Dołącz do czytelników
Brak wyników

Temat numeru , Strona www, która sprzedaje

11 maja 2021

NR 57 (Kwiecień 2021)

Między użytecznością a modą Strony internetowe – trendy 2021

39

W trakcie procesu tworzenia stron internetowych głównym celem projektantów jest dostarczenie użytkownikom rozwiązań umożliwiających realizację ich celów. Aby tak się stało, wykorzystują narzędzia sprzyjające efektywnej i przyjaznej eksploracji. Musimy przecież pamiętać, że funkcjonalność może się przekładać – choćby w e-commerce – na rentowność biznesu. Czasem istotną rolę odgrywa też walor estetyczny. To wszystko natomiast są czynniki zmieniające się w czasie. Oto kilka wskazówek i dobrych praktyk oraz trendów odpowiadających bieżącym zjawiskom rynkowym i społecznym. 

Trendy, które pojawiają się na rynku i dotyczą projektowania witryn internetowych, w największym stopniu podążają właśnie za jasnym celem. Chodzi o optymalizację poszczególnych obszarów strony, aby użytkownik w jak najprostszy i przyjazny sposób docierał do poszukiwanych treści. Trendy te odzwierciedlają również aktualną modę związaną z designem i projektowaniem wychodzącym poza obszar stron internetowych. Inna sprawa, czy nowe zjawiska przyjmują się na dłużej, czy nie wytrzymują próby czasu.

POLECAMY

Oczywiście, na czynniki determinujące trendy w projektowaniu ogromny wpływ ma również otoczenie – zmiany rynkowe i społeczne. Ubiegły rok, jak w innych obszarach, tak i w projektowaniu WWW, upłynął pod znakiem pandemii koronawirusa.

Mogliśmy bowiem doświadczyć niezwykle radykalnych i szybkich zmian w sferze szeroko rozumianego digitalu czy nowych technologii. COVID-19 niejako zmusił nas do głębszego zanurzenia się w cyfrowym świecie i zmiany sposobu życia. Rosnący popyt przyspiesza zaś rewolucję cyfrową. Zdalna rzeczywistość, konieczność pozostania w domach, „przeniesienie świata” do środowiska online, zmusiły również projektantów do odtworzenia rzeczywistych doświadczeń w cyfrowej formie. 

Twórcy stron internetowych stanęli na wysokości zadania, eksplorując dotychczasowe zachowania użytkowników w sieci. Swoje produkty tworzyli, opierając się na zebranych danych, nie zaś osobistych odczuciach. Nowatorskie grafiki, typografia, charakterystyczne połączenia kolorystyczne, symulacje produktów w 3D – to rozwiązania nie tylko efektowne wizualnie, lecz także mające realny wpływ na odbiór świata cyfrowego ze strony użytkowników.

Na co zwrócić uwagę, tworząc produkt cyfrowy?

Opierajmy się na danych

Jak zdążyliśmy zauważyć, projektanci sięgają po obiektywne wskaźniki i na ich podstawie wyciągają wnioski, które później wykorzystują w pracy twórczej. To zupełnie inne podejście niż stawianie na osobisty gust czy inspirowanie się „na ślepo” rozwiązaniami wykorzystywanymi w innych branżach. Autorzy serwisów WWW i aplikacji mobilnych coraz częściej kierują się analizą danych. Marki zaczynają rozumieć, jak wielką przewagę dostarcza analityka dobrze zgromadzonych i przetworzonych danych; wymagają więc od projektantów i deweloperów, aby proponowane rozwiązania bazowały na dotychczasowych zachowaniach użytkowników. Idealnym drogowskazem projektowym są informacje uzyskane za pomocą różnego rodzaju narzędzi typu HotJar czy Google Analytics, a także dane jakościowe, czyli zebrane podczas różnego rodzaju badań z udziałem użytkowników (np. badania prototypu witryny WWW na podstawie stworzonych scenariuszy użycia). Pozwala to projektantom odkrywać faktyczne problemy internautów i wdrażać efektywniejsze rozwiązania, a w następnym etapie – weryfikować je za pomocą kolejnych analiz.

