Elwix zabiera swoich Klientów na wspaniałe zakupy - nowy design, UX i technologia zmieniły zasady gry

Ścieżki zakupowe gładko prowadzące do celu

W warstwie wizualnej i funkcjonalnej skupiliśmy się na potrzebach użytkowników – na tym, by cały proces zakupowy był prosty, intuicyjny, przyjemny. Połączyliśmy nowoczesny design z UX i przemyślanymi funkcjonalnościami. Tak powstały m.in.:

• Oczyszczony koszyk zakupowy

Pierwsze nasze założenie to: “Nie przeszkadzać w zakupach”. Z koszyka usunęliśmy zbędne elementy, które mogłyby rozpraszać. Pozostało tylko to, co stricte związane z finalizacją zakupu. Układ treści jest czytelny, strona przejrzysta, prosta, elegancka, wszystkie ważne informacje są widoczne.

Drugim celem było dać takie “bodźce”, które sprawią, że użytkownik w tej strefie będzie czuł się bezpiecznie. Wpływają na to chociażby takie elementy jak logotypy dostawców płatności czy przesyłek (potwierdzone badaniami). By takie logotypy zamieścić, musieliśmy stworzyć osobny moduł.

• Mega menu 

Mega menu powstało, by ułatwić użytkownikowi poruszanie się pomiędzy kategoriami produktów – bez przekierowań, tworzenia dodatkowych podstron. Wszystkie poziomy zagnieżdżenia kategorii są w zasięgu ręki – dostępne już z poziomu menu, niezależnie od tego, na jakiej stronie znajduje się użytkownik. To element nawigacji mocno osadzony w UX. Moduł nie jest dostępny w standardzie.

Zrezygnowaliśmy jednocześnie z klasycznego, bocznego menu, które zabiera sporo przestrzeni na stronie. Uznaliśmy, że można by ją wykorzystać w bardziej efektywny sposób – na zaprezentowanie większej ilości produktów w wierszu.

• Minimalizowanie przekierowań na karcie produktu

Ta funkcjonalność jest stricte związana z wielowariantowością opartą o dedykowane karty produktowe dla każdego z wariantów, o czym trochę później. Z poziomu użytkownika pozwala na wybranie rozmiaru konkretnego produktu bez przeładowania strony – Klient pozostaje na tej samej karcie produktu. Co daje taka funkcjonalność?

• Mniejsze prawdopodobieństwo, że Klient porzuci zakup, zniechęcony oczekiwaniem na załadowanie karty produktu; ma to duże znaczenie dla Klientów robiących zakupy na urządzeniach mobilnych.
• Łatwe i szybkie przełączanie pomiędzy wariantami rozmiarowymi tego samego produktu = prostsze dodanie ich do koszyka.
• Do koszyka można dodać kilka różnych rozmiarów danego modelu odzieży bez wrażenia przeładowania strony.
• Opis produktu i jego cena ulegają zmianie bez przeładowywania strony.
• Większy komfort robienia zakupów.
• Zwiększenie wydajności działania strony – mniej requestów do serwera.

Zaawansowane rozwiązania dopasowane do potrzeb

Standard Sote nie odpowiada na indywidualne, złożone potrzeby naszych Klientów. By rozwiązać konkretny problem, tworzymy zaawansowane funkcjonalności od zera. W wielu przypadkach personalizacja jest nieunikniona. Dla Elwix.pl opracowaliśmy kilka takich rozwiązań.

• Wielowariantowość 

Wielowariantowość pojawiała się już w kontekście minimalizowania przekierowań. To, z czym styka się kupujący we front-endzie, ewidentnie podnosi komfort robienia zakupów. Ale większość procesów rozgrywa się w back-endzie. Po co powstała ta funkcjonalność?

Rozwiązanie zostało dostosowane do specyfiki działania integratora stanów magazynowych, którego używa nasz Klient. W programie ewidencjonowana jest sprzedaż modelu odzieży w konkretnym wariancie kolorystycznym i rozmiarowym – każdy wariant  jako osobna pozycja. Integrator potrzebuje konkretnych danych ze sklepu, zgodnych z przyjętym systemem.

I tu pojawił się problem, bo to, co oferuje platforma Sote, jest niewystarczająceSote pozwala na tworzenie wariantów produktu w oparciu o opcje przypisywane produktowi. By utrzymać formułę zapisu stanów magazynowych: inny wariant = inna pozycja w magazynie, musielibyśmy zaprezentować każdy z wariantów produktu na osobnej karcie produktowej. To z kolei mnożyłoby ilość produktów, wymagało tworzenia kolejnych podstron niższych kategorii. Generalnie takie “rozdrobnienie” mocno wpływa na strukturę sklepu i nie jest przyjazne użytkownikowi końcowemu – rozprasza go, wydłuża ścieżkę zakupową i proces wyboru produktu. Jak obeszliśmy to ograniczenie?

Stworzyliśmy mechanizm, który rozwiązał problem Klienta i jest przyjazny użytkownikowi:

w back-endzie w pełni odpowiada na specyfikę działania programu magazynowego Klienta – zapisuje warianty konkretnego modelu jako osobne instancje (karty produktu na indywidualnych adresach url), a nie jako opcję produktu,

we front-endzie pozwala na wybranie rozmiaru bez przełączania się na inną kartę produktu.

• Multi Rabaty – inteligentne zarządzanie rabatami

Klienci Elwixa mogą skorzystać z rabatów, promocji, przecen. Wiele różnego rodzaju obniżek cen, przyznawanych na różnych zasadach, wymagało stworzenia systemu zarządzającego nimi. Tym właśnie są Muliti Rabaty.

