Polska, Czechy
EVAMATS
Kompleksowy redesign UI/UX oraz interaktywny konfigurator produktów dla EVAMATS, zoptymalizowany pod kątem 80% ruchu mobilnego na rynkach Polski i Czech.
- Figma UI Kit
- System projektowania
- Design UI/UX
- Mobile First
- Sklep internetowy
- Akcesoria samochodowe
- Konfigurator
4
tygodnie — Czas projektowania interfejsu
80%
ruchu — Konwersja na urządzeniach mobilnych
Zadania klienta
-
Nieefektywna koncepcja wizualna. Stara platforma wykorzystywała ciemny motyw tylko po to, by odróżnić się od konkurencji, co pogarszało czytelność katalogu i zmniejszało zaufanie do jakości materiałów.
-
Przeładowana ścieżka użytkownika (CJM). Proces konfiguracji (wybór marki, modelu samochodu, koloru dywanika i obszycia) zawierał zbyt wiele kroków, co potwierdziły analizy porzuceń koszyka.
-
Ignorowanie ruchu mobilnego. Interfejs konfiguratora nie był przystosowany do smartfonów, co prowadziło do utraty zamówień od 80% użytkowników mobilnych.
-
Brak spójnej bazy elementów UI. Chaotyczne stosowanie komponentów utrudniało odbiór interfejsu i uniemożliwiało szybką rozbudowę serwisu w przyszłości z powodu braku systemu projektowania.
Nasze rozwiązania
-
Analityczny redesign UI i migracja motywu
- Przeprowadziliśmy pełny audyt wizualny, przenosząc platformę EVAMATS z ciemnego układu na przejrzysty, jasny interfejs o wysokiej konwersji.
- Na podstawie danych behawioralnych wykazaliśmy klientowi, że jasne tło jest niezbędne do poprawnego odwzorowania kolorów materiałów i faktury dywaników.
- Nowe UI łączy minimalizm z technologicznym stylem branży moto, budując zaufanie do marki w Polsce i Czechach.
-
Optymalizacja konfiguratora dla wyższej konwersji
- Przebudowaliśmy logikę konfiguratora, łącząc rozproszone etapy doboru akcesoriów w jedną, płynną przestrzeń roboczą. Teraz użytkownicy wybierają markę, model, rok produkcji auta oraz paletę komponentów bez przeładowywania strony.
- Wyeliminowaliśmy bariery dzięki dużym kartom podglądu, natychmiastowej walidacji danych oraz wizualnym wskaźnikom postępu.
-
Adaptacja Mobile-First dla kluczowego ruchu
- Biorąc pod uwagę, że 80% klientów przegląda stronę na smartfonach, zaprojektowaliśmy interfejs z myślą o obsłudze jedną ręką.
- Wszystkie elementy wyboru, rozwijane listy parametrów oraz próbki kolorów zostały powiększone i umieszczone в aktywnej strefie kciuka.
- Zastosowanie natywnych wzorców mobilnych i stałych przycisków akcji przekształciło złożone zamówienie w szybki proces.
-
Skalowalny system projektowania w programie Figma
- W celu sprawnego przekazania projektu programistom, stworzyliśmy ustrukturyzowany UI Kit w programie Figma.
- System obejmuje globalne style typografii, siatki, tokeny kolorystyczne oraz interaktywne stany komponentów.
- Każdy element interfejsu (przyciski, pola wyboru, stany pól wprowadzania danych) został szczegółowo udokumentowany, co eliminuje błędy kodowania przy wdrażaniu nowych wersji językowych.
Gotowość do rozwoju
Stworzona infrastruktura projektowa stanowi fundament pod skalowanie biznesu EVAMATS na kolejne rynki europejskie. Komponentowy UI Kit pozwala klientowi dodawać nowe kategorie produktów (dywaniki do bagażnika, organizery) bez konieczności angażowania projektantów. Globalne style wspierają szybką lokalizację językową i zmianę walut, zachowując spójność interfejsu na wszystkich obecnych i przyszłych wersjach sklepu.
Wyniki
-
Realizacja projektu w 4 tygodnie. Ścieżka od badania UX i weryfikacji hipotez do interaktywnego prototypu wysokiej rozdzielczości została zamknięta w miesiąc.
-
Uzasadniona zmiana paradygmatu wizualnego. Przejście na ergonomiczny, jasny motyw wyeliminowało problemy z percepcją kolorów i poprawiło czytelność katalogu.
-
Maksymalna wygoda dla 80% użytkowników. Architektura interfejsu została w pełni dostosowana do wzorców mobilnych, konwertując ruch ze smartfonów na zamówienia.
-
Gotowość do wdrożenia technicznego. Przekazanie ustrukturyzowanego systemu projektowania Figma wyeliminowało nieporozumienia po stronie programistów front-end.
-
Likwidacja barier w lejku sprzedaży. Optymalizacja etapów konfiguratora zminimalizowała porzucenia strony doboru produktów, tworząc prostą ścieżkę od wyboru auta do zakupu.
Integracje / Tech stack
TERMINY I ZESPÓŁ
4 tygodnie
łącznie
-
Zespół wewnętrzny3 osoby1 UX-resercher, 1 UI/UX designer, 1 PM
Wycenimy Twój projekt w ciągu 24 godzin
Zostaw numer telefonu i wybierz usługę. Oddzwonimy, aby w ciągu 10 minut omówić szczegóły, a następnie przygotujemy wstępną wycenę, harmonogram realizacji oraz zakres prac.