Poradnik

Kod źródłowy gry logicznej HTML5: co zawiera i co sprawdzić

Poziomy, zagadka dnia, kod w TypeScripcie i hosting gotowej gry logicznej na przykładzie Frogdoku.

Ribi, żaba w zielonej czapce, stoi na liściu lilii wodnej obok siatki stawów, z jedną żabą w każdym rzędzie.

Darmowy kod gier HTML5 łatwo znaleźć. Trudniej o gotowe, przetestowane gry logiczne z prawdziwymi poziomami, zagadką dnia i udokumentowanym kodem źródłowym, a właśnie to ma na myśli większość kupujących, gdy szuka kodu gotowego do publikacji.

Frogdoku to łamigłówka logiczna z jedną zasadą: w każdym rzędzie, każdej kolumnie i każdym kolorowym stawie musi stać dokładnie jedna żaba, a żadne dwie żaby nie mogą się stykać. Ten poradnik pokazuje, co sprawdzić w dowolnym szablonie łamigłówki, na przykładzie tego wydania.

Najpierw liczba poziomów i tryby

Wydanie dla kupujących zawiera 180 zagadek kampanii w sześciu odcinkach strumienia, kalendarz zagadek dnia, tryby Bez końca i Relaks, trofea, cofanie i ponawianie ruchów oraz podpowiedzi. Garderoba Ribiego jest nagrodą za postępy.

Liczba poziomów znaczy więcej niż okładka. Szablon z 20 poziomami jest bliżej prototypu, a ten ze 180 bliżej gotowej gry. Warto zapytać sprzedawcę, jak powstały poziomy i jak sprawdzono każdy z nich, bo zagadka, której nie da się rozwiązać, najszybciej zniechęca gracza.

Co zawiera kod źródłowy

Kod źródłowy jest napisany w TypeScripcie i dostarczany z testami oraz informacjami o licencjach zewnętrznych komponentów. Pakiet wymienia też pliki JSON, a folder gry to gotowa do hostingu wersja z lokalną grafiką, dźwiękiem i fontami.

  • game/: gotowa do hostingu wersja, z grafiką, dźwiękiem i fontami już lokalnie.
  • Kod źródłowy w TypeScripcie i jego testy: część, którą się czyta i edytuje.
  • Vite: opcjonalnie, potrzebny tylko przy ponownym budowaniu z TypeScriptu.

15-minutowa kontrola przed zakupem

Szablon łamigłówki można ocenić w krótkiej sesji. Warto zagrać pierwszy odcinek na telefonie, a potem na laptopie, i zanotować, gdzie dotknięcie lub przeciągnięcie wydaje się wolne albo niejasne. Następnie kilka razy cofnąć ostatni ruch i sprawdzić, czy plansza za każdym razem wraca do poprzedniego stanu.

Potem należy otworzyć kod źródłowy i przeczytać nazwy testów. Szukamy testów nazwanych tak jak zasady łamigłówki. Zasada, która ma test, jest pilnowana w kodzie, a nie tylko pokazywana na ekranie.

Hosting: tylko pliki statyczne

Podobnie jak pozostałe szablony z tego poradnika, wydanie dla kupujących wymaga aktualnej przeglądarki z obsługą JavaScriptu i dźwięku oraz statycznego hostingu HTTP(S). Nie potrzebuje bazy danych ani konta u autora.

Wystarczy wgrać zawartość folderu game/ do katalogu, w którym ma działać łamigłówka. Ponowne budowanie jest potrzebne tylko po zmianie kodu źródłowego w TypeScripcie.

Zobacz stronę Frogdoku, zawartość pakietu i licencję

Czego nie obejmuje cena

Frogdoku nie ma zapisu w chmurze, rankingu online, zakupów za prawdziwe pieniądze ani SDK reklamowego, a zwykła rozgrywka nie wysyła zapytań do takich usług. Postępy są zapisywane w używanej przeglądarce.

Aplikacje natywne, hosting i prace na zamówienie nie są wliczone. Zagadka dnia jest częścią kalendarza i do gry nie potrzebuje rankingu online.

Najczęstsze pytania

Czy grę trzeba budować?

Nie. Wystarczy wgrać zawartość folderu game/ na hosting HTTP(S). Ponowne budowanie jest potrzebne tylko po edycji kodu w TypeScripcie.

Gdzie zapisują się postępy?

Lokalnie, w używanej przeglądarce.

Czy zagadka dnia wymaga rankingu online?

Nie. Zagadki dnia działają bez niego, a postępy są zapisywane w przeglądarce gracza.

Jaka licencja obowiązuje?

Obowiązują warunki Polar Games Marketplace wyświetlane przy płatności.

Gdzie szablon łamigłówki się sprawdza

Taka łamigłówka pasuje do serwisu edukacyjnego, do codziennej zagadki na blogu albo do studia, które chce dostosować gotową grę logiczną. Słabo pasuje do projektu, który wymaga rozgrywek rankingowych lub kont użytkowników, bo nie ma ich w tym wydaniu.