Zmiana interfejsu rezerwacji biletów online oraz w kasach kina

OPINIA

ikonka

„Szkolenie Customer Journey pomogło nam zbudować świadomość tego, jak ważne w podejmowaniu decyzji w zespołach jest zidentyfikowanie trudności jakie napotyka klient i dobrych momentów związanych z procesem czy usługą. Zaletą szkolenia była możliwość stworzenia rzeczywistych ścieżek dla zaprojektowanych przez nas procesów."

Roksana Malesa-Danieluk
Tribe Omnichannel, BNP Paribas Polska

O kliencie

Multikino należy do korporacji VUE International. Sieć kin wielosalowych powstała jako joint venture pomiędzy UCI a grupą ITI w 1995 roku. Multikino pokazuje zarówno premiery filmowe, jak i koncerty światowych gwiazd, nocne maratony filmowe, transmisje najważniejszych wydarzeń sportowych, transmisje oper, baletu oraz retransmisje spektakli z brytyjskiego National Theatre.

▪️   Od 2017 r. Multikino jako jedyna sieć kinowa w Polsce poszerzyła ofertę o pokazy w technologii Virtual Reality. Multikino VR by Samsung działa w 5 obiektach.

▪️   W 2019 roku pod szyldem Multikino działały 33 kina w 27 miastach Polski z łączną liczbą 267 ekranów.

Aktualnie, firma jest w trakcie wprowadzania zmian digitalowych. Obecnie już ponad 50% ruchu na stronie www.multikino.pl odbywa się przy użyciu urządzeń mobilnych, które generują 30% całej sprzedaży oraz rezerwacji biletów online.

 

Kontekst wyzwania projektowego

Zakupu biletu na seans filmowy w Multikinie można dokonać na dwa sposoby – w kasie biletowej oraz poprzez stronę multikino.pl. Dla ułatwienia dokonania rezerwacji użytkownikom kupującym bilety w internecie, dokonano wizualnego rozróżnienia poszczególnych stref cenowych. Rezerwując miejsce online, użytkownik zobaczy grafikę przedstawiającą salę kinową z przypisanymi poszczególnym strefom kolorami miejsc.

Rezerwacja biletów w Multikinie – kolory stref cenowych

Wyjściowy (stan na I poł. 2022) układ kolorów wyglądał w następujący sposób:

▪️   Promo – strefa biletów w atrakcyjnej cenie: kolor zielony.

▪️   Standard – strefa biletów w standardowej cenie: kolor różowy.

▪️   VIP – strefa premium, miejsca z najlepszym widokiem: kolor granatowy.

▪️   Super VIP – strefa super premium, miejsca z najlepszym widokiem (tylko w niektórych kinach): kolor złoty.

 

Sala kinowa z trzema strefami cenowymi
stary system - 3 strefy.png

Sala kinowa z czterema strefami cenowymi
stary system pruszków - strefa supervip.png

Wyzwanie projektowe

Wraz z planami na wprowadzenie nowej strefy – Super Promo, gdzie klienci mogą zarezerwować bilety w bardzo atrakcyjnej cenie, pojawiło się pewne wyzwanie.

W kontekście przeprowadzanych zmian Multikino potrzebowało nadać kolor nowej strefie miejsc kinowych, aby zasilić obecny system rezerwacji miejsc online. Kompozycja kolorystyczna używana w interfejsach rezerwacji online różni się od tej w kasach, gdzie obowiązuje inny kod kolorystyczny.

Ekran w kasie kinowej
czarny ekran-kopia.png

Zestaw ikon dla ekranu kasy kinowej
unnamed-5.png

Dlatego Multikino wraz z wprowadzeniem nowej strefy oraz nowego koloru, chciało również ujednolicić interfejsy w kinowych punktach sprzedaży biletów oraz na stronie internetowej multikino.pl.

Wymagało to doprecyzowania dodatkowych oznaczeń i ikon dla następujących kategorii: miejsc wybranych przez rezerwującego, miejsc już zarezerwowanych, miejsc sprzedanych oraz miejsc niedostępnych.

Rola Fuzers w procesie

Rolą Fuzers było zaproponowanie zaktualizowanej palety kolorystycznej dla elementów procesu zakupu biletów z uwzględnieniem nowej strefy biletowej oraz wizualne uspójnienie interfejsu rezerwacji w Internecie i w kinowych punktach sprzedaży.

Podejmując wyzwanie, zdecydowaliśmy się na realizację następujących działań projektowych:

▪️   Analiza identyfikacji wizualnej marki Multikino.

▪️   Analiza aktualnych trendów kolorystycznych w kontekście wyzwania projektowego.

▪️   Analiza różnych wariantów rezerwacji.

▪️   Analiza interakcji w procesie rezerwacyjnym pod kątem kolorystyki i UI.

▪️   Zaproponowanie kilku wariantów kompozycji kolorystycznych.

▪️   Przetestowanie wybranych wariantów.

▪️   Stworzenie wizualizacji dla dwóch interfejsów: interfejs online oraz interfejsu rezerwacji miejsc w kasach biletowych.

 

1. Analiza identyfikacji wizualnej marki Multikino

Na początku przeanalizowaliśmy identyfikację wizualną marki Multikino, czego rezultatem było stworzenie moodboardu marki:
kolory brandowe.png

 

2. Analiza aktualnych trendów kolorystycznych w kontekście wyzwania projektowego.

Następnie w ramach poszukiwania inspiracji, wybraliśmy propozycję kompozycji kolorystycznej z kolorem roku Pantone, która była najbliższa wartościom marki Multikino i jej obecnej identyfikacji wizualnej.

Kolor roku 2022 Pantone: Very Peri
Pantone Connect Palette.png

