Five Mics Central

A community platform connecting players, cards, decks, and events in one place.

As Five Mics, a physical trading card game, expanded with new card releases, players gained more ways to build and experiment with their decks, creating a growing need for digital tools and community interaction. I took Five Mics Central from concept to launch, defining its MVP, information architecture, user flows, and interactions before implementing the platform in Plasmic.

View Site →

MY ROLE

Lead Product Designer

TOOLS

Figma, Plasmic, Lovable, Supabase

Timeline

Feb 2026 - Present

01

Problem

Building a Digital Home for a Growing Community

As new booster boxes gave players more cards to build and experiment with, the need for digital tools grew alongside the game. With no dedicated Five Mics platform for players to build, share, or connect, Five Mics Central became an opportunity to support deck building and collection management while creating new ways for the community to discover each other, organize events, and grow together.

02

Product Direction

I worked with the founder to shape the initial product vision through rapid AI-assisted prototyping, then studied existing TCG and community platforms to understand how deck building, profiles, events, and collections could work together.

Initial Product Vision

Core Experience

• Deck Builder • Card Discovery & Collection Edit • Player Profiles • Community Building

Core Experience

• Deck Builder • Card Discovery & Collection Edit • Player Profiles • Community Building

Competitive & Community

• Event Creation • Tournament Management • Leaderboard • Social Discovery

Competitive & Community

• Event Creation • Tournament Management • Leaderboard • Social Discovery

Engagement

• Rewards & Currency • Customization • Friends & Messaging • Social Conntections

Engagement

• Rewards & Currency • Customization • Friends & Messaging • Social Conntections

Competitive Research

What I looked at:

What I learned:

01 — Fragmented Ecosystems

Players often rely on separate third-party platforms for deck building, events, rankings, and community activity, leaving no single source of truth for the game ecosystem.

02 — Powerful, but Hard to Use

Many existing TCG platforms support deep functionality but come with dense interfaces and steep learning curves, creating an opportunity for clearer hierarchy and more approachable interactions.

03 — Community as Part of the Product

Connecting decks, profiles, events, and leaderboards creates more opportunities for players to discover each other, share strategies, and stay engaged beyond individual matches.

03

Define MVP

The initial vision extended beyond what we could realistically build for launch. We focused FMC on its core player experiences while partnering with TopDeck.gg for mature event and tournament tools.

By keeping event data connected across both platforms, players could manage events through TopDeck.gg while surfacing their activity on FMC. Rewards and other engagement features were deferred for future development.

Initial FMC Scope

Deck Builder
Player Profiles
Collection
Card / Deck Discovery
Leaderboard
Friends & DMs

Partner Integration

Event Creation
Tournament Management
Score Reporting

Deferred

Rewards & Currency
Customization
Administrative View
Color Mode Switch

04

IA & User Flow

I mapped the product architecture around a connected player ecosystem, linking collections, decks, profiles, events, and community discovery rather than treating each feature as an isolated tool.

From Collection to Community

Collect

Collection

Build

Deck Builder

Publish

My Public Decks

Engage

Likes & Discovery

05

Designing the Core Experience

With the product structure in place, I translated the core flows into high-fidelity interfaces, balancing the information density of a TCG platform with clear hierarchy and approachable interactions. The experience was designed around connected player activities — building decks, discovering cards and strategies, developing a player identity, and engaging with the wider community.

01 - Build

Create and manage decks

Deck Builder

Filter

Deck Builder (List View)

Save Deck

02 - Discover

Explore card collection, decks, and strategies

Collection

Card Inspect

Community Decks Exploration

Public Deck & Analysis

03 - Connect

Build a player identity

Player Info & Event Activity

Player Public Decks

Future Exploration — Organized Play

I explored a native organized play system spanning event creation, registration, tournament operations, and player reporting. We ultimately deferred building these tools natively and partnered with an existing platform instead, while keeping event activity connected to the Five Mics ecosystem.

Organizer — Create Event

Player — Discover & Register

Player — Report Scores

Organizer — Manage Matches

01 - Build

Create and manage decks

Deck Builder

Filter

Deck Builder (List View)

Save Deck

02 - Discover

Explore card collection, decks, and strategies

Collection

Card Inspect

Community Decks Exploration

Public Deck & Analysis

03 - Connect

Build a player identity

Player Info & Event Activity

Player Public Decks

Future Exploration — Organized Play

Organizer — Create Event

Player — Discover & Register

Player — Report Scores

Organizer — Manage Matches

06

Bringing the Design into Production

I implemented the responsive UI in Plasmic and took on front-end work when product needs extended beyond the platform’s native capabilities.

Building Beyond the UI

While implementing the Deck Viewer, I used AI-assisted coding to build a dynamic chart that visualizes deck composition at a glance, then integrated it directly into Plasmic.

RESPONSIVE IMPLEMENTATION

Desktop + mobile layouts built in Plasmic

DECK ANALYSIS

Card stats and composition at a glance

CUSTOM CODE

AI-assisted chart embedded directly into the product

Turning Extra Cards into a Resale Loop

While building Collection, I saw an opportunity to turn duplicate cards into a resale loop. I proposed a Sell Cards flow connecting players’ collections to Five Mics’ review process and Shopify storefront.

I implemented the front-end state logic to keep multiple selected cards editable, validated, and synchronized throughout the submission flow:

Select

Choose cards from Collection

Configure

Condition + Variant

Price

Match with Supabase card data

Validate

Ensure every selected card is complete

Submit

Send sell request to Five Mics

Review & List

Approved cards received → List on Shopify

Approved cards received → Shopify

Technical Challenge

Keeping collection data, per-card attributes, pricing, validation, and cart state synchronized across multiple selected cards.

07

Evaluation

From Concept to Launch

Five Mics Central launched as the digital companion to the physical TCG, bringing deck building, collections, player identity, and community discovery into one connected experience. Taking it from concept through implementation taught me to design beyond individual features, balancing product architecture, scope, technical constraints, and opportunities that emerge while building.

Timeline: 3 months

Opportunity → Align → Research → Scope → Structure → Design → Build → Launch