Lee Cooper Redesign i migracja sklepu internetowego

Poprzednia platforma:

Trustnet

Branża:

Moda, odzież

Cele:

Zmiana platformy, wzrost i skalowanie, opracowanie UX, nowy interfejs

Zdjęcie główne LeeCooper

Szczegóły wdrożenia i główne wyzwania

Lee Cooper to globalnie rozpoznawalna marka brytyjskich jeansów. W każdym z Państw, w których obecna jest dystrybucja odzieży Lee Cooper istnieją oficjalne, ale działające niezależne sklepy internetowe. Dlatego każdy z nich indywidualnie podchodzi do prezentacji oferty i zakupu. Naszym zadaniem była migracja oficjalnego, polskiego sklepu Lee Cooper na platformę IdoSell, aby wesprzeć wzrost i skalowanie biznesu, opracowanie nowej szaty graficznej oraz UX sklepu.

Głównym wyzwaniem było stworzenie sklepu lepszego od konkurencyjnych marek jeansów oraz innych sklepów Lee Cooper na świecie, jednocześnie zachowując charakter marki. Ponieważ polski sklep Lee Cooper powstawał kilka lat wcześniej, nie mogliśmy po prostu wykonać liftingu. Proces wdrożenia sklepu wymagał zaprojektowania wszystkiego od podstaw, stawiając potrzeby klienta na pierwszym miejscu. Zaczęliśmy od przeprowadzenia analizy UX, czyli określenia potrzeb klientów, stworzenia person, zbadania konkurencyjnych rozwiązań.

Stworzenie nowego sklepu internetowego Lee Cooper było dla nas priorytetem. Na rynku jest sporo dostawców platform e-commerce, jednak my nie mieliśmy wątpliwości. Nasza decyzja padła na IdoSell, czyli sprawdzoną firmę, która jest od wielu lat na rynku i cieszy się dobrą opinią wśród klientów. Dodatkowym atutem jest fakt, że IdoSell posiada doświadczenie we wdrażaniu sklepów z branży fashion.

Wojciech Balik

Dyrektor Generalny

W IdoSell bardzo wiele rozwiązań, szczególnie tych newralgicznych jak proces zakupowy albo reklamacje, rozwijamy regularnie i badamy od razu na dużych grupach sklepów. Dzięki temu nie tylko mamy szeroki zakres wiedzy, na której możemy opierać indywidualne rozwiązania, ale przede wszystkim nie musimy tworzyć wszystkiego od podstaw, co efektywnie zmniejsza koszty wdrożenia sklepu.Gdy tworzy się sklep internetowy od podstaw trzeba przemyśleć i zbadać każdy jego element, a testy niezbędne do wypracowania rozwiązań komfortowych dla klientów i gwarantujących wysoką konwersję, pochłaniają bardzo wiele czasu i zasobów. W IdoSell dużą część tej pracy mamy już wykonaną, więc tak naprawdę dopracowujemy szczegóły i poświęcamy cały czas na to co najlepiej sprawdzi się w przypadku konkretnego sklepu. Tak samo było w przypadku sklepu Lee Cooper, gdzie oprócz naszego doświadczenia i wiedzy z analizy UX, przekazano nam również ogromy feedback, który właściciele sklepu otrzymali od swoich klientów.

Opracowanie hierarchii informacji, szkice układów i rozwiązań

Najbardziej istotne przy wyborze jeansów są wybór fasonu i rozmiaru. Dlatego stworzenie jak najwygodniejszego procesu doboru odpowiednich spodni wymagało dopracowania nie tylko karty produktu, ale również widoku kategorii oraz zbudowania jak najlepszej nawigacji. W tym celu zawsze tworzymy szereg szkiców oraz mnogość wersji najbardziej istotnych podstron, aby wyłapać mocne i słabe punkty każdej z nich. Niektóre z nich możemy wykluczyć w trakcie wewnętrznych konsultacji, ale część która tego wymaga jest testowana z użytkownikami oraz konsultowana z właścicielami/obsługą sklepu. Dla sklepu Lee Cooper powstało od kilku do kilkunastu wersji głównego menu, strony głównej, karty produktu i kategorii.

Hierarchia informacji - pierwszy zrzut ekranu Hierarchia informacji - drugi zrzut ekranu Hierarchia informacji - trzeci zrzut ekranu

Dobór fontów i kolorystyki

futura pt book

Pierwszy font - Futura pt book

futura pt bold

Drugi font - Futura pt bold
#1F3555
#CE0E2D
#222222
#CCCCCC

Strona główna

Wizerunek jest bardzo ważnym aspektem sklepu z odzieżą, dlatego zastosowaliśmy banery o pełnej szerokości, które są jednocześnie tłem dla górnej części sklepu. Ponieważ w sklepie pojawią się banery na jasnym i ciemnym tle, ważne jest, aby górne elementy dostosowywały się do nich i zawsze kontrastowały z nimi.