Prezentacja wybranej kompozycji “Amusements”
Zrzut ekranu 2022-06-7 o 13.36.05.png
Zrzut ekranu 2022-06-7 o 13.35.12.png
źródło: https://www.pantone.com/color-of-the-year-2022-palette-exploration

 

3. Analiza interfejsu nowego systemu rezerwacji online w różnych układach sali

Kolejnym krokiem było sprawdzenie, jak obecny układ kolorystyczny wygląda w poszczególnych kinach na przykładzie odświeżonego UI procesu rezerwacji biletów w części kin w Polsce.

vista - super vip .png
Zrzut ekranu 2022-06-15 o 11.34.56.png

 

4. Analiza interakcji w procesie rezerwacyjnym pod online w różnych układach sal kątem kolorystyki i UI

Równocześnie sprawdziliśmy, jak poszczególne elementy interfejsu zmieniają się w trakcie i po interakcji z użytkownikiem. Celem tego działania było określenie spektrum odcieni i wersji jednego koloru, po to, aby uwzględnić je w późniejszym procesie projektowym.

analiza stanu obecnego - sample.png
boczny ekran.png

 

5. Projektowanie kompozycji kolorystycznych

Proces projektowy rozpoczęliśmy od stworzenia kilkunastu kompozycji kolorystycznych dla wariantów 4+1 (cztery obecne strefy cenowe plus nowa strefa). Następnie pogrupowaliśmy je według podobieństw kolorystycznych.

spektrum kolorów - nowe kompozycje-2.png

 

6. Wstępna selekcja kompozycji kolorystycznych

Następnie, do dalszego etapu wybraliśmy po jednej kompozycji z każdej grupy kolorystycznej:

wybrane wstępnie kompozycje.png

 

7. Dostępność pod lupę

Kolejnym krokiem było sprawdzenie każdej z pozostałych kompozycji pod kątem dostępności. Skorzystaliśmy z narzędzia internetowego Coolors, które pomogło nam zobaczyć kompozycję oczami osób z różnymi chorobami wzroku. Poniżej przykład:

Zrzut ekranu 2022-05-23 o 13.16.28 (2).png

Źródło: https://coolors.co

 

8. Selekcja kompozycji na podstawie użyteczności

Wybrane kompozycje osadziliśmy również w kontekście ich użycia, aby sprawdzić czy będą użyteczne.

Część z nich według nas nie sprawdziło się ze względu na nieodpowiedni kontrast lub zbytnie podobieństwo.

selekcja - check.png

selekcja 2 odrzut.png

 

9. Mock-upy dla wybranych kompozycji

Po przedstawieniu wyników naszych analiz klientowi, wspólnie wybraliśmy dwie z proponowanych kompozycji, dla których następnie stworzyliśmy mock-upy przedstawiające wykorzystanie nowego koloru w konfiguracji z pozostałymi kolorami stref.

Wariant 1

desktop - wersja wszystkie kolory + nowy ciemniejszy niebieski (Super Promo).png

 

Wariant 2

desktop - wersja wszytskie kolory + nowy jasny niebieski (Super Promo).png

 

Nowa paleta kolorystyczna interfejsu rezerwacji biletów

Ostateczny wybór padł na kolor niebieski #8093f1 (kod koloru szesnastkowego).

W modelu kolorów RGB #8093f1 składa się z 50,2% czerwieni, 57,65% zieleni i 94,51% niebieskiego.

W przestrzeni barw HSL #8093f1 ma odcień 230° (stopni), 80% nasycenie i 72% jasność.

Kolor ten ma przybliżoną długość fali 469,63 nm.

 

Nowa kompozycja kolorystyczna, w zależności od ilości stref w poszczególnych kinach, miała składać się z 4 kolorów (zielony, różowy, granatowy i niebieski) lub z 5 kolorów (różowy, zielony, granatowy, brązowy, niebieski).

kompozycja na czarnym tle (białe i czarne cyfry)- porównanie.png

Kompozycja 5 stref Multikina

Paski kompozycji kolorystycznych.png

Kompozycja 'Amusements’ Pantone



10. Projektowanie zmian w interfejsie w punktach sprzedaży

Po wybraniu kompozycji kolorystycznej przyszedł czas na przeniesienie jej dla interfejsu w kinowych punktach sprzedaży. Wspólnie z klientem musieliśmy podjąć decyzję, które z elementów pozostaną niezmienne, a które wymagają zmian. Dlatego zrobiliśmy krótkie badanie korytarzowe, które potwierdziło przypuszczenia, że niektóre z elementów potrzebują bardziej zrozumiałych oznaczeń i większych kontrastów.

Projektując odświeżony wygląd ikon, wprowadziliśmy niewielkie zmiany:

unnamed-5.png

tabela z nowymi ikonami.png

Zarówno Klient jak i my jesteśmy świadomi, że niektóre stałe elementy, takie jak kolor dotąd przypisany niektórym strefom biletowym nie sprawdza się w użyciu, natomiast byliśmy świadomi, że zmiany dotąd używanych kolorów stref nie są celem tego projektu.

11. Wybór koloru strefy dla odświeżonego systemu rezerwacji biletów

desktop - baza.png

desktop - wersja wszystkie kolory + nowy ciemniejszy niebieski (Super Promo).png

 

Proces rezerwacji z uwzględnieniem 5 stref cenowych jest wdrożony w większości obiektów Multikina w Polsce.

Chcesz poprawić doświadczenie i wskaźniki w obszarze obsługi klienta? Zobacz jakie problemy, w tym zakresie, możemy pomóc Ci rozwiązać.

 

Sprawdź ofertę


    NEWSLETTER

    Zapisz się do
    naszego newslettera.