Hver skærm, du bruger, er designet af nogen: startskærmen for en bankapp, et søgefelt, en indstillingsside. UI-design er den disciplin, der bestemmer, hvordan disse skærme er arrangeret, hvordan hver kontrol ser ud, og hvordan den reagerer, når du rører ved den.
En UI-designer arbejder med nogle få byggeklodser. Layout og mellemrum grupper relaterede ting sammen. Visuelt hierarki får den vigtigste handling til at skille sig ud. Typografi og farve bærer betydning og mærke. Komponenter som knapper, input, kort og menuer er designet én gang og genbrugt, så produktet føles ensartet.
Hver komponent har også tilstande. En knap har standardtilstande, hover, trykket, fokuseret, deaktiveret og indlæsningstilstande, og hver knap har brug for et design. At udelade stater er en af de mest almindelige årsager til, at et design ser færdigt ud i en mockup, men føles ødelagt i det rigtige produkt.
Interaktion og bevægelse er også en del af brugergrænsefladen. Små svar, ofte kaldet mikro-interaktioner, bekræfter, at et tryk virkede, viser fremskridt eller forklarer, hvor noget gik. De skal være hurtige og målrettede og respektere systemindstillingen for reduceret bevægelse.
Det meste UI-design sker i dag i Figma, med Penpot, Sketch og Lunacy som almindelige alternativer. Til grænseflader, der skal reagere på reelle data og input i den færdige app, bruger designere også interaktive værktøjer. ExodeUI, som vi laver, er én: den gemmer tilstande, fjederfysik og begivenheder i én åben fil, der kører i React, Vue, Svelte, Angular, Solid, React Native, ZQX3QZZ og ZXQX.