Jednodotykowa gra zręcznościowa działająca w przeglądarce telefonu — bez instalacji, bez rejestracji, bez reklam. Cała aplikacja: fizyka, animacje, dźwięk i dwa języki interfejsu, mieści się w jednym pliku o wadze 22 KB. Zbudowaliśmy ją jako dowód, jak szybkie i lekkie potrafią być aplikacje webowe, gdy wydajność traktuje się serio.
Cztery parametry, które definiują ten projekt — i pokazują nasze podejście do wydajności aplikacji webowych.
Jeden plik — mniej niż pojedyncze zdjęcie na typowej stronie. Ładuje się natychmiast nawet na słabym łączu.
Logika, grafika, dźwięk i dwa języki w jednym pliku HTML. Zero zewnętrznych bibliotek i frameworków.
Autodetekcja języka telefonu + przełącznik w menu z zapamiętywaniem wyboru na urządzeniu.
Bez rejestracji, cookies analitycznych i zewnętrznych skryptów. Rekord zapisywany tylko lokalnie na urządzeniu.
Gra w przeglądarce musi konkurować z aplikacjami ze sklepów — bez ich budżetów i bez instalacji. Cztery ograniczenia, które przyjęliśmy świadomie.
Gra w przeglądarce konkuruje z aplikacjami instalowanymi ze sklepów. Jeśli nie uruchamia się natychmiast po otwarciu linku — gracz wychodzi. Budżet wagi ustaliliśmy bezkompromisowo: cała gra ma ważyć mniej niż jedno zdjęcie na typowej stronie internetowej.
Gra projektowana była od zera pod telefon trzymany pionowo jedną ręką: sterowanie wyłącznie dotknięciem ekranu, restart jednym tapnięciem, wibracje potwierdzające akcje, pełny ekran bez pasków przeglądarki. Zero instrukcji — zasady mają być zrozumiałe w pierwszych trzech sekundach.
Pliki dźwiękowe to zwykle setki kilobajtów — zburzyłyby cały budżet wagi. Dodatkowo przeglądarki blokują automatyczne odtwarzanie dźwięku. Efekty dźwiękowe trzeba było wygenerować programowo, w czasie rzeczywistym, zgodnie z polityką autoplay przeglądarek.
Gra miała być dostępna po polsku i angielsku — ale bez utrzymywania dwóch osobnych wersji strony i bez systemu tłumaczeń. Interfejs musi sam rozpoznać język telefonu gracza i dać możliwość zmiany jednym dotknięciem.
Cztery decyzje techniczne, dzięki którym gra działa płynnie na kilkuletnich telefonach i ładuje się szybciej, niż użytkownik zdąży mrugnąć.
Cała gra — fizyka spadających klocków, system cząsteczek, kamera podążająca za wieżą, kolory przesuwające się po spektrum wraz z wysokością — napisana w czystym JavaScript i rysowana na HTML5 Canvas. Brak frameworków oznacza brak balastu: 22 KB zamiast megabajtów, a animacje są synchronizowane z częstotliwością odświeżania ekranu telefonu.
Web Audio API generuje każdy dźwięk matematycznie w momencie zagrania — seria perfekcyjnych ułożeń wspina się po skali pentatonicznej, więc im dłuższa seria, tym wyższy ton nagrody. Silnik audio uruchamia się zgodnie z polityką przeglądarek dopiero po pierwszej interakcji gracza, a Vibration API dodaje wibracje przy każdej akcji.
Gra odczytuje język urządzenia i startuje po polsku lub angielsku, a przełącznik w menu zapamiętuje wybór gracza lokalnie na urządzeniu. Wszystkie teksty obu wersji mieszczą się w tym samym pliku — bez osobnych adresów, przekierowań i duplikowania kodu.
Gra działa na subdomenie gra.eloni.pl z automatycznym certyfikatem SSL, polityką Content-Security-Policy blokującą wykonanie jakiegokolwiek obcego kodu, HSTS i ochroną przed osadzaniem w ramkach. Brak backendu i bazy danych oznacza brak danych do wykradzenia — z serwera serwowany jest wyłącznie jeden statyczny plik.
Główne technologie wykorzystane w projekcie.
O grze WIEŻA i o tym, co ten projekt oznacza dla Twojej strony.
WIEŻA to nasz poligon technologiczny i żywy dowód kompetencji frontendowych. Te same techniki, które sprawiają, że gra działa płynnie na kilkuletnim telefonie — minimalna waga, zero zbędnych bibliotek, animacje synchronizowane z ekranem, natychmiastowe ładowanie — stosujemy w stronach i aplikacjach naszych klientów. Zamiast opowiadać o wydajności, wolimy dać ją poczuć: otwórz gra.eloni.pl na telefonie i zobacz, jak szybko się uruchamia.
Tak — gra jest całkowicie darmowa, bez rejestracji, bez reklam i bez zakupów. Działa bezpośrednio w przeglądarce pod adresem gra.eloni.pl, na telefonie i na komputerze. Na telefonie po dodaniu do ekranu głównego uruchamia się na pełnym ekranie jak zwykła aplikacja.
Cała gra — logika, grafika, animacje, dwa języki interfejsu — mieści się w jednym pliku o wadze 22 KB, czyli mniej niż pojedyncze zdjęcie na typowej stronie internetowej. Osiągnęliśmy to rezygnując z frameworków i bibliotek: czysty JavaScript, grafika rysowana na żywo na HTML5 Canvas, dźwięki generowane matematycznie zamiast plików audio. Dokładnie to samo podejście do wydajności — ładuj tylko to, co konieczne — stosujemy w projektach klientów, bo szybkość ładowania bezpośrednio wpływa na pozycje w Google i konwersję.
Zobacz usługę: Tworzenie stron internetowychGry nie są naszą usługą — WIEŻA to projekt własny. Natomiast interaktywne elementy na strony firmowe jak najbardziej: kalkulatory wycen, konfiguratory produktów, quizy doradcze czy animowane prezentacje oferty. To ta sama technologia, którą widać w grze, użyta do celów biznesowych — zatrzymania użytkownika na stronie i doprowadzenia go do kontaktu.
Zobacz wszystkie usługi eloni.plNie. Gra nie ma rejestracji, kont ani formularzy, nie używa cookies analitycznych i nie ładuje żadnych zewnętrznych skryptów śledzących. Rekord gracza zapisywany jest wyłącznie lokalnie na jego urządzeniu (localStorage) i nigdy nie opuszcza telefonu. Gra nie ma nawet backendu ani bazy danych — z serwera pobierany jest tylko jeden statyczny plik.
Na każdym urządzeniu z nowoczesną przeglądarką. Na telefonie: sterowanie jednym dotknięciem, wibracje przy akcjach, tryb pełnoekranowy po dodaniu do ekranu głównego. Na komputerze: sterowanie spacją lub kliknięciem. Interfejs automatycznie dopasowuje się do języka urządzenia — polski lub angielski — a wybór można zmienić przełącznikiem w menu.
Wersja przeglądarkowa jest fundamentem — działa od razu, bez instalacji, na każdym systemie. Publikację w Google Play rozważamy jako kolejny krok, jeśli gra zdobędzie stałych graczy. Technologia webowa pozwala opakować tę samą grę w aplikację sklepową bez przepisywania kodu.
Ta sama technologia w służbie Twojego biznesu
Strony firmowe i landing page z tym samym podejściem do wydajności, które widać w grze. Realizacja 7-14 dni.
Dowiedz się więcejNiestandardowe funkcje, kalkulatory, konfiguratory i połączenia między systemami — dokładnie pod Twój proces.
Dowiedz się więcejBezpłatna 15-minutowa konsultacja — sprawdzimy, ile Twoja obecna strona waży, jak szybko się ładuje i co można poprawić. Bez zobowiązań.