Shopify to platforma, z której korzysta ponad milion sklepów z całego świata. Działa od 2006 roku i od tego czasu stała się już liderem na rynku platform e-commerce. Shopify daje właścicielom sklepów wiele możliwości – od pomocy przy tworzeniu marki, przez założenie sklepu, aż po jego promocję na różnych serwisach i zarządzanie nimi.
W artykule skupimy się głównie na kwestiach dotyczących projektu sklepu, a w tym zakresie Shopify dostarcza takie rozwiązania jak:
- gotowe szablony stron,
- możliwość modyfikacji elementów na stronie,
- wersja mobilna sklepu,
- możliwość edycji z poziomu kody HTML i CSS (pełne dopasowanie strony),
- możliwość wdrożenia pełnego serwisu blogowego,
- prosty w obsłudze web-builder.
Z naszego doświadczenia wynika, że dedykowane sklepy cieszą się przewagą konkurencyjną i lepszym doświadczeniem klientów, co przekłada się na wyższą konwersję i odsetek powracających użytkowników. W związku z możliwościami, jakie daje Shopify, dotyczącymi dostosowania elementów w sklepie warto zatem rozważyć kwestię lepszego dopasowania sklepu, zamiast powielania popularnych już szablonów. W dzisiejszym artykule poznasz dobre praktyki dotyczącej projektowania karty produktu. Poniżej znajdziesz 10 sprawdzonych elementów, które możesz z łatwością wprowadzić na karcie produktu w Twoim sklepie.
Przecena, promocja
Powinna być odpowiednio wyróżniona poprzez zastosowanie np. czerwonego koloru dla nowej ceny. Pokaż także poprzednio obowiązującą cenę, ale zastosuj np. przekreślenie lub szary kolor, aby pokazać, że nie jest już obowiązująca. Warto dodać także informację o wysokości zniżki wyrażonej w procentach, co dodatkowo zwróci uwagę użytkownika na atrakcyjną ofertę i skłoni do skorzystania z niej.
Producent
Jeśli w sklepie występują produkty różnych producentów, dodaj informację z nazwą producenta, opcjonalnie możesz zawrzeć także krótki opis 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, wprowadzający klientów w działalność i charakter marki.
Opis 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 podstawowe informacji warto zawrzeć w punktach, na samym początku opisu produktu. Pamiętaj, aby język był dla wszystkich zrozumiały. Możesz dodatkowo zastosować ikony obrazujące daną cechę lub funkcję, dla jeszcze lepszego odbioru i zrozumienia. Pamiętaj, że większość użytkowników skanuje każdy tekst, nie czyta go w całości, dlatego najistotniejsze informacje warto podać w czytelny sposób. Staraj się unikać także określeń branżowych i specjalistycznych, chyba, że Twoi odbiorcy są z nimi zaznajomieni.
Okruszki
Czyli tzw. breadcrumbs. Koniecznie zaimplementuj ścieżkę okruszkową, która ułatwi Twoim użytkownikom nawigowanie w sklepie. Dzięki nim będą mogli łatwo wrócić do poprzednich podstron i sprawdzić jaką kategorię produktową obecnie przeglądają.
Produkty niedostępne
Daj użytkownikom możliwość zapisania się na powiadomienie, jeśli dany produkt nie jest chwilowo dostępny. Zamieść pole do podania adresu e-mail, aby użytkownik mógł otrzymać wiadomość, kiedy wybrany produkt wróci do oferty. Potraktuj to jako swoistą deklarację gotowości do zakupu – w końcu nie każdy rozdaje swoje adresy mailowe bez powodu. Nie warto tracić klientów przez brak takiej opcji w sklepie. Jest to bardzo istotna funkcja, szczególnie dla stałych klientów, którym zależy na zakupie właśnie w Twoim sklepie.
Warianty produktu
Poinformuj użytkownika, jeśli dany produkt występuje w kilku wariantach, np. w różnych kolorach lub rozmiarach. Wybór dane koloru produktu z listy kategorii nie oznacza wcale, że użytkownik nie zdecyduje się na inny wariant, dlatego daj mu możliwość sprawdzenia ich także na karcie produktu. Dzięki takiemu rozwiązaniu nie będzie musiał cofać się do listy produktów, ale wybierze inny kolor widoczny po przejściu do szczegółów wybranego produktu.
Lista ulubionych lub schowek
Pamiętaj, że nie każdy użytkownik przychodzi do sklepu od razu z zamiarem zakupu. Część będzie się dopiero szukać najlepszego produktu lub po prostu przeglądać inspiracje. 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 zapisanie produktu na liście ulubionych. Dzięki zebraniu produktów w jednym miejscu 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, aby użytkownicy mogli zauważyć, że jest ich więcej. Dodaj odpowiednie znaczniki umożliwiające przewijanie zdjęć. Pamiętaj, aby zdjęcia były w miarę duże, ale nie przeciążające strony, gdyż mogą wydłużyć czas ładowania. Daj możliwość powiększenia zdjęć, bez utraty jakości i pokaż produkty np. na modelu lub w kontekście użycia. Wpłynie to pozytywnie na odbiór produktu, użytkownicy będą mieli o nim pełne wyobrażenie i zobaczą rzeczywisty rozmiar danego 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. Dzięki temu użytkownik nie będzie musiał szukać tych informacji w innych zakładkach, 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. Możesz zamieścić je na rozwijanych kartach (tzw. akordeon) lub w oknie modalnym. Jeśli natomiast informacji będzie stosunkowo niewiele, warto pozostawić je rozwinięte, aby zmniejszyć liczbę kliknięć.
Dodanie do koszyka
Przycisk dodania do koszyka na karcie produktu powinien być najbardziej widoczny. Jeśli to możliwe, umieść go nad zgięciem ekranu, wraz z informacją o liczbie produktów dodanych do koszyka i możliwością zmiany tej ilości za pomocą ikon “+” i “-”. Jeśli przed zakupem, produkt powinien być skonfigurowany przez użytkownika (np. musi wybrać rozmiar), informacja ta nie powinna być automatycznie wprowadzona a możliwość dodania produktu do koszyka musi być wyłączona, aby klient nie kupił przypadkowo produktu o złym rozmiarze. Pamiętaj o zaplanowaniu hierarchii przycisków i w wypadku głównych przycisków, takich jak dodanie do koszyka, zastosuj wyróżniający się kolor, spójny z Twoją marką i z innymi przyciskami na stronie.
Wiele sklepów korzystających z platform takich jak Shopify opiera się na gotowych szablonach, które widoczne są w wielu sklepach w internecie i nie są dla użytkowników żadną nowością. Nasze doświadczenie pokazuje jednak, że dopasowanie sklepu do działalności i modyfikacja utartych szablonów przynosi realne korzyści. Sprawdź dane, które przekonają Cię do zmiany podejścia w temacie implementacji gotowych szablonów w sklepie:
- 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.
Raportów tego typu, dotyczących satysfakcji z wdrożenia podejścia skupionego wokół tworzenia jak najlepszego doświadczenia użytkowników w sklepie, można znaleźć mnóstwo i każde z nich potwierdzi 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 dba o swoich klientów, jest nowoczesna i chce, aby zakupy w sklepie były po prostu wygodne.
Zobacz nasze pozostałe teksty o projektowaniu karty produktu w popularnych platformach:
