#1 Proč je tento UI design tak zatraceně dobrý?
Toto je série, kde rozebírám designy webů a aplikací od různých autorů. Ukážu vám, jaké designové principy jsou v praxi při návrhu UI používány.
Design k rozboru
Prohlédněte si dobře návrh UI k dnešnímu rozboru. Proč si myslíte, že vypadá tak dobře?
Vizuální obsah
Při první návštěvě webu si určitě všimnete úvodního obrázku květiny. Obrázek je ve vysoké kvalitě, je oříznutý a kontrastně vložený na černé pozadí. V kompozici obrázku je pouze jeden květ, takže přesně víte, na co se máte soustředit a neruší vás další prvky. Obecně je dobré pracovat s co nejjednoduššími fotografiemi nebo ilustracemi.
Typografie
V návrhu je použita především kombinace 2 písem, které jsou vůči sobě v kontrastu. Jedno písmo patkové pro nadpisy a druhé bezpatkové pro ostatní texty.
Patkové písmo určené pro nadpisy je vybrané takové, aby navozovalo spíše „přírodní“ pocit. Mění se tloušťka tahů písmen a jejich tvary jsou zajímavě zakřiveny. Oproti druhému bezpatkovému písmu není tak geometricky dokonalé.
Hierarchie informací
Při skenování designu očima si jistě všimnete prvků v určitém pořadí. Nejprve vás zarazí hlavní nadpis a obrázek. Potom se zastavíte na velkých plochách prázdného místa a až poté začnete zkoumat okolní vedlejší prvky, jako jsou hlavní menu, logo, navigační prvky a další odkazy. Každý si je může začít prohlížet v jiném pořadí. Jsou na podobné informační úrovni.
Kontrast prvků
Kontrast je základní designový princip, který zaručuje úspěšný vizuální návrh. Pokud jsou prvky mezi sebou v dostatečném kontrastu a zaručí se jejich dostatečné rozlišení, pro oči se stanou mnohem atraktivnější.
Cest, jak dosáhnout kontrastu mezi prvky, je mnoho. Jaké strategie jsou použity v tomto návrhu? Tady je pár příkladů:
Dostatečně odlišná hlavní písma (patkové vs. bezpatkové)
Velikost hlavního nadpisu vs. velikost ostatních textů
Světlý obsah vs. tmavé pozadí
Přírodní tvary vs. geometrické linie
Pokračování a celý rozbor návrhu najdete v nové sérii na Designui [dizajnuj], kde se chci zaměřit právě na vizuální rozbory UI designů.
https://www.designui.cz/rozbory-ui-designu/1
Pokud se vám bude rozbor líbit, budu rád, když se o něj podělíte s kolegy. Jestliže máte jakoukoliv připomínku nebo nápad na vylepšení, budu rád, když mi napíšete zprávu.
👋 Jsem web designér a UI designér. Tvořím čisté a nepřeplácané návrhy. Kladu důraz na funkčnost a spíše se zaměřuji na typografii a prodejní texty než na dekorace. Navrhuji weby, aplikace, e-shopy.
Přestože se rád řídím podloženými daty, ne vždy jsou k dispozici. Místo dlouhých výzkumů raději často pracuji na základě zkušeností a nejlepších úsudků a představ, které pak testuji a upravuji na základě získané zpětné vazby.
Pokud máte projekt, na kterém bych mohl spolupracovat a přemýšlíte podobně, rád vám s ním pomohu.
Více o mně na webu → https://www.lukasaugusta.cz.
