Design Review

Guesslet UX Tour

Every screen. Every flow. Every pixel. A complete walkthrough of the v1 app as it exists today — captured live from app.guesslet.com.

15+ screens captured 2 user flows mapped 5 brand colors Updated April 28, 2026 (Plan 7B)

Brand Kit

Guesslet's visual identity — palette, type, lockup, and component primitives.

Color Palette

Hot Pink
#FF40A0 — primary CTA, logo, accents
Cream
#FFFAEC — page background, light fills
Ink
#1C1B1A — body text, headings
Stone
#94908B — secondary text, placeholders
Linen
#E8DFD0 — borders, dividers, card outlines
Danger Red
#E53E3E — destructive actions only

Typography

Display — Capriola 400
Group guesses for friends.
Used for: headings, logo wordmark, screen titles, modal headers
Body — Inter 400/500/600
Pick a side. Win the coins.
Used for: all body copy, buttons, labels, metadata
Coin Display — Capriola 400
1,000 Coins
Coin balances rendered in Capriola for visual weight

Logo & Components

Guesslet logo lockup
Kite mascot + wordmark — pink on cream is primary use
Primary CTA — pill, 999px radius
Ghost — Linen border, Ink text
Destructive — red, used sparingly
Cards — 16px radius, Linen border

User Flows

The two primary paths through the app — first-time user onboarding, and the returning user core loop.

First-time user — Onboarding
New user opens app, signs in via Apple or Google, names themselves, then creates or joins their first group. On "Skip for now," a demo group is auto-seeded with bots and sample guesses so they land somewhere with activity. (Plan 7A: push opt-in step removed from wizard; notifications are now requested contextually after the user posts a guess or places a pick.)
🌐 Splash / Auth
App entry, sign-in options
Sign in
Apple or Google OAuth
👋 Welcome step 1
Name + emoji picker
🏠 Welcome step 2
Create, join, or skip
✏️ Create group
— or —
🔑 Join with code
— or —
🎉 Demo group
🎯 Group Detail
Guesses tab + demo banner
Returning user — Core guessing loop
User opens app, lands on Groups list, enters their group, makes a guess or places a pick on an open one. Activity feed surfaces cross-group updates.
🌐 Auth
Auto-login via stored token
🎲 Groups list
All groups, coin balances
🎯 Group Detail
Guesses + Members tabs
+ Make a guess
— or —
📋 Place a pick
⏳ Open guess
→ resolves →
🏆 Results
Also accessible from bottom nav: Activity feed (cross-group event stream) and You profile (edit name/emoji, settings, sign out).

Every Screen

Live screenshots captured at 800×1280 (mobile proportions) from app.guesslet.com on April 28, 2026. All authenticated screens use the tour user account.

