10 lekcji od najlepszych web designerów

W web designie nie ma punktu, w którym można się zatrzymać. Nawet weterani muszą stale podnosić kompetencje i poszerzać wiedzę, żeby pozostać w czołówce. Jednym ze sposobów jest czerpanie inspiracji od uznanych mistrzów zawodu. Czyja rada będzie lepsza niż samych ekspertów?

Jako zwinni programiści webowirozumiemy presję, by utrzymywać umiejętności na bieżąco. Dlatego zebraliśmy dziesięć rad od najlepszych na świecie projektantów webowych i UX designerów. Dzięki tym sztuczkom zawodu wykręcisz swój kolejny projekt na maksa! 

1. Użyteczność przede wszystkim. Zawsze
2. Ale… kreatywność depcze jej po piętach
3. Świetne strony wymagają całościowego podejścia do web developmentu
4. Tryb ciemny? Łatwiej powiedzieć, niż zrobić
5. Typografia ma znaczenie
6. Narzędzia to tylko narzędzia
7. Poszerzaj horyzonty
8. I nie traktuj animacji po macoszemu
9. Odróżniaj krótkotrwałe mody od trwałych trendów
10. Ucz się na błędach innych
    

10 kluczowych lekcji od najlepszych web designerów świata

1. Użyteczność przede wszystkim. Zawsze

„Innowacja jest świetna, ale użyteczność jest o wiele ważniejsza”. Kiedy mówi tak Jeffrey Zeldman, król standardów webowych, trudno się nie zgodzić. 

Dla doświadczonych projektantów webowychużyteczność jest oczywistością, ale początkujący często zbyt mocno pchają się w stronę innowacji czy wizji artystycznej kosztem wygody użytkownika. Tymczasem strony, po których trudno się poruszać, mają znacznie wyższy współczynnik odrzuceń i mniej powracających odwiedzin. 

88% kupujących online nie wraca na stronę po złych doświadczeniach. Gdy użytkownicy mają problem z osiągnięciem swojego celu na stronie lub w aplikacji, odchodzą sfrustrowani i raczej nie wracają, co musi odbić się na przychodach firmy. Poprawa projektu UX prowadzi do większego ruchu, wyższej konwersji i ostatecznie większej sprzedaży. 

2. Ale… kreatywność depcze jej po piętach

UX ma priorytet, gdy chodzi o zwiększanie konwersji i skuteczności aplikacji oraz stron, ale nie znaczy to, że kreatywność jest nieważna.

Jak trafnie zauważa uznany projektant webowy i UI, Mike Kus: „W obliczu automatyzacji sieci kreatywność, przełamywanie trendów i wytyczanie własnej ścieżki to najlepszy sposób, by wyprzedzić coraz bardziej wyrafinowany i zautomatyzowany web. Trzymaj się kreatywności; to ostatnia rzecz, którą ukradną nam komputery”.

Zasada jest prosta: projektuj produkty webowe, myśląc najpierw o odbiorcach, a dopiero potem wnoś do pracy swój osobisty, wyjątkowy styl. 

3. Świetne strony wymagają całościowego podejścia do web developmentu

„Wyzwaniem pracy z systemami projektowymi jest pomaganie zespołom myśleć w sposób bardziej międzyfunkcyjny i interdyscyplinarny. Muszą być świadome, jak zmiana pojedynczego fragmentu wpłynie na całość - a konkretniej, jak wpłynie na inne zespoły i osoby pracujące w tym systemie”. 

W swoim kultowym wpisie Ethan Marcotte, zwany ojcem responsywnego web designu, podnosi ważną kwestię web developmentu jako pracy zespołowej. 

Zwłaszcza w erze freelancingu i pracy zdalnej web design i development bywają postrzegane jako zawody samotnicze. Niesłusznie. Proces projektowania i budowania strony jest bardzo złożony i wymaga podejścia międzyfunkcyjnego oraz interdyscyplinarnego, w którym każdy powinien rozumieć, jak jego praca wpływa na pozostałe osoby. 

4. Tryb ciemny? Łatwiej powiedzieć, niż zrobić

