Look&Feel – jak definiować osobowość produktu

4 czerwca 2019

Rafał Ginko

Senior UI Designer
Rafał Ginko
Look&Feel – jak definiować osobowość produktu
Look&Feel to zestaw cech, które wpływają na odbiór produktu przez osoby, mające z nim styczność. Nie bez powodu pojęcie składa się z dwóch słów Look i Feel. O Look&Feel możemy myśleć jak o osobowości lub stylu produktu. Wyobraźmy sobie naszą stronę, aplikację lub nawet usługę i towarzyszącą jej kampanię marketingową jako osobę. Sposób w jaki się ubiera, porusza i mówi decyduje o tym jak będzie postrzegana przez otoczenie.

Na Look składa się zbiór atrybutów wizualnych takich jak kolor, kształt, liternictwo, zestaw ikon oraz klucz doboru zdjęć czy też ilustracji. Natomiast, grupa cech wyznaczających Feel produktu jest dużo szersza i wykracza poza samą warstwę wizualną. Oczywiście na to, jakie odczucia wywołuje produkt podczas korzystania olbrzymi wpływ mają elementy składające się na Look np. treść zdjęć lub ilustracji jakie zawiera produkt, ale na tym nie koniec.

Równie ważnymi czynnikami wywołującymi emocje u człowieka są ruch, a szczególnie jego charakterystyka, styl języka komunikacji, zgodność zastosowanych rozwiązań ze standardami znanymi już przez użytkownika, oraz sprawy, wydawać by się mogło, kompletnie nie utożsamiane z designem jak wydajność sprzętowa oraz jakość połączenia internetowego.

Osobowość produktu

To do nas należy decyzja, czy nasz produkt to Claire Underwood, postać z serialu House of Cards, ubrana w stonowany kostium, perfekcyjnie spełniający wymogi dyplomatycznego savoir-vivre. Świetnie operująca retoryką, jednak bardzo powściągliwa w okazywaniu swoich emocji. Może to Bridget Jones, która swoim temperamentem zaskarbia sobie sympatię widzów lub superbohater jednej z serii Marvel’a, w kolorowym trykocie i towarzystwie efektów specjalnych, ratujący świat przed zagładą.

Określając osobowość produktu staramy się ustalić jego lokalizację na kilku osiach przeciwstawnych cech.

Czy produkt powinien być poważny, czy nieformalny, luksusowy czy przystępny, nowoczesny czy tradycyjny, nowatorski czy konserwatywny, śmiały czy stonowany? Specyfika aplikacji, strony lub usługi może również wymagać ustalenia pozycji na osi kobiecy kontra męski.
Istotny jest fakt, że żadna z wymienionych cech nie dominuje sama z siebie nad swoim antonimem. Odpowiednie cechy określające osobowość produktu zależą od kontekstu, na który mogą składać się wartości utożsamiane z marką, specyfika grupy odbiorców produktu a przy szerszym spojrzeniu, nawet uwarunkowania kulturowe.

Jak możemy w sposób kontrolowany zapanować nad stylem produktu? Spójrzmy na składowe atrybuty Look&Feel i zastanówmy się jaki mają wpływ na styl produktu.

Kolor

Źródło: Material Design

Paleta barw, na której opiera się wizualna warstwa produktu najczęściej wynika bezpośrednio z kolorów marki. W przypadku tworzenia nowego produktu, czyli w sytuacji, w której mamy pełną wolność doboru kolorystyki, tym elementem mamy wpływ na pozycję produktu, właściwie na wszystkich, z wymienionych wcześniej osi osobowości produktu. Odpowiednim doborem koloru łatwo określić czy produkt jest poważny, luksusowy lub stonowany.

Typografia

Źródło: Material Design

Za czasy powstania projektowania liternictwa zwykle uznaje się XVw., czyli okres pracy Gutenberga. To 600 lat na przełomie których tworzono i rozwijano kroje pisma. Tak długa i bogata historia liternictwa powoduje, że umiejętny dobór kroju w Look&Feel produktu ma olbrzymi wpływ na umiejscowienie go na osi nowoczesny-tradycyjny. Cechy kroju pisma mogą również definiować powagę lub prestiż produktu.

Kształt

Źródło: Material Design

Ikony, ilustracje oraz zdjęcia

Chcąc wzmocnić wrażenie nowoczesności i śmiałości produktu, możemy sięgać po kształty wykraczające poza klasyczne prostokątne formy narzucone do niedawna przez “niedoskonałą” technologię.

Jasność, nasycenie

Look&Feel może również określać barwa, jasność i nasycenie elementów graficznych. Jeśli projekt aplikacji ma odzwierciedlać wartości luksusowej marki, stonowane, minimalistyczne zdjęcia z pewnością lepiej podkreśla tę cechę niż kolorowe, krzykliwe ilustracje. Sytuacja odwraca się, gdy mówimy o usłudze skierowanej do pokolenia digital natives, wychowanego na krótkiej, naszpikowanej treścią intensywnej informacji.

Ruch

Zgodność L&F z marką na poziomie wizualnym jest zwykle dużo prostsze niż określenie języka komunikacji oraz przeniesienie charakteru brandu na płaszczyznę ruchu/animacji.

Źródło: Material Design

