Case Studies

UX rozbudowanej strony www dla lidera w zakresie automatyzacji w logistyce, czyli o projekcie dla SKK S.A.

Klient:
SKK S.A.
Cel:
stworzyć UX dla nowej strony internetowej
Okres współpracy:
marzec-kwiecień 2020
Liczba sprintów:
6
Liczba osób w projekcie:
2


Firma SKK S.A., lider w zakresie automatyzacji w logistyce, rzuciła nam wyzwanie: stwórzmy stronę internetową, która będzie odpowiadała wszystkim działom sprzedaży w firmie, i zwiększy sprzedaż! Jak do tego podeszliśmy? Co zrobiliśmy, by skoordynować pracę kilku działów i zaprezentować ofertę firmy w pełni, ale nie przytłoczyć klientów? 

Z poniższego case study na przykładzie naszych prac dla SKK S.A. dowiesz się:

  • Jak zaprezentować wszystkie aspekty oferty firmy w sposób czytelny i jednocześnie przesunąć dalej użytkownika w ścieżce decyzyjnej/zakupowej? 
  • Jak pokazać mu złożoność biznesu, a jednocześnie nie przytłoczyć informacjami?
  • Jak zbudować architekturę informacji dla blisko 70 ekranów w serwisie?
  • Jak skoordynować pracę kilku działów sprzedaży i przełożyć to na jeden funkcjonalny serwis?

 

Kontekst projektu:

SKK to firma, która zajmuje się automatyzacją i optymalizacją procesów logistycznych oraz produkcyjnych. Zadanie, które przed nami podstawiła, to zaprojektowanie UX dla strony internetowej. SKK miało już istniejącą witrynę, ale wymagała ona ulepszeń. Podstawowym zadaniem dla nowego projektu było jasne, a jednocześnie wyczerpujące informowanie odbiorców o złożonej ofercie firmy. Wyzwaniem był fakt, że sprzedażą w firmie SKK S.A. zajmuje się kilka działów.

Problemy SKK S.A.:

  • nie wszystkie punkty z oferty firmy były prezentowane na stronie,
  • brak strukturalnej organizacji usług,
  • strona internetowa była dość rzadko wykorzystywana w procesie pozyskiwania klienta przez niektóre działy,
  • generyczne podstrony sprzedażowe,
  • niekompletne opisy usług na stronie,
  • mała konwersja na podstronach związanych z branżą

Klucz do udanej współpracy? Zespołowość!

Z działem Marketing & Product Developement SKK S.A., kierowanym przez Konrada Ulińskiego, staliśmy się na czas trwania projektu jednym teamem. Takie poczucie zespołowości bardzo wpisuje się w wartości Project: People.  

Team marketingu SKK S.A. wprowadził nas do każdej jednostki i poinstruował, z kim w firmie kontaktować się w konkretnych sprawach. Podzielił się niezbędnymi do pracy materiałami. Zespół po stronie SKK nadzorował też prace nad treściami na stronę. 

Współpraca była bardzo sprawna, leanowa, dzięki czemu o wiele częściej niż zazwyczaj iterowaliśmy z członkami zespołu SKK S.A. wireframe’y. Nasze wspólne prace zespół marketingowy SKK przekładał na kontekst ogólnofirmowy.

 


Strona główna przed przeprojektowaniem

Prezentacja usług na stronie głównej przed przeprojektowaniem

Strona główna po przeprojektowaniu


Prezentacja usług po przeprojektowaniu

Sprint 1-2: Warsztat kick-off


Stworzenie dobrej strony internetowej wymaga dogłębnego poznania firmy, dla której tworzy się serwis. Dlatego zaczęliśmy od warsztatu kick-off.

Plan warsztatu

Podstawowe założenia warsztatu, który przeprowadziliśmy dla SKK S.A., to:

  1. Poznanie struktury firmy i korelacji pomiędzy poszczególnymi działami. Naszym celem było zrozumienie, które procesy są uniwersalne w obrębie całej struktury, a gdzie występują indywidualne potrzeby poszczególnych działów.
  2. Zrozumienie zakresu usług oferowanych przez SKK. Miało to pomóc nam w opracowaniu odpowiednich person kupujących, co z kolei przekłada się na projekt serwisu odpowiadający na problemy użytkowników.
  3. Mapowanie procesów wykonywania usług w obrębie samej firmy. Dzięki temu mogliśmy zrozumieć, co jest ważne w kontekście strony internetowej.

 