W ciągu ostatnich kilku lat ciemne motywy wyraźnie zyskały na popularności. Są eleganckie, minimalistyczne i podobno łagodniejsze dla oczu i baterii. Ich wdrożenie bywa jednak dość złożone. „Wdrożenie trybu ciemnego jest łatwe, ale zaprojektowanie go już mniej” - ostrzega Andy Clarke, jeden z najbardziej znanych web designerów na świecie.

Żeby ciemne tło zadziałało i nadało Twoim produktom wyrafinowany, dopracowany wygląd, musi trzymać się kilku kluczowych zasad. 

Przede wszystkim musisz zapewnić wysoki poziom czytelności i dostępności, by było wygodnie i nie męczyło wzroku. Druga ważna kwestia to kontrast, który dyktuje dobór kolorów interfejsu. Po trzecie, projekt trybu ciemnego powinien współgrać z otoczeniem użytkownika. Skuteczne ciemne tło wymaga też zmiany stylów typograficznych, które potrafią dostosować się do zmiennych warunków oświetlenia.5. Typografia ma znaczenie

Skoro o tym mowa. Pamiętasz czasy, gdy praktycznie wszystkie strony używały Ariala albo Times New Romana? Wciąż są na czele wśród fontów zapasowych, ale obecnie prawie 60% stron korzysta z własnych krojów, co pokazuje rosnącą świadomość znaczenia typografii w web designie. Dlaczego jest tak ważna?

Typografia decyduje o czymś więcej niż tylko o kroju i rozmiarze fontów. Obejmuje interlinię i światło międzyliterowe, wcięcia akapitów, punktory, wysunięcia interpunkcyjne i inne elementy wpływające na czytelność, wygląd i dostępność produktu webowego. 

Jak wyjaśnia UX designer GitLaba, Matej Latin: „Rytm w typografii jest jak rytm w muzyce. Tak jak w muzyce porządek jest przyjemniejszy dla uszu niż chaos, tak dobrze zaprojektowany tekst z ustalonym rytmem łatwiej się czyta i przyjemniej odbiera oczami”. 

6. Narzędzia to tylko narzędzia

Kolejna ważna lekcja w web designie pochodzi od Camerona Molla, byłego szefa designu w Facebooku, który radzi, by nie obsesjonizować się na punkcie narzędzi. Moll mówi: „Narzędzia nie są tak ważne jak fundament kreatywnego myślenia. Narzędzia będą się zmieniać przez całą Twoją karierę, a branżowe oprogramowanie może zostać zastąpione jeszcze zanim skończysz studia. Naucz się podstaw projektowania, które przeniesiesz na każde narzędzie”.

Rzeczywiście, mimo mnogości narzędzi niezbędnych w pracy nad web designem i UI, zbytnie przywiązanie do konkretnych programów to częsty błąd projektantów. 

Każdy profesjonalista powinien mieć podstawowy zestaw narzędzi do codziennych zadań, ale zamiast zostawać zaawansowanym użytkownikiem konkretnych funkcji czy programów, ważniejsze jest opanowanie fundamentów: zasad projektowania, kodowania, obróbki zdjęć, projektowania wizualnego, UX, typografii, teorii koloru i kompozycji.

7. Poszerzaj horyzonty

W web designie wszechstronność liczy się też w szerszym kontekście. „Czerpanie inspiracji spoza sieci. Przekartkowanie którejkolwiek z tych książek podsuwa dziesiątki pomysłów na nowe układy. Czytanie o nauce i teorii uczy mnie, dlaczego i kiedy podejmować dane decyzje”. Tak właśnie tworzy swoje niesamowite prace Jen Simmons, designerka i developer advocate w Mozilli. 

Jest ogromny zasób wiedzy, który możesz wykorzystać w web designie, by uczynić go mocnym i skutecznym. Na przykład zainteresowanie sztuką doładuje Twoje pokłady kreatywności i ułatwi wypracowanie indywidualnego, autentycznego stylu. Zgłębiając psychologię i zachowania człowieka, lepiej zrozumiesz, które elementy projektu wywołują u użytkowników konkretną reakcję. Znajomość podstaw biznesu i marketingu pomoże Ci lepiej rozumieć klientów oraz spełniać (i przekraczać) ich oczekiwania. \

