Projekt strony dla wypożyczalni pojazdów online, czyli nowa platforma w 4 tygodnie

Bezpieczny wynajem pojazdów każdego typu za pomocą kilku kliknięć w internecie, na jednej platformie. Brzmi jak wyzwanie? Za nami 4-tygodniowy projekt strony dla wypożyczalni pojazdów, przeznaczonej dla szerokiej gamy odbiorców. Jak połączyć różne potrzeby użytkowników i opisy różnorodnych pojazdów w spójny sposób? O tym, jak w krótkim czasie zwalidowaliśmy podstawowe założenia rozwiązania i przygotowaliśmy projekt UX i UI najważniejszych podstron w platformie, dowiecie się z naszego case study ze współpracy z klientem z tej branży.

Kontekst projektu

W lipcu 2020 roku mieliśmy przyjemność pracować nad projektem strony dla wypożyczalni pojazdów online. W przeciwieństwie do konkurencji rozwiązanie nie jest skierowane w kierunku wynajmu samochodów lub motocykli, lecz gromadzi całą gamę różnorodnych pojazdów z całej Polski w jednym miejscu dając do nich dostęp poprzez szybką rezerwację internetową.

Proces pracy podzieliliśmy na cztery sprinty – pierwsze dwa obejmowały badania oraz analizę założeń rozwiązania, podczas gdy 3. i 4. pozwolił na stworzenie projektu oraz szaty graficznej wybranych ekranów.

Sprinty 1: Poznajemy projekt i jego rynek

Warsztat startowy

Swoje prace rozpoczeliśmy klasycznie od Warsztatu Kick-off, poprzedzonego zapoznaniem się z materiałami przesłanymi przez jednego z współzałożycieli platformy. Dzięki odpowiedniemu podegregowaniu przez nich informacji, otrzymaliśmy wizję produktu zmapowaną zgodnie z zasadą Lean Canvas i Value Proposition Canvas jeszcze przed rozpoczęciem spotkania. Zabieg ten, pozornie prosty, pozwolił nam o wiele lepiej zrozumieć cel założycieli od samego początku projektu.

Podczas warsztatu oprócz zespołu Project: People i głównych interesariuszy, udział w warsztacie wzięli również członkowie zespołu developerskiego, odpowiadający w projekcie za powstanie “proof of concept” (działanie mające na celu sprawdzenie czy projekt działa zgodnie z naszymi założeniami na wybranym rynku) od strony technologicznej. Podczas każdych warsztatów kickoff, staramy się aby w spotkaniu brały udział wszystkie zespoły pracujące obecnie nad rozwiązaniem, nawet jeśli są zespołami zewnętrznymi – te kilka godzin wspólnej dyskusji o wizji projektu, celach poszczególnych zespołów i koncepcji biznesowej, pozwala nie tylko na przełamanie lodów pomiędzy (bardzo często) obcymi sobie ludźmi, ale przede wszystkim na wypracowanie wspólnego celu i zrozumienia, w którym kierunku już jako jeden zespół powinniśmy się poruszać.

Oprócz mapowania wizji konceptu przedyskutowaliśmy również wspólnie wszystkie obawy dotyczące przyszłości rozwiązania. Zróżnicowane doświadczenie i umiejętności pozwoliły na wyróżnienie hipotez i negatywnych założeń z większego zakresu, niż miałoby to miejsce w przypadku spotkania z samym klientem. Wyróżniliśmy zagrożenia biznesowe, technologiczne, użytkowe oraz badawcze, określając tym samym zakres prac koniecznych do wykonania w etapie badawczym.

Zawężanie grup docelowych

Projekt strony dla wypożyczalni pojazdów tak różnorodnych, niesie za sobą duże obawy związane ze zbyt szeroko określoną grupą docelową. W końcu użytkownicy potrzebujący wynająć skutery na kilkugodzinną wycieczkę w obcym mieście, będą mierzyli się z zupełnie innymi potrzebami i problemami niż pasjonaci aut sportowych, szukający adrenaliny w jeździe na torze wyścigowym. Koniecznym więc było wprowadzenie zawężenia oraz priorytetyzacji grup docelowych na różnych poziomach.

