
Case study · Gry przeglądarkowe · 2017
FunSwan: gra reklamowa puzzle na targi z produktami Invena - 3 poziomy, spadające elementy, tryb z hasłem ze stoiska, pomiar czasu i ranking graczy.

FunSwan to gra reklamowa typu puzzle, którą w 2017 roku zaprojektowaliśmy i wykonaliśmy na targi wyposażenia wnętrz. Jej bohaterami są nowości 2017 roku marki Invena: gracze układają grafiki reklamowe produktów i walczą o jak najlepszy czas, a gra przyciąga ludzi na stoisko i pomaga zbierać kontakty.
Przygotowaliśmy moduł do dwóch trybów. W grze wolnej gracz zaczyna od podania adresu e-mail i zaznaczenia zgody na otrzymywanie materiałów reklamowych - bez obu tych rzeczy gra nie wystartuje, a formularz podpowiada, czego brakuje. W trybie targowym zamiast adresu wpisuje się hasło, które odwiedzający dostają na stoisku. Oba tryby prowadzą do tej samej rozgrywki.
Gra ma trzy poziomy i na każdym gracz układa inny obrazek: najpierw deszczownicę Patras, potem baterię umywalkową Nyks, a na końcu umywalkę z baterią z serii Nyks. Rośnie też liczba elementów - z 4 (siatka 2 x 2) przez 9 (3 x 3) do 16 (4 x 4). Elementy nie leżą od początku obok planszy: pojawiają się pojedynczo i spadają z góry ekranu, a gracz musi chwycić element w locie i przeciągnąć go na właściwe miejsce na obrazku. Na każdym kolejnym poziomie elementy spadają szybciej. Przeciąganie działa myszą i palcem - obsługę dotyku zapewnia biblioteka jQuery UI Touch Punch.
Licznik pod planszą pokazuje czas z dokładnością do dziesiątej części sekundy. Po każdym poziomie gracz widzi swój wynik i decyduje, czy grać dalej, czy zacząć od nowa. Po trzecim poziomie czasy wszystkich etapów są sumowane, a skrypt PHP wstawia wynik do wspólnego rankingu zapisanego na serwerze. Gracz dowiaduje się, które miejsce zajmuje i o ile sekund musiałby się poprawić, żeby awansować o jedną pozycję; za najlepszy czas dostaje osobne gratulacje. Ekran wyniku zawiera też zaproszenie na stoisko marki na targach i okno strony Invena na Facebooku.
Projekt graficzny łączy szare tło z rozbryzgami wody z pomarańczowymi przyciskami i akcentami, a nad logo FunSwan z góry wychyla się łabędź. Na ekranie gry plansza z obrazkiem ma pod spodem licznik czasu, a w prawym górnym rogu widać grafikę deszczowni z logo marki na tle pomarańczowego pasa. Ten sam styl mają ekrany hasła, rejestracji i wyniku, dostępne także jako osobne makiety HTML.
Gra działa pod adresem funswan.coolpage.pl w trybie targowym (hasło: test). Wersja robocza nie zapisuje adresów e-mail graczy, a pliki z danymi gry są zablokowane przed dostępem z sieci.