Unauthenticated
Splash screen — redirects to Auth
/
Splash / Entry
The app's only public entry point. Unauthenticated users are immediately redirected to /auth. No splash animation — deliberate; keeps time-to-auth minimal.
Public
Auth screen with sign-in options
/auth
Auth / Sign-in
The welcome gate. Three sign-in surfaces: Apple (black), Google (white border), and phone (disabled — coming soon). The mascot kite logo provides the warm first impression. Subtext sets legal expectations cleanly.
Public
📵
Phone auth — screenshot pending
"Continue with phone" is disabled in v1 with the note "Phone signin coming soon — use Apple or Google for now." No UI to capture yet.
/auth → phone
Auth — Phone Flow
Not yet implemented. Button is visible but disabled with messaging directing users to Apple/Google. Planned for a future release.
Public
First-run Onboarding Wizard
Welcome wizard step 1: Name and emoji picker
/welcome — step 1
Welcome — Name & Emoji
First-time user setup. Text input for display name (required to unlock Continue). Emoji picker with 16 options — selected emoji becomes the user's persistent avatar. The Continue button stays disabled until a name is typed, preventing empty submissions.
Wizard step 1
Welcome wizard step 2: Push notification opt-in
/welcome — step 2 (removed in Plan 7A)
Welcome — Notifications (deprecated)
Push notification consent step was removed from the wizard in Plan 7A. The "Want a heads-up?" step no longer appears. Notification permissions are now requested contextually — after the user posts a guess or places a pick — via the PushPromptBanner component. The wizard is now two steps: Name/emoji, then Create/Join/Skip.
Removed in Plan 7A
Welcome wizard step 3: Group prompt
/welcome — step 2
Welcome — Get Into a Group
Final onboarding step (now step 2 after Plan 7A removed the push notification step). Three choices: create a new group, join with an invite code, or skip. Skipping now seeds a demo group with bots and sample guesses, then navigates directly to it rather than leaving the user at an empty groups list. Copy "Guesslet only works with people you know" reinforces the private-group positioning.
Wizard step 2
Core App — Authenticated
Groups list with Tour Group card
/groups
Groups List
Home screen post-auth. Each group card shows: emoji, group name, role (Owner / Member), and coin balance in that group. The monospaced Capriola font on coin amounts gives them financial weight. FAB (+) opens the Create / Join sheet. Bottom nav: Groups, Activity, You.
Authenticated
Create group modal with name, emoji, coin name fields
/groups → FAB → Create tab
Create Group Modal
Tabbed modal (Create / Join). Create tab: group name (required), emoji picker, and the currency picker — "What do you call your coins?" Plan 7A changed the currency input from a free-text field to a CurrencyPicker component with quick-tap preset chips (Coins, Beers, Cookies, Push-ups, Points, Tacos) plus a custom text entry. This is the per-group renameable currency mechanic — the key retention hook, now faster to set.
Modal
Join group modal with invite code input
/groups → FAB → Join tab
Join Group Modal
Join tab of the same modal. Single field: invite code. Helper text: "Ask your friend to send a fresh link." Codes are time-limited — no stale link exploits. Simple, frictionless entry for invited users.
Modal
Group Detail
Group detail showing Guesses tab empty state
/groups/:id — Guesses
Group Detail — Guesses
Group header: emoji, name, member count, coin balance. Guesses / Members tabs. Empty state uses the kite mascot with "No guesses yet — Be the first to make one." CTA button + secondary Invite someone link. FAB (+) persists for quick guess creation. Back link → Groups. Plan 7A: when the group is a demo group (auto-seeded on onboarding skip), a pink DemoGroupBanner shows at the top: "Demo group — Your friends are not in here. Create or join a real group to play with people you know." with a Browse groups link. The demo group arrives pre-loaded with two sample guesses (one open, one resolved) and four bot members.
Authenticated
Group detail showing Members tab with leaderboard
/groups/:id — Members
Group Detail — Members
Members tab renders a ranked leaderboard: rank number, emoji avatar, display name, role badge (you · owner), and coin balance. Rank #1 is highest balance. This is the social competition surface — seeing your rank drives re-engagement.
Authenticated
Make a guess modal showing AnswerStyleChip auto-detection, template starter chips, and Choices input (Plan 7A)
/groups/:id → + Make a guess
Make a Guess Modal (default)
Core creation surface. Designed around the 30-second creation thesis. Default visible: question text, an AnswerStyleChip that auto-detects guess type as you type (Yes/No for questions like "Will it rain?", Multiple choice otherwise), four template starter chips (Who wins? / Closest call / Guess the time / Custom), datetime pickers for picks close and result known, Decided by chips (Me / Group confirms / Auto-expire), and a "+ Add image, reward, privacy, or rules" expander hiding advanced fields. The AnswerStyleChip is the Plan 7A key change: it eliminates the manual type-selection step and shows the correct input fields automatically. (Plan 7A updated.)
Modal
Make a guess modal with More options expanded showing image upload, emoji, who can pick, anonymous, rules, reward
/groups/:id → + Make a guess → More options ▾
Make a Guess Modal (More options expanded)
The "Fewer options ▴" state reveals everything behind the expander: image upload (drag or tap, JPEG/PNG/WebP), emoji tag pills, "Who can pick?" subset picker (Everyone vs Pick people), Anonymous picks toggle, Rules (Win = / Lose = / Other rules clarifier), Reward (Winner gets / Loser gets / Enforced by). Power users find every knob; new users never see this wall on first creation.
Modal
Group settings modal with rename, live event delay slider, and delete
/groups/:id → ⚙ Settings
Group Settings
Owner-only settings. Editable group name and emoji, then a "Live event spoiler delay" slider (0-300s, default Off). When set, resolution pushes are delayed by that many seconds — useful for sports / movie groups so the app doesn't spoil the result before everyone's seen it. Save changes (pink) and Delete group (destructive red). Non-owners see a read-only view.
Modal
Scale-type guess detail with empty Picks state
/groups/:id/guesses/:guessId
Guess Detail (scale-type, empty)
Scale-type guess shows "🔢 Predicted on a scale of 5 – 30" instead of options. Pool ratio bar, picks list, and a kite mascot empty state inviting "Be the first to pick." Resolver mode is surfaced at the bottom. When picks accumulate the empty state is replaced by per-pick rows showing predicted value and stake.
Authenticated
The Resolution Moment
Resolution Takeover full-screen — You called it. +450 coins. Per-pick narrative.
/groups/:id/guesses/:guessId (on resolve)
Resolution Takeover
The screenshot-worthy moment. Hot pink full-screen takeover with cream typography. "You called it." headline (or "Tough break." for losers), animated counter spinning up to the win amount with slot-stop deceleration (~700ms), per-pick narrative listing each loser by name and exact amount you won from them ("You won 100 from Bob / You won 150 from Carol / You won 100 from Dave"), pool size + picker count footer, winning option label. Confetti fires on win path only. A "Share with the group" button (when the per-guess 9:16 share card is generated server-side) opens the native share sheet for one-tap posting back to the group chat. Plan 7A: added a rematch row at the bottom so the proposer can quickly post a follow-up guess without leaving the resolution screen.
Authenticated
Global Navigation
Activity feed showing empty state
/activity
Activity Feed
Cross-group event stream. Shows all guess events across every group the user belongs to — new guesses posted, picks closing soon, results dropped. Empty state: kite mascot + "Quiet around here. Make a guess to liven things up." Notification badge on nav icon when unread.
Authenticated
You profile page with streak and calibration cards
/you
You — Profile
Three stacked cards. (1) Profile: emoji avatar, display name in Capriola, join date, Edit profile + Settings buttons. (2) STREAK: 🔥 current day count, "Best ever: N days · Streak freezes: 1/1 this week" — with grace mechanics (one freeze per week, decay-not-reset on misses) so a missed day softens the streak rather than killing it. (3) CALIBRATION: Brier score from the optional confidence slider on picks, with percentile vs other group members. Empty state nudges toward using the slider. The two parallel scoreboards — coins for casual, calibration for the nerds — engage both populations on the same product.
Authenticated
Settings screen showing 5 sections: Account, Notifications, Privacy, Groups, About (Plan 7A)
/you/settings
Settings
Five sections added in Plan 7A. Account: profile name/emoji/phone with edit row. Notifications: five toggles (New guesses, Picks closing soon, Results dropped, Mentions and resolver, Weekly recap) persisted to the server. Privacy: Blocked users row linking to /settings/privacy; How coins work row. Groups: membership list with role badge. About: How coins work, Send feedback (opens FeedbackForm modal inline), Terms, Privacy Policy, app version. Sign out and Delete account at the bottom. (Plan 7A expanded from lean stub.)
Authenticated

