CoinDuel
Fantasy Crypto Trading

Fantasy crypto trading powered by real-time market data. Draft coins. Manage your portfolio. Compete. Designed and built end-to-end as a solo Product Design Engineer.

Timeline
2 Months
Role
Product Design Engineer
Scope
End-to-End Design & Dev
Platform
iOS & Android
Markets
Contest
Leaderboard
Position
Figma · React Native · Expo · Supabase · Claude Code · GitHub · Google AdMob · Google Cloud

Product strategy, UX/UI design, design system, full-stack mobile application

01 — 02
The Problem

Practice alone, or risk it all.

Learning to trade crypto means either practicing alone on a simulator with no stakes, or risking real money you can't afford to lose. No middle ground exists.

The Solution

Make it social. Make it competitive.

CoinDuel bridges that gap — making crypto accessible through competition and strategy. Real market data, no real money. Your skill is the only thing at stake.

03 — Market Positioning
Fantasy sports is a proven model — competitive, social, retention-driven. Existing crypto apps focus on solo trading. CoinDuel applies the fantasy format to crypto.

Monetized through a freemium credit system and ad revenue

BTC+2.40%
ETH-1.20%
SOL+5.80%
DOGE+12.10%
XRP-0.50%
SHIB+25.30%
ADA+3.10%
AVAX-2.80%
BTC+2.40%
ETH-1.20%
SOL+5.80%
DOGE+12.10%
XRP-0.50%
SHIB+25.30%
ADA+3.10%
AVAX-2.80%
04 — Gameplay & Systems
Every mechanic creates
a meaningful decision

Game Formats

Head-to-head, leagues (10-50 players), daily and weekly contests. Same core mechanics, different duration and strategy.

In-Game Play

Spot trade coins using real-time market data. Boost multipliers amplify potential gains at a cost. Pick a direction — pump or dump.

Token-Based Draft

Random draft balanced by a 6-10 token budget. Token cost is determined by market cap, ranging from 2 to 5 per coin.

Credit & Points

Players start with 100 credits. 1 credit = $100 in simulated buying power. Profits convert to points at the end of each contest.

ELO Ranking

Every match adjusts a player's ELO. Separate ratings for 1v1 Daily, 1v1 Weekly, League Daily, and League Weekly. Beat higher-ranked players, climb faster. Drives matchmaking and powers the global leaderboard. Seven tiers from Bronze to Legend.

05 — Key Screens
Every screen earns its place
Data-forward interfaces. No clutter. Every element serves the game.
Markets

Markets

Total market cap hero chart with timeframe toggles. Top 50 coins sorted by gainers, losers, or market cap. Search, filter, and bookmark — all above the fold. The home screen is a data dashboard, not a menu.

Live prices Sparkline charts Timeframe toggles
Contest

Live contest

Auto-zoom score chart tracks you against your opponent in real time. Wallet balance, score, coin positions, and swap action — all on one screen. The countdown timer creates urgency without noise.

Auto-zoom chart Live scoring 1-tap trades
Position

Position detail

Average cost, current value, percent change, and point value — the math is done for you. Trade or Boost from the same screen. No navigation required to take action on a position.

Credit tracking Point calculation Trade + Boost
Leaderboard

Leaderboard

Rankings filtered by format, mode, and season. Top 3 players highlighted with avatar cards. Your rank pinned at the bottom so you always see where you stand relative to the best.

Format filters Rank badges Persistent self-rank
League

League play

Up to 50 players in a single contest. Score comparison chart, live standings table, and your full portfolio. Player tabs let you switch between your view and your competitors'.

50 player rooms Live standings Player tabs
06 — Design System & Information Architecture
A system that feeds
directly into production
No redline handoff. No translation layer. Components built once, used everywhere. Design infrastructure first, so everything downstream moves faster.

Components

Coin list items with sparkline charts, contest cards with live countdowns, rank cards with tier badges, position detail rows, wallet/score stat blocks, standings tables, format pills (1V1, LGE, PVT).

Patterns

Dropdown filters, search bars, dual-action button pairs reused across contexts. Contextual action button in the top right of every screen. Back navigation always returns to the tab root.

Visual Language

Black, white, green. Gray containers. Minimal palette, consistent type hierarchy. No gradients, no shadows, no 3D. Flat, calm, data-forward.

📈

Market

Top 50 coins. Real-time prices, charts, sorting. Bookmarks top right.

🏆

Leaderboard

Rankings by format — daily, weekly, season. Friends list top right.

Contests

Central hub. Create, track, review. Enlarged active state. Rules top right.

💬

Inbox

DMs and league group chats. Notifications top right.

👤

Account

Profile, settings, subscription. Settings top right.

07 — Technical Architecture
Built to ship cross-platform
from day one
Frontend

React Native + Expo

Single codebase for iOS and Android. Expo Router for file-based navigation. Zustand for state management with persist middleware.

Backend

Supabase

Handles authentication, player profiles, ELO ratings, contest data, and real-time score tracking. Row-level security for data isolation.

Market Data

CoinGecko API

Real-time coin pricing, market data, and chart data. Cached locally with rate-limit handling for performance.

Monetization

Google AdMob

Banner and rewarded ad placements. Ad revenue as the primary free-tier monetization model.

Payments

Stripe

Premium subscription management. Handles upgrade flows and billing for the paid tier.

Infrastructure

Google Cloud

Backend services, edge functions, and scheduled jobs for price updates and tier calculations.

08 — AI-Assisted Development
A solo build shipped
in 2 months
Thorough product design and strategy upfront meant less back and forth during development. Clear references, correct semantics, and well-defined requirements allowed Claude Code to build features with minimal revisions.
01

Product Strategy

Define the problem, market positioning, game mechanics, scoring formula, and monetization before touching any tools.

02

Design System

Build the component library, design tokens, and screen patterns in Figma. Every decision documented with rationale.

03

AI-Assisted Build

Claude Code receives well-defined specs with correct semantics. MCP connects Figma directly to production. No drift between design and code.

04

Ship

Test, iterate, deploy. The design thinking done upfront is why a solo build ships in weeks, not months.

09 — Outcomes
From concept to
production in 2 months
90%
Complete
2mo
Solo build timeline
12
Core screens designed & built
1
Person. End-to-end.

Next Steps

Remaining work includes finalizing the live market data API, testing 1v1 and league play end-to-end, and refining UX copy and simplicity before launch. A go-to-market plan is being developed alongside the product — the goal is a deliberate launch, not a premature one.

Contests hub
Inbox
Rules
Account
Contests list

Try CoinDuel

Fantasy crypto trading powered by real-time market data. Draft coins, compete with friends, climb the leaderboard.