← Back to Portfolio

Game Design · UX Design · Product Development

The Game That Made Two Strangers Fall in Love

From Google Sheets prototype to full web application — designing social mechanics that created genuine human connection at scale.

I led visual direction, UX architecture, and game systems design for a week-long social game — from Google Sheets prototype to shipped mobile app. One of the most technically constrained and creatively freeing projects I've worked on.

Project Overview

A friend had a game concept and needed people to break it. What started as playtesting during COVID lockdown turned into a year-long product build — Google Sheets prototype to full Laravel web app.

The social mechanics worked better than anyone expected. Two players who'd never met fell in love through the game. They're now engaged.

Project Details

Role
Game Designer, UX Designer, Technical Contributor
Duration
~1 year from concept to web app launch
Team
Core group of friends, rotating cast of ~50 players
Tools
Google Sheets, Figma, Laravel, Tailwind CSS
Product Owner
John (friend with board game background)
Full Figma project overview showing the complete scope of screens, flows, and design decisions for Pecking Order

Full project scope in Figma — login through end-game, across two platform generations

The Gap Nobody Had Filled

We set out to solve a specific problem in the digital social gaming space. During the pandemic, people craved meaningful social interaction, but existing games fell into two extremes: shallow party games that lasted minutes, or complex MMORPGs requiring massive time investments.

The Gap: No games captured the strategic depth and genuine social dynamics that make Survivor compelling — the week-long relationship building, alliance formation, and strategic gameplay that creates authentic human connections.

Initial Constraints

  • Limited development resources (friends working in spare time)
  • Need for real-time social interaction and voting
  • Managing complex game economics and player progression
  • Week-long engagement without losing player interest

Research & Discovery

Understanding the Source Material

We analyzed what makes Survivor compelling: social voting dynamics, resource management, alliance formation, and the balance between strategic gameplay and social relationships.

Daily Challenge Integration

The game operated on a consistent daily rhythm:

  • Daily Challenge: Varied objectives like "be part of the biggest tribe" or "predict which player receives the most upvotes"
  • Voting Ballot: Core upvote/downvote mechanics that determined player rankings
  • Tribal Challenges: Periodic team-based competitions that could shift alliances and power dynamics

These elements created multiple strategic layers — players had to balance individual performance, social positioning, and team dynamics simultaneously.

How a Spreadsheet Became a Web App

Phase 1: Google Sheets Prototype

Why we started here: Google Sheets offered the perfect rapid prototyping environment — real-time collaboration, built-in data structure, and zero development overhead.

The "Probst" System: One player served as game master, managing the master spreadsheet while others accessed individual sheets with 4-digit password protection.

Phase 2: Web App Development

Why we made the transition: Google Sheets became increasingly fragile as we added complex logic. A single typo could break the entire game mid-session.

Technical Solution: Migrated to Laravel web application with proper error handling, data validation, and robust architecture.

Early web version of Pecking Order — pre-game lobby in the Laravel beta, light theme

Early Laravel web build — the pre-game lobby before the full mobile redesign. Players joined via shareable game code and could see the full round schedule.

Phase 3: Complete UX Redesign in Figma

From the Google Sheets prototype through the Laravel web app, I designed the entire user experience from scratch — including authentication, daily mechanics, live scoreboard, and social feed. The wireframe flow below maps every decision point in the app.

Complete UX wireframe flow for Pecking Order — from login through ballot submission, quiz, advantages, and top navigation

Complete UX flow — Login → Game List → Pregame Lobby → Dashboard → Ballot, Quiz, Challenge, and Advantage submission screens

  • Authentication & Onboarding: Login system and new player introduction
  • Daily Mechanics Interface: Streamlined voting, challenge participation, and action selection
  • Live Scoreboard: Real-time player rankings and status updates
  • Social Feed: Public activity stream for announcements and game events

Design Philosophy: We kept external communication in Discord while focusing the app on core game mechanics — clear separation between social strategy (Discord) and game actions (web app), reducing interface complexity while maintaining rich social dynamics.

Pecking Order onboarding screen — 'You should close this app now before you start destroying all of your friendships'

Onboarding — tone-setting copy that primes players for competitive social gameplay

Pecking Order game list screen showing current games and archive

Game list — current active game plus archive of past seasons

The Mechanics Behind the Magic

Game Economics Design

