
- KLIENT:
- SkinApe
- BRANŻA:
- Rozrywka / GameTech
Migracja z mobile do web bez utraty użytkowników ani logiki biznesowej
Podsumowanie projektu
PROJEKT LIVE- KLIENT
- SkinApe
- BRANŻA
- Rozrywka / GameTech
- PRODUKTY
- Strona internetowa, Aplikacja mobilna
- ZESPÓŁ
- Front-end Developer
- Tester
Rezultaty
Dostęp z każdej przeglądarki
bez instalacji i bez pośrednictwa sklepów mobilnych
Ciągłość kont użytkowników
te same konta, monety i postępy na mobile i w webie
Backend nietknięty
pełna kompatybilność z istniejącym Firebase
Architektura gotowa na rozwój
reużywalne komponenty i modułowe landingi
WYZWANIE
W ramach realizacji zaplanowaliśmy wdrożenie:
- responsywnej aplikacji webowej odwzorowującej kluczowe funkcjonalności wersji mobilnej,
- w pełni zintegrowanej z istniejącym backendem w Firebase,
- zoptymalizowanej pod urządzenia desktopowe i mobilne,
- niezależnej od ograniczeń dystrybucyjnych Google Play i App Store,
Największym wyzwaniem projektu była pełna migracja rozwiązania mobilnego na web, bez utraty spójności działania i przy zachowaniu integracji z istniejącym backendem.
ROZWIĄZANIE
Aplikacja została zaprojektowana jako (SPA) w oparciu o:
- Frontend: Next.js (SPA + SSR dla szybkiego startu i SEO), React, Tailwind CSS (mobile-first).
- Backend: istniejący Firebase (bez zmian w rdzeniu backendu), zapewniający pełną kompatybilność z aplikacją mobilną.
- Firebase Authentication: Google, Facebook, Apple, Email (Magic Link), logowanie anonimowe.
- Systemy zewnętrzne
- Ghost CMS (istniejący blog) - źródło artykułów blogowych, kategorii, tagów, featured content.
- Zendesk - obsługa wsparcia (Get Help).
- Partnerzy offerwall i dostawcy zadań.

KLUCZOWE FUNKCJONALNOŚCI
W ramach realizacji dla SkinApe zaprojektowaliśmy i wdrożyliśmy spójny ekosystem kluczowych elementów produktu: skalowalne landingi oparte na reużywalnych komponentach (z mocnym hero, czytelnym CTA, sekcjami budującymi zaufanie, szybkim przejściem do pobrania aplikacji oraz klarownym opisem ścieżki użytkownika), a także aplikację z uproszczonym onboardingiem i wieloma metodami logowania. W samym produkcie zbudowaliśmy centralny ekran sterujący komunikacją i ofertami, moduł „Earn” do zdobywania monet przez zadania i partnerów z widocznymi postępami, sklep do wymiany monet na nagrody (z wyszukiwaniem, filtrami, dynamiczną prezentacją dostępności i wsparciem dla kontekstu regionalnego), obsługę kodów promocyjnych i referralowych oraz system poleceń z udostępnianiem i statystykami.
Uzupełnieniem całości jest profil użytkownika z integracjami pod wypłaty i kanały społecznościowe, historią aktywności i statusami, a także blog oparty o Ghost CMS - wszystko zaprojektowane tak, by zwiększać konwersję, utrzymywać spójność UX i umożliwiać dalszą rozbudowę bez przebudowy fundamentów.

REZULTATY
- Otwarcie platformy na nowych użytkowników - brak konieczności instalacji aplikacji mobilnej, dostęp bezpośrednio przez przeglądarkę.
- Nowoczesna, modułowa architektura oparta o Next.js i Tailwind, ułatwiająca rozwój i iterację.
- Pełna kompatybilność z istniejącym Firebase backendem - bez konieczności przepisywania logiki serwerowej.
- Responsywna, spójna platforma - użytkownik może płynnie przechodzić między mobile a web, zachowując swoje konto i stan.
- Edukacyjny onboarding i blog pomagają lepiej zrozumieć produkt i zwiększają zaangażowanie.
- Zoptymalizowane interfejsy i popupy wpływają na wyższą konwersję.

PODSUMOWANIE
SkinApe Web to kompleksowa migracja produktu z Unity do przeglądarki, zbudowana w Next.js i zintegrowana z ekosystemem Firebase (Auth, Realtime Database, Functions, Remote Config). Projekt przenosi kluczowe funkcjonalności aplikacji mobilnej na web, zachowując spójność UX oraz logiki biznesowej: od logowania i onboardingu, przez zarabianie monet i wymianę nagród, po profil użytkownika, system poleceń i zintegrowane wsparcie Zendesk.
Efektem jest nowoczesna, responsywna platforma webowa, która zwiększa dostępność produktu i elastyczność rozwoju, jednocześnie pozwalając ominąć ograniczenia dystrybucji w sklepach mobilnych.

Wykorzystane technologie
- Frontend
Next.js w modelu SPA + SSR dla szybkiego startu i SEO, Tailwind CSS w podejściu mobile-first.
- Backend
Istniejący backend bez zmian w rdzeniu, zapewniający pełną kompatybilność z aplikacją mobilną.
- Systemy zewnętrzne
Istniejący blog jako źródło artykułów, kategorii, tagów i featured content.


