Celem projektu było stworzenie sklepu internetowego z dedykowanym designem, który przedstawiałby charakter marki i wyróżniał ją na tle konkurencji. Platforma musiała mieć możliwość łatwego zarządzania produktami i treściami na stronie. Kluczowym czynnikiem była szybkość strony i jej responsywność. Projekt miał zakładać możliwość rozbudowy sklepu o nowe funkcje w przyszłości.
Zobacz stronę »Case study opisuję budowę dedykowanego rozwiązania eCommerce dla marki TraczykLeather.
Przed rozpoczęciem projektu klient sprzedawał swoje produkty jednie w formie tradycyjnej, skupiając się na rynku lokalnym. Trafił do nas z pomysłem wejścia w branżę eCommerce i rozpoczęcia sprzedaży internetowej. Udało nam się wspólnie zdeterminować potrzeby i główne cele projektu, a następnie stworzyć jego plan.
Stworzenie sklepu internetowego zakładało zaprojektowanie ux/ui, budowę interfejsu użytkownika, konfigurację platformy eCommerce oraz wdrożenie sklepu na serwer.
Projekt rozpoczęliśmy od zdeterminowania wymagań klienta i przygotowania planu. Następnie projekt został podzielony na fazy i został ustalony harmonogram prac. Sklep internetowy realizowaliśmy w metodyce Agile, w związku z czym zadania były wykonywane w formie jednotygodniowych sprintów, po których spotykaliśmy się z klientem i omawialiśmy progres prac. Najważniejszy podczas implementacji był stały kontakt z klientem, który pozwolił szybko omawiać najważniejsze sprawy i wprowadzać zmiany w projekcie.
Tworzenie sklepu internetowego rozpoczęliśmy od stworzenia makiety ux. Następnie po akceptacji przez klienta przystąpiliśmy do nanoszenia designu. Ux & ui designer zaprojektował interfejs użytkownika tak, aby zagwarantował on możliwie, jak najprostszy proces zakupowy. W ramach tworzenia internetowej identyfikacji wizualnej również część marki offline skorzystała z rebrandingu i został zaprojektowany nowy logotyp. Kiedy makiety ux i design były gotowe, przystąpiliśmy do implementacji platformy sprzedażowej.
Projekt został zaimplementowany w koncepcji headless eCommerce. Część frontend sklepu internetowego zdecydowaliśmy się stworzyć przy użyciu technologii NextJs, która zapewnia szybkość strony oraz jej responsywność. NextJs gwarantuje również, że sklep internetowy będzie mógł zostać zoptymalizowany pod SEO i dobrze się pozycjonować. Część backend sklepu została stworzona w technologii Saleor. Jest to nowoczesna platforma eCommerce, która pozwala tworzyć bardzo szybkie sklepy internetowe. Saleor jest oprogramowaniem typu open source, dzięki czemu zyskuje dużą społeczność i szybko się rozwija. Technologia Saleor została zbudowana z myślą o koncepcji heeadless eCommerce, co w połączeniu z technologią NextJs z części frontend daje pełną elastyczność i możliwość większości integracji eCommerce, np. CMS, CRM, PIM itd. Podejście headless oznacza, że również panel admina jest oddzielną instancją. W projekcie został wykorzystany panel admina Saleor, który jest stworzony w technologii React.
W sklepie internetowym wykorzystaliśmy kilka integracji eCommerce. Została podłączona bramka płatności Stripe oraz Paczkomaty Inpost w celu umożliwienie wyboru paczkomatu jako metody dostawy zamówienia. Klient zdecydował się na podłączenie Stripe ze względu na wiele możliwych sposobów płatności i automatyczną integrację z polską bramką płatności Przelewy24, która umożliwiła płatność min. Blik. Wybór bramki Stripe był również podyktowany zamiarem sprzedaży zagranicznej. Z tego względu sklep internetowy został wyposażony również w dwie wersje językowe, polską i angielską. Panel admina Saleor umożliwia łatwe zarządzanie produktami oraz contentem sklepu dla obu języków.
W celu zapewnienia bezpieczeństwa sklepu i zgodności z prawem sklep został wyposażony w certyfikat SSL oraz wtyczkę do obsługi cookies. Certyfikat SSL gwarantuje bezpieczne połączenie ze stroną i wpływa pozytywnie na pozycjonowanie SEO platformy sprzedażowej. Zaimplementowana wtyczka do cookies jest zgodna z wytycznymi RODO i pozwala na zarządzanie preferencjami, które cookies'y użytkownik chce zaakceptować podczas używania platformy eCommerce.
Gotowy sklep internetowy wdrożyliśmy na serwerze VPS przy użyciu Dockera, który gwarantuje odpowiednie bezpieczeństwo i dostarczenie aplikacji ze wszystkimi potrzebnymi zależnościami i wybranym systemem operacyjnym. Dla optymalizacji dodatkowo w projekcie został zastosowany Redis. Jest to nierelacyjna baza danych, która świetnie sprawdza się przy cache’owaniu danych i zapewnia natychmiastową odpowiedź bazy na zapytania. Zdjęcia w projekcie serwowane są przez usługę Amazon AWS S3. AWS jest to usługa pamięci masowej oferowana przez Amazon. Usługa zapewnia łatwy i szybki dostęp do zdjęć, wskutek czego sklep zachowuje najwyższą wydajność.
Gotowa platforma eCommerce spełniła wymagania klienta i pozwoliła marce TraczykLeather rozpocząć sprzedaż internetową.
Next.js
Saleor
Redis
AWS S3
Zoptymalizowany projekt poddaliśmy testom wydajności przy użyciu narzędzia Gtmetrix. Połączenie zastosowanych technologii: NextJs (frontend), Saleor (eCommerce), Redis (cache), Amazon AWS S3 (serwowani zdjęć); przyniosło znakomity efekt. Sklep podczas testów otrzymał najwyższą możliwą ocenę A. Wydajność platformy została oceniona na 99% a budowa jej struktury na 95%. Tak dobry wynik zapewnia najlepsze możliwe doświadczenia użytkownika podczas procesu zakupowego.
Nasze darmowe, 15 minutowe spotkanie rozwieje wszystkie Twoje wątpliwości.
Umów się na bezpłatną konsultacje
