UX portfolio – dziewięć mistrzowskich przykładów

Portfolio UX to dla projektanta podstawa profesjonalnej obecności w sieci. To właśnie tu możesz zabłysnąć geniuszem: wyeksponować najlepsze osiągnięcia, opisać źródła pomysłów i zademonstrować etapy pracy nad projektami.

Potencjalny klient (gdy jesteś freelancerem) lub pracodawca (jeśli szukasz pracy na etat) w pierwszej kolejności oceni jakość Twojego UX portfolio – nikt nie potraktuje Cię poważnie, gdy nie będzie mógł zobaczyć dowodu Twoich umiejętności. Poświęć więc dość czasu na przejrzenie prac i wybranie najlepszych, wykorzystaj maksimum zdolności i zbuduj strony, które wypromują Twój talent.

Projektowanie to bardzo złożony proces i przełożenie go na prezentacje w formacie wizualnym może wymagać sporo wysiłku, zwłaszcza jeśli Twoja praca koncentruje się wyłącznie wokół zagadnień UX. Istnieje jednak wiele sposobów, aby opowiedzieć o swojej drodze twórczej z wykorzystaniem wizualizacji.

Przejrzyj wybrane przez nas interesujące przykłady UX portfolio (wszystkie powstały na platformie Wix) i zobacz, jakie elementy warto uwzględnić na swoich stronach i jak je ustrukturyzować. Stworzyliśmy także listę najlepszych praktyk, o których warto pamiętać przy tworzeniu własnego UX designer portfolio.

1. Sophie Brittain

Sophie Brittain, która pracuje w obszarze digital i branding, stworzyła projekt intrygujący i pełen przestrzeni. Na głównej stronie jej UX portfolio przyciąga uwagę element w prawym górnym rogu – układ klocków w wyrazistych kolorach. Motyw ten powtarza się w całym portfolio, łącząc różne strony i tworząc rozpoznawalną markę Sophie.

Przy przewijaniu strony menu pozostaje w stałym miejscu na ekranie, co zapewnia wygodną nawigację. Przechodząc na stronę „O mnie”, zauważymy, że zmienia się tło z białego na jasnoniebieskie – to stanowi przyjemne zaskoczenie i urozmaicenie, ale zarazem jest w pełni spójne z resztą projektu.

UX portfolio Sophie Brittain – to warto zapamiętać

Napisz jednoznacznie, kim jesteś i czym się zajmujesz. Prawdopodobnie potencjalni pracodawcy i klienci będą przeglądać dziesiątki UX portfolio i Twoje znajdzie się między wieloma innymi. Wyraźnie zaznacz, w jakiej dziedzinie się specjalizujesz.

Wykorzystaj główną część strony, aby krótko się przedstawić i podkreślić swój obszar specjalizacji.

Sophie na samym początku napisała, kim jest: jak się nazywa i czym się zajmuje. Dzięki specyficznej typografii i dużej ilości pustej, białej przestrzeni wokół zdania wprowadzającego odwiedzający stronę od razu widzą tę informację. Dodała również przyjazne „hello!” oraz osobisty akcent w postaci ikonek. Wszystkie szczegóły subtelnie podkreślają jej osobowość twórczą.

2. Lital Karni

Jedno z najlepszych UX portfolio – bez wątpienia dzieło profesjonalnego projektanta. Energetyczna kombinacja kolorów natychmiast przyciąga wzrok, a górna część strony wydaje się zarówno wyrafinowana, jak i zabawna.

Układ na stronie głównej jest prosty i uporządkowany, zbudowany na planie pełnoekranowej siatki. Każdy prezentowany projekt ma inne tło, ale całość doskonale razem się komponuje.

Lital stworzyła niestandardowy projekt własnego logo, który przy scrollowaniu strony pozostaje w miejscu i pozwala na szybki powrót na początek strony głównej. Dzięki subtelnej poświacie, logo widoczne jest na każdym tle.

