Portfolio
WooCommerce
Deskwise
Nowoczesny sklep internetowy dla dystrybutora mebli. Wykonany w technologii Headless Commerce w oparciu o React, Gatsby.js oraz WooCommerce.
Usługi: Warsztaty eCommerce | UX/UI Design | Wdrożenie headless CMS | Rozwój i utrzymanie serwisu
Branża: Handel detaliczny
Sprawdź: https://deskwise.pl/
Potrzeby biznesowe
Nowy serwis eCommerce dla marki Deskwise to przede wszyskim migracja z dotychczasowego systemu na nowy oparty o technologię headless commerce. Na cały proces składały się nastęujące elementy:
- przeprowadzenie warsztatów eCommerce;
- przygotowanie pełnej architektury informacji nowego sklepu internetowego;
- stworzenie makiet UX oraz UI serwisu eCommerce;
- implementacja sklepu internetowego w oparciu o technologię headless commerce;
- wykorzystanie naszego autorskiego rozwiązania gatsby.js storefront we wdrożeniu serwisu eCommerce;
- instalacji kluczowych modułów sklepu internetowego;
- implementacje dedykowanych rozwiązań.
Głównym celem biznesowym była migracja na platformę, której jakość będzie w stanie odwzorować wartości marki Deskwise.
Główny cel projektu
Głównym celem projektu przygotowanego dla marki Deskwise była migracja z systemu Shoplo na system oparty o technologię headless commerce.
Wyzwania
Przygotowanie oraz wdrożenie sklepu internetowego dla marki Deskwise wiązało się z przejściem przez następujące aspekty:
- analiza możliwości migracji Shoplo - WooCommerce;
- przeprowadzenie analizy użytkowników oraz analizy benchmarkingowej konkurencji
- przeprowadzenie warsztatów Design Thinking w obszarze sklepu internetowego;
- stworzenie indywidualnych projektów UX/UI nowego serwisu eCommerce;
- wdrożenie sklepu internetowego w oparciu o gatsby.js storefront na platformie WordPress WooCommerce;
- skonfigurowanie infrastruktury zwłaszcza od strony front-endowej
- implementacja dedykowanych modułów
Ostatecznie stworzony został nowoczesny i funkcjonalny sklep internetowy w technologii headless commerce, oparty o silnik WordPress WooCommerce.
Opis projektu
Pierwszym krokiem współpracy było określenie możliwości migracji na linii Shoplo - WooCommerce. Klient w momencie zakupu Shoplo przez Shoper, zdecydował się na migrację na silnik WordPress WooCommerce. Po przeprowadzeni procesu migracji jako zespół przystąpiliśmy do analizy wymagań oraz rozpoczęliśmy proces warsztatowy w oparciu o nasz autorski warsztat eCommerce. Dzięki przeprowadzonym wspólnie z przedstawicielami klienta warsztatom udało się uzyskać m. in. najważniejsze informacje dotyczące potrzeb i wymagań użytkowników oraz ich oczekiwań w zakresie tworzonego serwisu eCommerce. Podsumowaniem warsztatów było powstanie pełnej architektury informacji nowego sklepu internetowego dla marki Deskwise.
Kolejny krok to przeniesienie informacji wyjętych z warsztatów oraz zilustrowanych w ramach architektury informacji "na papier". W tym kroku przygotowane zostały makiety użytkowe oraz graficzne dla całego serwisu. Na makietach odwzorowane zostały założenia sklepu internetowego. Proces designu był w pełni skoordynowany z klientem, który w trakcie prac przekazywał najważniejsze uwagi i zmiany zespołowi designu. Ostatecznie na podstawie zaprojektowanych makiet przygotowany został pełny backlog produktu pod wdrożenie serwisu eCommerce.
Do wdrożenia sklepu internetowego użyliśmy CMS WordPress WooCommerce w połączeniu ze statycznym generatorem stron Gatsby.js, który używamy jako podstawę naszego autorskiego gatsby typescript storefront'a. Aby oddzielić funkcjonalność CMS od warstwy prezentacji, użyliśmy autorskiego modułu, który zapewnia rozszerzalny schemat GraphQL i interfejs API dla dowolnej witryny WordPress WooCommerce. Warstwa front-endowa całego serwisu została napisana w React, co pozwoliło między innymi na implementację funkcjonalności Progressive Web App dla serwisu eCommerce. Oprócz wyżej wymienionych platforma sklepowa zyskała także niezbędne moduły do obsługi całego systemu zakupowego.
W ostatnim kroku podjęliśmy działania związane z migracją contentu z poprzedniej platformy sklepowej, a także kompleksowym testowaniem i implementacją nowego serwisu eCommerce. W międzyczasie klient zdecydował się także na wdrożenie kilku dodatkowych modułów rozszerzających pierwotnie zakładany zakres projektu odwzorowany w backlogu produktu. Finalnie sklep internetowy został opublikowany na domenie produkcyjnej zastępując starą instancję Shoplo.
Rozwiązanie
Do kluczowych aspektów, dzięki którym stworzyliśmy nowoczesny i funkcjonalny sklep internetowy dla marki Deskwise zaliczyć należy:
- odpowiedź na wymagania klientów zidentyfikowane podczas warsztatów;
- przygotowanie dedykowanego projektu UX/UI;
- zastosowanie technologii headless commerce w oparciu o WooCommerce;
- przygotowanie oraz udostępnienie aplikacji PWA dla użytkowników;
- sprawną migrację Shoplo - WooCommerce.
Proces badawczo-warsztatowy, przygotowanie dedykowanego projektu graficznego oraz jego wdrożenie w technologii headless commerce pozwoliło na stworzenie unikalnego, efektownego i skutecznego serwisu eCommerce dla marki Deskwise.