0
870
Walka o uwagę użytkownika osiąga coraz wyższy poziom. Niestety, nie znamy jednego magicznego triku, który podczas projektowania strony internetowej sprawi, że będzie ona zawsze aktualna, świeża i przykuwająca uwagę.
To trendy odzwierciedlają upodobania większości odbiorców dotyczące serwisu, biorąc pod uwagę zarówno ich stronę wizualną, jak i użyteczną. Nie możemy zatem zapominać o nich przy projektowaniu stron www. Gdzie powinieneś skierować swoje oczy, jakie rozwiązania wykorzystywać i czym się inspirować? Badania pokazują, że dobry design jest głównym czynnikiem gwarantującym pierwsze pozytywne wrażenie. Atrakcyjność wizualna i łatwość obsługi strony nie tylko zwiększają jej wiarygodność, ale mają też znaczący wpływ na zaangażowanie użytkowników w serwisie www. Badanie Stanford pokazuje, że 75% konsumentów przyznaje się do oceniania wiarygodności firmy na podstawie projektu jej strony internetowej.
Wciągające ilustracje i elementy 3D
Użycie 3D na stronie www nie przestaje fascynować. Przyciąga uwagę użytkowników i przekracza granicę między przestrzenią wirtualną a rzeczywistością. Popularność tego trendu w 2020 r. ciągle wzrasta, a rozwój technologii VR & AR, obfitość narzędzi i gotowych zasobów w połączeniu z nowymi pomysłami projektantów gwarantuje jego dalszy rozwój. Możesz graficznie urozmaicić swoją stronę, stosując organiczne i abstrakcyjne kształty, zwiększyć jej przyjazność poprzez dodanie uroczych postaci czy też zachęcić potencjalnych klientów do dłuższego pozostania na stronie dzięki interaktywnym elementom — możliwości jest nieskończenie wiele, a ogranicza Cię wyłącznie Twoja kreatywność. Użycie techniki 3D zapewnia też więcej informacji, zarówno w zastosowaniach edukacyjnych, jak i tych bardziej komercyjnych. Pojedyncza grafika 3D przekazuje większą wiedzę wizualną o produkcie niż pojedynczy obraz 2D.
Zainspiruj się:
Głębia, miękkie cienie, zaokrąglenia, warstwy i transparentność
Po analizie można określić ten trend jako Organic UI. Początków możemy szukać w Material Design od Google’a, następnie przenieść się do roku 2017 (kiedy Microsoft przedstawił nam Fluent Design), a dalszą ewolucję śledzić na bieżąco, patrząc na to, jakie zmiany w designie niosą ze sobą premiery iOS 14 i macOS Big Sur. Czym w takim razie jest całe to Organic UI? To zabiegi mające na celu sprawić, że interfejs użytkownika będzie bardziej przyjazny i naturalny dla człowieka. To stosowanie bardziej organicznych kształtów nad ostre geometryczne bryły, odzwierciedlenie rzeczywistości przez dodanie głębi, zabawy cieniem i transparentnością mające na celu stworzenie hierarchii.
Typografia, typografia i jeszcze raz typografia
Oczywiście, że obraz bardziej przykuwa uwagę, ale to typografia zawsze miała fundamentalne znaczenie w projektowaniu. Ogrom swobody, miejsca na ekspresję i eksperymentowanie są dziś nieporównywalnie większe od tego, czym dysponowali projektanci chociażby 10 lat temu. To koniec cierpienia z powodu niedostatku fontów, problemów z czytelnością i kompatybilnością. Dostępność tysięcy godnych uwagi rodzin o różnych stylach pozwoli Ci na przekazanie zupełnie odmiennych emocji i zbudowanie strony w oparciu wyłącznie o typografię. Nie chodzi już tylko o wybór samego fontu czy ich kombinacji, ale o użycie słów jako głównego elementu stylistyki. Teraz to słowa, fizycznie obecne w projekcie, są elementem konstrukcyjnym, wokół którego ułożona jest cała reszta kompozycji.
Variable Fonts
Variable font to wiele odmian fontu, które są spakowane w jeden plik. Poprzez manipulowanie wartościami CSS możesz płynnie zmieniać jego grubość, szerokość czy np. pochylenie.
Hero Images bez grafiki
Wyjdź naprzeciw schematom i usuń typową grafikę w tej sekcji. Odważny i unikalny font wystarczy, by szybko przykuć uwagę użytkownika. Hero Images to najczęściej pierwszy element, jaki widzi użytkownik na stronie. Jest statyczną lub dynamiczną (np. slider) sekcją umieszczoną na samej górze serwisu www, składającą się zazwyczaj z grafiki i tekstu.
Pogrubiona typografia
Stosowanie pogrubionych fontów w 2020 r. nie jest żadną innowacją, ale trend ten ciągle nabiera rozpędu. Duży wyboldowany nagłówek znajdujący się w centrum uwagi lub wylewający się poza ekran szybko przyciągnie uwagę użytkowników. Łącz różne style i grubości, korzystaj zarówno z delikatnych szeryfów, jak i krojów geometrycznych. Nie bój się eksperymentować, pozwól typografii grać pierwsze skrzypce.
Zainspiruj się:
- www.weareowlsome.com
- www.vorrel.design
- www.mgcream.com/en/
- www.essenceglobal.com/about
- www.alitwotimes.com
Dark mode
Dark mode to jeden z najbardziej aktualnych trendów 2020 r. i nic w tym dziwnego. Jest po prostu ładny. Wprowadzenie trybu ciemnego na komputerach i telefonach przez Apple praktycznie wymusiło na innych twórcach oprogramowania zaimplementowanie czarnej wersji w swoich aplikacjach. Droga tego trendu z aplikacji mobilnych do stron internetowych była bardzo szybka, a projekty na nim oparte wyglądają nowocześnie i są naprawdę dynamiczne, przy czym redukują obciążenie oczu. Pod względem estetycznym Dark mode doskonale uzupełnia się z innymi trendami w projektowaniu stron i pozwala podkreślić dane elementy na stronie poprzez przyciemnienie pozostałych.
Zainspiruj się:
Customowe kursory
Niestandardowe kursory ciągle ewoluują i są używane coraz częściej. Wystarczy kreatywny kod developera, by zmienić klasyczny kursor myszki w coś wyjątkowego i niepowtarzalnego. Tak stworzony kursor często łączony jest z efektami, które zmieniają jego kolor, kształt i rozmiar podczas interakcji z innymi elementami na stronie, co nie tylko rozwija poczucie kreatywności, ale także wzbogaca doświadczenia użytkownika.
Minimalizm
Minimalizm w web designie nie wziął się znikąd i nie bez powodu jego popularność ciągle rośnie. Korzeni tego trendu możemy szukać w sztuce, a także filozofii minimalizmu, która w dużym uproszczeniu sprowadza się do skoncentrowania uwagi na rzeczach kluczowych, wzbogacających nasze życie. Dzięki zastosowaniu minimalizmu w swoim projekcie będziesz w stanie przedstawić użytkownikowi informacje w sposób przejrzysty i czytelny, a ponadto nie obciążysz strony dodatkowymi elementami graficznymi. Kieruj się zasadą „mniej znaczy więcej”. Wystarczy, że zadbasz o odpowiednią ilość światła między poszczególnymi elementami, dobierzesz właściwy font i zredukujesz do minimum paletę kolorów. Po tych zabiegach możesz mieć pewność, że Twój projekt wyróżni się na tle przesyconych, pełnych nieładu stron, a przede wszystkim ułatwi użytkownikom nawigację i dotarcie do kluczowych treści. Omawiając minimalizm, nie można chociaż jednym zdaniem nie wspomnieć o Swiss Style – stylu w projektowaniu, który skupia się przede wszystkim na typografii i prostocie, rezygnacji z ozdobników, a także oparciu projektu na z góry ustalonym gridzie. To niesamowite, jak dzisiejsze trendy bazują na wzorcach z lat 50. XX wieku.
Asymetryczne układy i broken grid
W ostatnich latach widać ogromny wzrost asymetrycznych układów w projektach nie tylko stron eksperymentalnych czy tych związanych ze sztuką. Projektanci coraz częściej i odważniej wykorzystują asymetrię w biznesowych projektach www, na stronach przedsiębiorstw, e-commerce i tym podobnych. Właściwe zastosowanie niesymetrycznych układów jest w stanie dodać każdemu projektowi charakteru, dynamiki i osobowości. Tradycyjne generyczne layouty zdecydowanie zanikają, a w następnych latach to właśnie trend asymetrii będzie się utrzymywał. Dostajesz tu wiele miejsca na kreatywność. Mnogość opcji i możliwości w tworzeniu asymetrycznych układów jest nieskończona, choć tworzenie tych udanych wymaga nieco praktyki i czasu (niestety umieszczenie elementów losowo na siatce nie działa). Pamiętaj jednak, by asymetrię wykorzystywać i wdrażać z rozwagą, zawsze uwzględniając potrzeby użytkowników. Przecież nie chcesz, by gubili się podczas korzystania z Twojej strony, prawda?
Zainspiruj się:
Łączenie fotografii z grafiką
Użycie prawdziwych zdjęć, połączenie ich z ilustracjami lub innymi prostymi elementami grafiki pozwala stronie internetowej wyróżnić się z tłumu, dostarczając jej unikalnej oprawy wizualnej. Ten kolażowy trend jest niezwykle wszechstronny, a wykorzystując go, możesz dodać uroku nijakim zdjęciom produktu lub w prosty sposób przekazać skomplikowane, abstrakcyjne koncepty, takie jak np. technologia czy finanse. Jest to też sposób na dostosowanie zdjęć do własnych potrzeb i spersonalizowanie komunikatu, co może niesamowicie pomóc w budowaniu konkretnego wizerunku marki. To od Ciebie zależy, jak wykorzystasz elastyczność tego trendu, czy postawisz na geometryczne i szczegółowe ilustracje, by osiągnąć coś wyrafinowanego, czy może zdecydujesz się na ręcznie rysowane, wręcz kreskówkowe elementy, żeby stworzyć coś uroczego i humorystycznego.
