About
I leverage the power of AI tools such as Cursor and Claude to bridge the gap between Figma to React Native, concept to production code.
Santa Clara University
BA Design · Concentration: Design Systems, UX/UI
Snowboarder · Gamer · 25-'26 NBA Fantasy Commissioner & Champ
WheareAI
AI Wardrobe App
Overview
My Role: Founding Product Designer & Front-End Engineer - sole designer and sole engineer.
The Problem: Getting dressed is a context problem, not a taste problem.
Key Decision: I designed and built the full front-end.
Figma design system translated 1:1 into a React Native component library. No handoff because I was both.
Diskify
Data Visualization Software
Overview
My Role: UI Designer — designed the full app UI and brand site in a traditional handoff model. Founder built to spec.
The Problem: Most people have no idea what's eating their disk space.
Key Decision: Traditional handoff meant every design decision had to be deliberate and communicable on its own. No fixing it in code after the fact.
The Challenge
Sleeper · NBA Team Pick Detail Page
Overview
The Screen: NBA Team Pick Detail Page — pregame picks, real-money game.
The Problem: Multiple actions at equal visual weight. No hierarchy. No clear path for the user.
The Goal: Make it obvious what to do first — establish primary vs secondary actions throughout.
The answer was micro, not macro.
First Submission
Sleeper · NBA Team Pick Detail Page
Overview
What Went Wrong: Solved the wrong problem. Reorganized the page architecture instead of fixing the visual hierarchy of existing elements. Blurry @1x export didn't help either.
The feedback was clear: I solved architecture when the brief asked for hierarchy.
Wrong problem. Right instinct to rebuild.
The Rework
Sleeper · 24-Hour Turnaround
Overview
The Shift: Stop reorganizing. Fix the hierarchy of what already exists.
Fix 1: Selected/unselected states defined and applied consistently.
Fix 2: IA refactor ditched
The Final Solution
Sleeper
Unselected
Everything passive, ready to explore.
Every action sits at equal visual weight with enough distinction waiting for the user to lead.
The Final Solution
Sleeper
Partial Selection
One pick made, CTA builds anticipation.
The CTA wakes up for the first time but stays incomplete — one avatar slot empty, multiplier building, not yet ready.
State System
Sleeper · Button & Card Hierarchy
Overview
Team Picks and Player Picks each have two states — unselected and selected. Selected picks fade the unchosen option and activate the teal border.
Nothing earns color until the user commits.
Design Decisions
Sleeper · How Hierarchy Was Built
1. Color as the only hierarchy tool
Teal is reserved exclusively for selected states and the primary CTA — nothing else on screen earns that color.
2. VIEW ENTRY never competes
The CTA is invisible until picks are made. When it appears it's the only solid element on screen demanding attention.
3. Passive default, earned activation
Every action starts at equal ghost weight — hierarchy builds through user behavior, not visual noise.
Feedback & Revisions
Sleeper · What I Heard, What I Fixed
Critique
Button colors don't align with brand
Selected/unselected states contradicted the email
Feed and Stats tabs were removed
Response
Restored brand-accurate teal throughout — no custom colors
Unified state language — what I wrote and what I designed now match
Reinstated — FEED · PICKS · STATS restored with PICKS as center tab, matching the current live app
What I'd Do Next
Sleeper · If I Had More Time
1. Alt lines swipe interaction
The secondary spread and O/U buttons could support horizontal swipe to reveal alt lines — eliminating the extra pop up the current app launches for alt line selection, keeping users in context and the hierarchy intact.
2. Live game state
The current design solves pregame. An in-game version would need a different hierarchy — live score becomes dominant, win probability updates in real time, and CTA logic shifts entirely.
3. Game log legibility in the picks context
Although outside the scope of the challenge, the game log inside the picks player card is cramped and visually inconsistent with the fantasy version of the same data. For a real-money decision, that friction matters — a more legible in-context game log would give users the confidence to commit without leaving the screen.
Why Sleeper?
Sleeper is the only product where I'm already the user.
People burn their screen time on IG or TikTok but during fantasy szn, me and the boys put our hours on Sleeper.
Whether it's trash talking, yoinking desired players off waivers after my star player gets injured, losing a week by .5 pts, or trying to convince one another that Curry o 3.5 3PM is a lock tonight against the Clippers.
I understand this space from both sides of the screen and I want to help build future versions of it that feel just as good to use as it does to win on.
This is where I want to grow.