←Back to Start
App Client

The Selfie Spot:Location-Based Social Game

Client
The Selfie Spot
Industry
Social Gaming
Timeline
6 Weeks
Status
Launched
The Selfie Spot App Interface

The Challenge

The Selfie Spot needed a complete iOS application that transforms city exploration into an addictive gamified experience. The vision was to combine location-based check-ins with video game mechanics, social sharing, and a two-sided marketplace connecting users and business locations.

Key Challenges:
✔Build native iOS app with camera, GPS tracking, and real-time location verification
✔Implement complete gamification system with XP, levels, badges, and dramatic celebrations
✔Create interactive map with 500+ verified locations across multiple cities
✔Design 3-column masonry feed for community photo sharing
✔Build business analytics dashboard with conversion tracking and ROI metrics
✔Integrate Apple Sign In, subscription system, and admin tools
✔Design bold Monopoly-inspired UI with custom camera filters
✔Deploy scalable backend with PostgreSQL, Cloudinary, and real-time analytics

Our Solution

We architected and delivered a complete production-grade system: native iOS app, RESTful backend API, PostgreSQL database, business analytics platform, admin panel, and high-converting marketing website.

Technical Implementation:
iOS App:
Built native SwiftUI app with 5-tab navigation, camera system, MapKit integration, and infinite scroll feeds
Backend API:
Node.js/Express REST API with JWT auth, Prisma ORM, and comprehensive endpoint coverage
Database:
PostgreSQL with optimized indexes for geographic queries and leaderboard rankings
Location Services:
Haversine distance calculations, 100m check-in radius enforcement, reverse geocoding
Gamification:
XP system, dynamic level calculations, flexible badge system with 6 requirement types
Camera System:
AVFoundation camera with timer, flash, grid overlay, and 3 branded AR filters
Photo Storage:
Cloudinary CDN with automatic thumbnail generation and image optimization
Analytics:
Business dashboard with conversion tracking, peak hours analysis, distance metrics, ROI calculations
Admin Tools:
Complete admin panel for spot/badge/business management and QR code generation
Landing Page:
Next.js marketing site with interactive map, real photo feed mockups, custom icons
Key Features Delivered:
✔GPS-verified check-ins (100m radius)
✔XP progression & leveling system
✔Epic level-up celebration animations
✔Badge collection system (6 types)
✔Real-time leaderboards
✔3-column masonry social feed
✔Professional camera with filters
✔Privacy controls (wall & leaderboard)
✔Business analytics dashboard
✔QR code generation system
✔Apple Sign In integration
✔Admin panel with moderation
✔Email verification system
✔Photo reporting/moderation
✔Infinite scroll pagination
✔Subscription management (StoreKit)

Technical Deep Dive

iOS Architecture

Built with SwiftUI and MVVM pattern for clean separation of concerns. The app uses a centralized APIService singleton for all network requests, StateObject for auth state management, and @EnvironmentObject for dependency injection across views.

→SwiftUI with NavigationStack for deep linking
→AVFoundation for professional camera controls
→MapKit for interactive spot discovery
→CoreLocation for real-time GPS tracking
→Async/await for clean asynchronous code
→UserDefaults for auth token persistence
→URLSession with custom date decoding

Backend Architecture

RESTful API built with Express and TypeScript, using Prisma ORM for type-safe database queries. The backend handles authentication, location verification, photo uploads, gamification logic, analytics, and business features.

→Express + TypeScript for type safety
→Prisma ORM with PostgreSQL database
→JWT authentication with bcrypt password hashing
→Cloudinary integration for photo CDN
→Nodemailer for verification emails
→Rate limiting and caching middleware
→Haversine formula for distance calculations
→Flexible badge system with JSON requirements

Gamification System

The XP and badge system creates addictive progression loops. Every check-in awards XP, calculates level automatically, and checks for badge unlocks across six criteria types. Level-up celebrations feature confetti animations, rotating rays, and dramatic badge reveals.

XP System
  • • 100 XP per check-in (default)
  • • Level = floor(XP / 1000) + 1
  • • Progress bar in header
  • • +500 XP bonus on level-up
Badge Types
  • • Total check-ins milestones
  • • Total XP thresholds
  • • Specific spots visited
  • • City/country exploration
  • • Featured spots collection

The Results

The Selfie Spot launched with a complete ecosystem: native iOS app, scalable backend, business tools, admin capabilities, and a high-converting landing page. The platform is production-ready with zero technical debt.

✔On-time delivery in 6 weeks
✔Complete iOS app with 5 core tabs and 20+ features
✔RESTful backend with 40+ API endpoints
✔PostgreSQL database with 15+ optimized tables
✔GPS-verified check-in system (100m radius enforcement)
✔Full gamification engine with XP, levels, and 6 badge types
✔Business analytics with conversion tracking and ROI metrics
✔Admin panel for spot/badge/business management
✔Professional camera with 3 branded filters
✔Social feed with masonry grid and infinite scroll
✔Apple Sign In and subscription integration
✔Marketing website with interactive map and real photo previews
✔Privacy controls and photo moderation system
✔QR code generation for physical marketing
✔Client owns 100% of code and infrastructure
500+
Verified Spots
50+
Cities Worldwide
40+
API Endpoints
15+
Database Tables
Client Impact

"Zera built our complete iOS app with GPS-verified check-ins, gamification, and social features in 6 weeks. The level-up celebrations are addictive, the map integration is flawless, and our beta users can't stop exploring. They nailed the Monopoly aesthetic we envisioned and delivered a production-ready platform that exceeds our initial vision."

J
Jordan Parker
Founder, The Selfie Spot

Technology Stack

Frontend

  • • SwiftUI (iOS)
  • • Next.js (Website)
  • • AVFoundation (Camera)
  • • MapKit (Maps)
  • • CoreLocation (GPS)

Backend

  • • Node.js + Express
  • • TypeScript
  • • Prisma ORM
  • • PostgreSQL
  • • JWT Authentication

Infrastructure

  • • Cloudinary (CDN)
  • • Nodemailer (Email)
  • • Heroku (Hosting)
  • • StoreKit (Subscriptions)
  • • Leaflet.js (Web Maps)

Ready to Build Your App?

From idea to App Store in weeks. Let's build your vision.