WybierzTV
WybierzTV
WybierzTV
Rola w projekcie
UI/UX/Prototyp
O projekcie
Dopasowarka telewizorów
Klient
Maciej Koper / WybierzTV
Wyzwanie
Wyzwanie
Stworzenie konfiguratora telewizorów z kolosalną ilością danych i informacji
Stworzenie konfiguratora telewizorów z kolosalną ilością danych i informacji
Za pomocą interaktywnych ankiet platforma prowadzi użytkownika do idealnych wyników wyszukiwania, a następnie do profilu telewizora z dostępną punktacją i szczegółową specyfikacją. Uferuje również testy telewizorów i możliwość porównania wyników.
Za pomocą interaktywnych ankiet platforma prowadzi użytkownika do idealnych wyników wyszukiwania, a następnie do profilu telewizora z dostępną punktacją i szczegółową specyfikacją. Uferuje również testy telewizorów i możliwość porównania wyników.
Design system
Design system
Design system
Design system
Przygotowałem wykaz typografii, kart, kolorów ikon i wiele więcej.
Przygotowałem wykaz typografii, kart, kolorów ikon i wiele więcej.
1 etap
1 etap
Z poziomu strony głównej wchodzimy w interaktywne ankiety aby dopasować telewizor do naszych preferencji
Z poziomu strony głównej wchodzimy w interaktywne ankiety aby dopasować telewizor do naszych preferencji
Etapy dopasowania zostały podzielone na 11 etapów za pomocą intuicyjnych ankiet. Niektóre etapy może użytkownik pominąć.
Etapy dopasowania zostały podzielone na 11 etapów za pomocą intuicyjnych ankiet. Niektóre etapy może użytkownik pominąć.
Strona główna
Strona główna
Wejście do ankiet jest dostępne na stronie głównej
Wejście do ankiet jest dostępne na stronie głównej
Ten widok bo obejmuje również takie sekcje jak: Wpisy, Najnowsze testy telewizorów
Ten widok bo obejmuje również takie sekcje jak: Wpisy, Najnowsze testy telewizorów
2 etap
2 etap
Po wypełnieniu ankiet przechodzimy do strony z listingiem wyników telewizorów
Po wypełnieniu ankiet przechodzimy do strony z listingiem wyników telewizorów
Przygotowałem cały userflow łącznie z prototypem, aby klient miał lepszy przegląd tego co zostało zrobione. To co istotne wyróżniłem procent dopasowania telewizora do potrzeb oraz oferty sklepów - linki afiliacyjne.
Przygotowałem cały userflow łącznie z prototypem, aby klient miał lepszy przegląd tego co zostało zrobione. To co istotne wyróżniłem procent dopasowania telewizora do potrzeb oraz oferty sklepów - linki afiliacyjne.
Porównywarka wyników wyszukiwania
Porównywarka wyników wyszukiwania
Mamy również możliwość porównania telewizorów z poziomu listingu
Mamy również możliwość porównania telewizorów z poziomu listingu
Po zaznaczeniu pozycji telewizorów (za pomocą checkbox'a) pojawia się na pasku nadrzędnym opcja zaznaczenia maksymalnie dwóch pozycji oraz przycisk "Porównaj". Cały pasek jest widoczny (przyklejony-sticky) na stałe w górnej części.
Po zaznaczeniu pozycji telewizorów (za pomocą checkbox'a) pojawia się na pasku nadrzędnym opcja zaznaczenia maksymalnie dwóch pozycji oraz przycisk "Porównaj". Cały pasek jest widoczny (przyklejony-sticky) na stałe w górnej części.
3 etap
3 etap
Projekt widoku telewizora
Projekt widoku telewizora
Finalnie mamy bardzo obszerny widok z rozwinietą punktacją telewizora i ostatecznym werdyktem. Strona jest bardzo obszerna - pokazuje dokładne szczegółowe informacje z czego wynika punktacja - zawiera mnóstwo tabel, statystyk, analiz i wiele więcej.
Finalnie mamy bardzo obszerny widok z rozwinietą punktacją telewizora i ostatecznym werdyktem. Strona jest bardzo obszerna - pokazuje dokładne szczegółowe informacje z czego wynika punktacja - zawiera mnóstwo tabel, statystyk, analiz i wiele więcej.
4 etap
4 etap
W ramach zlecenia wykreowałem również widok testów telewizorów łącznie z listingiem testów
W ramach zlecenia wykreowałem również widok testów telewizorów łącznie z listingiem testów
Przygotowałem cały userflow łącznie z prototypem, aby klient miał lepszy przegląd tego co zostało zrobione. To co istotne wyróżniłem procent dopasowania telewizora do potrzeb oraz oferty sklepów - linki afiliacyjne.
Przygotowałem cały userflow łącznie z prototypem, aby klient miał lepszy przegląd tego co zostało zrobione. To co istotne wyróżniłem procent dopasowania telewizora do potrzeb oraz oferty sklepów - linki afiliacyjne.
Użyteczne userflow
Użyteczne userflow
W wersji mobilnej użyłem modali aby ułozyć skutecznie ścieżkę użytkownika
W wersji mobilnej użyłem modali aby ułozyć skutecznie ścieżkę użytkownika
Ze względu na dużą ilość informacji ścieżkę użytkownika podzieliłem na najważniejsze wyróżniki oraz na UX'owe modale.
Ze względu na dużą ilość informacji ścieżkę użytkownika podzieliłem na najważniejsze wyróżniki oraz na UX'owe modale.
5 etap
5 etap
Intro dla filmu youtube
Intro dla filmu youtube
Wykonałem również krótkie intro dopasowane do całości stylistyki strony, które klient wykorzystuje w swoich filmach na kanale youtube.
Wykonałem również krótkie intro dopasowane do całości stylistyki strony, które klient wykorzystuje w swoich filmach na kanale youtube.