Oczywiście w przypadku nowych serwisów (dotyczących np. zupełnie nowej usługi) istnieje spore ryzyko błędów. Nie sposób przecież sięgnąć po dane zebrane od użytkowników. Aby minimalizować błędy, wykorzystuje się różne metodologie projektowe składające się m.in. z faz badawczych i koncepcyjnych, pozwalających określić i zebrać potrzeby potencjalnej grupy odbiorców – w tym także potrzeby biznesowe. Używając np. strategii ciągłej optymalizacji konwersji (Conversion Rate Optimization), projektanci są w stanie szybko i tanim kosztem optymalizować produkty – tak aby zwiększać ich skuteczność i pozytywne doświadczenie użytkowników. 

Przykład optymalizacji istniejącego serwisu WWW

Bazując na danych z Google Analytics i nagraniach od użytkowników pochodzących z Hotjara, byliśmy w stanie dla jednego z naszych klientów zoptymalizować proces zamówienia w sklepie internetowym i zwiększyć konwersję o 14%. Dzięki danym ilościowym z Google Analytics mogliśmy zidentyfikować obszary ścieżki, w których użytkownicy napotykają na kłopoty i porzucają koszyk zamówień. Analizy HotJar z nagrań sesji użytkowników pozwoliły nam pogłębić wiedzę o występujących tam problemach i wyeliminować je. 

Przykład wdrożenia platformy e-commerce dla nowego produktu

Projektując platformę e-commerce dla klienta rozpoczynającego sprzedaż w sieci, nie mieliśmy dostępu do danych wyjściowych, ponieważ po prostu nie istniały. Sięgnęliśmy zatem po nasze dotychczasowe doświadczenia, wykorzystując je na etapie fazy koncepcyjnej, ale wzbogaciliśmy je o aktualne trendy. Platformę projektowaliśmy w taki sposób, aby mieć możliwość wykonywania testów A/B w obszarach, których nie byliśmy do końca pewni. Dzięki takim rozwiązaniom po uruchomieniu sklepu mogliśmy szybko i tanim kosztem przetestować różne rozwiązania i wdrażać te, które okazały się skuteczniejsze. 

Porządkujmy proces twórczy 

Poza zmianami wizualnymi w web designie, zmienia się także podejście i sposób projektowania. Produkty są coraz bardziej zaawansowane wizualnie i funkcjonalnie, co wymusza inne podejście do projektowania i zarządzania samym projektem. Często już w etap projektowania angażuje się ekspertów od danego obszaru biznesu, grafików oraz specjalistów od technologii i IT. Stąd też proces tworzenia strony bądź aplikacji bywa skomplikowany od strony operacyjnej. Odpowiedzią na ten problem jest zbiór zasad, narzędzi oraz procesów, które ułatwiają spójne zarządzanie projektem.

Design systemu w praktyce

W proces tworzenia strony internetowej dla jednego z klientów zaangażowane były trzy strony. Za kreację i interfejs odpowiadała nasza agencja, za technologie – inny podmiot zewnętrzny wskazany przez klienta, a za obszar biznesowy – sam klient.

Sięgnięcie po design systemu umożliwiło przekazanie wszystkich składowych interfejsu w płynny i zrozumiały dla wszystkich stron sposób, w tym deweloperów odpowiedzialnych 
za wdrożenie produktu. Dzięki temu strona WWW, która składała się z ok. 200 widoków, była od początku spójna na poziomie interfejsu; deweloperzy zaś otrzymali konkretne informacje, które pozwoliły wyeliminować niejasne kwestie i ograniczyć czas potrzebny na doprecyzowywanie zasady działania poszczególnych elementów interfejsu. 

Typografia w roli głównej

Typografia od zawsze stanowiła kluczową rolę w projektowaniu stron internetowych. Obecnie jej rola jeszcze wzrosła i przekłada się na całościowy efekt warstwy estetycznej serwisów i aplikacji. Można śmiało powiedzieć, że layout oparty na typografii stanowi dziś jeden z najbardziej wyrazistych trendów i pewnie nie zmieni się to w ciągu najbliższych lat. Już od jakiegoś czasu obserwujemy sporą wolność, jeśli chodzi o stosowanie niestandardowych krojów liter. Co ważne jednak, nie należy tego sprowadzać jedynie do wyboru fontów. Chodzi też o przekaz tekstowy – dobór słów, sloganów, haseł, o ich znaczenie i potencjał w nich zgromadzony. 

 Rys. 1. Przykład strony – Hot Black https://hotblack.design/