Mapowanie interesariuszy

Warsztat rozpoczęliśmy od tradycyjnego poznania wszystkich członków zespołu projektowego – interesariuszy, aby każdy wiedział o roli innych osób w zespole. Poprosiliśmy uczestników o zmapowanie struktur firmy. Wykorzystaliśmy proste ćwiczenie rozgrzewkowe: napisz na karteczce imię i powiedz kilka słów o sobie. Kiedy wszyscy się już przedstawili, poprosiliśmy ich o rozrysowanie na tablicy struktury firmy. Każda osoba miała za zadanie przykleić swoją karteczkę w odpowiednim miejscu w firmie. 

Chcieliśmy wiedzieć, jak wygląda przepływ informacji w obrębie SKK S.A., oraz mieć pewność, że tworząc stronę internetową, spełniamy wymagania wszystkich interesariuszy.

 

Mapa interesariuszy stworzona podczas warsztatu


W procesie mapowania wyodrębniliśmy poszczególne działy handlowe:

  • dział handlowy zajmujący się automatyką i etykietami,
  • dział handlowy odpowiedzialny za logistykę,
  • dział handlowy odpowiedzialny za sieci.

Ogólny proces sprzedaży był podobny dla każdego działu, jednakże ze względu na specyfikę branży każdy dział miał inne potrzeby. Pracownicy uczestniczący w warsztatach wskazali działy, w obrębie których pracują. Zmapowanie struktury firmy przez nich samych ułatwiło nam późniejsze rozplanowanie wywiadów.

W czasie warsztatu poprosiliśmy uczestników również  o opisanie:

  • Jak wygląda obsługa zamówień na styku kilku działów?
  • Kiedy kończą się kompetencje jednego działu, a zaczynają drugiego?
  • Czym dokładnie zajmują się i co sprzedają poszczególne działy?

Teraz także możesz skorzystać 30+ narzędzi do efektywnej pracy na warsztatach. Za darmo.