W pierwszej kolejności, zgodnie z wizją klienta oraz analizą konkurencji i ogólnodostępnych opinii użytkowników, zmapowane zostały poszczególne cele wynajmu konkretnych grup docelowych. Umożliwiły one podział użytkowników i przypisanie im konkretnych zakresów problemów, potrzeb oraz użytkowanych pojazdów. Spośród wszystkich grup, najbardziej wyróżniające okazały się trzy z nich:

• osoby wynajmujące auta sportowe, często niszowe, 
• osoby wynajmujące pojazdy na wakacjach,
• osoby wynajmujące auta w celach biznesowych.

Każda z tych grup została przedstawiona za pomocą metody Customer – Problem – Solution, która ułatwia porównywanie konceptów, dzięki konieczności uproszczenia każdego opisu do pojedynczego zdania. Forma ta sprawdza się przy bardzo rozbudowanych konceptach i pomysłach – konieczność zawarcia opisu w jednym zdaniu wymaga znalezienia głównego clue grupy docelowej, wyróżniając tym samym najważniejsze cechy/ problemy. Do każdej z grup zostało również przypisane ryzyko, związane z jej wyborem.

Jako drugie zawężenie wybrana została priorytetyzacja za pomocą rodzajów pojazdów – na podstawie danych rynkowych oraz bezpośrednich informacji od wypożyczalni, z którymi miała zostać zawarta współpraca, udało się wybrać 6 rodzajów pojazdów, będących pierwszymi z zarejestrowanych na platformie.

Analiza rynku i grup docelowych

Kluczowym czynnikiem wspomagającym cały proces badawczy była analiza rozwiązań konkurencyjnych, zarówno bezpośrednich, jak i tych o mniej zbliżonym koncepcie. Działania z nią związane rozpoczęły się praktycznie już pierwszego dnia prac (wraz z eksploracją temat) i były kontynuowane w różnej postaci do końca drugiego sprintu. W pierwszej kolejności został zastosowany arkusz Competition Canvas, wspomagający mapowanie i porównywanie gromadzonych informacji. Ze względu na duży nacisk na doświadczenie użytkownika, analiza miała delikatnie inny charakter – celem było przeanalizowanie rozwiązań z perspektywy osoby poszukującej pojazdu do wynajmu, co wykluczało m.in. szczegółową analizę większości podstron, które są zazwyczaj pomijane w procesie wynajmu. Działania te zostały rozwinięte w drugim sprincie o stworzenie mapy usług rozwiązań konkurencyjnych.

Sprint 2: User flow i makietowanie rozwiązania

Mapy usług

Mapy usług są prostymi wykresami gdzie można znaleźć zmapowane ścieżki użytkowników w wybranej usłudze. W przeciwieństwie do wireflow i architektury informacji, mapy usług mogą przyjmować różną formę graficzną oraz poziom szczegółowości – ale nawet proste mapy w postaci połączonych ze sobą ogólnych haseł i opisów są już ogromną bazą wiedzy i pozwalają na całościowe spojrzenie na serwis. Na początku drugiego sprintu, wraz z działaniami związanymi z analizą konkurencji, przygotowane zostały mapy usług kilku dostępnych już na rynku rozwiązań związanych z wynajmem samochodowym. Porównanie takich map pozwoliło na wyróżnienie najważniejszych trzonów usługi, zauważenie błędów projektowych popełnianych przez konkurencję oraz stworzenie prostej i przejrzystej użytkowo mapy dla opracowywanej platformy. 

W przypadku projektów, gdzie następuje wyszukiwanie możliwe z kilku podstron, bardzo łatwo jest stworzyć rozwiązanie posiadające zbyt wiele niezachodzących na siebie ścieżek wyszukiwania. Rozwiązanie traci przez to przejrzystość w zakresie user flow i staje się coraz mniej intuicyjne. Stworzenie mapy rozwiązania oraz wireflow przed przystąpieniem do prac związanych z makietowaniem pozwala na upewnienie się, że wyróżnione ścieżki użytkownika są przejrzyste i łączą się wszystkie w spójną całość