Jeśli Klient kupi 2 produkty, 5% rabat jest mu przyznawany “z automatu”, i kolejno 10% w przypadku 3 produktów oraz 15%, gdy kupi minimum 4 produkty. Funkcjonalność uwzględnia wyjątki – rozpoznaje inne rodzaje promocji i nie łączy się z nimi (np. z kodami rabatowymi, produktami przecenionymi itp.).

• Filtry wspierające promowanie produktów i SEO

Filtry na stronie Elwix.pl służą nie tylko Klientom w sprawnym wyszukiwaniu produktów. Wprowadzone na poziomie filtrowania parametry są implementowane do linku – zostają zapisane w url-u. Co to daje?

• Promowanie produktów, sprzedaż

Wyobraźmy sobie, że w związku z Walentynkami chcemy promować czerwone bluzki. Wystarczy, że użyjemy filtra i gotowe. Parametry zapiszą się w linku i skierują użytkownika właśnie do tego widoku strony. Idealne narzędzie do wykorzystania np. w social mediach.

• Wsparcie dla SEO

Dzięki temu mechanizmowi wyfiltrowana strona może zaindeksować się w Google. To świetne wsparcie dla SEO.

Kilka kliknięć - duże zmiany. Narzędzia automatyzujące procesy

Naszym Klientom bardzo często dostarczamy narzędzia wyraźnie podnoszące efektywność zarządzania sklepem, automatyzujące procesy, ułatwiające prowadzenie sprzedaży, marketingu. W Elwixie, osoby zarządzające sklepem, mają do dyspozycji:

• Widgety

Widgety to kapitalne, proste w obsłudze narzędzie wspierające marketing sprzedażowy, idealne do cross sellingu. Dzięki niemu, bez pomocy grafika czy programisty, można tworzyć sekcje graficzno-tekstowe i osadzać je na stronie. Dzięki zdefiniowanym szablonom w kilka minut powstaje np. baner, na którym zamieścimy: tekst, zdjęcie, mini karty produktów, olinkowany button kierujący na wybraną podstronę, zmienimy kolor napisów, tła sekcji.

To całkiem rozbudowane narzędzie, bo:

• w ramach jednego widgetu, można zawrzeć inne, pomniejsze, spełniające określoną rolę,
• zawiera zautomatyzowane funkcje, jak dobór drugiego koloru np. o ton ciemniejszego, niż zdefiniowany (jeśli szablon zakłada użycie 2 kolorów w jakimś obszarze),
• pozwala na wgrywanie plików svg,
• ma bardzo szerokie zastosowanie – przy użyciu widgetów zbudowana jest cała strona główna!
• Klient ma do wyboru kilka typów widgetów, dostosowanych do podstron, na których mają być zamieszczone.

• Efektywne zarządzanie produktami 

W panelu zarządzania produktami wprowadziliśmy wiele modyfikacji, dzięki którym zarządzanie produktami jest łatwiejsze, a wprowadzanie zmian szybsze – np.:

• parametry produktów można edytować z poziomu listy produktów – w jednym “widoku” zdefiniujemy wiele opcji związanych z produktem (m.in. opis, kolor, rozmiar, przesyłka, przypisanie do kategorii)
• zmiana wprowadzana w obrębie jednego produktu (np. jego nazwa) może być zastosowana do wielu powiązanych produktów.

• Newsletter wspierający marketing automation  

Nasz moduł ułatwia personalizowanie przekazu do osób zainteresowanych otrzymywaniem newslettera. Jest zintegrowany z zewnętrznymi systemami do wysyłki mailingu. Zaprojektowaliśmy go tak, by już na etapie zapisu pobierał imię, które później pojawi się w nagłówku maila oraz obszar zainteresowań Klienta – np. moda męska.

Do newslettera użytkownik może zapisać się już z poziomu strony głównej lub strony kategorii, którą przegląda – bez konieczności przenoszenia się na dedykowaną podstronę. Może to również zrobić finalizując zamówienie. Ponieważ jesteśmy dobrzy w wychwytywaniu niuansów, napisaliśmy skrypt, który umożliwia wyciągnięcie z formularza zamówienia imienia Klienta, jeśli zapisał się do newslettera właśnie na tym etapie.

• Zautomatyzowany moduł dodawania opinii

Ten moduł jest sprzęgnięty z systemem wielowariantowości. Opinia użytkownika dodana do modelu w konkretnym rozmiarze finalnie będzie wyświetlana dla wszystkich jego wariantów czyli dla wszystkich rozmiarów tego modelu będących pod innymi adresami url. W standardzie, opinia byłaby dodana tylko na karcie konkretnego produktu czyli jednego modelu w określonym rozmiarze.

Mobile

Podczas projektowania rozwiązań sporo uwagi daliśmy mobilnej wersji strony. Doradzaliśmy Klientowi szczególnie w kontekście UX. Przykładami bardzo trafionych rozwiązań są Sticky Header, na którym użytkownik ma dostęp do najważniejszych elementów nawigacyjnych i menu horyzontalne.

Sticky Header nie przeszkadza w zakupach i nie zabiera cennej przestrzeni – podczas scrollowania w dół i przeglądania kolejnych produktów chowa się. Ale wystarczy, że przescrollujemy stronę do góry i znów mamy do niego dostęp.

Podobną funkcję spełnia menu horyzontalne. Przeprojektowaliśmy standardowe menu boczne i wprowadziliśmy je w formie horyzontalnych, ładnie prezentujących się buttonów. Dodatkowa przestrzeń wykorzystywana jest na zaprezentowanie produktów.