Splitty

Splitty is an Expo and React Native app targeting Android and iOS. It uses TypeScript and Expo Router, with a prepared environment contract for a future Supabase backend.

Included gameplay

• A deterministic 1,000-level campaign using real Quick, Draw! silhouettes
• Deterministic UTC daily challenges shared by every installation
• Real polygon-area measurement for each swipe and a 0–3 star scoring system
• Reanimated completion feedback, retry/next-level flow, and optional haptics
• A roadmap, monthly daily calendar, statistics, settings, help, and rules screens
• Local progress, settings, streak, and completion history via AsyncStorage

Campaign and daily shapes are selected from an offline catalogue covering all 345 categories in the Quick, Draw! Dataset using versioned seeds in src/lib/levels.ts. Only the closed polygon following each drawing’s outermost border is displayed and used for area measurement. The 1,000 campaign levels are assigned by a deterministic shuffle without replacement, so categories can recur but Quick, Draw! contribution IDs cannot. Rebuild the bundled catalogue with npm run quickdraw:build.

The Quick, Draw! source drawings are provided by Google under the Creative Commons Attribution 4.0 license. The generated catalogue retains each contribution’s original dataset key ID.

Requirements

• Node.js 22.13.x or Node.js 24.3 and newer
• npm
• A Splitty development build on a physical device, or Android Studio for an Android emulator
• macOS with Xcode for a local iOS Simulator; Windows users can test on a physical iPhone with Expo Go and create iOS binaries with EAS Build

Start developing

npm install
npm start

The default start command targets an Expo development client, which supports every native module used by Splitty. From the Expo terminal, press a for Android, i for iOS (macOS only), or scan the QR code with a previously installed development build. You can use Expo Go when its installed version supports this project’s SDK by running npm run start:go.

You can also use the platform scripts directly:

npm run android
npm run ios
npm run web

Project structure

src/
  app/             Expo Router screens and layouts
assets/            Icons, splash screens, and other static media
app.config.js      Shared Android, iOS, and Expo configuration
eas.json           Preview and production cloud-build profiles
.env.example       Future client-side environment variables

The native android/ and ios/ directories are intentionally not committed. Expo generates them from app.config.js when a native build needs them.

Checks

npm run typecheck
npm run lint
npm run doctor

Connect Supabase later

When the Supabase project exists:

1. Copy .env.example to .env and fill in the project URL and publishable key.

2. Install the Expo-compatible client dependencies:

   npx expo install @supabase/supabase-js react-native-url-polyfill expo-sqlite
   

3. Add src/lib/supabase.ts and initialize the client with persistent auth storage.
4. Enable Row Level Security on every client-accessible table before shipping.

Never put a Supabase secret key or legacy service_role key in an EXPO_PUBLIC_ variable. Values with that prefix are included in the client app and are visible to users.

Build for testers and stores

Install/login to EAS CLI, link this repository to an Expo project, then build either platform:

npx eas-cli@latest login
npx eas-cli@latest build:configure
npx eas-cli@latest build --platform android --profile development
npx eas-cli@latest build --platform ios --profile development
npx eas-cli@latest build --platform android --profile preview
npx eas-cli@latest build --platform ios --profile preview

Use the production profile when you are ready to produce store binaries. Before the first release, replace the placeholder com.sachakefif.splitty Android package and iOS bundle identifier in app.config.js if that identifier is not owned by your team, and replace the generated placeholder icon and splash assets with final Splitty artwork.