STAY Connected
STAY Connected
Designed a unified fan platform that reduced content fragmentation for Stray Kids fans consolidating live recaps, event discovery, and community into one seamless mobile experience. Validated through user research with 12+ participants across 3 iterative testing rounds.
Designed a unified fan platform that reduced content fragmentation for Stray Kids fans consolidating live recaps, event discovery, and community into one seamless mobile experience. Validated through user research with 12+ participants across 3 iterative testing rounds.
Mobile App
Aug - Dec 2025
Masters Capstone
Solo
Context:
Master’s Capstone Project
My Role:
Lead UX Designer user research, information architecture, interaction design, prototyping
Challenge:
Overwhelming, fragmented fan experience of Stray Kids fans across platforms
Project Goal:
Build a unified, translation-first, emotionally supportive Stray Kids fan app
Methods:
Surveys, Interviews, Documentation, Competitive Analysis, UX Research, Wireframing, Prototyping, Usability Testing, Vibe Coding
Tools:
Figma | Lovable | GitHub | FigJam | Miro | Google Forms | Zoom | Google Meet
Mobile App
August–December 2025
Master’s Capstone Project
Solo
Context:
Master’s Capstone Project
My Role
Lead UX Designer user research, information architecture, interaction design, prototyping
Challenge:
Overwhelming, fragmented fan experience of Stray Kids fans across platforms
Project Goal:
Build a unified, translation-first, emotionally supportive Stray Kids fan app
Methods:
Surveys, Interviews, Documentation, Competitive Analysis, UX Research, Wireframing, Prototyping, Usability Testing, Vibe Coding
Tools:
Figma | Lovable | GitHub | FigJam | Miro | Google Forms | Zoom | Google Meet
A fan-first platform that solves overwhelm, time-zone inequity, translation gaps, and fractured community spaces through clarity, structure, and emotional UX.
A fan-first platform that solves overwhelm, time-zone inequity, translation gaps, and fractured community spaces through clarity, structure, and emotional UX.
tl;dr
tl;dr
A fan-first platform that solves overwhelm, time-zone inequity, translation gaps, and fractured community spaces through clarity, structure, and emotional UX.
A fan-first platform that solves overwhelm, time-zone inequity, translation gaps, and fractured community spaces through clarity, structure, and emotional UX.
Skip to Solution
Key Features
Key Features
One place for all Stray Kids updates, simplified and stress-free.
Instant recaps for missed lives with translation indicators.
Discover events and connect safely with local/global fans.
Problem
Problem
Stray Kids fans (“STAYs”) navigate 8–12 different platforms—Twitter/X, Instagram, YouTube, Bubble, Stationhead, Notion dashboards, fanbase accounts, voting apps, Discord, TikTok, Google Calendars, and fan translators to stay updated.
This results in:
Missed lives due to time zones
Overwhelm from constant content drops
Difficulty knowing where to start
Delayed or missing translations
Pressure during comeback seasons
Emotional fatigue + burnout
Difficulty connecting with fans offline
Stray Kids fans (“STAYs”) navigate 8–12 different platforms—Twitter/X, Instagram, YouTube, Bubble, Stationhead, Notion dashboards, fanbase accounts, voting apps, Discord, TikTok, Google Calendars, and fan translators to stay updated.
This results in:
Missed lives due to time zones
Overwhelm from constant content drops
Difficulty knowing where to start
Delayed or missing translations
Pressure during comeback seasons
Emotional fatigue + burnout
Difficulty connecting with fans offline
Problem Statement
Problem Statement
Stray Kids fans are highly engaged but deeply fragmented scattered across 5+ platforms with no unified way to discover content, connect with other fans, or stay current without burnout. The opportunity was to consolidate this ecosystem into a single, intelligent, low-friction experience.
Stray Kids fans are highly engaged but deeply fragmented scattered across 5+ platforms with no unified way to discover content, connect with other fans, or stay current without burnout. The opportunity was to consolidate this ecosystem into a single, intelligent, low-friction experience.
Challenges & Constraints
Challenges & Constraints
The product needed to:
Reduce overwhelm without reducing content
Organize information without gatekeeping
Support global fans across time zones
Deliver a translation-first experience
Provide a calm, centralized “homebase” for fans
Help new fans learn terms + context
Support real-world community and events
Foster safety, not toxicity
Constraints
Technical: Limited API access across platforms required creative content aggregation solutions
User: Fans ranged from casual followers to obsessive daily users requiring flexible information density
Scope: 3-week timeline with a required ruthless prioritization of core flows over nice-to-haves
The product needed to:
Reduce overwhelm without reducing content
Organize information without gatekeeping
Support global fans across time zones
Deliver a translation-first experience
Provide a calm, centralized “homebase” for fans
Help new fans learn terms + context
Support real-world community and events
Foster safety, not toxicity
Constraints
Technical: Limited API access across platforms required creative content aggregation solutions
User: Fans ranged from casual followers to obsessive daily users requiring flexible information density
Scope: 3-week timeline with a required ruthless prioritization of core flows over nice-to-haves
User Research
User Research
To understand the emotional, behavioral, and logistical realities of being a Stray Kids fan, I conducted 8 user interviews and a survey of 390+ Stray Kids fans to understand content consumption habits, pain points, and unmet needs across existing platforms.
To understand the emotional, behavioral, and logistical realities of being a Stray Kids fan, I conducted 8 user interviews and a survey of 390+ Stray Kids fans to understand content consumption habits, pain points, and unmet needs across existing platforms.
Overwhelm & Fragmentation
Fans use 8–12 platforms daily and feel constantly behind.
“I check Twitter, Instagram, YouTube, SKZ fanbases… it’s too much.”
“If I want to catch up, I need at least 2 hours.”
Translation Gaps
66% struggle with translation delays; 73% rely on fan translators.
“I wait for days sometimes.”
“If nobody is translating, I skip it.”
Community Dynamics
Large group chats cause anxiety; fans want safe spaces and local friendships.
“Big group chats give me anxiety.”
“I want to meet fans but don’t know where events are happening.”
Time-Zone Disadvantage
79% miss lives; global fans wake up to hours of content already stale.
“Lives always happen when I’m asleep.”
“Everyone reacts live and I’m catching up 10 hours later.”
Comeback Pressure & Burnout
Streaming, voting, and “catching up” feel like obligations.
“Streaming felt like a job.”
“I love them, but I can’t keep up.”
New Fan Confusion
Terminology and content formats are hard to navigate.
“What’s an unveil? Mixtape? SKZ Code?”
“I wish someone told me where to start.”
"I don't know which source is right there is so much content"
Overwhelm & Fragmentation
Fans use 8–12 platforms daily and feel constantly behind.
“I check Twitter, Instagram, YouTube, SKZ fanbases… it’s too much.”
“If I want to catch up, I need at least 2 hours.”
Translation Gaps
66% struggle with translation delays; 73% rely on fan translators.
“I wait for days sometimes.”
“If nobody is translating, I skip it.”
Community Dynamics
Large group chats cause anxiety; fans want safe spaces and local friendships.
“Big group chats give me anxiety.”
“I want to meet fans but don’t know where events are happening.”
Time-Zone Disadvantage
79% miss lives; global fans wake up to hours of content already stale.
“Lives always happen when I’m asleep.”
“Everyone reacts live and I’m catching up 10 hours later.”
Comeback Pressure & Burnout
Streaming, voting, and “catching up” feel like obligations.
“Streaming felt like a job.”
“I love them, but I can’t keep up.”
New Fan Confusion
Terminology and content formats are hard to navigate.
“What’s an unveil? Mixtape? SKZ Code?”
“I wish someone told me where to start.”
"I don't know which source is right there is so much content"
What I learned from documentation
Fans consume 1–6 hours/day, bookmark but rarely return, and experience mental fatigue. TikTok/IG often surface updates faster than official sources.
“I doomscrolled all day… got a few SKZ reels.”
“I save everything but never watch it… it’s overwhelming.”
What I learned from observation (BART Anime Festival)
Fans love keepsakes and gamified interactions (passport stamps, QR quests).
Offline experiences are highly social.
Instagram reposts directly influence event attendance.
Implication: Fans want a reliable way to discover and attend events — digitally and locally.
What I learned from competitive analysis (10 platforms)
Strengths across platforms:
Personalization, centralized hubs, organized dashboards, light gamification.
Gaps across platforms:
No translation pipeline
No time-zone localization
Outdated or cluttered flows
Fragmented information
No catch-up experience
Poor event discovery
No emotional wellbeing considerations
Minimal multilingual support
What I learned from documentation
Fans consume 1–6 hours/day, bookmark but rarely return, and experience mental fatigue. TikTok/IG often surface updates faster than official sources.
“I doomscrolled all day… got a few SKZ reels.”
“I save everything but never watch it… it’s overwhelming.”
What I learned from observation (BART Anime Festival)
Fans love keepsakes and gamified interactions (passport stamps, QR quests).
Offline experiences are highly social.
Instagram reposts directly influence event attendance.
Implication: Fans want a reliable way to discover and attend events — digitally and locally.
What I learned from competitive analysis (10 platforms)
Strengths across platforms:
Personalization, centralized hubs, organized dashboards, light gamification.
Gaps across platforms:
No translation pipeline
No time-zone localization
Outdated or cluttered flows
Fragmented information
No catch-up experience
Poor event discovery
No emotional wellbeing considerations
Minimal multilingual support
Insights:
Fans check 5+ apps daily just to stay current - consolidation is the primary need, not new features
Live event recaps are the highest-value content type but the hardest to find quickly
Community spaces feel unsafe on large platforms fans want moderated, fandom-specific spaces
Insights:
Fans check 5+ apps daily just to stay current - consolidation is the primary need, not new features
Live event recaps are the highest-value content type but the hardest to find quickly
Community spaces feel unsafe on large platforms fans want moderated, fandom-specific spaces
User Persona
User Persona
Based on recurring emotional and behavioral patterns, three personas emerged:
Based on recurring emotional and behavioral patterns, three personas emerged:
User Journey Map
User Journey Map
Mapping the fan journey revealed three critical drop-off points like onboarding, live event discovery, and community entry. These became primary design focus areas.
Mapping the fan journey revealed three critical drop-off points like onboarding, live event discovery, and community entry. These became primary design focus areas.
Service Blueprint
Service Blueprint
A service blueprint mapping how fans move through the STAY Connected ecosystem revealing the front-stage interactions and back-stage systems needed to deliver a calm, seamless fan experience.
A service blueprint mapping how fans move through the STAY Connected ecosystem revealing the front-stage interactions and back-stage systems needed to deliver a calm, seamless fan experience.
Information Architecture
Information Architecture
Early IA explorations used a tab-based structure with 6 top-level sections. User testing revealed this
created cognitive overload and so I simplified it to 4 primary destinations with progressive disclosure
for secondary content.
Early IA explorations used a tab-based structure with 6 top-level sections. User testing revealed this
created cognitive overload and so I simplified it to 4 primary destinations with progressive disclosure
for secondary content.
Low fidelity Wireframes
Low fidelity Wireframes
I mapped the six primary flows:
Onboarding
Catch-Up
Missed Live
Comeback Hub
Event Finder
Community & Profile
Testing Goals
Establish mental models
Validate flow priority
Identify confusing terminology
I mapped the six primary flows:
Onboarding
Catch-Up
Missed Live
Comeback Hub
Event Finder
Community & Profile
Testing Goals
Establish mental models
Validate flow priority
Identify confusing terminology
Low-fidelity wireframes were tested with 6 users and three key changes emerged:
The home feed needed stronger content hierarchy
Thee event discovery flow had too many steps
The community entry point was buried.
These insights directly shaped the high-fidelity iteration.
Low-fidelity wireframes were tested with 6 users and three key changes emerged:
The home feed needed stronger content hierarchy
Thee event discovery flow had too many steps
The community entry point was buried.
These insights directly shaped the high-fidelity iteration.
Branding
Branding
Inspired by Stray Kids’ bold identity:
Inspired by Stray Kids’ bold identity:
High fidelity Wireframes
High fidelity Wireframes
High-fi screens incorporated all research insights:
Clearer labels
Translation-forward
Localized timestamps
Calm, spaced layouts
Predictable navigation
High-fi screens incorporated all research insights:
Clearer labels
Translation-forward
Localized timestamps
Calm, spaced layouts
Predictable navigation
The Catch-Up feature delivers a structured daily or weekly digest across all platforms, reducing the time and effort needed to understand what happened. It is designed around a 'Today's Priority' card that surfaces the
most time-sensitive content first, reducing the need to scroll.
The Catch-Up feature delivers a structured daily or weekly digest across all platforms, reducing the time and effort needed to understand what happened. It is designed around a 'Today's Priority' card that surfaces the
most time-sensitive content first, reducing the need to scroll.
For fans who miss lives, this flow provides a short recap, a full live with chapters, and translation ETA indicators addressing one of the biggest pain points for global fans.
For fans who miss lives, this flow provides a short recap, a full live with chapters, and translation ETA indicators addressing one of the biggest pain points for global fans.
The Comeback Hub consolidates all comeback-related content such as music video, performances, interviews and introduces an optional personalized checklist to reduce pressure.
The Comeback Hub consolidates all comeback-related content such as music video, performances, interviews and introduces an optional personalized checklist to reduce pressure.
Fans can discover both official and fan-hosted events through a multi-city, map-based system that includes RSVP, wallet integration, and calendar syncing. It was also reduced from 5 steps to 3 by consolidating filter and
browse into a single swipeable surface.
Fans can discover both official and fan-hosted events through a multi-city, map-based system that includes RSVP, wallet integration, and calendar syncing. It was also reduced from 5 steps to 3 by consolidating filter and
browse into a single swipeable surface.
The community space is intentionally small-scale and moderated. It focuses on meaningful interactions, not algorithm-driven feeds.
The community space is intentionally small-scale and moderated. It focuses on meaningful interactions, not algorithm-driven feeds.
Rapid Prototyping with Lovable (vibe coding)
Rapid Prototyping with Lovable (vibe coding)
Used Lovable (an AI-powered vibe-coding tool) to rapidly generate a functional front-end prototype, enabling real user testing with an interactive build rather than a static click-through compressing the prototyping timeline by approximately 60%.
Used Lovable (an AI-powered vibe-coding tool) to rapidly generate a functional front-end prototype, enabling real user testing with an interactive build rather than a static click-through compressing the prototyping timeline by approximately 60%.
My Process
I wrote structured mega-prompts (with ChatGPT) to reduce trial-and-error.
Low-fi → took me around ~20 credits
After refining prompts → it only took me around 2–3 credits per full flow
Connected GitHub for image/asset management
Coded 30+ screens in a single day
My Process
I wrote structured mega-prompts (with ChatGPT) to reduce trial-and-error.
Low-fi → took me around ~20 credits
After refining prompts → it only took me around 2–3 credits per full flow
Connected GitHub for image/asset management
Coded 30+ screens in a single day
Check out the live app here (best viewed on a mobile): https://stay-connect-skz.lovable.app/
Check out the live app here (best viewed on a mobile): https://stay-connect-skz.lovable.app/
What I Learned
Prompt writing = designing logic
Naming components clearly saves hours
GitHub is essential for asset-heavy UI systems
AI-assisted coding still requires UX intuition
Visual prototypes feel “alive” when rendered as functional screens
What I Learned
Prompt writing = designing logic
Naming components clearly saves hours
GitHub is essential for asset-heavy UI systems
AI-assisted coding still requires UX intuition
Visual prototypes feel “alive” when rendered as functional screens
User Testing
User Testing
I tested the Figma prototype and Loveable vibe coded app with 7 fans across India, the U.S., Australia, Middle East and Singapore.
Testing Round 1: 6 participants, identified navigation confusion and content hierarchy issues
Testing Round 2: 5 participants, validated revised Information Architecture, surfaced copy clarity issues
Key outcome: Task completion for event discovery improved from 58% to 89%
between rounds
What worked
Catch-Up was the favorite feature “This alone replaces Twitter for me.”
Missed Live Recap reduced FOMO “Finally, I don’t feel guilty missing lives.”
Event Finder felt unique “Nobody puts events in one place. This is huge.”
What needed work
SkzLog needed clearer entry point
Back button in some screens was missing
Suggestion word confused users
Onboarding could use a quick tutorial
Testing Round 1: 6 participants, identified navigation confusion and content hierarchy issues
Testing Round 2: 5 participants, validated revised Information Architecture, surfaced copy clarity issues
Key outcome: Task completion for event discovery improved from 58% to 89%
between rounds
What worked
Catch-Up was the favorite feature “This alone replaces Twitter for me.”
Missed Live Recap reduced FOMO “Finally, I don’t feel guilty missing lives.”
Event Finder felt unique “Nobody puts events in one place. This is huge.”
What needed work
SkzLog needed clearer entry point
Back button in some screens was missing
Suggestion word confused users
Onboarding could use a quick tutorial
Prototype
Prototype
STAY Connected
This flow is the high-fidelity version of the core experience, built from insights gathered across research and usability tests.
This flow is the high-fidelity version of the core experience, built from insights gathered across research and usability tests.
What I learned
What I learned
This project pushed me to think beyond individual screens toward ecosystem design. The biggest lesson was that fans don't have a content problem they have a fragmentation problem. Solving it required understanding the entire service layer, not just the app interface. Working within a time constraint also forced me to prioritize ruthlessly, which made me a better decision-maker under pressure.
Future Scope
Future Scope
Given more time, I would explore personalization through listening history and engagement patterns, deeper integration with streaming APIs, and a notification system that reduces rather than adds to information overload.
Outcome
Outcome
Delivered a fully tested, high-fidelity prototype validated across two rounds of user testing. The final design consolidated 5+ fan touchpoints into a single platform, with a task completion rate of 89% for core flows. Presented to peers and faculty at CSUEB as part of graduate research.
View My Other Projects
↑
↑