UX portfolio Lital Karni – to warto zapamiętać

Postaw na ułatwienie kontaktu. Głównym celem posiadania strony online jest zwrócenie uwagi na Twoje osiągnięcia i zdobycie nowych zleceń lub lepszego stanowiska. Ułatw pracodawcom i klientom kontakt ze sobą – wszystkie niezbędne informacje kontaktowe zamieść w łatwo dostępnym miejscu, podaj adres e-mail, numer telefonu i linki do swoich kanałów społecznościowych.

Gdzie w UX portfolio najlepiej jest umieścić informacje kontaktowe? Istnieje kilka możliwości: możesz stworzyć dedykowaną stronę kontaktową, podać swoje dane w stopce witryny lub na stronie „O mnie". Możesz też wykorzystać wszystkie powyższe rozwiązania.

Przeglądając UX designer portfolio przygotowane przez Lital, zauważysz, że projektantka wykorzystała kilka miejsc, by udostępnić swoje dane. Zachęcający przycisk „Let’s Talk” jest umiejscowiony w stałym punkcie ekranu i cały czas widoczny, sugerując odwiedzającym nawiązanie kontaktu. Kliknięcie w przycisk powoduje przeniesienie użytkownika do formularza kontaktowego na dole strony. Na stronie „O mnie” Lital podała swój e-mail, numer telefonu i linki do stron w mediach społecznościowych.

3. Saloni Joshi

Projektantka Saloni Joshi postawiła na prosty układ UX portfolio. Górna część głównej strony jest pełna przestrzeni, zawiera tylko krótką informację wprowadzającą i ikonki kontaktowe. Poniżej są jej przykładowe prace.

Saloni zamieściła kilka wzorcowych projektów wraz z dokładnym opisem – szczegółowym case study dla każdego zlecenia. Pokazanie etapów projektu i całego procesu pracy nad nim prezentuje odwiedzającym zakres umiejętności Saloni. Jednoznaczne określenie jej roli, celu projektu i zakresu czasowego prac pozwala dokładnie zrozumieć istotę każdego projektu.

Omówiła również kluczowe elementy każdego procesu projektowania UX: od przygotowania ogólnych założeń przez budowę szkieletu stron i prototypowanie po badania UX. Wszystko przedstawione jest za pomocą grafiki i zwięzłych, objaśniających tekstów.

UX portfolio Saloni Joshi – to warto zapamiętać

Napisz, w jakim trybie pracujesz – czy jesteś freelancerem, z którym można nawiązać współpracę, czy pracujesz na etacie. To ważna informacja dla potencjalnych zleceniodawców.

Saloni zamieściła tę istotną informację w strategicznym miejscu, na górze strony głównej. Potencjalni klienci i pracodawcy mogą natychmiast zobaczyć jej status zawodowy, bez poświęcania czasu na poszukania. Dodała również kilka słów o swoich poprzednich stanowiskach. Odwiedzający, którzy chcą dowiedzieć się więcej, mogą przejrzeć jej życiorys, do którego prowadzi link z menu.

4. Priyanka Goyal

Naprawdę trudno ominąć wzrokiem UX portfolio Priyanki Goyal, projektantki i ilustratorki. Zabawne połączenie grafiki i żywego pomarańczowego tła jest zrównoważone elegancką białą ramką. Ta czysta przestrzeń stanowi idealne miejsce dla elementów nawigacyjnych strony, takich jak pasek społecznościowy, menu hamburgerowe i logo.

W dalszej części strony asymetryczny układ intryguje i zachęca do dalszego przeglądania, gdzie można obejrzeć różne prace Priyanki. Dla każdego projektu wybrała jedno kluczowe zdjęcie i umieściła je na kolorowym tle. Trzymając się tego samego stylu, stworzyła urozmaicony, ale spójny projekt.

