Při vytváření vizuálů, rozvržení nebo systémů pro návrh značky mějte na paměti tyto trendy – pomohou upoutat pozornost publika a stále dělají vše podle kánonů UX.
Ahoj, jmenuji se Evgeny Kuznetsov. Jsem spoluzakladatelem WIM.Agency, naším hlavním zaměřením je CRM marketing, výkon a kreativní design. Děláme UI/UX design uživatelských rozhraní, děláme gamifikace, vytváříme propagační materiály a mnoho dalšího.
Porozumění designu je naší prací, takže v tomto článku mi Julia Korsun, návrhářka WIM.Agency, pomohla vybrat hlavní designové trendy v roce 2021. Mnohé z nich se staly populární v loňském roce, ale v roce 2021 je určitě najdete v rozhraních, rozloženích, bannerech a vstupních stránkách.
Přechod
Použijte přechod a můžete vytvářet krásné přechody, přidávat objem a důraz plochým vzorům: přechody jsou nápadnější než plné barvy, takže si vaši uživatelé všimnou tlačítek nebo položek nabídky s výprodejem a zapamatují si důležité informace.
Používejte jako základ. Světelné gradientní tóny, pokud chcete udržet pozornost publika na produktu, a jasné a kontrastní pro zvýraznění.
Pečlivě vybírejte styly přechodů: například radiální je vhodnější pro kulaté oblasti, lineární je vhodnější pro čtvercové oblasti.
Jak pomoci návrháři: použijte generátor CSS nebo připravený vytvořil přechody s čísly barev RGB, aby našel přechod a kód CSS.
Glassmorphism
Efekt z matného skla, který je založen na kombinaci stínu, průhlednosti a rozostření pozadí, dodá designu hloubku a pomůže s vizuální hierarchií. Ujistěte se, že pozadí má dostatečný tonální rozdíl – pro zvýraznění efektu použijte světlé barvy. Jako reference si můžete prohlédnout výchozí barvu pozadí tapety v systému Mac OS Big Sur.
Hlavním úkolem matného skla je přidat rozhraní lehkost, zbavit se „těžkých“ prvků. Nepoužívejte jej pro tlačítka a objekty, které jsou lépe ponechány v kontrastu. Místo toho přidejte efekt na produktové karty nebo do náhledů oznámení.
Jak pomoci návrháři: vyberte příslušné možnosti efektů a zkopírujte kód do generátoru CSS.
< h2> Samolepky
Samolepky, které jsme nalepili do notebooků a poškrábali v banánové slupce v našem vzdáleném dětství, se přenesly na web. Toto je snadný způsob, jak zaujmout publikum a přidat svému plochému designu texturu a hloubku.
Pomocí štítků můžete označit kategorie nebo služby na webu. A také – učinit z nich součást nativní reklamy značky, například vytvořením balíčků virálních nálepek pro sociální sítě. Před tím se musíte rozhodnout, jaké poselství chce značka prostřednictvím samolepek sdělit, jaký výsledek získá.
Pomůže designérovi: trochu inspirace od Behance. Samolepky můžete diverzifikovat prací s písmy a barvami v každém z nich.
Ikony objemového obrázku
3D ikony a ilustrace jsou vizuál, který je populární v roce 2021. Návrhářům se díky vysoce výkonnému softwaru snadněji vytvářejí objekty v trojrozměrném prostoru a díky vysoké rychlosti internetu, vývoji VR/AR a výkonných gadgetů bude opět tlačit na konstrukci hyperrealistických vizuálních efektů.
V síti se objevuje stále více knihoven s rozsáhlými ikonami a ilustracemi a online kurzy pomohou porozumět 3D i těm, kteří svou profesi teprve začínají zvládat. Můžete si vybrat vhodný model a ilustrovat objekty v projektu jejich zvýrazněním v plochém minimalistickém designu.
Jak pomoci designérovi: doporučujeme věnovat pozornost UI8, kolekce 3D modelů rukou Handy 3D Hands a izometrické ikony.
Styl designových systémů
Citování prvků specifických pro určité návrhové systémy a programy přinese rozložení značky nový význam.
Například můžete použít obdélník a šipku k reprezentaci uživatele v aplikaci Figma, v nástrojích pro výběr textu v Dokumentech Google nebo ve stylu raných počítačů. Zároveň je důležité nesklouznout do kopírování: můžete porušit autorská práva a ztratit důvěru uživatelů.
Pomáháme designérovi: příklady prvků Figma a Mail Systémový design skupiny .ru.
Virtuální realita
Po pandemii mnoho společností investovalo do VR, aby zůstalo ve spojení se zákazníky a zaměstnanci na dálku.
Bez vstávání ze židle může uživatel absolvovat firemní školení, povídat si s kolegy, nakupovat, vyzkoušet nové oblečení a večer – relaxovat při prohlídce VR, výstavě o 360 stupních nebo koncertu. Použijte tyto technologie ve svých designech ke zvýšení zapojení publika a zájmu o produkt.
Pomáháme designérovi: Nechte se inspirovat virtuálním koncertem Fortnite od Travise Scotta s 12 miliony lidí, kde vše konce letěly do vesmíru.
Animace
Nebojte se přidat do svého designu dynamiku: nechte logo deformovat a písma se budou otáčet a explodovat. Můžete animovat pozadí, galerii webů, jednotlivé bannery a rozhraní.
Animace upoutá pozornost publika, vypráví příběh vaší značky a také si udrží pozornost. Například pokud načítání webu trvá déle než dvě sekundy, můžete použít preloader, abyste neztratili uživatele. Nezapomeňte na mikrointerakce – činí rozhraní přehlednějším a zlepšují uživatelský komfort.
Pomáháme designérovi: příklad animovaného banneru SKR4T 2.0, stará škola hodinová reklama s animovanými skicemi a minimalistickými animacemi z Google Chrome.
Co si myslíte o trendech? Nemusíte do svého designového systému začlenit všechny relevantní prvky, ale mnoho z nich jistě vylepší váš vizuál značky.
