Zmiana interfejsu rezerwacji biletów online oraz w kasach kina

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.

czarny ekran-kopia.png

Ekran w kasie kinowej

unnamed-5.png

Zestaw ikon dla ekranu kasy kinowej

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.

Pantone Connect Palette.png

Kolor roku 2022 Pantone: Very Peri

Zrzut ekranu 2022-06-7 o 13.36.05.png
Zrzut ekranu 2022-06-7 o 13.35.12.png

Prezentacja wybranej kompozycji “Amusements”

Kolor roku 2022 Pantone: Very Peri

ź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

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

Widok wybranych kompozycji kolorystycznych w kasowych punktach sprzedaży biletów

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ść.

Ten kolor 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
amusement.png

9. 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.

10. 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ć.