UX portfolio Priyanki Goyal – to warto zapamiętać

W pełni pokaż swoją osobowość. Goście Twojego UX portfolio chcą poznać Cię bliżej. Zamieść swoje najlepsze prace, przygotuj sekcję „O mnie” i postaraj się pokazać swój charakterystyczny rys w każdym elemencie strony, zarówno wizualnym, jak i w tekstowym.

Ilustracja na górze portfolio Priyanki oddaje jej charakter, podobnie jak odważna paleta kolorów. Priyanka na swoich stronach wita gości zdaniem: „Czuj się jak u siebie w domu, w lodówce jest lemoniada", które jest bardzo osobiste i dużo mówi o jej indywidualności.

5. Evie Cheng

W portfolio Evie Cheng, UX researcherki, wszystko wskazuje na profesjonalizm. Jej strona spełnia wszystkie oczekiwania: zamieściła interesujące wprowadzenie, nawigacja jest prosta i intuicyjna, a informacje okrojone do najważniejszego minimum – Evie prezentuje zaledwie cztery najlepsze projekty. Załączone do nich studia przypadków są naprawdę imponujące.

Evie zajmuje się szeroko pojętymi rozwiązaniami UX, nie tylko wizualnym aspektem stron. Pracę nad projektami przedstawiła w sposób dokładny i wciągający. Każde studium przypadku opatrzone jest tytułem i zdjęciami. Evie zaczyna się od wprowadzenia – wyjaśnia wyzwania, przed jakim stał zespół. Prezentuje proces badawczy, opisuje wywiady z użytkownikami, analizę konkurencji, podaje ustalenia i wnioski. Evie ponumerowała poszczególne sekcje, dzięki czemu opisy case studies są bardzo przejrzyste.

Evie przedstawia projekty, uzupełniając je ciekawymi wyjaśnieniami. Zamieszczona na końcu sekcja „What's More” wskazuje, że proces jest ciągły i że Evie uczestniczy w pełnym cyklu życia produktu, nie skupia się tylko na tym jednym jego aspekcie.

UX portfolio Evie Cheng – to warto zapamiętać

Opisując studia przypadków, załącz zdjęcia, które uzupełnią wyjaśnienia tekstowe. Evie jest utalentowaną autorką artykułów (możesz się o tym przekonać, klikając w linki zamieszczone w menu), wykorzystuje również wizualizacje, aby przeprowadzić nas przez cały proces swojej pracy. Dodanie zdjęć do case studies sprawia, że tekst jest bardziej czytelny i zachęcający, a także pomaga odwiedzającym stronę lepiej zrozumieć cały proces.

Evie zamieściła zdjęcia interfejsów w wersji „przed i po", a także zdjęcia ankiet, papierowych prototypów i kart, których jej zespół używał w trakcie badań. Fotografie pokazujące Evie i jej zespół przy pracy urozmaicają tekst i sprawiają, że opisywane przypadki stają się bliższe czytelnikowi.

6. Brittney Johnson

Pracująca jako product designer Brittney Johnson jest wszechstronnie uzdolniona. Jej kreatywne umiejętności w zakresie projektowania graficznego są wyeksponowane w UX portfolio, a ciekawa forma graficzna strony głównej od razu przyciąga wzrok.

Brittney w swoim UX designer portfolio wykorzystuje angażujące, interaktywne rozwiązania i daje odwiedzającym krótki przegląd możliwości twórczych. O jej talencie można przekonać się od razu po wejściu na stronę główną. Po najechaniu kursorem na odpowiedni tekst widzimy odpowiednią grafikę obrazującą projekt po drugiej stronie ekranu. Projektantka dodała również efekt hover, który sprawia, że tekst zmienia kolor w zależności od barwy tła.

Brittney wykorzystuje szeroką paletę barw w swoim UX portfolio, dzięki czemu projekt jest zabawny i zapada w pamięć. Żywe odcienie odzwierciedlają jej osobowość i dodają element humoru do wysoce ustrukturyzowanego układu strony.