Dołącz do naszego newslettera!



    Zgadzam się na przetwarzanie moich danych osobowych przez Project: People Sp. z o.o. w celu komunikacji marketingowej, a tym samym wysyłania mi newslettera, informacji o usługach, promocjach lub nowościach zgodnie z Polityką prywatności

     

    Mapowanie usług

    W dalszej części warsztatu podzieliliśmy uczestników na grupy. Każda zajęła się mapowaniem procesu usług w swoim dziale. Poprosiliśmy pracowników o ułożenie procesu od pierwszego punktu styku klienta z firmą (co ważne, nie od pierwszego kontaktu) do realizacji usługi i okresu po obsłudze. Dzięki temu mogliśmy zobrazować, jak wiele punktów styku z odbiorcą może mieć strona internetowa.

    Poniżej kilka naszych wniosków:

    • w przypadku etykiety wiele zapytań ofertowych mogło być sprecyzowanych już na stronie internetowej,
    • oferta sieciowa nie była zaprezentowana na stronie w czytelny sposób,
    • informacje o oprogramowaniu i sprzęcie sprzedawanym przez firmę nie były wyeksponowane,
    • strona internetowa była stosunkowo rzadko wykorzystywana przez niektóre działy.

    Sprint 1-2: Analiza danych zastanych 

     

    Po warsztacie przeszliśmy do analizy danych zastanych. Pierwszym krokiem była analiza oferty

    Warto wiedzieć, że firma SKK S.A. zaczynała działalność od etykiet specjalizowanych, następnie stopniowo rozszerzała swoją ofertę o kolejne segmenty. W chwili, gdy rozpoczęliśmy współpracę, firma proponowała klientom:

    • etykiety specjalizowane,
    • programy do zarządzania i produkcji etykiet,
    • autorskie systemy Hive Sensor i Hive Track do rozwiązań logistycznych,
    • kompletację głosową,
    • sprzedaż sprzętu Auto ID: terminali, drukarek etykiet, drukarek mobilnych,
    • rozwiązania sieciowe.


    Jak widać, jest to oferta złożona. Musieliśmy zrozumieć jej granice i kompleksowość. 

    Na potrzeby analizy danych zastanych początkowo przebywaliśmy w siedzibie firmy SKK S.A., aby na miejscu porozmawiać i spotkać się z poszczególnymi osobami. 

    Dodatkowo przeprowadziliśmy analizę danych ilościowych z Google Analytics oraz Hotjar. Co ważne, SKK S.A. posiada dwie domeny: skk.com.pl (skierowaną na polski rynek ) oraz skkglobal.com, która jest dedykowana rynkowi zagranicznemu. Ustaliliśmy, że priorytetem jest domena polska. 

    Problemem do rozwiązania było między innymi brak call to action na większości podstron sprzedażowych. Same strony były dość generyczne, opisywały usługi, ale nie utwierdzały potencjalnych odbiorców w przekonaniu, że SKK S.A. ma duże doświadczenie. Stosunkowo mało było testimoniali, przykładów projektów czy liczb pokazujących doświadczenie SKK. 

    Dodatkowym problemem był brak organizacji strukturalnej usług. Były one wypisane, ale nie uszeregowane logicznie ze względu na potrzeby klientów.

    Sprint 3-4: UX Research – wywiady pogłębione

    Zgodnie z naszą dobrą praktyką staramy się przebywać w siedzibie klienta, aby na spokojnie spotkać się z poszczególnymi osobami i porozmawiać o tym, jak wygląda funkcjonowanie firmy od środka. Umawialiśmy się na wywiady pogłębione z każdą osobą odpowiedzialną za produkt. Naszym celem było zorganizowanie struktury wszystkich usług, wypracowanie konkretnego podziału, a później stworzenie dedykowanej podstrony dla każdej usługi.

    Informacje o każdej usłudze staraliśmy ułożyć w uporządkowaną strukturę i odpowiedzieć w ten sposób na pytania:

    • Jakie podprodukty, rodzaje ma dana usługa?
    • Kto jest klientem?
    • Kim są kluczowi klienci?
    • Jakie są relacje z klientami?
    • Jakie są kluczowe aktywności w ramach usługi?
    • Kto jest konkurencją w obrębie tego produktu?
    • Jak wygląda proces rozpoczęcia współpracy?
    • Jakie są kanały dotarcia do klienta?
    • Jakie problemy i obiekcje mają klienci?
    • Jak klienci szukają poszczególnego produktu?
    • Co jest w danym produkcie Unique Value Proposition?

    Po wybuchu pandemii COVID-19 przeszliśmy na pracę zdalną. Nie przeszkodziło nam to w przeprowadzeniu wywiadów. Wszystkie odbywały się telefonicznie bądź przy użyciu platformy Webex. Odbyliśmy blisko 20 wywiadów z pracownikami różnego szczebla. Od osoby odpowiedzialnej za obsługę klienta, u której zaczyna się proces, po dyrektorów sprzedaży. Na wywiady zaprosiliśmy też:

    • dział HR, 
    • osoby zajmujące się rozwojem poszczególnych produktów (Hive Track), 
    • osoby odpowiedzialne za sprzedaż oprogramowania do zarządzania etykietami, 
    • osoby pracujące przy kompletacji głosowej, 
    • kilka osób z działu sieciowego
    • oraz innych pracowników.


    Wszystko po to, aby stworzyć rozwiązanie dopasowane do ich potrzeb. 
    W czasie wywiadów prosiliśmy każdego uczestnika o:

    • prezentację własnych usług, 
    • opisanie etapów procesu sprzedaży,
    • opowiedzenie o potrzebach w tym zakresie.

    Na tej podstawie zmapowaliśmy punkty styku. Równolegle projektowaliśmy architekturę strony.

    Sprint 3-4: Tworzenie architektury

    Najbardziej wymagającym etapem było stworzenie odpowiedniej architektury. Tradycyjnie powinno się ją budować na podstawie persony. Jednak przy opisywaniu idealnego odbiorcy napotkaliśmy następujące problemy:

    • większość działów sprzedaży współpracowała z dużymi organizacjami o złożonej strukturze, gdzie o wyborze  pojedynczego produktu decydowało kilka osób,
    • SKK S.A. ma szeroką gamą produktów w różnych segmentach: logistyce, handlu, magazynowaniu; część usług firmy jest istotna zarówno dla osób zaangażowanych w logistykę, jak i magazynowanie,
    • dla sprzedawców SKK kluczowy był proces produkcji, który odbywał się np. w logistyce czy na produkcji.

    Z tego względu postanowiliśmy stworzyć strukturę serwisu na podstawie jobs to be done. To metoda, dzięki której możemy zidentyfikować bardzo złożony problem i rozwiązać go.

    Zidentyfikowaliśmy w każdym segmencie działalności SKK konkretne “jobsy”, czyli kompleksowe usługi, których odbiorcy szukali w obrębie danej kategorii.

     

    Podzieliliśmy je na działy:

    • produkcja,
    • logistyka,
    • handel,
    • etykiety,
    • rozwiązania sieciowe,
    • urządzenia i oprogramowanie.

    Przykładowo wspólnie z pracownikami zidentyfikowaliśmy dla produkcji takie obszary jak:

    • robotyzacja procesów przemysłowych,
    • automatyczne systemy znakowania,
    • projektowanie i wydruk etykiet,
    • rozwiązanie sieciowe.

    Dział logistyki zawierał przykładowo:

    • Hive Track (autorskie rozwiązanie SKK S.A.),
    • zarządzanie mobilnością,
    • kompletację głosową,
    • terminale,
      • czytniki kodów kreskowych,
      • projektowanie i wydruk etykiet,
      • rozwiązania sieciowe.drukarki etykiet,


    Jak można zauważyć, projektowanie i wydruk etykiet znalazło się w obu kategoriach.
    Po wywiadach doszliśmy do wniosku, że warto umieścić tę samą usługę w obu miejscach. Osoby zajmujące się logistyką nie szukają usług z etapu produkcji czy magazynowania, zależało nam jednak na konwersji w tym aspekcie.

     

    Fragment wizualizacji architektury informacji w serwisie


    Z tak przygotowaną architekturą serwisu mogliśmy przystąpić do kolejnych etapów projektu. Pracę nad
    wireframe’ami (widokami służącymi do zaprezentowania struktury strony) rozpoczęliśmy jeszcze pod koniec 4 sprintu.

    Sprint 4-6: Wireframing


    Na tym etapie wróciliśmy do wniosków ze wspomnianych już wywiadów i podjęliśmy kilka decyzji:

    • Potrzebujemy potwierdzenia jakości usług – na stronach usługowych koniecznie należy umieszczać dla każdej konkretnej usługi testymoniale, liczby oraz case study związane z danym obszarem.
    • Call to action powinno być widoczne w sticky menu (czyli menu przyklejonym u góry strony, które nie znika w czasie scrollowania) cały czas.
    • Na każdej podstronie powinien pojawić się formularz kontaktowy odsyłający do konkretnej osoby zajmującej się daną usługą.


    Na podstawie podstawowych wywiadów stworzyliśmy pierwszy koncept serwisu.
    Przygotowaliśmy blisko 70 ekranów high quality, czyli bardziej zaawansowanych widoków strony (przykład poniżej). Dzięki nim możemy zastanowić się, jak chcemy zorganizować treść, układ elementów na stronie, łatwiej zaplanować prace programistyczne.

    Po pierwszym koncepcie każdorazowo kontaktowaliśmy się z zespołem odpowiedzialnym za dany produkt/usługę. Chcieliśmy wspólnie ustalić, jakie elementy na podstronie ułatwią codzienną pracę.

    Niektóre działy wymagały prostego formularza:


    Dla innych został stworzony dużo bardziej rozwinięty formularz. Aby zespół mógł odpowiedzieć na zapytanie, potrzebował innych informacji:

     

     

    W ostatnim etapie tworzyliśmy wersje mobilne, aby designer mógł opracować widoki strony.

    W czasie trwania tego etapu, cyklicznie co 2-3 tygodnie spotykaliśmy się z całym zarządem SKK S.A., aby zaakceptować strukturę strony internetowej. Wspólnie omawialiśmy poszczególne elementy. W dobie pandemii rewelacyjnie sprawdziła się do tego Figma, która umożliwiła równoczesną współpracę nawet 17 osobom.

    Po zaakceptowaniu projektu UX strony www materiał został przekazany do designera i developera, których zadaniem było zaprojektowanie i wdrożenie serwisu. Przez cały ten czas byliśmy do dyspozycji i pomagaliśmy rozwiązać wątpliwe kwestie.

    Podsumowanie

    Lessons learned z tego projektu?

    1. W procesie tworzenia narzędzia, które ma pomóc wielu osobom (np. reprezentującym różne działy tej samej firmy), warto zastosować metodę jobs to be done.
    2. Często pracownicy jednego działu mają własne wyobrażenie o pracy innego. Aby dogłębnie zsynchronizować pracę wszystkich, należy porozmawiać z osobami o różnych perspektywach.

    Przejście w tryb pracy zdalnej nie wpływa na jakość projektu, jeśli użyjemy odpowiednich narzędzi (o tym, z jakich narzędzi do zdalnej współpracy warto korzystać, przeczytasz w naszym e-booku).

    Podsumowanie w liczbach

    20

    wywiadów pogłębionych

    70

    ekranów high quality

    17

    osób pracujących symultanicznie w Figmie

    Narzędzia i metody:

    • warsztat kick-offowy
    • mapa interesariuszy
    • mapa ścieżki klienta
    • metoda jobs to be done
    • wywiady pogłębione
    • analiza danych zastanych w Hotjar i Google Analytics

    Co o projekcie mówi klient?

    Rozpoczynając projekt stworzenia nowej strony internetowej, wiedziałem, że bardzo dużo uwagi chcę poświęcić na przemyślaną architekturę serwisu wspierającą cały ekosystem narzędzi generujących dla nas leady. Już po pierwszym spotkaniu z Beatą i Joanną z Project: People widziałem, że to właśnie z nimi chcę pracować. Czułem, że już na pierwsze spotkanie przyszły przygotowane, z perfekcyjną interpretacją przesłanego wcześniej briefu.

    Sama realizacja projektu jest przeze mnie bardzo wysoko oceniana. Tomasz, który z ramienia Project: People zaopiekował się nami, idealnie odzwierciedlił w projekcie wszystkie nasze potrzeby i wnioski zgłaszane już od pierwszych warsztatów koncepcyjnych. Nie forsował gotowej, jedynie słusznej koncepcji, tylko uważnie słuchał i analizował, co jest istotne dla nas.

    Ze strony Tomasza otrzymaliśmy również duże wsparcie w obszarze poszukiwania firmy, która przygotowany projekt zakoduje i przeniesie na wybraną przez nas platformę CMS.

    Polecam Project: People jako ekspertów w obszarze projektowania UX stron internetowych.

     

    Konrad Uliński, Marketing and Product Development Director, SKK S.A.

    Case study to za mało?

    Chcesz poznać cały proces i dowiedzieć się, jak mógłby wyglądać w Twojej organizacji?

    Umów się na bezpłatną konsultację

    Zespół projektowy, czyli kto za co odpowiadał

    Autor Case Study

    Tomasz Osowski Lean UX & Service Designer w Project: People
    Pomaga firmom stworzyć doskonałe doświadczenie użytkownika zapewniając jednocześnie odpowiednią rentowność biznesu. Jego zdanie to stworzyć produkt i usługi, które są potrzebne i przynoszą satysfakcję zarówno odbiorcom jak i właścicielom biznesu.Certyfikowany Trener Biznesu i rozwoju osobistego, Certyfikowany moderator Design Thinking. Przedsiębiorca od 6 lat szczerze zakochany w metodologii Lean. Zawsze stara się dostarczyć produkt jak najszybciej na rynek przy najmniejszym udziale kapitałowym.Współpracował z firmami: T-mobile, Ecard, inPost, ING, Nationale Nederlanden, Brainly, Publicis, Netguru. Organizator DesignWays Conf.