Spis treści Kompleksowe wdrożenie e-commerce dla TIM SA 3 Kompleksowa optymalizacja e-commerce dla INTERSPORT Polska S.A. 17 Rozwijanie sprzedaży e-commerce w modelu success fee dla In360.pl 25 Wsparcie sprzedaży sezonowej w e-commerce dla Grupa Edukacyjna S.A. 28 Strategia obecności w sieci marki Balneum Baby Basic 31 Kompleksowe wdrożenie e-commerce dla SOLAR Company 34 Optymalizacja sprzedaży w TUI Poland 39 Automation Marketing dla Willsoor 46 Kompleksowa obsługa e-commerce dla Praktiker Polska 54 E-mail marketing dla bdsklep.pl 60 Opisy produktów dla Vitalab.pl 66 Referencje i efekty pracy 69 3
Kompleksowe wdrożenie e-commerce dla TIM SA BankKabli jest projektem firmy TIM SA jednego z największych dystrybutorów artykułów elektrotechnicznych w Polsce. TIM działa na rynku już od blisko 25 lat (od 15 lat jest notowany na GPW w Warszawie). W stałej ofercie posiada ok. 9000 produktów. Firma zatrudnia 350 osób i dysponuje siecią sprzedaży składającą się z 30 oddziałów w całej Polsce. Centrala firmy oraz centrum logistyczne zlokalizowane są w Siechnicach pod Wrocławiem. Magazyn Centralny jest w znacznym stopniu zautomatyzowany zarówno jeśli chodzi o procesy magazynowania, jak i usługi dodatkowe, takie jak przewijanie kabli oraz usługi cięcia na wymiar. TIM SA coraz odważniej stawia kroki w Internecie, a BankKabli był jednym z pierwszych przedsięwzięć mających na celu stworzenie i rozwój nowego kanału dystrybucji. Dzięki otwarciu internetowego kanału sprzedaży planowano zmniejszyć koszty obsługi klientów i jednocześnie znacząco poszerzyć ich grono. Proces W Divante posługujemy się metodyką User Centered Design, która za swój główny cel stawia optymalne zaspokojenie potrzeb użytkowników w sposób dla nich intuicyjny i wygodny. Projekt został wytworzony w ramach procesu, na który składały się następujące etapy: 1. Analiza potrzeb i zebranych wymagań biznesowych podczas której uzupełniliśmy dostarczony dokument funkcjonalny, spisaliśmy dodatkowe wymagania oraz w czasie warsztatów z klientem zebraliśmy cele biznesowe i pozostałe wymagania funkcjonalne i niefunkcjonalne (dot. np. wydajności i pojemności systemu) 4
2. Projektowanie interakcji podczas którego powstał i został zoptymalizowany interfejs użytkownika, opis przypadków użycia oraz zostały przeprowadzone badania z użytkownikami i wprowadzone poprawki. 3. Analiza techniczna i ustalenie integracji zadanie było sporym wyzwaniem, ponieważ wymagało wprowadzenia zmian także po stronie infrastruktury technicznej i systemów klienta. W tym etapie zebraliśmy wszystkie specyfikacje usług sieciowych oraz ustaliliśmy protokoły wymiany danych (więcej o tym w dalszej części). 4. Projektowanie graficzne na podstawie makiet funkcjonalnych, 5. Wdrożenie w oparciu o silnik Magento, 6. Testy i uruchomienie wykonany został szereg testów oraz dostarczone zostały raporty dotyczące każdego aspektu aplikacji. Testowanie aplikacji, które dostarczamy klientom ma dla nas szczególne znaczenie, ponieważ chcemy by produkt działał bez zarzutu. Także tym razem etap testów trwał stosunkowo długo, ale po jego zakończeniu klient jak i my byliśmy pewni, że uruchomienie sklepu przebiegnie bez zarzutu. 7. Pomiar i optymalizacja - za pomocą narzędzi analitycznych po pewnym czasie od uruchomienia serwisu dokonaliśmy pomiarów, aby sprawdzić czy wyznaczone na wstępie cele biznesowe faktycznie zostały zrealizowane. Łącznie nad projektem pracowało: w etapie analitycznym i graficznym: 2 projektantów interakcji, 1 analityk systemowy (analiza integracji i uszczegółowienie procesów biznesowych), 1 grafik, w etapie wdrożeniowym: 1 webmaster, 2 programistów (w pełnym wymiarze pracy), 1 programista (w niepełnym wymiarze pracy), 1 administrator (w niepełnym wymiarze pracy) w czasie uruchomienia serwisu, w etapie testowym: 1 tester oraz analityk biznesowy (scenariusze testowe i raporty). 1. Analiza potrzeb i zebranych wymagań biznesowych 2. Projektowanie interakcji Projektowanie Badania 4. Analiza techniczna i ustalenie integracji 5. Projektowanie graficzne 6. Wdrożenie 7. Testy i uruchomienie 8. Pomiar i optymalizacja Optymalizacja Rys. 1. Diagram pokazujący przebieg prac przy projekcie Prace projektowe i graficzne zajęły 1,5 miesiąca, natomiast samo wdrożenie przebiegło w 4,5 miesiąca. Biorąc pod uwagę stopień skomplikowania systemu, uważamy to za dobry wynik czasowy. Kompleksowe wdrożenie e-commerce dla TIM SA 5
Interaktywne prototypy Wdrożenie rozbudowanego systemu z określonym budżetem oraz terminem zawsze wiąże się z ryzykiem. Aby je zminimalizować, na początku konieczne jest sporządzenie dobrego i szczegółowego projektu funkcjonalnego. Jego ewentualne zmiany są dużo tańsze niż zmiany zaimplementowanej aplikacji. Praca koncepcyjna na makietach umożliwia tanie i szybkie weryfikowanie pomysłów oraz dokonywanie optymalizacji. Dodatkowo interaktywne prototypy umożliwiają pokazanie jak dana aplikacja będzie działać, przez co możliwa jest szybka weryfikacja wyobrażeń projektanta z oczekiwaniami klienta oraz jego klientów docelowych co w przypadku e-commerce ma znaczenie szczególne. Badania z użytkownikami Na podstawie interaktywnych prototypów zbadaliśmy, jak potencjalni klienci sklepu pracują z aplikacją. Badania te były o tyle trudne, że ze sklepu korzystały osoby o bardzo zróżnicowanym doświadczeniu w obsłudze sklepów internetowych. Przebadano osoby z kilku regionów Polski wybrane przy pomocy klienta z grona jego odbiorców docelowych. Badane osoby pracowały na co dzień w firmach energetycznych, budowlanych (developerzy) oraz wywodzili się z grona inwestorów indywidualnych np. osób przeprowadzających remont i wykończenie domu. W czasie badań użytkownicy wykonywali zadania zdefiniowane wcześniej z klientem. Zadanie dla sklepów i hurtowni elektrycznych Wyobraź sobie, że potrzebujesz do sprzedaży 345 m kabla do zasilania budynku. Spróbuj go kupić na tej stronie. Zadanie dla utrzymania ruchu Wyobraź sobie, że potrzebujesz 345 m kabla do zasilania budynku. Spróbuj go kupić na tej stronie. Optymalizacja kalkulatora W czasie testów z użytkownikami udało nam się wypracować optymalizacje, które sprawiły że obsługa systemu stała się intuicyjna mimo że momentami dotyka złożonych problemów. W tym miejscu warto omówić pokrótce dlaczego w przypadku przewodów mamy do czynienia z produktem nietypowym i jakie problemy są z tym związane. Kable są sprzedawane na krążki, bębny w odcinkach różnej długości. Mogą też być docinane na wymiar pod potrzeby klientów. TIM SA, jak każdy dystrybutor przewodów, po 6 Kompleksowe wdrożenie e-commerce dla TIM SA
pewnym czasie działalności zmagał się z problemem zalegania odcinków pozostałych po cięciu na wymiar przewodu, takie odcinki są krótkie dlatego nikt nie chce kupić ich osobno. Ich magazynowanie wiąże się zaś z wykorzystaniem cennej powierzchni logistycznej. Dlatego BankKabli miał pomagać również w ich wyprzedawaniu. W tym celu zaprojektowany został specjalny kalkulator gdzie po podaniu żądanej długości system automatycznie sugerował rozwiązanie np. docięcie odpowiedniego odcinka przewodu lub zastosowanie kilku odcinków wyprzedażowych + złączek do ich połączenia tak aby w efekcie pozbyć się zalegających na magazynie odcinków, i zaoferować tańszą cenę. Przykład jak zmieniał się kalkulator w czasie optymalizacji i testów z użytkownikami pokazuje poniższy obrazek. Kalkulator ulegał upraszczaniu (od lewej do prawej). Rys. 2. Makiety funkcjonalne - z lewej wersja początkowa, z prawej wersja końcowa. Kompleksowe wdrożenie e-commerce dla TIM SA 7
Projektowanie graficzne W ramach projektowania graficznego już po akceptacji finalnych wersji prototypów przygotowaliśmy jedną linię grafiki (look & feel). Po jej akceptacji (dla strony głównej serwisu) zaprojektowane zostały ekrany przedstawiające wygląd wszystkich makiet funkcjonalnych. Prace graficzne zajęły jeden miesiąc i w pewnym zakresie przebiegały równolegle z wdrożeniem, aby zminimalizować finalny czas dostarczenia produktu na rynek. Po projektowaniu graficznym webmaster stworzył szablony HTML i CSS które w kolejnym etapie zostały wdrożone do produktu końcowego. Etap cięcia do HTML zajął w tym przypadku blisko 3 tygodnie pracy na pełen etat webmastera. W tym czasie równolegle trwały prace programistyczne. Wdrożenie Magento Podczas wyboru platformy technologicznej dla klienta ważne było kilka czynników, m.in.: bezpieczeństwo biznesowe licencja platformy powinna być otwarta, tak aby klient sam w razie potrzeby mógł dopisywać funkcje oraz zajmować się utrzymaniem i rozwojem oprogramowania. Ważna była też możliwość ew. przekazania rozwoju do innej firmy lub nawet wykorzystanie supportu technicznego producenta, elastyczność funkcjonalna - system B2B stawia przed oprogramowaniem spore wyzwania, dodatkowo biznes klienta nie stoi w miejscu i wiele funkcjonalności pojawia się w trakcie platforma musi umożliwiać ich łatwe i tanie wdrażanie, bezpieczeństwo systemowe ważna była możliwość aktualizacji oprogramowania mimo wprowadzonych, daleko posuniętych zmian oraz częstotliwość aktualizacji przez producenta (m.in. łatki bezpieczeństwa). Pod tymi względami Magento wydaje się idealne. Poprzez swoją elastyczność zapewnia bardzo duże możliwości rozbudowy. Obecnie wielu partnerów Magento rozwija dodatkowe moduły, które mogą być wykorzystane w przyszłości zapewniają oni także bezpieczeństwo biznesowe. Magento jest obecnie pewnego rodzaju standardem branżowym jeśli chodzi o oprogramowanie do prowadzenia sklepu internetowego (posiadając ok. 125 tyś. wdrożeń na całym świecie, w tym wiele w Polsce). Wszystkie modyfikacje, jakie zostały przez nas wprowadzone do oprogramowania zostały zrealizowane na zasadzie modułów dodatkowych, które umożliwiają aktualizacji jądra platformy. Nie kolidują z wypuszczanymi przez producenta łatkami. Podział na moduły dodatkowo ułatwia proces wydawania kolejnych modyfikacji i planowania rozwoju. W dalszej części omówione zostaną wyzwania technologiczne i ich rozwiązania, które wystąpiły podczas wdrożenia. 8 Kompleksowe wdrożenie e-commerce dla TIM SA
Specyficzny produkt Kable są sprzedawane na krążki i bębny. Przechowywanie informacji o dostępnej długości przewodu na magazynie nie jest wystarczające, ponieważ konieczne jest zapamiętywanie, jakie konkretnie odcinki są dostępne (aby zrealizować m.in. sprzedawanie odcinków wyprzedażowych omawiane już wcześniej). Dodatkowo z konkretnym zakupem przewodu wiąże się konieczność jego cięcia na wymiar lub kaucja za opakowanie (bęben) oraz opłaty logistyczne. Jakby tego było mało, ceny przewodów nie są stałe, ponieważ zależą od stanów magazynowych, popytu i wielu innych czynników biznesowych. W Banku Kabli ceny są wyliczane zawsze na bieżąco według algorytmu, który bierze pod uwagę wspomniane czynniki, importowane w postaci plików Ms Excel oraz odczytywane z systemu ERP. Zaimplementowanie reguł cenowych oraz produktów o skomplikowanej specyfice wymagało nadpisania modeli danych w Magento oraz wstrzelenia się za pomocą mechanizmu zdarzeń (events) w algorytmy wyliczania ceny. Zarówno na kartach produktów, w kalkulatorze oraz na ścieżce zakupowej ceny są wyliczane za pomocą jednego algorytmu biorącego pod uwagę wszystkie dynamiczne czynniki. Zmianie uległo też działanie reguł promocyjnych i kodów rabatowych. Wygląd wdrożonego kalkulatora kabli został przedstawiony poniżej. Rys. 3. Kalkulator kabla w finalnej wersji pozwala dobrać optymalny zestaw przewodów oraz pomaga TIM SA sprzedawać krótki odcinki przewodów zalegające w magazynach. Kompleksowe wdrożenie e-commerce dla TIM SA 9
Elementy B2B W przypadku Banku Kabli, wdrożenie funkcjonalności B2B spędzało nam sen z powiek. Ponieważ Magento nie posiada natywnego wsparcia dla tych modułów (ciężko też o gotowe moduły, które można by było użyć bez modyfikacji), funkcjonalności te wymagały dużego nakładu prac w związku z tym, w ramach projektu wdrożyliśmy m.in.: hierarchiczne konta klientów klient posiadający oddziały może każdemu pracownikowi założyć osobne konto, w ramach którego pracownik może dokonywać w imieniu firmy zakupów na określony limit, limity kupieckie w pełni zintegrowane z systemem ERP zarówno proces występowania o limit (wniosek elektroniczny), jak i jego obsługa zostały zaimplementowane w Magento. Stworzono nową metodę płatności, która uwzględnia saldo klienta. Dane są na bieżąco wymieniane z systemem ERP, odbioru wielu adresów wraz z rezerwacją terminów dzięki automatycznej logistyce możliwe jest rezerwowanie czasów odbioru bezpośrednio w Magazynie Centralnym. Jeden klient może mieć dowolną ilość adresów odbioru odpowiadających jego oddziałom, obsługa reklamacji wnioski reklamacyjne generowane są automatycznie i przesyłane do systemu obiegu dokumentów (Workflow) w TIM, Rys. 4. Bazowa wersja Magento została rozbudowana o funkcje obsługi sprzedaży B2B. 10 Kompleksowe wdrożenie e-commerce dla TIM SA
obsługa faktur i innych dokumentów klient kupując nawet offline, a potem zakładając konto w BankKabli, może sprawdzić stan swoich spraw i dokumentów dzięki integracji z systemem Workflow. Takie zastosowanie platformy internetowej umożliwia odciążenie Call Center, a dla klientów staje się centrum informacji o ich kontach oraz stanie rozliczeń i spraw. Aby stworzyć konto B2B ponownie wykorzystaliśmy mechanizmy observerów i zdarzeń w Magento, nadpisaliśmy kilka modeli oraz dodatkowo wykorzystaliśmy mechanizmy EAV dające możliwość dodawania niestandardowych atrybutów do wszystkich grup obiektów w bazie danych (w tym do modeli użytkowników i klientów). Nietypowa ścieżka zakupowa Osoby znające Magento początkowo doceniają i chwalą mechanizm Onepage checkout. To rozwiązanie jest oparte na ajax-owym mechanizmie ścieżki zakupowej obejmującej tylko jeden krok (z dynamicznie doładowywanymi elementami). Mechanizm nie sprawdził się w przypadku Banku Kabli - był zupełnie nieużyteczny. Podczas badań z użytkownikami i projektowania określiśmy dokładne kroki ścieżki zakupowej. W tym miejscu zostały zastosowane precyzyjne metody dostawy tj. mechanizm rezerwacji odbioru osobistego z wyborem miejsca, daty i godziny), rodzaje płatności, limity kupieckie oraz powiadomienia SMS o kolejnych krokach realizacji. W związku z tym przepisaliśmy cały mechanizm ścieżki zakupowej (wyprowadzając nowy kontroler oraz modele odpowiedzialne za te funkcjonalności w ramach Magento). Staraliśmy się wykorzystać, na ile to możliwe standardowe mechanizmy i modele danych np. adresy dostawy, zamówienia, faktury) modyfikując je tylko tam, gdzie było to konieczne. Osadzenie w IT przedsiębiorstwa W ramach wdrożenia do zintegrowania mieliśmy kilka systemów: magazyn automatyczny, system ERP (MFG/PRO), system obsługi dokumentów. W TIM działają sprawne i zoptymalizowane procesy biznesowe, w które system internetowy miał się wpisać drogą ewolucji, a nie rewolucji. W związku z tym na etapie analizy przed-wdrożeniowej rozpisane zostały w notacji BPMN wszystkie procesy, w które ingerować miał system. Następnie ustalono, które ich kroki będą wspierane i w jakim zakresie. Kompleksowe wdrożenie e-commerce dla TIM SA 11
Rys. 5. W ramach analizy opraowano szczegółowe diagramy procesów biznesowych. 12 Kompleksowe wdrożenie e-commerce dla TIM SA
Rys. 6. Diagram przedstawia modelową konfigurację infrastruktury e-commerce. Na podstawie tak przygotowanych procesów biznesowych spisane wymagania systemowe, zaprojektowano interfejs użytkownika i systemowe przypadki użycia. Integracje zostały opisane wspólnie z IT klienta w formie dokumentu pt. Analiza integracji opisującego wszystkie formaty danych oraz sposoby (protokoły) ich wymiany. Zastosowano szynę wymiany danych Microsoft BizTalk Server która zestandaryzowała sposób wymiany informacji. Jako formatów użyto dokumentów XML wypracowanych przez OAGIS. Dzięki takiemu podejściu integracje, które zostały zaimplementowane mogą bez problemów zostać wykorzystane zarówno przy nowych systemach po stronie TIM, jak i w przypadku rozwiązań internetowych, które z tymi systemami się komunikują. Użycie standardowych rozwiązań przy integracji jest bardzo istotne. Jeśli chodzi o zakres wymiany danych: produkty wymieniane są pełne specyfikacje techniczne produktów (raz na dobę, wysyłane przez system magazynowy/erp). stany magazynowe - są synchronizowane kilka razy na dobę, w ramach sklepu odbywają się też rezerwacje produktów kupowanych online, a pełne informacje Kompleksowe wdrożenie e-commerce dla TIM SA 13
o kupionych odcinkach (z dokładnością do odcinka) są przekazywane do systemu magazynowego, zamówienia i dane klientów odbywa się pełna obustronna synchronizacja. Sklep przesyła dane zamówień i klientów, natomiast drogą zwrotną są przekazywane informacje dot. stanów realizacji zamówienia. W ten sposób procesy dotyczące samej logistyki i części handlowej nie zostały zmodyfikowane i nadal są wspierane przez system ERP. Dzięki temu nie były wymagane szkolenia pracowników odpowiedzialnych za realizację zamówień. dokumenty sprzedażowe i limity kupieckie również obustronna synchronizacja w czasie rzeczywistym. Rys. 7. System integruj się z kilkoma systemami w ramach obecnej infrastruktury TIM SA. Rys. 8. Hosting serwisu jest realizowany w ramach naszkicowanej na etapie analizy koncepcji technologicznej obejmującej wydzielony serwer bazo-danowy, serwer aplikacji, zapora sieciowa oraz szyfrowany kanał wymiany danych z systemami dziedzinowymi w DataCenter klienta (poprzez VPN). 14 Kompleksowe wdrożenie e-commerce dla TIM SA
W celu zwiększenia niezawodności wymiany danych po stronie sklepu internetowego użyto systemu kolejkowania Gaerman, który ponawia komunikaty w przypadku zerwania łączności czy innych zdarzeń utrudniających wymianę informacji. Testy, testy, testy Systemy e-commerce są systemami o zwiększonym stopniu wymaganej dostępności. W przypadku Banku Kabli dodatkowym czynnikiem ryzyka wpływającym na stabilność systemu była duża liczba integracji. W ramach testów napisaliśmy pełne scenariusze testowe do UAT (User Acceptance Tests testy funkcjonalne) oraz plany testów wydajnościowych i pozostałych. Sumarycznie zostały przeprowadzone następujące testy: funkcjonalne/akceptacyjne na podstawie scenariuszy, które stały się też podstawą do dalszych testów dymnych i regresyjnych przeprowadzanych w trakcie rozwoju, po wdrożeniu, integracyjne na podstawie opracowanych scenariuszy testowych, wspólnie z pracownikami TIM sprawdziliśmy czy dane synchronizują się w wymaganym zakresie i czasie oraz jaka jest wydajność i awaryjność systemu, bezpieczeństwa zostały przeprowadzone dwuetapowo. Z jednej strony testowano za pomocą automatycznych narzędzi typowe podatności (XSS, SQL Injection, CSRF) z drugiej zaś strony dokonano rewizji i oceny kodu źródłowego w zakresie dopisanych do Magento funkcjonalności, wydajnościowe za pomocą narzędzi Siege i JMeter zostały przetestowane kluczowe ścieżki aplikacji. W ramach umowy utrzymaniowej aplikacja ma gwarantowane czasy odpowiedzi i realizacji celów użytkownika. Testy wydajnościowe wykazały, że cele są odpowiednio realizowane, oraz że aplikacja podoła zakładanemu wolumenowi ruchu i sprzedaży. Przebieg i rezultaty wszystkich testów dostarczone zostały klientowi w postaci pisemnych raportów. Dopiero po ich akceptacji doszło do produkcyjnego wdrożenia systemu. Kompleksowe wdrożenie e-commerce dla TIM SA 15
2. Działanie funkcji edycji bloczków statycznych Scenariusz dotyczy Cel testu Sposób dostępu SPU 2.11 Zarządzanie stroną główną Konsola Testowanie poprawnego działania edycji bloczków statycznych. Bloczek jest dostępny z poziomu CMS Scenariusz (kroki tekstowe) Akcje uzytkownika Odpowiedź systemu 1. Wybrać w menu głównym CMS > Bloki statyczne, wybrać bloczek do edycji: Footer Links Slider content Linki stopki Dane kontaktowe stopki Linki korzyści Filmy bezpiecznych zakupów Kategorie strony głównej Treść regulaminu Bloki infolinii Mały banner reklamowy Dostawa Bezpieczne zakupy na głównej Bezpieczne zakupy na stronie produktu Bezpieczne zakupy zamówienie 2. Wyświetlenie edycji wybranego bloku statycznego 3. Zmienić zawartość bloczka statycznego i potwierdzić zmiany poprzez przycisk Zapisz 4. Wyświetlenie zmienionej zawartości bloczka statycznego w serwisie Ocena testu Rys. 9. Scenariusze testowe zostały opracowane na etapie projektu funkcjonalnego. 16 Kompleksowe wdrożenie e-commerce dla TIM SA
Zapewnienie jakości wdrożenia Aby zapewnić jakość wdrożenia zastosowaliśmy standardowe rozwiązania wykorzystywane w Divante: system kontroli wersji w tym przypadku SVN z tagowaniem wersji, planem rozwoju oraz oznaczaniem realizowanych zgłoszeń, system ewidencji zgłoszeń Redmine, w którym przeprowadzana jest cała komunikacja i ustalenia z klientem. Redmine służy do planowania kolejnych wydań oprogramowania, system monitoringu Incinga, monitorujący wszystkie parametry systemu operacyjnego, a także monitorujący dostępność aplikacji (HTTP), automatyczne testy PHPUnit monitorujące dostępność i poprawność działania kluczowych algorytmów aplikacji: wyliczania cen, usługi z którymi następuje integracja, ścieżka zakupowa, osobne środowiska: developerskie, testowe i produkcyjne, transakcyjny system wdrożenia - przy wykorzystaniu SVN (transakcyjność) oraz procedur wersje są planowane raz na tydzień z uwzględnieniem czasu na testy UAT klienta i nasze testy funkcjonalne oraz testy regresyjne. Kompleksowe wdrożenie e-commerce dla TIM SA 17
Kompleksowa optymalizacja e-commerce dla INTERSPORT Polska S.A. Grupa INTERSPORT jest największą na świecie grupą zakupową prowadzącą sprzedaż detaliczną markowego sprzętu sportowego w ponad 5400 sklepach zlokalizowanych w 40 krajach na całym świecie, łączne przychody przekraczają 10 mld euro. W naszym kraju INTERSPORT Polska S.A. jest liderem wśród sieci sklepów sportowych, posiadając obecnie 32 salony zlokalizowane w 21 największych miastach Polski. Spółka jest rokrocznie wyróżniana na rynku za dynamikę rozwoju, zwiększanie swojej wartości rynkowej oraz za rzetelność w prowadzeniu biznesu. Podejmując współpracę z Intersport Divante przejęło opiekę nad istniejącym sklepem internetowym http://esklep.intersport.pl. Oparty jest na dedykowanym rozwiązaniu i zintegrowany z systemami dziedzinowymi Intersport. Zdiagnozowano: problemy z użytecznością sklepu problemy z szybkością działania Cele Rozpoczęliśmy współpracę z INTERSPORT na wielu płaszczyznach e-commerce. Naszym nadrzędnym celem było zwiększenie sprzedaży z wykorzystaniem sklepu internetowego. 18 Kompleksowa optymalizacja e-commerce dla INTERSPORT Polska S.A.
Chcemy wykorzystać pozycję lidera w handlu tradycyjnym, aby w przyszłości stać się liczącym graczem sprzedającym online. Zdecydowaliśmy się na współpracę w oparciu o outsourcing swojego kanału e-commerce, tak aby nie rozpraszać sił sprzedażowych poza kanał tradycyjny, który generuje większość obrotów w firmie. Marek Bugajski, Dyrektor ds. Obsługi Sklepów INTERSPORT Polska S.A. W naszych działaniach operacyjnych przewidzieliśmy: 1. Optymalizację konwersji w sklepie internetowym podzieloną na rekomendację do obecnego projektu sklepu oraz całkowite przeprojektowanie maski sklepu. 2. Poszerzenie zasięgu e-sprzedaży działaniami z zakresu SEM, epr, social media oraz przygotowanie podwalin pod późniejsze rozwijanie niewykorzystanych obszarów marketingu sprzedażowego. Niniejszy case study opisuje działania realizowane w punkcie 1 (optymalizacja). Praca nad zwiększeniem konwersji Proces rozpoczęliśmy od analizy konkurencji oraz rynku. Dobrze uczyć się od najlepszych. Aby głębiej poznać branżę, wyszliśmy poza rynek polski i przyjrzeliśmy się jak działają zagraniczni najwięksi sprzedawcy w kategorii Artykułów Sportowych. Przeanalizowaliśmy również zagraniczne serwisy marki Intersport. Naszym celem było zachowanie spójnego międzynarodowego wizerunku marki Intersport. Następnie zrealizowaliśmy badania użyteczności. Badania były podstawą do zaproponowania modyfikacji. Dokładnie sprawdziliśmy obecny projekt sklepu, chcąc wykorzystać to, co dobrze sprawdza się na polskim rynku i wskazać słabe punkty lub braki, które w pierwszej kolejności wymagały dopracowania. 1. Analiza konkurencji oraz rynku 2. Audyt ekspercki obecnego rozwiązania 3. Projektwanie makiet funkcjonalnych 4. Projektowanie graficzne 5. Kodowanie oraz podpięcie projektu 6. Prace wdrożeniowe 7. Uruchomie- -nie projektu Rys. 10. Diagram pokazujący przebieg prac przy projekcie. Mając na uwadze dobro klienta przekazaliśmy listę rekomendacji odnośnie prostych poprawek użyteczności które mogą szybko poprawić sprzedaż do czasu wdrożenia nowego projektu. Kompleksowa optymalizacja e-commerce dla INTERSPORT Polska S.A. 19
Analizowaliśmy, projektowaliśmy, wdrażaliśmy wszystko z myślą o zwiększeniu sprzedaży poprzez poprzez poprawę komfortu klienta. Identyfikacja czynników decyzji zakupowej Analizując branżę wskazaliśmy unikatowe dla e-commerce wartości, którymi kierowaliśmy się w późniejszych pracach nad projektem. Do najważniejszych należały: 1. wiarygodność marki Intersport; 2. szeroka oferta markowych produktów, w tym marki własne Intersport; 3. dopracowana prezentacja produktu; 4. prostota zakupu (esencja dużego sklepu sportowego). Poza szeroką ofertą, unikalną wartością dodaną jest możliwość bezpłatnego odbioru osobistego w punktach stacjonarnych rozsianych po całym kraju oraz szybka wysyłka zamówień. Prototypowanie Po przeanalizowaniu zebranych materiałów przeszliśmy do projektowania makiet. Każdy z elementów zmieniających funkcjonalność konsultowaliśmy bezpośrednio z pracownikami Intersport oraz osobami znającymi branżę. Efektem naszej pracy był projekt funkcjonalny składający się z 23 widoków. Projektowanie graficzne Po zaprojektowaniu wszystkich funkcjonalności nowego sklepu przystąpiliśmy do koncepcji graficznej. Projekt wykonaliśmy w klimacie zimowym, z możliwością zmiany tematu strony. Nasz dział graficzny opracował lekką i dobrze wywarzoną koncepcję, która w 100% oddawała charakter marki Intersport. 20 Kompleksowa optymalizacja e-commerce dla INTERSPORT Polska S.A.
Przykładowe modyfikacje na co warto zwrócić uwagę Strona główna Najważniejszym elementem strony było menu, które przeprojektowane zostało wraz z całą architekturą informacji. Horyzontalne menu zakładkowe pozwoliło na zwiększenie dostępności dwóch zagłębień kategoryzacji. Pod menu znalazło się miejsce na banner sprzedażowy i cztery punkty startowe, a pod nimi produkty w promocji. Rys. 11. Menu główne. Nagłówek W nagłówku sklepu zamieściliśmy najważniejsze informacje od dużego logo i kontaktu poprzez konwencjonalne elementy logowania i rejestracji, wyszukiwarki i bardzo użytecznego rozwijanego koszyka. Rys. 12. Nagłówek. Karta produktu Dwa układy karty produktowej horyzontalna i standardowa pozwoliły na efektywne zaprezentowanie wszystkich rodzajów produktów. Aby maksymalnie wesprzeć efekt ROPO, zaprojektowaliśmy bardzo intuicyjny element sprawdzający dostępność w salonach stacjonarnych. Poza tym wprowadziliśmy jasne komunikaty o dostępności i odbiorze za 0 zł w salonie. Kompleksowa optymalizacja e-commerce dla INTERSPORT Polska S.A. 21
Rys. 13. Karta produktu. Proces zakupowy Projektując proces zakupowy skoncentrowaliśmy się na prostocie dokonywania zakupów. Zmniejszyliśmy liczbę kroków, uprościliśmy sposób określania formy płatności oraz wysyłki lub odbioru osobistego. Rys. 14. Proces zakupowy. Duża grupa klientów Intersport przede wszystkim ceni swój czas i nie zawsze chce się wiązać ze sklepem. Dla tej grupy klientów wprowadziliśmy zakupy bez rejestracji element, którego do tej pory brakowało. 22 Kompleksowa optymalizacja e-commerce dla INTERSPORT Polska S.A.
Dodatkowo chcieliśmy mieć pewność, że klienci poznają korzyści rejestracji, co mogłoby ich skłonić do założenia konta. Element ten został dokładnie przemyślany i wpisany w formularz. Rys. 15. Formularz rejestracji. Nawigacja przez markę Wielu klientów preferowało przeglądać całą ofertę wybranej marki. Dla szybszego dostępu do wybranych marek umieściliśmy w stopce przejrzysty rotator logotypów. Rys. 16. Nawigacja przez markę. Nowe mechanizmy w sklepie Członkowie programu lojalnościowego mogą wykorzystać przydzielane bony promocyjne. Aby ułatwić ich wykorzystanie zalogowany użytkownik musi jedynie wybrać bon z listy. Informacja o darmowej dostawie pojawia się przy wyborze opcji dostawy we właściwym miejscu i we właściwym momencie. Rys. 17. Bony promocyjne. Kompleksowa optymalizacja e-commerce dla INTERSPORT Polska S.A. 23
Rekomendacje Quartic Ze względu na specyfikę biznesu i sposób poszukiwania produktów wprowadziliśmy rekomendacje produktowe. Wkomponowane bloczki pomagają znaleźć alternatywę dla przeglądanych produktów, dopasowując się do odbiorców na bazie danych historii zachowania danego użytkownika w sklepie. Systemem rekomendacji jest Quartic. Wdrożenie i optymalizacja techniczna Nie zmienialiśmy technologii, w której został wykonany sklep. Specjaliści Divante w porozumieniu z klientem dokonali modyfikacji aplikacji. Podczas prac wdrożeniowych projekt zoptymalizowaliśmy pod kątem SEO. Do kodowania szablonu zastosowaliśmny techniki optymalizacji ładowania interfejsu. Poprawione zostały także zdiagnozowane błędy w kodzie aplikacji, które skutkowały problemami z ładowaniem się stron sklepu. Wprowadzono automatyczne testy interfejsu użytkownika i stały monitoring dostępności serwisu. Zapewnienie jakości podczas wdrożenia Przeprowadzono wewnętrzną kontrolę jakości na każdym etapie projektu. Wprowadzono systemowe zarządzanie wymaganiami, zmianą oraz zgłoszeniami serwisowymi (Redmine). Przygotowano też automatyczny proces wdrożenia, zastosowano listę kontrolną, procedury, trzystopniowe wdrożenie oraz dobre praktyki wdrożeniowe. Minimalizacja ryzyka podczas wdrożenia Zwracamy szczególną uwagę na: Dokładne zebranie wymagań: makiety + widoki + webcast z istniejącego systemu. Analiza systemów zewnętrznych (integracje) i procesów na ich styku. Szczegółowe kamienie milowe / iteracje każdy kamień oznacza gotowe do użycia funkcjonalności. Kontrola postępów prac w systemie Redmine z udziałem klienta i stałą wymianą informacji oraz wersją testową online. Stworzenie i przetestowanie automatycznych skryptów do migracji danych podczas tworzenia funkcji najpierw migrujemy potrzebne do nich dane dzięki temu mamy pewność, że o niczym nie zapomnimy. Stworzenie dokumentacji zawierającej opis wszystkich scenariuszy testowych do biznesowego działania platformy (pod testy dymne). 24 Kompleksowa optymalizacja e-commerce dla INTERSPORT Polska S.A.