Game Hub Overview

Chapter transforms the university journey into an immersive game world where students explore, connect, and prepare for their future through interactive 3D environments. The game hub provides a “The Sims meets UK Education” experience that wraps all app features in an explorable, multiplayer world.

Game Vision

The game world serves as a new navigation layer on top of existing Chapter features. Instead of browsing static menus, students walk through interactive zones, tap buildings to access features, and see other students exploring alongside them in real-time. Key design principle: The game enhances navigation without replacing functionality. Every existing feature (course search, accommodation, careers, messaging) remains exactly as built - the game simply provides a more engaging way to access them.

Four Game Hubs

The game world adapts to each student’s journey stage, presenting different hubs based on their EnrollmentStatus:

1. Careers Hub (Prospects)

Career Exploration

Interactive buildings for each career sector (Healthcare, Engineering, Business, Arts, Tech)

University Fair

Virtual booths for every UK university with full detail views

Career Arcade

SpriteKit mini-games for career discovery and skills assessment

Course Discovery

Search kiosks and category buildings for course exploration

Purpose: Help prospects explore career paths, discover universities, and decide between uni and apprenticeships.

2. Offer Holder Hub (Deciding)

Five Islands

One island per UCAS choice from the student’s shortlist

Comparison Central

Interactive scale building for comparing offers

UCAS Tracker

Journey timeline building showing application progress

Q&A Café

Chat with current students about courses and universities

Purpose: Help offer holders compare their options, explore accommodation, and make their firm choice decision.

3. Firm Choice Hub (Preparing)

Campus Preview

Detailed map of the student’s firm choice university

Societies Fair

Interactive stalls for every society at their university

Preparation HQ

Checklist building for pre-arrival tasks

What's Next Office

Guidance building for settling in and next steps

Purpose: Help students prepare for university arrival, find flatmates, and complete essential pre-enrollment tasks.

4. Campus Life Hub (Enrolled)

Library & Lecture Halls

Study spaces with timetable integration and class resources

Student Union

Events board, society desks, and campus feed access

Your Room

Customizable personal space in student accommodation

Sports Centre

Team rooms and fixtures board for university sports

Purpose: Full university life simulation with study tracking, social spaces, and community features.

Technical Architecture

Hybrid SwiftUI + SpriteKit

The game uses a layered architecture that maintains SwiftUI’s navigation while adding a SpriteKit game layer:

ChapterApp (SwiftUI)
└── MasterTabView
    └── GameContainerView (SwiftUI) // Replaces tab content
        ├── SpriteView(scene: currentHubScene) // SpriteKit game layer
        ├── GameHUDView (SwiftUI overlay) // Mini-map, XP bar, chat
        └── FeatureOverlayView (SwiftUI) // Existing views as overlays

Scene Management

The GameManager singleton bridges SpriteKit scenes with SwiftUI:

Scene Switching: Automatically loads the appropriate hub scene based on EnrollmentStatus
Feature Overlays: When players tap buildings, existing SwiftUI views appear as overlays
State Persistence: Player position, progress, and customization saved to Supabase

Zone-Based Design (Phase 3)

Each hub is divided into multiple interconnected zones:

Compact Scenes: Small, focused areas instead of one massive world
2.5D Backgrounds: AI-generated artwork with depth and perspective
Zone Transitions: Smooth fades between zones via boundary arrows or exit areas
Independent Multiplayer: Each zone has its own Realtime Presence channel

Game Features

Real-Time Multiplayer

See other students exploring the same zones in real-time via Supabase Realtime Presence

Students can:

See avatars of other students walking around
Chat via proximity bubbles (messages appear above avatars)
Tap profiles to view student details, add friends, or send DMs
Privacy controls (public, friends-only, school-only, or solo mode)

Multiplayer uses Supabase Realtime Presence for ephemeral position sync (no database writes per frame), with channels scoped per zone for performance:

let channel = supabase.realtime.channel("hub:careers:zone:main_hub")
await channel.track(["user_id": userId, "x": x, "y": y, "avatar": config])

Avatar Customization

Students create Bitmoji-style avatars with:

Body: Skin tone selection
Hair: Multiple styles and colors
Face: Eye styles, face shapes
Outfit: Tops, bottoms, shoes (with university-branded merch for offer holders)
Accessories: Glasses, hats, items
Pets: Companion animals that follow the player

Avatars use AvatarRenderer to composite body parts into a single sprite with natural walk/run animations.

XP & Progression

Students earn XP by:

