Typ: Projekt komercyjny
Czas trwania: 10.10.2022 - 04.11.2022
Moja rola: UX/UI oraz implementacja strony www
Przeprowadzone prace UX/UI:
Stronę rzutnawschod.pl opracowałem w ramach współorganizacji Lubelskiego Festiwalu Gier Fabularnych “Rzut na Wschód”. Jest to coroczne, współfinansowane przez miasto Lublin wydarzenie dedykowane osobom zainteresowanym grami fabularnymi. Kiedy dołączyłem do pracy przy festiwalu jako osoba odpowiedzialna za program wydarzenia, zauważyłem, że jedną z pierwszych rzeczy jakie moglibyśmy poprawić jest jego strona internetowa.
Pierwsza wersja rzutnawschod.pl nie była tworzona przez profesjonalistę, dlatego posiadała kilka obiektywnie złych rozwiązań dla UX:
Dwa ostatnie problemy były szczególnie uciążliwe dla osób, które nie korzystały z wersji komputerowej. Kiedy sprawdziłem statystyki, okazało się, że ponad połowa wyświetleń pochodziła z urządzeń mobilnych. Przerobienie strony na całkowicie responsywną poprawiłoby komfort większości użytkowników, co przełożyłoby się na zwiększoną retencję użytkowników, co zaowocowałoby większą ilością uczestników na wydarzeniu.
Wydarzenie było darmowe, dlatego naszym celem strony nie była sprzedaż biletów, a zachęcenie potencjalnych uczestników do przybycia. Na podstawie przeprowadzonych wywiadów z 7 osobami uczestniczącymi w tego typu wydarzeniach, ustaliłem jakich informacji przede wszystkim oczekują. Osoby, z którymi rozmawiałem były zróżnicowane, część z nich dopiero wchodziła w ten typ rozrywki, inne były stałymi bywalcami na podobnych wydarzeniach. Kiedy przeanalizowałem ich wypowiedzi wyszło mi, że nowy projekt strony powinien zapewnić przystępne odpowiedzi na pytania:
Do audytu wybrałem 3 strony innych wydarzeń związanych z szeroko pojętą fantastyką:
Obecnie największe wydarzenie tego typu odbywające się w Lublinie.
Tło Starfestu wygląda jakby miało mieć przejście pomiędzy sekcjami, co sprawia wrażenie niedopracowania. Grafika w hero section ma w sobie tekst jako jej część, a tekst obok CTA ma słaby kontrast, który utrudnia czytanie. Zastosowany navbar jest niewygodny, listy wysuwają się dopiero po kliknięciu, a nie po najechaniu. Co gorsze, ten system nie jest konsekwentny, gdyż dzieje się tak w przypadku każdego linku, oprócz jednego, który po prostu przenosi do podstrony. Dodatkowo, sekcje są nieprawidłowo wyśrodkowane, co jest szczególnie zauważalne w wersji mobilnej.
Nowe wydarzenie w Lublinie, lecz posiadające spore zaplecze finansowe.
Głównym problemem ich strony jest brak koherencji. Przyciski są różne i często ciężko ocenić czy to przycisk, czy tylko ozdobnik, co jest bardzo irytujące w wersji mobilnej. Elementem powodującym negatywny UX jest też hamburger menu w wersji desktopowej. A jego zawartość? Tam możemy znaleźć dwa zbliżone do siebie linki: "Info" oraz "o FanCon". Czym się od siebie różnią? To już musi odkryć sam użytkownik - odnośnik "O FanCon" przenosi go do podstrony, która już nazywa się inaczej - "Nasza Historia" i wygląda na wersję roboczą, bo nie przekazuje żadnej istotnej informacji.
Znany, duży konwent odbywający się w Krakowie w tym samym czasie co Rzut.
Strona wita nas źle wykadrowaną grafiką, która ucina większość obrazka niż go pokazuje, a także ledwo czytelnym tekstem. Strona główna nie posiada odnośnika do sekcji z kontaktem, a na dodatek zmusza uczestnika do przeklikania kilku "Czytaj więcej" aby zebrać najważniejsze informacje o konwencie.
Niechlubnym elementem łączącym strony tych wydarzeń jest brak programu wydarzenia, który da się wygodnie przeglądać na urządzeniu mobilnym. Korzystając z telefonu trzeba się namęczyć z przesuwaniem tabeli programowej przygotowanej w pdfie lub google sheets.
Chciałem, aby Rzut na Wschód był pozbawiony niedogodności jakie napotkałem na stronach konkurencji. Najbardziej zależało mi na tym, aby była przejrzysta:
Stronę podzieliłem na sekcje, aby ułatwić użytkownikom skanowanie w poszukiwaniu informacji. Podczas wczesnych testów na prototypie, zauważyłem, że użytkownicy po przeczytaniu informacji o atrakcjach, wracają na górę strony do miejsca z datą i miejscem, dlatego na podstawie tej obserwacji postanowiłem dodać dodatkową sekcję - Czas i miejsce.
Zadaniem tej sekcji jest podsumowanie niezbędnych informacji aby trafić do miejsca gdzie będzie odbywał się festiwal. Dla wygody dodałem też mapę pokazującą okolice miejsca wydarzenia.
Duże znaczenie miało przyciągnięcie twórców programu, którzy chcieliby mieć swój wkład w tworzenie festiwalu. Dlatego zaoferowałem im kilka sposobów kontaktu, aby ułatwić im zgłaszanie się do współtworzenia programu.
Sekcja z programem jest jedną z najważniejszych dla uczestnika. Wywiady powiedziały mi, że uczestnicy bardzo często korzystają zarówno z komputera jak i telefonu. Lubią wygodnie, na dużym ekranie przejrzeć wszystkie atrakcje jakie wydarzenie ma do zaoferowania przed wydarzeniem, a podczas samego wydarzenia jedynie wspierać się telefonem ze “ściągawką”. Stanąłem przed poważnym wyzwaniem - jak przedstawić program aby użytkownicy mogli korzystać z niego tak jak lubią?
Aby wspomóc użytkowników w tym zachowaniu, nawiązałem współpracę z aplikacją Konwencik dostępną na Androida i iOS. Dzięki temu uczestnicy mogli cieszyć się dodatkowymi funkcjami, których wprowadzenie na stronę byłoby budżetowo niemożliwe i pracochłonne. Zaś osoby korzystające z komputerów mogły skorzystać ze starannie przygotowanej rozpiski programu do pobrania.
Inne konwenty również coraz częściej korzystają z Konwencika, co jest dużym plusem dla uczestników - dzięki temu mają darmową aplikację, która gromadzi programy większości wydarzeń i jest stworzona właśnie do wygodnego ich przeglądania. Kolejnym plusem wykorzystania tej aplikacji jest dodatkowa promocja, ponieważ każdy użytkownik Konwencika mógł zobaczyć Rzut na Wschód w nadchodzących wydarzeniach.
Stronę stworzyłem za pomocą Oxygen Builder, a animację w głównej sekcji przygotowałem korzystając ze Spline. Był to mój pierwszy prawdziwy projekt w którym wykorzystałem te narzędzia. Po skończonej pracy zadbałem też o to, żeby uzyskać certyfikat SSL. Kiedy strona wyglądała dla mnie satysfakcjonująco, przeprowadziłem testy użyteczności. Wersję mobilną testowało 8 osób, a 5 komputerową. Testerzy należeli do grupy docelowej, każdy z nich został zapytany czy może znaleźć wszystkie informacje, których potrzebuje. Drugie pytanie dotyczyło ich opinii o samej stronie. Poniżej kilka cytatów:
“Mhm, jest wszystko. I fajnie że jest tu mapka”
“Podoba mi się ten motyw kolorystyczny”
“Dobrze, że można sobie ten program ściągnąć, bo w tym hotelu jest trochę słaby internet”
“Znacznie lepsza niż strona Starfestu”
Wyniki testów nie wskazywały na problemy w korzystaniu ze strony, a dodatkowe elementy które dodałem spotkały się z ciepłym przyjęciem. Strona była więc gotowa aby udostępnić ją publicznie.
Każdy przybyły uczestnik przy wejściu na wydarzenie odpowiadał na pytania z krótkiej ankiety pytającej o doświadczenie w tego typu rozrywce, skąd dowiedział się o nim dowiedział i etc. Kiedy przeanalizowałem jej wyniki okazało się, że pewna część osób nie była zaznajomiona z konceptem jak i terminem “LARP”. Jest to forma rozrywki, która jest bardzo trudna do zorganizowania na własną rękę. Jeśli zapoznalibyśmy z nią więcej potencjalnych uczestników, to prawdopodobnym rezultatem tego działania byłoby ich zwiększone zainteresowanie naszym wydarzeniem, jako że oferowaliśmy profesjonalnie wykonane LARPy w naszym programie. Podczas kolejnej edycji festiwalu z pewnością poświęcę miejsce na stronie głównej do wyjaśnienia tego konceptu zabawy lub zapewnię zachęcający odnośnik.
W trakcie festiwalu mogłem zauważyć, że uczestnicy z niej korzystają. Z pewnością jednym z największych atutów które do tego się przyczyniły, był krótki czas ładowania. Przez to, że Rzut odbywał się na minus pierwszym piętrze, był problem z prędkością internetu, przez co, po informacje o wydarzeniu i jego programie szybciej było udać się na rzutnawschod.pl niż szukać ich na naszym fanpage'u na facebooku.
Finalnie, wszystkie osoby odpowiadające za festiwal były zadowolone z tego jak sprawdziła się nowa strona internetowa. Po drobnych aktualizacjach będzie mogła służyć podczas organizacji tegorocznej edycji wydarzenia.
