Nora Music
Designing the onboarding and profile experience for the IMDB for music fans.
Duration
May 2025
Roles
User Experience Designer
Skills
UI/UX Design
Rapid Prototyping & Iteration
User-Centric Design
Tools
Figma
Photoshop
Overview
Background
Nora Music is a startup building a fandom platform where fans can showcase engagement, track stats, and stay connected to artist communities. I designed and delivered high-fidelity onboarding and profile UX flows, balancing playful, tactile interactions (fan cards and reveal moments) with clear, uncluttered data visualizations. The work progressed from low to high-fidelity across the onboarding, profile, and charts screens handed off directly to developers in 10 days.
Challenge
How might we design a memorable onboarding flow that makes fans feel instantly recognized and motivated to participate without overwhelming them with data or setup friction?
Concept
Search through charts on different platforms
Solution Synopsis
Embedded sharability into the product experience, turning fan activity into social artifacts that reinforce community participation
Multi-step onboarding with clear progress cues to reduce burnout and keep momentum
Structured visual hierarchy for data to feel both credible and approachable
Process
Design Process
I began each flow by aligning with the founder on how the page fit into the overall product, then sketched the user journey and mapped the screen sequence before building. I used mid-fidelity layouts to validate navigation, toggle logic, and hierarchy, then moved into high-fidelity within Nora's design system and built interaction states for handoff. Throughout, I stayed in sync with developers to ensure the implemented UI matched the system and the Figma handoff was frictionless.
Moving from lofi to hifi
Iteration
We iterated on onboarding pacing and sharability moments, using patterns from Stationhead and Lapse (minimal screens, segmented inputs, satisfying microinteractions) and tightening data clarity across charts/search.
Onboarding Ideation
Pros
Under 3 key stages to prevent form fatigue
Progress indicator to keep users oriented
Lightweight profile personalization (ex. top 3 songs) + Welcome to Nora reveal moment
Cons
Early versions needed stronger completion feedback between stages
Some choices (ex. notifications frequency) were easy to misinterpret without clearer framing
Required tighter alignment on what must-have setup info belonged in MVP vs later
Profile Page Ideation
Pros
Added focused search bar + typeahead results (Spotify/Apple Music pattern)
Introduced results list view with artwork thumbnail + type badge (Track/Artist/Album)
Improved chart readability with full-width tables, brand gradient continuity, and clear labeling (ex. thresholds)
Cons
More UI states increased implementation complexity
Toggle behavior needed careful mapping to the correct chart contexts
Required extra attention to hierarchy to avoid visual clutter while staying on-brand
Result
Onboarding to Profile Page Walkthrough
What we delivered
24 high-fidelity Figma frames covering onboarding, profile, search, and charts flows
Interactive component states with developer-ready specs
Design-system-aligned UI patterns scalable across future artist communities