UX portfolio Brittney Johnson – to warto zapamiętać

Zaprezentuj cały proces pracy, a nie tylko produkt końcowy. Projektanci UX dobrze wiedzą, ile wysiłku trzeba włożyć w każdy projekt. Efekt końcowy to tylko zwieńczenie pracy, do którego prowadzą badania na szeroką skalę, testowanie, prototypowanie, liczne iteracje i kolejne etapy przygotowań.

Pokazanie pełnej rozpiętości działań zaprezentuje skalę Twoich umiejętności i możliwości i zarazem wyjaśni Twój proces decyzyjny stojący za każdym z projektów.

Brittney fantastycznie zaprezentowała swój proces pracy. Efekt końcowy jest wyraźnie przedstawiony po prawej stronie ekranu, a lista drop-down dzieli informacje na zrozumiałe fragmenty. Projektantka nie przytłacza odwiedzających obszernym tekstem – to wyraźnie wskazuje, że planując swoje UX designer portfolio, Brittney wzięła pod uwagę doświadczenia związane z przeglądaniem stron. W zwięzły sposób omawia wszystko, począwszy od prezentacji celu przez badania, personalizację użytkowników, ustalenia i prototypowanie aż po ostateczny efekt projektu.

7. Omar Alamrani

Strona główna Omara Alamrani, projektanta UX/UI, zawiera dużo pustej, białej przestrzeni. Dzięki temu od razu widzimy jego nazwisko i proste zdanie wprowadzające. Omar wykorzystał także favicon, dzięki czemu jego strona wyróżnia się wśród innych otwartych kart.

Każde studium przypadku jest przemyślane i pokazane w uporządkowany sposób. Menu po prawej stronie ekranu pomaga odwiedzającym w nawigacji, umożliwiając łatwą orientację w zawartości opisu. Omar pokazuje pełen wachlarz swoich umiejętności: od prowadzenia badań analitycznych po projekty UI.

Projektant dodał sekcję poświęconą przemyśleniom nad przyszłością każdego interfejsu. To pokazuje jego zaangażowanie w pracę – widzimy, że każde zlecenie traktuje bardzo poważnie.

UX portfolio Omara Alamrani – to warto zapamiętać

Stosuj tzw. microcopy – krótkie i przejrzyste hasła, instrukcje lub komentarze. Projektanci UX rozumieją znaczenie dobrze napisanego tekstu. Podobnie jak struktura i wygląd interfejsu, prawidłowo opracowany tekst odgrywa ogromną rolę w doświadczeniach użytkowników ze stronami i ułatwia im w zrozumienie skomplikowanych procesów.

Zastosuj sprawdzone rozwiązania w swoim portfolio UX. Przygotuj proste, czytelne teksty microcopy, które ułatwią odwiedzającym zrozumienie zawartości Twoich stron i ich przeglądanie. Możesz do swojego UX portfolio dodać nieco humoru, aby nadać mu osobisty rys, ale skup się na tym, by teksty były jednoznaczne i czytelne.

Skoncentruj się na prostocie i zrozumiałości, podobnie jak zrobił to Omar w sekcji kontaktowej i w menu. Najważniejsze jest, aby odbiorcy natychmiast i zgodnie z Twoimi założeniami odczytali Twoje intencje.

8. Pondsuda June Saelim

Multidyscyplinarna projektantka Pondsuda June Saelim wita odwiedzających intrygującą animacją na stronie głównej, która nie tylko przyciąga uwagę i wyróżnia jej portfolio spośród innych, ale także służy jako autoprezentacja.

Klasyczne menu Pondusuda zastąpiła menu rozbitym na kilka elementów umiejscowionych w rogach strony głównej. Do tego dodała efekt hover – najechanie kursorem na menu powoduje wyświetlenie listy różnych projektów, podzielonych na dyscypliny. Daje to odwiedzającym przejrzysty przegląd jej obszarów specjalizacji i przypisanych do nich projektów.