Wykorzystanie liter w projekcie strony dotyczy nie tylko fontów, które stają się elementem kompozycji, lecz także odpowiedniego dobrania słów i ich znaczenia.

Scrollytelling? A co to takiego?

Niemal na każdym kroku przekonujemy się, jak ważna jest opowieść. Historia towarzysząca przekazowi, mająca przyciągnąć do niego uwagę i go utrwalić. Znakomicie widać to we wszystkich kanałach komunikacji marketingowej oraz PR. Zjawisko to objęło również projektowanie stron WWW. Użytkownik, wpisując adres dający dostęp do danej strony, powinien wejść do unikalnego świata, który go urzeknie, przyciągnie na dłużej, zwiąże ze sobą. Dziś marki walczą na wszelkich polach o uwagę widza, potencjalnego konsumenta. Projektując witrynę WWW dowolnego rodzaju, myślimy o opowieści marki, którą ma ona zaproponować odbiorcy. Zjawisko to, zwane scrollytellingiem (albo „interaktywną narracją”), obejmuje te doświadczenia, które towarzyszą nam, jak łatwo się już domyśleć, podczas przewijania strony WWW. Co to oznacza w praktyce? Między innymi to, że powinny się na niej pojawiać elementy podkreślające historię. Jednocześnie unikać należy wszystkiego, co mogłoby odwracać od niej uwagę.

Scrolling cards

Spośród ruchomych elementów ciekawym rozwiązaniem są scrolling cards, czyli przewijające się karty, które pozwalają przedstawić informacje w mniej oczywisty sposób. 

 Rys. 2. Przykład: FLPLNY https://www.flplny.com/


Powrót do przeszłości

To zjawisko dotyka dziś wielu obszarów komunikacji i rozrywki czy też, szerzej rzecz ujmując, popkultury. Wystarczy włączyć serial na Netfliksie bądź innych platformach streamingowych, aby przenieść się np. do świata lat 80. XX stulecia. To swego rodzaju gra na nostalgii, emocjach związanych ze wspomnieniami z młodości („Kiedyś to były czasy…”). Zjawisko dotyczy jednak nie tylko contentu (jak show, film czy serial), lecz także doświadczania w świecie online na styku z platformą digitalową i rozwiązaniami na niej zastosowanymi. Przez lata prym wiodła estetyka w stylu flat way. Teraz jednak projektanci szukają nowych sposobów na „dodanie głębi” naszym doświadczeniom online.  

Stylistyka takich stron zwykle nawiązuje do popularnych w latach 90. XX wieku seriali telewizyjnych czy gier, a także sprzętu używanego w tamtym czasie. Wykorzystywane są mniej oczywiste układy, tekstury, wzory czy nawet grafika pikselowa. Wbrew pozorom, tego typu strony nie są łatwe do stworzenia, ponieważ do góry nogami odwracają wiele wytycznych i zasad, do których przywykliśmy, tworząc strony WWW już przez ponad dekadę.

Hiperpersonalizacja

Personalizacja to trend w komunikacji znany od dawna. Rewolucja cyfrowa znacznie ją przyspieszyła, bo umożliwiła tradycyjnym mediom – 
na sposoby i skalę dotąd nieznane – dotrzeć do odbiorcy z przekazem naprawdę skrojonym na miarę. Ale to jeszcze zbyt mało, bo apetyt rośnie przecież w miarę jedzenia. 

W przypadku personalizacji interfejsu chodzi o jeszcze silniejsze dostosowanie go do preferencji użytkowników. Dotyczy to nie tylko możliwości przełączenia strony na tryb „dark”, wyboru motywów kolorystycznych, rozmiaru tekstu czy interlinii, lecz także tworzenia takich interfejsów, które będą zmieniać się w zależności od osobistych zainteresowań i preferencji danego użytkownika. Przez wykorzystanie nowych technologii, w tym odpowiednich algorytmów, wyświetl...

Pozostałe 70% treści dostępne jest tylko dla Prenumeratorów

Co zyskasz, kupując prenumeratę?
  • 6 drukowanych wydań magazynu Online Marketing
  • Dodatkowe artykuły niepublikowane w formie papierowej
  • Dostęp do czasopisma w wersji online
  • Dostęp do wszystkich archiwalnych wydań magazynu oraz dodatków specjalnych
  • ... i wiele więcej!
Sprawdź szczegóły

Przypisy