Mocno dopracowaliśmy układ i zawartość zakładek w rozwijanym menu, które po wielu testach i dyskusjach przybrało obecny kształt. Oczywiście równie ważne było dopracowanie menu w mobilnej wersji sklepu.

Strona główna

Menu na mobile

Strona główna menu - pierwszy zrzut ekranu Strona główna menu - drugi zrzut ekranu Strona główna menu - trzeci zrzut ekranu

Strona główna

Dla sklepu takiego jak Lee Cooper bardzo ważne jest promowanie wielu kategorii, kolekcji i kampanii, które zawsze dotyczą zarówno kobiet, jak i mężczyzn. Stworzyliśmy dużą strefę z kafelkowym układem bannerów, z przyciskami, które kierują do odpowiedniego asortymentu w zależności od męskiej lub żeńskiej budowy ciała.

Strona główna - pierwszy widok

Strona główna

Również w przewijanym obszarze polecanych produktów znajduje się podział na eksponowanie ubrań w zależności od interesującego nas typu sylwetki.

Niżej znajduje się strefa linkująca do przewodnika doboru fasonu jeansów oraz link do wyszukiwarki sklepów stacjonarnych. Dodatkowo strefa instagram, do której mamy w IdoSell autorską wtyczkę, zapis do newslettera aby otrzymać kod promocyjny oraz stopka z linkami do ważnych podstron związanych z kontem i zamówieniami.

Strona główna - drugi widok

Strona główna

Mobile

Strona główna mobile - pierwszy zrzut ekranu Strona główna mobile - drugi zrzut ekranu Strona główna mobile - trzeci zrzut ekranu

Karta produktu

Najważniejsza podstrona, czyli karta produktu. To na niej podejmujemy decyzję o zakupie, więc musi być szczególnie dopracowana. W przypadku sklepu Lee Cooper zdecydowaliśmy się wyświetlić dwa zdjęcia jednocześnie, ale zachowując klasyczne miniatury i informację ile jeszcze zdjęć jest w galerii.

Bardzo ważne było wyraźne wyróżnienie promocji, ale najbardziej istotne było podzielenie rozmiaru na szerokość i długość spodni, co w praktyce nie jest tak proste, jak mogłoby się wydawać. Takie rozwiązanie wymagało ścisłej współpracy projektantów z frontend developerami, aby zarządzanie rozmiarami było wygodne dla obsługi sklepu, a wybór rozmiaru jasny i wygodny dla klientów. Dla jasności dodaliśmy wybrany rozmiar na końcu, obok linku do tabeli rozmiarów, zapisany jako XX/YY, czyli w formie dobrze znanej klientom.

Ważne było również przedstawienie dokładnego opisu wszystkich cech produktu, co docelowo będzie sprawą obsługi sklepu, ale zawsze robimy research, aby ustalić, jakich elementów może najbardziej brakować klientom. Dobry opis produktu to zazwyczaj jeden z najważniejszych i niestety często zaniedbywanych elementów w sklepach internetowych.

Karta produktu - pierwszy widok

Karta produktu

Gdy już wszystko wiemy o produkcie, możemy przedstawić rekomendacje innych produktów.

Karta produktu - drugi widok

Karta produktu

Mobile

Karta towaru mobile - pierwszy zrzut ekranu Karta towaru mobile - drugi zrzut ekranu Karta towaru mobile - trzeci zrzut ekranu

Lista produktów

Ponieważ jeansy charakteryzują się wieloma parametrami, które nie muszą być istotne dla każdego klienta, możemy pokazać najpierw najważniejsze filtry. Pozostałe, takie jak rodzaj zapięcia, wyświetlimy dopiero po kliknięciu przycisku.

Search - pierwszy widok

Lista produktów

Mobile

Search mobile - pierwszy zrzut ekranu Search mobile mobile - drugi zrzut ekranu

Strona główna

W całości

Homepage pełna strona

Karta produktu

W całości

Projector pełna strona

Lista produktów

W całości

Search pełna strona

Więcej historii klientów IdoSell

"Budowanie sklepu wspólnie z zespołem Idosell to była radość tworzenia czegoś nowego. Dało nam to dużo satysfakcji. Miałyśmy poczucie, że stawiamy sklep na naprawdę solidnych fundamentach."

Czytaj całość

"Potrzebowałyśmy czegoś większego, z większą liczbą opcji, możliwościami personalizacji, ale też z większą stabilnością. (...) IdoSell na ten moment dostarcza nam wszystkich potrzebnych funkcjonalności."

Czytaj całość

"Zależało nam nie tylko na funkcjonalnościach, ale również na oryginalnym i zaawansowanym szablonie graficznym sklepu. Chcieliśmy mieć swobodę w dokonywaniu modyfikacji w wyglądzie sklepu oraz nie ograniczać się we wdrażaniu coraz to nowszych rozwiązań ułatwiających zakupy."

Czytaj całość