Kolejnym ciekawym akcentem jest interaktywna gra, która pojawia się po najechaniu kursorem myszy na literę „R” w menu. Odwiedzający są zaproszeni do zabawy z układaniem liter z imienia Pondsudy, co stanowi zaskakujący i zabawny dodatek do jej portfolio UX.

UX portfolio Pondsudy June Saelim – to warto zapamiętać

Warto załączyć swoje CV. Choć nie jest to konieczne, dodanie do portfolio UX życiorysu da potencjalnym pracodawcom lub klientom więcej informacji o Tobie. Zamieść tam tylko najważniejsze fakty, by nie przytłaczać czytelnika nadmiarem informacji.

Pondsuda umieściła w menu nawigacyjnym bezpośredni link do CV, dzięki czemu jest ono łatwo dostępne. Tworząc portfolio projektowe, umieść CV albo na stronie „O mnie”, albo jako plik do pobrania.

9. Michaella Twersky

Portfolio projektantki Michaelli (Miki) Twersky ma klasyczny wygląd, a jednocześnie dużo mówi o jej niezwykłej osobowości.

Przestronny układ i duży, wprowadzający tekst jest często spotykany w UX portfolio, ale Miki nadała swojej stronie indywidualny charakter. Połączyła dwa różne style czcionek i zmodyfikowała znane powiedzenie, dzięki czemu stworzyła intrygujące hasło, inspirujące do chwili namysłu. Zabawny tekst i rysunek w stopce strony również odzwierciedlają osobowość projektantki i zachęcają odwiedzających do pozostania dłużej na jej stronach.

Miki wykorzystała na stronie głównej efekt hover – wszystkie grafiki są czarno-białe, ale po najechaniu na nie, ożywają kolorami. To pomaga użytkownikom skupić się na konkretnym projekcie, co jest doskonałym przykładem zastosowania zasad UX.

UX portfolio Michaelli Twersky – to warto zapamiętać

Do UX portfolio wybierz wyłącznie najlepsze prace. Twoje strony to szansa na pokazanie najważniejszych umiejętności, dlatego zamieść w nim tylko te projekty, które naprawdę napawają Cię dumą. Nie ma sensu zwracać uwagi na prace, za którymi nie przepadasz, albo takie, które nie były dla Ciebie dość satysfakcjonujące i nie chcesz nad podobnymi projektami pracować w przyszłości.

Michaella zamieściła w swoim portfolio kilka wybranych projektów. Każdy z nich jest bardzo wysokiej jakości i odzwierciedla jej możliwości jako projektantki. Dodała również sekcję „Cache”, gdzie dzieli się projektami, które nie zmieściły się w głównej części. Dzięki temu pokazała pełen zakres umiejętności i zainteresowań, a także talent graficzny i pomysły na prace konceptualne.

UX portfolio – najlepsze praktyki

Po zaczerpnięciu inspiracji od innych projektantów UX, wykorzystaj własne przemyślenia i wnioski i stwórz swoje strony. Weź pod uwagę najważniejsze wskazówki i pamiętaj o elementach, które powinny być uwzględnione w Twoim UX designer portfolio:

1. Wyraźnie napisz, kim jesteś i czym się zajmujesz.

2. Ułatw kontakt ze sobą.

3. Wyjaśnij swój obecny status zatrudnienia.

4. Zadbaj, by wyrazić swoją indywidualność twórczą.

5. Wykorzystaj grafikę i zdjęcia w studiach przypadków.

6. Przedstaw cały proces pracy, a nie tylko produkt końcowy.

7. Używaj zrozumiałych komunikatów microcopy.

8. Rozważ dodanie CV.

9. Wybierz tylko najlepsze prace.

Zespół Wix