Exploring new buildings (+5 XP)
Completing features (+10 XP)
Finishing mini-games (variable XP)
Unlocking new zones (+20 XP)

Levels unlock cosmetic rewards and zone access via a quest system.

Quest System

Structured guidance through the game world:

struct Quest {
    let id: String
    let title: String
    let description: String
    let objectives: [QuestObjective]
    let reward: QuestReward
}

Quests guide students through key tasks (“Explore 3 career sectors”, “Compare your offers”, “Find your flat”) with visual markers on buildings.

Performance Optimizations

Terrain Rendering

Single pre-rendered texture for ground (grass, paths, water) - one draw call

Viewport Culling

Hides off-screen decoration nodes to reduce render load

Polygon Collision

Precise pathfinding around obstacles using visibility graph A*

Player Limiting

Max 30 visible players, sorted by proximity to local player

The game maintains 60 FPS on iPhone 12+ with 20+ concurrent players per zone. The game replaces ChapterHubView (the widget cards screen) while preserving all tabs:

Hub tab: Shows the game world
Search tab: Direct course/uni search (unchanged)
Feed tab: Campus feed (unchanged)
Calendar tab: Timetable for enrolled students (unchanged)
Connect tab: Messages and groups (unchanged)

Students who prefer quick access can still use tabs directly - the game is additive, not mandatory.

Building Interactions

Buildings in the game world map to existing AppDestination routes:

class InteractiveBuildingNode: SKSpriteNode {
    let buildingType: BuildingType
    let destination: AppDestination  // Uses existing routing!
    
    func onTap() {
        GameManager.shared.showFeature(destination)
    }
}

When tapped, buildings trigger the same views users access via widgets or tabs, maintaining consistency.

Database Schema

The game adds four tables to Supabase (existing tables unchanged):

player_progress

player_avatars

Stores avatar customization (skin tone, hair, outfit, accessories)

player_last_position

Fallback position for reconnection (Presence handles live positions)

minigame_scores

Leaderboards for Career Arcade and other mini-games

All tables use Row Level Security (RLS) policies matching existing Chapter patterns.

Platform Support

Minimum: iPhone 12, iOS 16+
Optimized for: Portrait and landscape (dynamic zoom-to-fit on rotation)
App bundle: < 100MB (SpriteKit is lightweight, AI sprites compressed)

The game uses native SpriteKit - no Unity, no external game engines, no UIKit

Success Metrics

After full implementation, students will:

Open Chapter and see a living game world instead of static widget cards
Tap-to-walk around zones, exploring buildings
Tap a building to access the same features they’d normally navigate to via menus
See other students walking around, chat in proximity, and build connections
Experience their entire education journey - from career discovery to campus life - as an immersive game

Every underlying feature (course search, accommodation, careers, messaging) remains exactly as built. The game is a navigation layer that makes Chapter feel like a world, not an app.

Get Started

Core Features

Social & Community

Tools & Planning

Game World

User Guide

​Game Vision

​Four Game Hubs

​1. Careers Hub (Prospects)

Career Exploration

University Fair

Career Arcade

Course Discovery

​2. Offer Holder Hub (Deciding)

Five Islands

Comparison Central

UCAS Tracker

Q&A Café

​3. Firm Choice Hub (Preparing)

Campus Preview

Societies Fair

Preparation HQ

What's Next Office

​4. Campus Life Hub (Enrolled)

Library & Lecture Halls

Student Union

Your Room

Sports Centre

​Technical Architecture

​Hybrid SwiftUI + SpriteKit

​Scene Management

​Zone-Based Design (Phase 3)

​Game Features

​Real-Time Multiplayer

​Avatar Customization

​XP & Progression

​Quest System

​Performance Optimizations

Terrain Rendering

Viewport Culling

Polygon Collision

Player Limiting

​Navigation Integration

​Building Interactions

​Database Schema

​Platform Support

​Success Metrics

Build docs developers (and LLMs) love

Game Vision

Four Game Hubs

1. Careers Hub (Prospects)

2. Offer Holder Hub (Deciding)

3. Firm Choice Hub (Preparing)

4. Campus Life Hub (Enrolled)

Technical Architecture

Hybrid SwiftUI + SpriteKit

Scene Management

Zone-Based Design (Phase 3)

Game Features

Real-Time Multiplayer

Avatar Customization

XP & Progression

Quest System

Performance Optimizations

Navigation Integration

Building Interactions

Database Schema

Platform Support

Success Metrics