The currency system created rich strategic depth through multiple spending options. Every advantage had to feel meaningfully different — not just reskinned versions of the same action.

Advantages screen showing Blood Oath, Betrayal, Embargo, Wing Clipper, Immunity Idol, Grandstand, and other purchasable actions with token costs

Advantages screen — the full economic menu. Each action had distinct strategic value and a token cost balanced against weekly earning rates.

Offensive Actions

  • Vote Blocking: Prevent another player's vote from counting
  • Vote Amplification: Cast multiple votes in a single round
  • Public Shaming: Post callouts in the public feed to influence opinion

Information Warfare

  • Identity Spying: Reveal other players' hidden roles or allegiances
  • Intelligence Gathering: Access voting intentions or alliance information

Defensive Tools

  • Immunity Idol: Protection from elimination votes
  • Counter-Intelligence: Block spying attempts on your actions

Alliance Mechanics

  • Blood Oath: Secret binding alliance with mutual benefits and consequences
  • Embargo: Cut off another player's token earning for a round

The economy had to balance power (expensive actions felt impactful) with accessibility (everyone could participate meaningfully). Early versions suffered from runaway leaders until we implemented diminishing returns on consecutive actions.

Social Interaction Framework

Meaningful Connection Through Mutual Need: Rather than forcing social features, the game design created natural interdependencies. Players needed alliances to succeed in challenges, votes to avoid elimination, and strategic cooperation to maximize their position. The challenges provided a "cradle for mutual need" that allowed authentic relationship building to emerge organically.

The most powerful validation of the social design was that two strangers met through the game and are now engaged to be married — demonstrating that the game mechanics successfully created conditions for genuine human connection.

Pecking Order final app — Create Game, Game of Cones dashboard, and feed screens

Final mobile app — Create Game, live round dashboard, and the social feed showing active challenges and player activity

Pecking Order — Blood Oath prompt, ballot submission, quiz, scoreboard, and tribal challenge screens

Core mechanics in action — Blood Oath alliance prompt, ballot submission with upvote/downvote, quiz challenge, live scoreboard, and tribal selection

Results & Impact

~50
Total Players
Rotating cast across multiple game seasons
95%+
Completion Rate
Almost everyone finished their full week-long game
2
Players Engaged
Strangers who met through the game and are now engaged to be married
Still Live
Conference Tool
Adapted and still running today as a professional engagement tool

Memorable Game Moments

  • The "HugeInfoDumps" Incident: Players created fake accounts specifically to blast information and create chaos, leading to new identity verification systems
  • Blood Oath Alliances: Secret partnerships formed in the final hours, with players making dramatic last-minute promises and betrayals
  • The Great Economic Upset: Due to voting economy imbalances, unknown players could rocket from last place to first in the final round through strategic currency deployment

Current Evolution: Conference Engagement Tool

The platform was successfully adapted for John's product consulting company as a conference engagement tool. The streamlined version focuses on core voting and challenges, removing complex economic advantages for the professional environment while keeping Blood Oaths as an optional "expansion" game mode.

Challenges & Solutions

Technical Constraints

Challenge: Google Sheets couldn't handle increasingly complex features — a single typo could crash the entire game mid-session.

Solution: Migrated to Laravel web application with proper error handling, data validation, and robust architecture that could scale with feature complexity.

Balancing Game Economics

Challenge: The original voting economy created dramatic endgame swings that felt disconnected from week-long strategic play.

Solution: Simplified automatic vote mechanics and added diminishing returns to prevent dramatic last-minute position changes.

Honest Retrospective

  • Simplify Advantage Complexity: The economic advantages were overwhelming for non-competitive players. I'd design clearer onboarding and tier the complexity — basic modes for casual players, advanced modes for strategy enthusiasts.
  • Address "King Making" Dynamics: Competitive players would secure votes from others by promising reciprocity in future games, creating frustration for excluded players. I'd consider mechanics that give trailing players more agency.
  • Balance Social Drama vs. Accessibility: While emergent social gameplay was entertaining, clearer guidelines about acceptable behavior would help maintain inclusive participation without killing the spontaneous interactions that made the game special.

Skills Demonstrated

Game Design
UX Design
Product Development
Social Systems Design
User Psychology
Figma Prototyping
Data Analysis
Project Management
Stakeholder Management
Technical Implementation
Change Management
Business Strategy

View More Case Studies