Warsztat dopełniający i makietowanie

Zebranie informacji o rozwiązaniu, konkurencji i użytkownikach to jedno – połączenie ich w konkretne wytyczne projektowe to drugie. W związku z krótkim okresem badań postanowiliśmy przenieść prace nad mapowaniem informacji na konkretnych podstronach, na formę wspólnych warsztatów z makietowania. 

Celem było wykonanie bardzo prostych makiet z przygotowanych elementów lub co najmniej mapowania informacji w formie tekstu o zawartości konkretnych podstron. Poświęcenie wspólnie 4 godzin na dyskusję, ustawianie informacji i budowanie wspólnego stanowiska w oparciu o wizję i badania pozwoliło na zaoszczędzenie ogromu czasu, który w klasycznej sytuacji byłby poświęcony na komunikację między zespołową. Zwłaszcza w przypadku projektu strony dla wypożyczalni pojazdów tak różnorodnych pod kątem potrzebnych do przedstawienia informacji, działanie to okazało się strzałem w dziesiątkę, jeśli chodzi o ustalenie wspólnej wizji zawartości podstron. W związku z bardzo dużą zgodnością uczestników warsztatu, zebrane informacje zostały zapisane za pomocą wirtualnych karteczek i dopasowane do konkretnych podstron z wybranego flow użytkownika.

Posiadając zgodną wizję w odniesieniu do zawartości każdej strony oraz szczegółowe informacje o potrzebnych funkcjonalnościach i elementach, przystąpiliśmy jeszcze tego samego dnia do przygotowania makiet. W związku z dużą ilością omówionych i opracowanych już rozwiązań UX-owych, przystąpiliśmy od razu do prac na makietach które od samego początku pomogły zobrazować potencjalny kierunek projektu graficznego. Pracując nad ekranami bieżąco udostępniliśmy je do wglądu zarówno klientowi, jak i zespołowi developerskiemu, aby jak najszybciej otrzymywać informacje zwrotne dotyczące projektu UX. W przypadku niektórych ekranów przygotowane zostały również różne wersje widoków, które omawialiśmy z klientem przed wybraniem ostatecznej wersji.

Sprint 3 i 4: Projekt UX i UI aplikacji

W związku z bardzo szybkimi działaniami, pierwsze kompletne makiety zostały przygotowane zaledwie w przeciągu dwóch dni. Przed rozpoczęciem prac związanych z projektem UI, na początku kolejnego sprintu wykonane zostały tak zwane Dry Tests z innymi członkami zespołu. Testy polegały na krótkich wywiadach i obserwacjach, jak nasi współpracownicy – jako potencjalni klienci – rozumieją poszczególne ekrany i znajdujące się na nich informacje. Pomimo szybkiego tempa, przeprowadzenie takich krótkich wewnętrznych testów pozwala nam na poznanie i wyeliminowanie potencjalnych problemów użytkowych.

Przed przystąpieniem do projektu UI, przedstawione zostały propozycje stylów graficznych za pomocą moodboardu, opartego o analizę konkurencji, trendów oraz innych, inspirujących rozwiązań. Wykorzystanie zbioru inspiracji przed przystąpieniem do projektowania interfejsu graficznego, pozwala na szybkie zwalidowanie założeń wizualnych i wybranie jednego kierunku już na samym początku prac. Dzięki ciągłej weryfikacji zgodności co do kierunku prac, mogliśmy bardzo szybko przystąpić do przygotowania końcowej wersji UI i przekazać ją do dalszych prac zespołowi developerskiemu.

Podsumowanie pracy w liczbach

Narzędzia wykorzystane w projekcie

• Competition Canvas
• Warsztaty Kick 
• Lean Canvas
• Team Canvas
• Proto-persony
• Mapy usług
• Warsztat z wspólnego makietowania