Retention Milestone — What's New

11 features shipped in Plan 7B (the retention overhaul). Screenshots deferred to next capture pass; descriptions reflect live behavior as of April 28, 2026.

Motivation & Identity
🎯
You tab — PlayerCard
Screenshot pending recapture
/you
You — PlayerCard
Redesigned from three stacked cards into a single cohesive PlayerCard. Shows: emoji + name header, current title (one of 12 behavior-based labels — "Cautious Coward", "Vibes-Only Picker", etc.), total play coins, best group, this week stats (picks / wins / biggest win / most embarrassing miss), Prediction skill with a casual label ("Sharp" / "Learning" / etc.), and On a Roll streak. Brier score is hidden from casual view.
Authenticated
🔥
On a Roll (streaks)
Visible inside PlayerCard
/you — streak section
On a Roll (renamed streaks)
Streak mechanic renamed from "Streak" to "On a roll" and reframed to reward participation, not just opening the app. Label copy: "On a roll · N day(s)". Best ever and freeze credits shown as metadata. One freeze credit replenished per week.
Authenticated
🎯
Prediction skill labels
Visible inside PlayerCard
/you — prediction skill section
Prediction Skill (renamed calibration)
Calibration renamed to "Prediction skill" with 6 casual labels mapped to Brier score ranges: Sharp, On point, Getting there, Learning, Too confident, and Needs data. The raw Brier score is hidden by default — tap the ⓘ button to reveal. Empty state nudges toward using the confidence slider.
Authenticated
Social Reactions & Receipts
😂
5-emoji reactions
Screenshot pending recapture
/groups/:id/guesses/:guessId
Guess Reactions
Five emoji reactions render below the guess title on the detail screen: 😂 👀 🤡 🔥 💀. Each shows a count. Tap to toggle your reaction; the button goes active and the count increments immediately. Available on both open and resolved guesses. Backed by the schema-018 reactions table.
Authenticated
🧾
1-line receipts
Screenshot pending recapture
/groups/:id/guesses/:guessId — resolved
Receipts (resolved guesses)
Below reactions on resolved guesses, a Receipts section appears. Players post a single line of commentary ("Called it from the start." / "Unbelievable."). One receipt per user; you can update yours. Empty state: "No receipts yet. Be the first." The receipt persists on the guess forever. Backed by schema-018 receipts table.
Authenticated
Group Detail Redesign
📂
Open / Closing soon / Resolved sub-tabs
Screenshot pending recapture
/groups/:id — Guesses tab
Guesses Tab — 3 Sub-tabs
The Guesses tab is now split into three sub-tabs: Open (count badge), Closing soon (guesses within 2 hours of close), and Resolved (count badge). Each tab filters the guess list accordingly. Empty states per sub-tab. Resolved guesses render in a condensed GuessCard resolved mode showing outcome + "You called it." / "Tough break." copy.
Authenticated
🏆
Members awards + era selector
Screenshot pending recapture
/groups/:id — Members tab
Members — 6 Awards + Era Selector
Members tab gains an era selector (This week / This month / All time) and 6 secondary award cards above the leaderboard: 👑 Top of the table, 🎯 Sharpest pick, 🌀 Most chaotic, 🔥 On a roll, 😬 Biggest swing, 🎖 Most picks. Awards update when you change era. Player badge icons on leaderboard rows.
Authenticated
Group personality header
Screenshot pending recapture
/groups/:id — header
Group Personality (motto + champion)
Group header can now surface personality stats computed by the server: motto (group's self-description), current champion (top balance holder), most chaotic guess, and biggest swing amount. Backed by schema-019 columns on the groups table. Updated after each resolution.
Authenticated
Engagement Loops
📬
Weekly recap takeover
Screenshot pending recapture
App boot — Monday 9AM trigger
Weekly Recap Takeover
Every Monday at 9AM a server-side cron generates a weekly recap per group. On next app open, users see a full-screen takeover with their weekly performance: picks made, win rate, biggest win, biggest miss, group rank change. A shareable recap card is generated server-side. Backed by schema-020 weekly_recaps table. The takeover dismisses with a swipe or "Done" tap.
Authenticated
🏁
Seasons — manual reset + archive
Screenshot pending recapture
/groups/:id → ⚙ Settings → Seasons
Seasons
Group owners can now end a season and start fresh. On reset: current leaderboard is archived as a season record with a name + date range, all balances return to the starting amount, and the archive is viewable in Group Settings. Backed by schema-021 seasons table. The seasons list shows past champions and final standings.
Authenticated
📡
Activity feed — 4-lane priority
Screenshot pending recapture
/activity
Activity Feed — 4-Lane Priority
The activity feed now classifies events into 4 priority lanes rendered in order: "Action needed" (picks closing soon, user has not picked), "Result dropped" (resolutions within last 2 hours), "Drama" (lopsided outcomes, big swings), and "Just so you know" (low-priority social nudges). Empty lanes are omitted. This surfaces the most important events at the top without overwhelming the feed.
Authenticated
Composer Magic
Quick-time chips + live preview
Screenshot pending recapture
/groups/:id → + Make a guess
Composer — Quick-time Chips & Live Preview
Picks close chips: [Now] [In 15 min] [In 1 hour] [5 min before result] [Custom]. Result known chips: [In 1 hour] [Tonight] [Tomorrow] [Custom]. Tapping any chip sets the datetime field instantly. A live Preview card at the bottom of the modal updates in real-time as you type — showing "People pick:", "Picks close:", and "Result:" so the proposer sees exactly what their group will see before posting.
Modal
Ambiguity prompt
Screenshot pending recapture
/groups/:id → + Make a guess → type question
Composer — Ambiguity Prompt
When the question text contains ambiguous phrasing (e.g. "Will Sarah leave before 11?"), a yellow inline prompt appears: "Need to clarify? What counts as leaving?" with quick-tap suggestion chips ("Out the door", "Driving away"). The user can dismiss it ("It's clear") or tap a chip to append clarifying language to the question. Prevents disputes after resolution.
Modal
📋
Smart templates + intent-grouped Extras
Screenshot pending recapture
/groups/:id → + Make a guess → template chips
Composer — Smart Templates & Extras
Four template starter chips at the top of the composer: "Who wins?" (pre-fills multiple choice structure), "Closest call" (scale type), "Guess the time" (datetime format), and "Custom". The "+ Add image, reward, privacy, or rules" expander is now intent-grouped — each option is in a logical cluster rather than a flat list. Microcopy throughout guides the proposer toward clear, dispute-free questions.
Modal