Play That Song! mobile board-game companion

Play That Song! — mobilny pomocnik do muzycznej gry planszowej

Salerow opracował aplikację mobilną Play That Song! — muzycznego quizu przy wspólnym stole. Aplikacja łączy fizyczne karty QR z muzyką i zapewnia szybki dostęp do zasad.

Cel projektu

Pomóc prowadzącemu przejść od karty do muzyki na kolejną rundę dzięki prostemu ekranowi startowemu, skanowaniu QR i dostępnym zasadom.

Aplikacja mobilna

Wspólna baza kodu React Native i Expo jest przeznaczona dla Androida i iOS. Gracze wybierają kraj i język angielski lub niemiecki, czytają zasady, losują numer karty i otwierają skaner. Kod zawiera odrębne ścieżki muzyczne: linki Spotify na Androidzie i wbudowany odtwarzacz audio z danymi SoundCloud na iOS. Istniejące API dostarcza powiązania kart i dane utworów. Zakres pracy Salerow w tym projekcie to aplikacja mobilna.

playthatsong.de

Ekrany aplikacji

Prawdziwe ekrany lokalnej wersji demonstracyjnej na Androidzie: rozpoczęcie gry, zasady, losowa karta i ustawienia.

Start — rozpocznij grę, wylosuj kartę lub przeczytaj zasady
Start — rozpocznij grę, wylosuj kartę lub przeczytaj zasady
Zasady — instrukcje dla prowadzącego i drużyn
Zasady — instrukcje dla prowadzącego i drużyn
Losowa karta — numer zwrócony przez lokalne API
Losowa karta — numer zwrócony przez lokalne API
Ustawienia — język, kraj i opcje muzyczne
Ustawienia — język, kraj i opcje muzyczne

Ekrany przedstawiają izolowane demo Androida z nową lokalną bazą i fikcyjnymi powiązaniami kart. Losowy numer pochodzi z lokalnego API. Analityka i zewnętrzne logowanie muzyczne są wyłączone. Rozpoznawanie fizycznych kart kamerą, odtwarzanie Spotify/SoundCloud i kompilacja iOS nie zostały zweryfikowane w tym demo.

Zalety

  • 🎵 Utrzymaj rytm gry — główny ekran grupuje najważniejsze działania prowadzącego.
  • 📷 Połącz karty z muzyką — skan QR otwiera ścieżkę muzyczną danej karty.
  • 🎲 Urozmaicaj rundę — pobierz losowy numer karty w aplikacji.
  • 📖 Sprawdź zasady przy stole — instrukcje są dostępne wewnątrz aplikacji.
  • 🌍 Wybierz znany język — dostępne są angielski, niemiecki i ustawienia kraju.

Technologie

Kod mobilny wykorzystuje React Native 0.73, React 18, Expo SDK 50, TypeScript i Expo Router. Expo Camera obsługuje skanowanie QR, a Expo AV wbudowany odtwarzacz. i18next zapewnia język angielski i niemiecki, a MMKV zapisuje preferencje. Żądania HTTP łączą aplikację z API. API i panel administracyjny to systemy pomocnicze; ten opis dotyczy aplikacji mobilnej.

React Native / React Expo TypeScript
Wróć do portfolio

Tworzenie aplikacji mobilnej do fizycznej gry muzycznej

Play That Song! łączy muzyczny quiz przy stole z mobilnym pomocnikiem. Salerow opracował aplikację wspierającą prowadzącego w korzystaniu z kart podczas wspólnej rundy.

Od stołu do telefonu

Ekran startowy łączy rozpoczęcie gry, losowanie karty i zasady. Skanowanie QR wiąże fizyczną kartę z cyfrową ścieżką muzyczną, a instrukcje można sprawdzić w trakcie gry.

Wspólny kod i muzyka zależna od platformy

React Native i Expo zapewniają wspólne ekrany i nawigację. Kod oddziela linki Spotify na Androidzie od wbudowanego odtwarzacza audio na iOS. Żądania HTTP pobierają dane kart i utworów z istniejącego API.

Preferencje i udokumentowane demo

Tłumaczenia angielskie i niemieckie, wybór kraju i lokalne ustawienia wspierają ponowne korzystanie. Opis rozróżnia zarejestrowane ekrany Androida od integracji wymagających sprawdzenia na fizycznych urządzeniach i kontach serwisów muzycznych.