Zakres prac
W ramach realizacji projektu XILO Shop odpowiadaliśmy za szereg działań, które obejmowały:
Stworzyliśmy design sklepu, który odpowiadał standardom branży i preferencjom użytkowników z niemieckojęzycznego rynku.
Przygotowaliśmy treści w języku niemieckim dla kluczowych stron serwisu, uwzględniając specyfikację rynku i SEO.
Przygotowaliśmy i zoptymalizowaliśmy zdjęcia dla każdego z oferowanych produktów, co jest kluczowe dla prezentacji grzejników o różnych wariantach i rozmiarach.
Opracowaliśmy design system, który umożliwiał łatwe i intuicyjne dokonywanie zakupów przez użytkowników.
Kluczowy element projektu polegał na wdrożeniu szerokiej gamy wariantów produktów, co zapewniło użytkownikom możliwość wyboru spośród 40 produktów i ich 2500 kombinacji rozmiarów, kolorów i innych cech.
Zadbaliśmy o pełną implementację sklepu, w tym integrację z systemami płatności, co umożliwiło bezproblemowe transakcje.
Proces realizacji
1. Reset projektu
W Unique Devs każdą realizację rozpoczynamy od tzw. resetu projektu, czyli od przygotowania środowiska pracy. Na czym to polega?
- Kopiowanie plików WordPress oraz plików do kompilacji
- Uporządkowanie struktury projektu, w tym nazewnictwa plików i ścieżek
- Instalacja potrzebnych narzędzi do budowy strony (np. do formularzy)
- Dodanie niezbędnych wtyczek jak Woocommerce oraz wszystkich wtyczek bramek płatności
2. Blok Gutenberga
W przypadku XILO Shop, serwis został zbudowany w oparciu o blok Gutenberga, co pozwoliło na bardziej elastyczne zarządzanie treścią i łatwość dalszego rozwoju sklepu. Proces ten obejmował:
- Przygotowanie elementu tablicy zawierającego dane do samego ACF
- Dodanie odpowiednich pól ACF
- Dodanie pliku PHP zawierającymi między innymi strukturę HTML
- Dodanie styli w pliku scss wraz z wersją responsywną
Zaawansowane funkcjonalności
Projekt XILO Shop wymagał od nas wdrożenia wielu zaawansowanych funkcjonalności, które wykraczały poza standardowy WordPress. Do najważniejszych należały:
- indywidualne filtrowanie produktów
użytkownicy sklepu mogą łatwo sortować produkty według różnych kryteriów tj.: rozmiar, kolor czy funkcje
- automatyczne przeliczanie kosztów dostawy
koszty są automatycznie kalkulowane w zależności od liczby zamówionych produktów, co znacząco usprawnia proces zakupowy
- zmiana cen dla różnych wariantów
cena produktów jest dynamicznie aktualizowana w zależności od wybranego wariantu
- tłumaczenia
wszystkie elementy serwisu zostały w pełni przetłumaczone na język niemiecki
Technologie użyte w projekcie
Aby zrealizować projekt XILO Shop wykorzystaliśmy różnorodne technologie, które umożliwiły nam stworzenie funkcjonalnego i nowoczesnego sklepu,
- Gulp (kompilacja SCSS i JS)
- JavaScript
- SCSS
- CSS
- PHP
- HTML
- WordPress
- WooCommerce
- ACF
- Contact Form 7
- Bramki płatności
Rezultat
Finalnym efektem prac był nowoczesny, intuicyjny sklep internetowy, który zapewnia użytkownikom możliwość zakupu produktów o szerokiej gamie wariantów. Implementacja 2500 kombinacji produktowych oraz zaawansowanych funkcji sklepu pozwoliła płynnie i wygodnie korzystać z serwisu. Sklep XILO na dzień premiery obejmował około 40 produktów, z licznymi wariantami, a jego funkcjonalność oraz optymalizacja pod kątem rynku niemieckojęzycznego wyróżniały się na tle konkurencji.
Podsumowanie
Projekt XILO Shop był dla nas wyjątkowym wyzwaniem, które wymagało od nas zaawansowanego podejścia i wybrania odpowiednich technologii. Stworzenie dynamicznego i funkcjonalnego sklepu z tak rozbudowaną liczbą wariantów produktowych, połączone z pełną integracją płatności, stanowiło kluczowy element sukcesu na rynku niemieckojęzycznym. Nasze zaangażowanie, elastyczność oraz bogate doświadczenie technologiczne pozwoliły nam dostarczyć klientowi produkt, który spełnia jego oczekiwania.