Guild Portal UI Mockups
ASCII wireframes for the member portal redesign. The core concept: this is a character sheet, not a dashboard.
Five pages, each with a clear purpose:
| Nav label | Full page name |
|---|---|
| Character | Character Sheet |
| Log | Activity Log |
| Quests | Quest Board |
| Reward | Rewards Shop |
| Guild | Guild Hall |
Icons: Character (person), Log (clock/history), Quests (scroll), Reward (gift), Guild (castle)
1. Character — Character Sheet (Home)
The primary view when a member logs in. Identity and progression at a glance.
┌─────────────────────────────────────────────────────────────────┐
│ ⚔ DUNGEON BOOKS GUILD Character Sheet ◆ Quest Log │
│ Adventure Log ◆ Rewards │
├─────────────────────────────────────────────────────────────────┤
│ │
│ ┌─────────┐ PANAT "VOID" │
│ │ │ Fighter · Level 7 · Law │
│ │ ( ◠ ) │ ───────────────────────────────────────────── │
│ │ /│││\ │ XP ████████████████████░░░░░░ 82,000 / 120,000 │
│ │ │ ▲ 38,000 XP to Level 8 │
│ └─────────┘ │
│ ┌──────────────┐ ┌──────────────┐ │
│ │ GOLD TIER │ │ POINTS │ │
│ │ 2x Multiplier│ │ 1,500 ($15) │ │
│ │ 20% Store │ │ │ │
│ │ 15% Events │ │ [Spend →] │ │
│ └──────────────┘ └──────────────┘ │
│ │
│ ┌─── STATS ────────────────────────────────────────────────┐ │
│ │ Purchases: 47 Visits: 23 Member Since: Mar 2026 │ │
│ │ Quests: 5/12 Events: 8 Streak: 🔥 3 weeks │ │
│ └──────────────────────────────────────────────────────────┘ │
│ │
│ ┌─── RECENT ACTIVITY ──────────────────────────────────────┐ │
│ │ ● +500 XP Purchased "Dungeon Crawler Carl #3" 2h ago │ │
│ │ ● +100 XP Daily check-in Today │ │
│ │ ● +1,000 XP D&D Night attendance Yesterday │ │
│ │ [View full log →] │ │
│ └──────────────────────────────────────────────────────────┘ │
│ │
│ ┌─── ACTIVE QUESTS ────────────────────────────────────────┐ │
│ │ ◇ Visit 3 events this month 2/3 [Uncommon] │ │
│ │ ◇ Recommend a book to a friend 0/1 [Common] │ │
│ │ ◇ Draw your character 0/1 [Rare] │ │
│ │ [View all quests →] │ │
│ └──────────────────────────────────────────────────────────┘ │
│ │
└─────────────────────────────────────────────────────────────────┘
Key decisions:
- XP bar is the dominant element — progression is the product
- Points always show dollar equivalent (“1,500 ($15)”)
- Recent activity and active quests give reasons to come back
- Stats are compact, not 6 separate cards
- Character identity (class, level, faction) is immediate
2. Log — Activity Log
Chronological feed of all activity, grouped by month, filterable by type.
┌─────────────────────────────────────────────────────────────────┐
│ ⚔ DUNGEON BOOKS GUILD Adventure Log │
├─────────────────────────────────────────────────────────────────┤
│ │
│ Filter: [All ▾] [Purchases] [Check-ins] [Quests] [Events] │
│ │
│ ── April 2026 ────────────────────────────────────────────── │
│ │
│ APR 3 ● PURCHASE +500 XP +500p │
│ │ Dungeon Crawler Carl #3 $12.99 │
│ │ The Goblin Emperor $8.99 │
│ │ Base: 2,198 pts × 2.0 (Gold) = 4,396 pts │
│ │ │
│ APR 3 ◆ CHECK-IN +100 XP │
│ │ Daily visit · NFC tap │
│ │ │
│ APR 2 ★ EVENT +1,000 XP │
│ │ D&D Night — "Tomb of the Serpent Kings" │
│ │ Streak: 4th consecutive D&D Night! +500 XP bonus │
│ │ │
│ APR 1 ◇ QUEST COMPLETE +1,500 XP │
│ │ "Attend 3 events this month" [Uncommon] │
│ │ Approved by Carrie │
│ │ │
│ ── March 2026 ────────────────────────────────────────────── │
│ │
│ MAR 31 ● PURCHASE +200 XP +200p │
│ │ Cyberpunk RED Core Rulebook $49.99 │
│ │ │
│ MAR 29 ▲ LEVEL UP! Level 6 → 7 │
│ │ 🎉 "The quest continues..." │
│ │ │
│ MAR 28 ◆ CHECK-IN +100 XP │
│ │ Daily visit · NFC tap │
│ │ │
│ [Load more ↓] │
│ │
└─────────────────────────────────────────────────────────────────┘
Key decisions:
- Grouped by month, not flat list
- Filterable by type (purchases, check-ins, quests, events)
- Level-up moments are first-class entries in the timeline
- Streak bonuses are visible inline
- Quest completions show who approved them (the GM)
- XP and points shown separately (XP permanent, points spendable)
3. Quests — Quest Board
Active, available, and completed quests. The core engagement loop.
┌─────────────────────────────────────────────────────────────────┐
│ ⚔ DUNGEON BOOKS GUILD Quest Log │
├─────────────────────────────────────────────────────────────────┤
│ │
│ [Active] [Available] [Completed] │
│ │
│ ── ACTIVE QUESTS (3) ─────────────────────────────────────── │
│ │
│ ┌───────────────────────────────────────────────────────────┐ │
│ │ ◇ Visit 3 events this month [Uncommon] │ │
│ │ ██████████████░░░░░░░ 2 / 3 │ │
│ │ Reward: 1,500 XP │ │
│ │ Expires: Apr 30 │ │
│ └───────────────────────────────────────────────────────────┘ │
│ │
│ ┌───────────────────────────────────────────────────────────┐ │
│ │ ◇ Recommend a book to a friend [Common] │ │
│ │ ░░░░░░░░░░░░░░░░░░░░ 0 / 1 │ │
│ │ Reward: 500 XP │ │
│ │ Permanent quest · Submit in Discord │ │
│ └───────────────────────────────────────────────────────────┘ │
│ │
│ ┌───────────────────────────────────────────────────────────┐ │
│ │ ◇ Draw your character [Rare] │ │
│ │ ░░░░░░░░░░░░░░░░░░░░ 0 / 1 │ │
│ │ Reward: 3,000 XP │ │
│ │ Permanent quest · Submit in Discord │ │
│ └───────────────────────────────────────────────────────────┘ │
│ │
│ ── AVAILABLE QUESTS ──────────────────────────────────────── │
│ │
│ WEEKLY │
│ ┌───────────────────────────────────────────────────────────┐ │
│ │ ○ Buy a book you've never heard of [Common] │ │
│ │ Reward: 500 XP Resets: Mon [Accept] │ │
│ └───────────────────────────────────────────────────────────┘ │
│ │
│ SEASONAL — Spring 2026 │
│ ┌───────────────────────────────────────────────────────────┐ │
│ │ ○ Read a book outdoors and photograph it [Uncommon] │ │
│ │ Reward: 1,500 XP Until: Jun 1 [Accept] │ │
│ └───────────────────────────────────────────────────────────┘ │
│ │
└─────────────────────────────────────────────────────────────────┘
Key decisions:
- Three tabs: Active (accepted, in progress), Available (can accept), Completed (history)
- Progress bars on active quests
- Rarity badges (Common/Uncommon/Rare/Very Rare/Legendary) with D&D item color coding
- Expiration and reset info visible
- “Submit in Discord” directs to the social loop
- Available quests grouped by rotation type (weekly, seasonal, permanent)
4. Reward — Rewards Shop
What you’ve earned and what you can spend points on.
┌─────────────────────────────────────────────────────────────────┐
│ ⚔ DUNGEON BOOKS GUILD Rewards │
├─────────────────────────────────────────────────────────────────┤
│ │
│ Points: 1,500 ($15.00) │
│ │
│ [My Inventory] [Rewards Shop] │
│ │
│ ── MY INVENTORY ──────────────────────────────────────────── │
│ │
│ ┌──────────┐ ┌──────────┐ ┌──────────┐ ┌──────────┐ │
│ │ 🎭 │ │ 🔮 │ │ 🏷️ │ │ │ │
│ │ Fighter │ │ Law │ │ Guild │ │ │ │
│ │ Discord │ │ Faction │ │ Sticker │ │ Empty │ │
│ │ Role │ │ Discord │ │ Pack │ │ Slot │ │
│ │ │ │ Role │ │ │ │ │ │
│ │ Equipped │ │ Equipped │ │ Claimed │ │ │ │
│ └──────────┘ └──────────┘ └──────────┘ └──────────┘ │
│ │
│ ── REWARDS SHOP ──────────────────────────────────────────── │
│ │
│ DIGITAL │
│ ┌──────────┐ ┌──────────┐ ┌──────────┐ │
│ │ 💀 │ │ 🐉 │ │ 🎵 │ │
│ │ Undead │ │ Dragon │ │ Custom │ │
│ │ Slayer │ │ Hoarder │ │ Kiosk │ │
│ │ Discord │ │ Discord │ │ Sound │ │
│ │ │ │ │ │ │ │
│ │ 5,000 pts│ │ 10,000 p │ │ 15,000 p │ │
│ │ ($5) │ │ ($10) │ │ ($15) │ │
│ └──────────┘ └──────────┘ └──────────┘ │
│ │
│ PHYSICAL │
│ ┌──────────┐ ┌──────────┐ ┌──────────┐ │
│ │ 👜 │ │ 👕 │ │ 💰 │ │
│ │ Guild │ │ Guild │ │ $10 │ │
│ │ Tote Bag │ │ T-Shirt │ │ Store │ │
│ │ │ │ │ │ Credit │ │
│ │ │ │ │ │ │ │
│ │ 50,000 p │ │ 100,000p │ │ 10,000 p │ │
│ │ ($50) │ │ ($100) │ │ ($10) │ │
│ └──────────┘ └──────────┘ └──────────┘ │
│ │
└─────────────────────────────────────────────────────────────────┘
Key decisions:
- Points balance always visible with dollar equivalent
- Two tabs: Inventory (owned) and Shop (available)
- Inventory items show status (Equipped, Claimed, etc.)
- Shop items show point cost with dollar equivalent
- Grouped by Digital (zero fulfillment) vs Physical
- Empty inventory slots create aspiration
5. Guild — Guild Hall (Community Hub)
The store’s living community hub. Answers “what’s happening in the guild right now” before anything else. Tier upgrade lives here but below the fold.
┌─────────────────────────────────────────────────────────────────┐
│ ⚔ DUNGEON BOOKS GUILD Guild Hall │
├─────────────────────────────────────────────────────────────────┤
│ │
│ Dungeon Books Guild · Level 12 · 247 members │
│ Season: Spring 2026 · Ends: Jun 1 │
│ │
│ ── STORE ANNOUNCEMENTS ───────────────────────────────────── │
│ 📌 D&D Night next Saturday — bring your dice [Apr 12] │
│ 📌 Spring sale May 1 — Gold+ gets early access [May 1] │
│ │
│ ── UPCOMING EVENTS ───────────────────────────────────────── │
│ APR 12 D&D Night — Tomb of the Serpent Kings [Register →] │
│ APR 19 MTG Draft Night [Register →] │
│ APR 26 Author Reading: N.K. Jemisin [Register →] │
│ [View all events →] │
│ (links to hi.events) │
│ │
│ ── GUILD ACTIVITY ────────────────────────────────────────── │
│ ▲ Mira leveled up to Level 5! 2h ago │
│ ◇ Jake completed "Read 5 books this season" 5h ago │
│ ★ D&D Night — 18 members attended Yesterday │
│ ▲ Sam leveled up to Level 8! Yesterday │
│ ◆ Season goal "100 Events" hit — 500 XP incoming! Apr 3 │
│ [View all activity →] │
│ │
│ ── COLLECTIVE QUESTS ─────────────────────────────────────── │
│ │
│ Events this season │
│ ████████████████░░░░░░░░░░░░░░░░ 312 / 500 │
│ Reward: 500 bonus XP for all members │
│ │
│ Guild spend goal │
│ ██████████████████████░░░░░░░░░░ $7,240 / $10,000 │
│ Reward: Guild Level 13 — store upgrade event │
│ │
│ ── HALL OF HEROES ────────────────────────────────────────── │
│ │
│ SPRING 2026 │
│ 🥇 Mira Most Events (22) │
│ 🥈 Jake Top Spender │
│ 🥉 Priya Quest Champion (11 completed) │
│ │
│ ALL TIME │
│ ⭐ Carrie Guild Founder │
│ ⭐ Sam First to Level 10 │
│ ⭐ Alex Organized 5 community events │
│ │
│ ── YOUR TIER ─────────────────────────────────────────────── │
│ Gold · $50/mo · 2x XP · 20% store · 15% events │
│ [View tier details & upgrade →] │
│ │
└─────────────────────────────────────────────────────────────────┘
Key decisions:
- Lead with the live community, not the upgrade prompt
- Announcements are the store’s voice — events, news, promotions
- Activity feed shows the guild as alive: level-ups, quest completions, event attendance
- Collective quests give every member a stake in community-wide goals
- Hall of Heroes is permanent recognition, not a live leaderboard — seasonal champions + all-time notables
- Tier upgrade is present but below the fold; tier details link to a dedicated comparison view
- Discord handles all social interaction; this page is read-only
- dungeon.club is an interface layer, not a replacement — events link to hi.events, social goes to Discord, purchases go to the store. The platform surfaces everything, owns nothing.
Design Principles
- Character sheet, not dashboard — every element reinforces that this is a game
- XP bar is king — the primary visual element on every page
- Points always show dollar value — transparency builds trust
- No dark patterns — show when upgrades aren’t worth it, never hide information
- Social hooks — quest submissions route to Discord, not a form
- Progressive density — Character Sheet is the summary, other pages go deep
- Level-up moments are events — they appear in the timeline, not just a number change
- Rarity language everywhere — Common/Uncommon/Rare/Very Rare/Legendary for quests, rewards, achievements
Related
- guild-portal-ui-implementation — build plan for these mockups
- guild-visual-direction — cassette futurism aesthetic
- rpg-loyalty-system-creative-direction — Neopets/RuneScape feel
- dungeon-club-game-design-document — full game design document