Animacja wykorzystana w odpowiedni sposób, pozwala podkreślić ciągłość procesów, w które zaangażowany jest użytkownik, lub zwrócić jego uwagę na istotne elementy interfejsu. Ruch, który może być jednym z elementów Look&Feel, opiera się na parametrach takich jak czas trwania, przyspieszenia i spowolnienia, które umożliwiają nadanie charakteru animacji.

Od subtelnych zmian koloru np. na aktywnych elementach strony internetowej, po bardzo dynamiczne animacje dużych elementów, tworzące wrażenie płynnego przejścia pomiędzy zróżnicowanymi wizualnie ekranami aplikacji. Decyzje dotyczące ruchu wpływają przede wszystkim na oś osobowości: poważny – nieformalny oraz śmiały-stonowany.

Source: Material Design

Język komunikacji

Kolejną cechą definiującą Feel produktu, a wręcz całej marki, jest styl komunikacji. Innym językiem będziemy prowadzić dialog z naszymi klientami jako duży bank, a innego języka będzie od nas wymagać komunikacja w aplikacji sieci społecznościowej, skierowanej do młodego użytkownika. Dobór odpowiedniego języka komunikacji umożliwia zbudowanie dystansu lub zbliżenie produktu do klienta, co pozwala na pozycjonowanie produktu na płaszczyźnie poważny-nieformalny.

Zgodność ze standardami

Źródło: Material Design

Jeśli zdecydujemy się oprzeć interfejs produktu na elementach zgodnych z konwencjami, oszczędzimy korzystającym z niego osobom konieczności nauki nowych sposobów obsługi produktu. Poznane wcześniej przez użytkownika wzorce, zastosowane w naszym produkcie wywołają wrażenie intuicyjności całego rozwiązania. Źródłem takich standardów mogą być specyfikacje projektowe udostępnione przez Google (Material Design) oraz Apple (Human Interface Guidelines).

Wydajność

Szybkość ładowania treści, płynność zastosowanych animacji, czy czas reakcji aplikacji lub strony na akcję użytkownika, mają ogromny wpływ na doświadczenia jakie wywołuje produkt. Wydajność powinna być cechą podstawową i obligatoryjną w każdym produkcie cyfrowym. Niewydajna strona lub aplikacja, mimo świetnych decyzji podjętych dla wszystkich pozostałych elementów składowych Look&Feel, staje się produktem nieudanym.

Musimy pamiętać, że przeciętni użytkownicy naszej aplikacji korzystają z niej za pomocą różnych urządzeń – nie tylko komputerów, ale coraz częściej urządzeń mobilnych, które na dodatek nie zawsze zaliczają się do grona najnowszych i najbardziej wydajnych.

Możemy zaprojektować znakomity i doskonale dopasowany UI, zaoferować szereg przydatnych funkcjonalności, odpowiedzieć na wszystkie potrzeby użytkownika, ale jeśli aplikacja nie będzie działać szybko i wydajnie, jego cierpliwość bardzo szybko się wyczerpie, a on sam po prostu zacznie się rozglądać za alternatywnym rozwiązaniem.

Właśnie dlatego jednym z priorytetów w procesie tworzenia aplikacji powinna być efektywność, rozumiana zarówno jako usability interfejsu użytkownika, jak i optymalizacja od strony technicznej.

Wszystkim cechom Look&Feel towarzyszą konwencje utrwalone przez istniejące rozwiązania. Marki uczą nas, że stonowana kolorystyka i formalny język komunikacji jest domeną aplikacji bankowych. Na charakterystyczną typografię pozwalają sobie zwykle marki kierujące swoje produkty do młodych użytkowników, a ilustracje są najczęściej obecne w produktach dla dzieci. Umiejętne łamanie tych konwencji może stać się atrybutem wyróżniającym produkt na tle innych rozwiązań. Snapchat stworzył zupełnie autorskie rozwiązania nawigacji w interfejsie, a Revolut, pomimo że rywalizuje z produktami bankowymi, prowadzi komunikację ze swoimi klientami nieformalnym językiem.

Czas realizacji

Projektowanie L&F to podejmowanie szeregu ważnych decyzji. Wiele z nich mogło zapaść jeszcze przed rozpoczęciem prac nad osobowością produktu. Look&Feel produktu oferowanego przez markę, która dysponuje brandingiem z określoną paletą barw i zestawem fontów, może zostać przygotowany w przeciągu kilka dni. Zdecydowanie więcej czasu wymaga zaprojektowanie Look&Feel obejmującego kilka punktów styku (np. aplikacja mobilna + strona www). Look&Feel powstający dla nowego produktu, bez fundamentu, jakim jest identyfikacja wizualna marki, zdecydowanie zwiększa zakres pytań, na które musimy odpowiedzieć. W takim przypadku, pracę nad osobowością produktu możemy liczyć nie w dniach, a tygodniach. W przypadku Look&Feel dedykowanego dla całego ekosystemu produktów, możemy mówić o ogromnym i skomplikowanym przedsięwzięciu projektowym, które angażuje duże zespoły projektowe na wiele tygodni.

Dobrze zaplanowany Look&Feel zawsze uwzględnia pełny kontekst. Wartości istotne dla użytkowników, wymagania biznesowe i założenia marki, wszystkie te czynniki powinny mieć wpływ i swoje odbicie w projekcie Look&Feel produktu.