Projektowanie karty produktu w Magento

Magento jest jedną z najpopularniejszych i rozwiniętych platform e-commerce, która posiada ponad 5000 rozszerzeń. Najnowsza wersja platformy, czyli Magento 2.0, pojawiła się na rynku w 2015 roku i obecnie działa w dwóch wersjach: Magento Open Source oraz Magento Commcerce. Narzędzie swoimi rozwiązaniami wspiera wzrost i rozwój sklepów oraz platform B2B.

W związku z możliwościami, jakie daje ta platforma, dotyczącymi dostosowania elementów w sklepie, warto zadbać o dobre zaprojektowanie strony i zaplanowanie jej treści. W dzisiejszym artykule poruszymy temat karty produktu i podzielimy się dobrymi praktykami. Poniżej znajdziesz 10 sprawdzonych elementów, które możesz z łatwością wprowadzić na karcie produktu w Twoim sklepie.

Cena produktów przecenionych

Powinna być odpowiednio wyróżniona poprzez zastosowanie np. czerwonego koloru dla nowej ceny i przekreślenie poprzedniej ceny produktu. Warto dodać także informację o wysokości zniżki wyrażonej w procentach, aby dodatkowo zwrócić uwagę użytkownika na atrakcyjną ofertę.

Informacja o producencie

Jeśli w sklepie występują produkty od różnych producentów, dodaj stosowną informację z nazwą producenta i opcjonalnie z krótkim opisem danej marki. Po kliknięciu na nazwę, użytkownik powinien być przeniesiony na listę produktów wybranego producenta, na której także może znaleźć się krótki opis w nagłówku.

Wyróżnione główne cechy produktu

Treść opisu nie powinna być za długa, powinna natomiast skupiać się na kluczowych cechach, istotnych dla Twoich klientów. Szczegółowe informacje można uwzględnić w zakładce dotyczącej parametrów technicznych lub po rozwinięciu opisu (np. “Zobacz więcej”, “Rozwiń opis”) a skrócone punkty warto umieścić na samym początku opisu produktu.

Pamiętaj, aby język był dla wszystkich zrozumiały. Unikaj określeń branżowych (chyba, że odbiorcy są z nim zaznajomieni), aby ułatwić przeglądanie treści i zachęcić użytkowników do zakupu, bez konieczności kontaktowania się z obsługą klienta.

Okruszki

Koniecznie zaimplementuj ścieżkę okruszkową (tzw. breadcrumbs), aby ułatwić użytkownikom nawigację w Twoim sklepie. Dzięki nim będą mogli łatwo wrócić do poprzednich podstron i sprawdzić jaką kategorię produktową obecnie przeglądają.

Sprzedawaj więcej, zarabiaj mądrzej

Sprawdź naszą ofertę audytu użyteczności na DochodowySklep.pl
  • Zadbaj o użyteczność i przyjazność sklepu dla klientów.
  • Popraw współczynnik konwersji na ścieżce zakupowej.
  • Porównaj swój sklep z bezpośrednią konkurencją.

Sprawdź

Produkty niedostępne

Daj użytkownikom możliwość zapisanie się na powiadomienie, jeśli dany produkt nie jest dostępny. Informacja o dostępności produktu powinna być wysłana na adres e-mail zainteresowanej osoby. Dzięki temu możesz dowiedzieć się ile osób chce kupić dany produkt. Jest to swoista deklaracja gotowości do zakupu, którą warto wykorzystać, aby nie stracić klienta.

Warianty produktu

Jeśli dany produkt występuje w kilku wariantach, np. w różnych kolorach lub rozmiarach, poinformuj o tym użytkownika. Daj mu możliwość sprawdzenia innych wariantów nie tylko z poziomu listy produktu, ale także na karcie danego produktu. Jeśli więc użytkownik wybierze z listy produktów przykładowo czarny t-shirt, nie oznacza wcale, że może zmienić zdanie i chcieć zobaczyć jak będzie wyglądał ten sam t-shirt w kolorze czerwonym. Dzięki takiemu rozwiązaniu nie będzie musiał cofać się do listy produktów, ale wybierze inny kolor widoczny na karcie produktu.

Dodanie do listy ulubionych lub do schowka

