Cel projektu
Shirtme potrzebowało wtyczki, która naprawdę połączy sprzedaż z produkcją. Nie kolejnego konfiguratora, który wygląda ładnie, ale potem trzeba wszystko ręcznie ogarniać. Chodziło o to, żeby klient mógł zaprojektować produkt w przeglądarce, a zespół produkcyjny od razu dostał dane w takiej formie, żeby można było z nimi pracować.
Narzędzie musiało być proste dla użytkownika, ale jednocześnie na tyle elastyczne, żeby dało się je rozwijać o AI, automatyzację i integracje z innymi systemami.
Wyzwanie
Standardowe konfiguratory w WooCommerce to zazwyczaj prosty wybór wariantu i tyle. Nie dają rady z projektowaniem wielowarstwowym, różnymi metodami nadruku, przygotowaniem plików do produkcji czy sensownym zarządzaniem wzorami. Dla Shirtme to było zdecydowanie za mało.
Potrzebowali czegoś, gdzie użytkownik może swobodnie projektować, ale cały proces od początku do końca ma sens biznesowy. Wybór rozmiaru, kolor, cena na żywo, eksport danych. Wszystko musi ze sobą grać.
Najważniejsze wymagania
- wizualny designer produktu oparty o canvas i warstwy
- obsługa tekstów, grafik, clipartów i kodów QR
- wiele widoków produktu (przód, tył, rękawy i inne powierzchnie)
- dynamiczna kalkulacja ceny zależna od konfiguracji
- pełna integracja z WooCommerce i zamówieniami
- narzędzia administracyjne do zarządzania produktami, wzorami i produkcją
- wydajność na urządzeniach mobilnych i desktopowych
Zakres wdrożenia
Zrobiliśmy kompletny system do personalizacji. Frontend prowadzi użytkownika przez projektowanie bez zbędnych komplikacji. Backend daje zespołowi pełną kontrolę nad produktami, nadrukami, clipartami, wzorami i zamówieniami. Wszystko w jednym miejscu.
Frontend dla klienta
- edytor projektów zbudowany na bazie Fabric.js
- dodawanie tekstu z edycją czcionki, koloru, rozmiaru, konturu i cienia
- dodawanie grafik z plików użytkownika
- biblioteka clipartów z kategoriami i semantycznym wyszukiwaniem AI
- generator kodów QR
- efekty łuku dla tekstu (górny, dolny i kołowy)
- zarządzanie warstwami z blokowaniem, widocznością i drag and drop
- obsługa wielu widoków produktu
- live preview z zoomem i przesuwaniem
- zapisywanie projektów dla zalogowanych użytkowników
Zaplecze administracyjne
- konfiguracja produktów i obszarów nadruku
- zarządzanie kolorami, rozmiarami i tabelami rozmiarów
- definiowanie metod nadruku oraz ich ograniczeń
- cenniki zależne od wariantów i ilości
- zarządzanie clipartami, tagami i importem masowym
- biblioteka gotowych wzorów z automatycznymi miniaturami
- podgląd projektów w zamówieniach i generowanie plików produkcyjnych
Kluczowe funkcjonalności
1. Zaawansowany kreator produktu
Serce całego systemu to designer produktu. Zależało nam, żeby użytkownik mógł łączyć tekst, grafiki, cliparty i inne elementy bez wrażenia, że siedzi w Photoshopie.
Balans między prostotą a możliwościami był kluczowy. Można precyzyjnie kontrolować warstwy, obiekty i różne powierzchnie produktu, ale interfejs pozostaje przejrzysty i nowoczesny.
2. Personalizacja z logiką biznesową
Personalizacja to nie tylko ładny wygląd. Każdy wybór klienta wpływa na cenę, zamówienie i to, jak produkt trafi do realizacji. Kolory, rozmiary, metody nadruku, ceny. Wszystko liczy się na żywo.
Klient widzi od razu, co dostanie i ile zapłaci. Sklep nie musi się domyślać, co właściwie zostało zamówione.
3. AI i automatyzacja
Semantyczne wyszukiwanie clipartów przez AI oszczędza masę czasu. Zamiast przeklikiwać się przez setki grafik, wystarczy wpisać, czego szukasz. Automatyczne tagowanie samo porządkuje bibliotekę.
4. WooCommerce bez kompromisów
Projekt zapisuje się razem z produktem i zamówieniem, można go edytować w koszyku, administrator ma do niego dostęp z panelu.
Doświadczenie klienta i obsługa zamówienia to jeden spójny proces, bez dziur i niespodzianek.
Efekt biznesowy
System porządkuje sprzedaż produktów personalizowanych od początku do końca. Klient pracuje w nowoczesnym narzędziu, zespół Shirtme dostaje dane gotowe do użycia.
- więcej projektów ląduje w koszyku
- obsługa niestandardowych konfiguracji idzie szybciej
- łatwo dodawać nowe produkty, cliparty i wzory
- wszystko w jednym miejscu, bez skakania między systemami
Podsumowanie
Zamiast sklejać kilka gotowców, powstał spójny system, który łączy UX, technologię i realizację zamówień.
Warstwa wizualna, wydajność, AI i integracja z WooCommerce pracują razem na jeden cel: sprzedawać więcej i uprościć życie zespołowi.