8. I nie traktuj animacji po macoszemu

Przez lata obserwowaliśmy rozdźwięk między projektantami webowymi a animatorami. Ci pierwsi często byli niezadowoleni z jakości motion designu i obawiali się, że animowane elementy spowolnią strony, psując doświadczenie użytkownika. Na szczęście to już przeszłość. 

Wraz z dojrzewaniem web developmentu przemyślana, dobrze zaprojektowana animacja - dynamiczne tła, ekrany ładowania czy wizualna informacja zwrotna - potrafi pozytywnie kształtować doświadczenie użytkownika, nie tylko poprawiając estetykę strony, ale też ułatwiając nawigację i podtrzymując zainteresowanie serwisem lub aplikacją.

„Animacja w sieci może być czymś znacznie więcej niż tylko dekoracją, ale tylko wtedy, gdy uczynimy ją częścią procesu projektowego. Nie będzie znaczącym dodatkiem do doświadczenia użytkownika, jeśli nie uwzględnisz jej we wczesnych rozmowach, które to doświadczenie definiują” - mówi Val Head, senior design advocate w Adobe.

9. Odróżniaj krótkotrwałe mody od trwałych trendów

Pamiętasz menu hamburgerowe, nieskończone przewijanie i karuzele reklam? Wolelibyśmy zapomnieć, że kiedykolwiek istniały. Co roku scena web designu przeżywa nową falę kreatywnych pomysłów. Część z nich warto zatrzymać, ale większość wychodzi z mody równie szybko, jak się pojawia. 

Sprytni projektanci i programiści webowi wiedzą, jak rozpoznać i wykorzystać przełomowe trendy, które napędzają świeże i inspirujące projekty, oraz jak odróżnić je od krótkotrwałych mód, które potrafią zepsuć każdą stronę i aplikację wyglądem przestarzałym tuż po wdrożeniu.

Shane Mielke, nagradzany creative director, projektant i front-end developer, tłumaczy, czym grozi uleganie przemijającym modom w web designie: „Uważam, że wiele obecnych trendów w projektowaniu jest niesamowicie nudnych i pozbawionych inspiracji. Projekty cofnęły się w czasie i przypominają wystylizowany UX z kilkoma podstawowymi kolorami, paroma fontami i zdjęciami, zamiast być przedłużeniem osobowości i stylu projektanta”.

10. Ucz się na błędach innych

Tę myśl przypisywano wielu osobom, ale w istocie zawsze sprowadza się do tego samego. Błędy są niezbędnym etapem nauki, ale uniknięcie części z nich dzięki uczeniu się od innych oszczędzi Ci mnóstwo czasu (i frustracji).

„Projektowanie stron jest trudne i wymaga mnóstwa praktyki, żeby robić to dobrze. Jeśli jesteś choć trochę taki jak ja, popełniłeś przy tym mnóstwo błędów. Uważam, że warto wskazywać typowe błędy, żebyśmy mogli zamienić je w sukces” - mówi Jesse Showalter, jeden z najpopularniejszych youtuberów wśród projektantów i deweloperów UI/UX. 

Słaba czytelność, bałaganiarski układ, zła nawigacja - to tylko kilka podstawowych pułapek, które ominiesz, słuchając rad najlepszych projektantów webowych i UX oraz czytając branżowe blogi i inne materiały.

Chcesz podkręcić swój web design? 

Web design i development to bardzo wymagające zawody, które wymagają szerokiego wachlarza umiejętności i ogromnej wiedzy. Dobrze dobrany zespół kreatywnych specjalistów webowych z doświadczeniem w zwinnym prowadzeniu projektów potrafi jednak zamienić zwykłą aplikację czy stronę w maszynę do sprzedaży. Dlatego jeśli potrzebujesz pomocy przy kolejnym projekcie webowym, warto oprzeć się na zaufanych specjalistach. Na szczęście nie musisz szukać daleko ;)