Pamiętaj, że nie każdy użytkownik może przychodzić do sklepu od razu z zamiarem zakupu. Część będzie się dopiero rozglądać, szukać najlepszego produktu. Warto umożliwić im zatem stworzenie listy produktów, których zakup wstępnie rozważają. Dodaj przycisk wraz z odpowiednią ikoną (najczęściej jest to serduszko lub gwiazdka), która oznacza zachowanie produktu na liście ulubionych. Podczas kolejnej wizyty lub nawet w trakcie tej samej sesji, użytkownicy będą mogli szybko przejrzeć produkty, które wpadły im w oko i dodać do koszyka te, na których zakup finalnie się zdecydują.

Galeria zdjęć

Zamieszczając więcej niż jedno zdjęcie produktu, pamiętaj o wprowadzeniu miniaturek zdjęć, aby użytkownicy mogli zauważyć, że jest ich więcej. Dodaj odpowiednie znaczniki, jeśli podgląd (miniaturki) zdjęć nie mieści się na danym widoku. Użytkownicy powinni móc przewinąć całą galerię i sprawdzić ile jest w niej zdjęć. Pamiętaj, aby zdjęcia były w miarę duże, ale nie przeciążające strony, gdyż mogą wpłynąć na długość jej ładowania. Daj możliwość powiększenia zdjęć, bez utraty jakości i pokaż produkty w sytuacji użycia np. na modelu lub w kontekście w zależności od przeznaczenia danego produktu. Wpłynie to pozytywnie na odbiór produktu, użytkownicy będą mieli o nim pełne wyobrażenie, dzięki temu też zobaczą rzeczywisty rozmiar przedmiotu.

Dodatkowe informacje

Zamieść w okolicy przycisku dodania do koszyka, istotne informacje dotyczące wysyłki i płatności dostępnych w Twoim sklepie. Pamiętaj, że dobrze poinformowany użytkownik szybciej dokona zakupu, a sklep będzie w jego oczach bardziej wiarygodny. Dodaj informacje o metodach dostawy i ich koszcie oraz o dostępnych metodach płatności i ewentualnych prowizjach.

Dodanie do koszyka

Najważniejszy przycisk na karcie produktu powinien być najbardziej widoczny. W miarę możliwości, warto umieścić go nad zgięciem ekranu. Obok przycisku powinna znajdować się liczba produktów dodanych do koszyka. Jeśli produkt powinien być skonfigurowany dodatkowo przez użytkownika (np. musi wybrać rozmiar), wartość ta nie powinna być automatycznie wybrana a możliwość dodania produktu do koszyka musi być wyłączona, aby klient nie zakupił przypadkowo produktu o złym rozmiarze. Pamiętaj o odpowiedniej hierarchii przycisków i w wypadku dodania do koszyka zastosuj wyróżniający się kolor, spójny z Twoją marką i z innymi przyciskami na stronie.

Większość właścicieli sklepów internetowych decyduje się na użycie gotowego szablonu, które można znaleźć na platformie Magento. Nasze doświadczenie pokazuje jednak, że dopasowanie sklepu do działalności i modyfikacja utartych szablonów przynosi realne korzyści. Dane mówią same za siebie:

  • 7 na 10 CEO uważa, że dobry UX jest konkurencyjnym wyróżnikiem marki,
  • o 400% może wzrosnąć konwersja na użytkowniku, jeśli strona oferuje wysoki poziom UX,
  • kwota wydana na szeroko rozumiana projektowanie użyteczności zwraca się stukrotnie,
  • 94% użytkowników nie ufa przestarzałym stronom a połowę z nich frustrują sklepy źle dostosowane do urządzeń mobilnych,
  • 88% kupujących online twierdzi, że nie wróci na stronę, jeśli doświadczyli złego UX.

Danych z tego typu badań satysfakcji biznesu i użytkowników sklepów internetowych można znaleźć mnóstwo i każde z nich potwierdzają zasadność dbania o użyteczność. Zalecamy zatem skupienie się na tym aspekcie podczas budowania sklepu, aby wyróżniał się on na tle konkurencji, zachęcał użytkowników do zakupów i był dopasowany na miarę marki, która tworzy najlepsze doświadczenie zakupowe.

Zobacz nasze pozostałe teksty o projektowaniu karty produktu w popularnych platformach:

Nasze publikacje

Ponad dziesięcioletnie doświadczenie w projektowaniu UX przekuwamy także na wiedzę, którą dzielimy się z Wami na naszym blogu i w cyklicznych publikacjach.

Polecane artykuły

`