Routine Out Loud
ROL is a personalized wellness app that helps users build mindful routines through community-driven motivation and shared accountability. ROL helps users to create, track, and maintain habits for a healthier and more productive life.
This project was selected for the Pre-Startup Package, awarded government funding of 30M KRW.
Routine Out Loud
ROL is a personalized wellness app that helps users build mindful routines through community-driven motivation and shared accountability. ROL helps users to create, track, and maintain habits for a healthier and more productive life.
This project was selected for the Pre-Startup Package, awarded government funding of 30M KRW.
Routine Out Loud
ROL is a personalized wellness app that helps users build mindful routines through community-driven motivation and shared accountability. ROL helps users to create, track, and maintain habits for a healthier and more productive life.
This project was selected for the Pre-Startup Package, awarded government funding of 30M KRW.
Timeline
Jun 2025 - Aug 2025
Jun 2025 - Aug 2025
Team
1 Product Designer
1 Project Manager
3 Frontend/ Backend Developers
1 Product Designer
1 Project Manager
3 Frontend/ Backend Developers
Company
Mavericks in Motion Inc.
Mavericks in Motion Inc.
Role/ Disciplines
Market, User Research
Design System
Prototype
QA & Iteration
Android/App Store Screenshots
Market, User Research
Design System
Prototype
QA & Iteration
Android/App Store Screenshots
Timeline
Jun 2025 - Sep 2025
Team
Market, User Research
Design System
Prototype
QA & Iteration
Android/App Store Screenshots
1 Product Designer
1 Project Manager
3 Frontend/ Backend Developers
Company
Mavericks in Motion Inc.
Role/ Disciplines
Design Process
Design Process
Design Process
My Role
My Responsibilities
My Responsibilities
As a solo ux designer in our team, I was responsible for 0 to 1 product design, including product planning, content strategy, design system, prototyping, app store screenshot creation, social media marketing, and iterative testing and QA.
As a solo ux designer in our team, I was responsible for 0 to 1 product design, including product planning, content strategy, design system, prototyping, app store screenshot creation, social media marketing, and iterative testing and QA.
Background
Redesigning the Core Experience for Scalability and User Impact
Redesigning the Core Experience for Scalability and User Impact
Our company was founded in May 2025, and we launched the initial version of our app in August with a set of foundational features to accelerate time-to-market. As we continued gathering real user data and behavioral insights, we identified opportunities to elevate usability and visual coherence across the product.
This project focuses on designing the next iteration of our UI, an improved, scalable experience that we plan to integrate into the live product to support growth, retention, and long-term user value.
Our company was founded in May 2025, and we launched the initial version of our app in August with a set of foundational features to accelerate time-to-market. As we continued gathering real user data and behavioral insights, we identified opportunities to elevate usability and visual coherence across the product.
This project focuses on designing the next iteration of our UI, an improved, scalable experience that we plan to integrate into the live product to support growth, retention, and long-term user value.
Context
Context Behind The Project
Context Behind The Project
Market Landscape
While the market is saturated with habit-tracking and wellness apps, most solutions focus on individual goal-setting without addressing the fundamental human need for social connection and community support. This gap creates an opportunity for a wellness platform that combines personalization with meaningful social engagement.
While the market is saturated with habit-tracking and wellness apps, most solutions focus on individual goal-setting without addressing the fundamental human need for social connection and community support. This gap creates an opportunity for a wellness platform that combines personalization with meaningful social engagement.
Why This Matters Now?
Why This Matters Now?
Post-pandemic, there's been a fundamental shift in how people approach wellness. Users are moving away from performative social media wellness culture toward authentic, supportive communities that prioritize mental health alongside physical goals. This cultural moment creates the perfect timing for a wellness platform built on genuine connection rather than comparison.
Post-pandemic, there's been a fundamental shift in how people approach wellness. Users are moving away from performative social media wellness culture toward authentic, supportive communities that prioritize mental health alongside physical goals. This cultural moment creates the perfect timing for a wellness platform built on genuine connection rather than comparison.
UXR
User Research - Interview
User Research - Interview
I led a comprehensive research initiative to understand the psychological and behavioral patterns behind goal abandonment. My hypothesis was that social isolation and lack of personalized support were primary drivers of user disengagement.
I led a comprehensive research initiative to understand the psychological and behavioral patterns behind goal abandonment. My hypothesis was that social isolation and lack of personalized support were primary drivers of user disengagement.
We interviewed 12 potential stakeholders (6M and 6F), while focusing on understanding how often participants set daily goals, what types of goals they usually set, and how frequently they felt discouraged when trying to achieve them, as well as general questions about their daily life.
We interviewed 12 potential stakeholders (6M and 6F), while focusing on understanding how often participants set daily goals, what types of goals they usually set, and how frequently they felt discouraged when trying to achieve them, as well as general questions about their daily life.
User Research Findings
Findings From the User Interview - Core Problems
Findings From the User Interview - Core Problems
9 of 12 (75%) users failed to achieve their goals within 2 weeks
9 of 12 (75%) users failed to achieve their goals within 2 weeks
Users expressed a need for more connection with other users to maintain their motivation
Users expressed a need for more connection with other users to maintain their motivation
Users wanted to plan personalized goals in detail, rather than conforming their goals into social norms
Users wanted to plan personalized goals in detail, rather than conforming their goals into social norms
9 of 12 (75%) users failed to achieve their goals within 2 weeks
Users wanted to plan personalized goals in detail, rather than conforming their goals into social norms
Design question & Goal
User research led us to think of the design question:
User research led us to think of the design question:
User research led us to think of the design question:
How might we create a sense of community that motivates users to maintain their wellness routines?
How might we create a sense of community that motivates users to maintain their wellness routines?
Competitive Analysis and the gap
Competitive Analysis and the Gap
Competitive Analysis
Competitive Analysis
I conducted a comprehensive competitive analysis of 3 leading wellness apps to identify market gaps and differentiation opportunities. The analysis was structured across three dimensions: social features, personalization capabilities, and engagement strategies.
I conducted a comprehensive competitive analysis of 3 leading wellness apps to identify market gaps and differentiation opportunities. The analysis was structured across three dimensions: social features, personalization capabilities, and engagement strategies.
My Routine
Routinary
My Routine
My Routine
Routinary
Routinary
Habitica
Habitica
Habitica
Our competitive analysis showed that while most routine apps provide basic social features, they fail to cultivate an active community that truly supports user motivation. This inactive community experience emerged as a key reason why users discontinue using routine apps.
Our competitive analysis showed that while most routine apps provide basic social features, they fail to cultivate an active community that truly supports user motivation. This inactive community experience emerged as a key reason why users discontinue using routine apps.
Product Opportunities
Community
A comfortable space not overwhelmed by mixed information and promotions, but deeply relatable content and meaningful connections
Rolly (AI)
Accurately identify the wellness that fits user's body and mind, recommend the most relevant content, and deliver it in a clear, easy-to-digest summary
Global Connection
Not just simple connections, but a link across time and space. a single, ever-evolving space that stays active even while users are in different time zone
User Research Findings
Goals
Product Opportunities
A comfortable space not overwhelmed by mixed information and promotions, but deeply relatable content and meaningful connections
Accurately identify the wellness that fits user's body and mind, recommend the most relevant content, and deliver it in a clear, easy-to-digest summary
Not just simple connections, but a link across time and space. a single, ever-evolving space that stays active even while users are in different time zone
Rolly (AI)
Community
Global Connection
A comfortable space not overwhelmed by mixed information and promotions, but deeply relatable content and meaningful connections
Accurately identify the wellness that fits user's body and mind, recommend the most relevant content, and deliver it in a clear, easy-to-digest summary
Not just simple connections, but a link across time and space. a single, ever-evolving space that stays active even while users are in different time zone
Rolly (AI)
Community
Global Connection
Design System
Defining Design System
Defining Design System
Establishing a design system in early stage was important, since I thought a well-defined and consistent system will result in minimizing the communication gaps between developers during the development process.
Establishing a design system in early stage was important, since I thought a well-defined and consistent system will result in minimizing the communication gaps between developers during the development process.
Design Concept
Design Concept & MVPs
Design Concept & MVPs
Drawing from user research and market analysis, we decided to center our app on cultivating a supportive, collaborative community where users can confidently share their routines and stay motivated toward long-term goal achievement.
Splash & Onboarding
Introduces ROL’s purpose, helping users “get to know themselves.”
Encourages users to begin their journey through simple email signup.
Splash & Onboarding
Introduces ROL’s purpose, helping users “get to know themselves.” Encourages users to begin their journey through simple email signup.
Splash & Onboarding
Introduces ROL’s purpose, helping users “get to know themselves.” Encourages users to begin their journey through simple email signup.
Home (Routine)
Displays daily wellness routines with time-based tracking.
Users can toggle tasks on/off and monitor completion progress.
Home (Routine)
Displays daily wellness routines with time-based tracking. Users can toggle tasks on/off and monitor completion progress.
Home (Routine)
Displays daily wellness routines with time-based tracking. Users can toggle tasks on/off and monitor completion progress.
Rolly (AI)
Acts as an AI assistant offering personalized feedback and motivation. Supports voice interaction and routine recommendations based on data.
Rolly (AI)
Acts as an AI assistant offering personalized feedback and motivation. Supports voice interaction and routine recommendations based on data.
Profile
Shows user info, routines, posts, and community interactions.
Allows users to edit their profile and view connected members.
Profile
Shows user info, routines, posts, and community interactions. Allows users to edit their profile and view connected members.
Profile
Shows user info, routines, posts, and community interactions. Allows users to edit their profile and view connected members.
My Room
Connects users through interest-based community “rooms.”
Users can join, explore, or manage their own personalized spaces.
My Room
Connects users through interest-based community “rooms.” Users can join, explore, or manage their own personalized spaces.
My Room
Connects users through interest-based community “rooms.” Users can join, explore, or manage their own personalized spaces.
Diary
Visualizes daily activities and reflections through AI-generated cartoons. Lets users add diary entries to reflect on their habits and emotions.
Diary
Visualizes daily activities and reflections through AI-generated cartoons. Lets users add diary entries to reflect on their habits and emotions.
Diary
Visualizes daily activities and reflections through AI-generated cartoons. Lets users add diary entries to reflect on their habits and emotions.
Navigation Bar
Provides seamless access to main sections — Routine, Room, Rolly, Diary. Highlights the active page with a clean, minimalist icon design.
Navigation Bar
Provides seamless access to main sections — Routine, Room, Rolly, Diary. Highlights the active page with a clean, minimalist icon design.
Usability Testing
Usability Testing
Usability Testing
After identifying the key pages to include in the app, our team decided to postpone the Diary feature to prioritize a faster launch. I then created low-fidelity prototypes and conducted usability testing with six participants, focusing on the Splash & Onboarding, Home, AI (Rolly), and My Room pages. Through the user testing, I identified several usability issues within the design and refined the interface based on user feedback.
The purpose of the user testing was to deeply understand users’ expectations, behaviors, and pain points across the main flows, ensuring the product experience aligned with real user needs rather than assumptions.
After identifying the key pages to include in the app, our team decided to postpone the Diary feature to prioritize a faster launch. I then created low-fidelity prototypes and conducted usability testing with six participants, focusing on the Splash & Onboarding, Home, AI (Rolly), and My Room pages. Through the user testing, I identified several usability issues within the design and refined the interface based on user feedback.
The purpose of the user testing was to deeply understand users’ expectations, behaviors, and pain points across the main flows, ensuring the product experience aligned with real user needs rather than assumptions.
01
01
Login Page
Login Page
→
→
→
"Different input field height"
"Confusing UX writing (Login)"
"Different input field height"
"Confusing UX writing (Login)"
"Different input field height"
"Confusing UX writing (Login)"
Before
Before
Consistent button height
Accurate UX writing
Noticeable Input Field
Consistent button height
Accurate UX writing
Noticeable Input Field
Consistent button height
Accurate UX writing
Noticeable Input Field
After
After
02
02
My Room
My Room
→
→
→
"Sections lack clear visual hierarchy"
"Search UX writing is vague"
“Follow button has low contrast"
"Sections lack clear visual hierarchy"
"Search UX writing is vague"
“Follow button has low contrast"
"Sections lack clear visual hierarchy"
"Search UX writing is vague"
“Follow button has low contrast"
Before
Before
Sections are clearly separated with better hierarchy
Search bar uses clearer, action-oriented text.
“Follow” button has stronger color contrast
Sections are clearly separated with better hierarchy
Search bar uses clearer, action-oriented text.
“Follow” button has stronger color contrast
Sections are clearly separated with better hierarchy
Search bar uses clearer, action-oriented text.
“Follow” button has stronger color contrast
After
After
→
→
→
"Vague UX writing for search bar"
"Unclear visual hierarchy
"Small like button"
"Unclear filter icon function"
"Vague UX writing for search bar"
"Unclear visual hierarchy
"Small like button"
"Unclear filter icon function"
"Vague UX writing for search bar"
"Unclear visual hierarchy
"Small like button"
"Unclear filter icon function"
Before
Before
Clearer search bar with specific guidance
Balanced visual hierarchy across elements
Segmented control replaced filter icon
Clearer search bar with specific guidance
Balanced visual hierarchy across elements
Segmented control replaced filter icon
Clearer search bar with specific guidance
Balanced visual hierarchy across elements
Segmented control replaced filter icon
After
After
03
03
Home
Home
→
→
→
"Confusing hierarchy between time and routine name"
"Confusing hierarchy between time and routine name"
"Confusing hierarchy between time and routine name"
Before
Before
Improved time and routine labels through font weight differentiation
Differentiated activated routine
Improved time and routine labels through font weight differentiation
Differentiated activated routine
Improved time and routine labels through font weight differentiation
Differentiated activated routine
After
After
04
04
Rolly (AI)
Rolly (AI)
→
→
"Less personalized"
"Less personalized"
"Less personalized"
Before
Before
More personalized by adding suggested prompts
More personalized by adding suggested prompts
More personalized by adding suggested prompts
After
After
→
05
05
Profile
Profile
→
→
→
"Tight tag spacing and small edit button"
"Unclear layout between sections"
"Tight tag spacing and small edit button"
"Unclear layout between sections"
"Tight tag spacing and small edit button"
"Unclear layout between sections"
Before
Before
Enlarged and repositioned edit button
Improved tag spacing and visibility
Grouped settings into Account and Support for clearer hierarchy
Enlarged and repositioned edit button
Improved tag spacing and visibility
Grouped settings into Account and Support for clearer hierarchy
Enlarged and repositioned edit button
Improved tag spacing and visibility
Grouped settings into Account and Support for clearer hierarchy
After
After
06
06
Navigation Bar
Navigation Bar
→
→
→
"Inconsistent icon sizes"
"Menu tabs misaligned with page content"
"Inconsistent icon sizes"
"Menu tabs misaligned with page content"
Before
Consistent icon strokes; active tab enlarges icon.
Uniform icon strokes; active page highlighted by larger icon.
Consistent strokes with enlarged active icons.
Consistent icon strokes; active tab enlarges icon.
Uniform icon strokes; active page highlighted by larger icon.
Consistent strokes with enlarged active icons.
After
"Inconsistent icon sizes"
"Menu tabs misaligned with page content"
Before
Before
After
After
Final Design
Final Design
Designed to convey ROL’s calm and wellness-focused identity, the splash screen creates a welcoming first impression.
The simplified onboarding flow ensures quick, effortless access and encourages users to start their journey smoothly.
Splash & Login Flow
Designed to convey ROL’s calm and wellness-focused identity, the splash screen creates a welcoming first impression. The simplified onboarding flow ensures quick, effortless access and encourages users to start their journey smoothly.
Splash & Login Flow
My Room
My Room
My Room is a wellness community where users connect through shared routines and experiences. Explore profiles, discover inspiring rooms, and find people on the same journey.
My Room is a wellness community where users connect through shared routines and experiences. Explore profiles, discover inspiring rooms, and find people on the same journey.
Explore (Home)
My Room is a wellness community where users connect through shared routines and experiences. Explore profiles, discover inspiring rooms, and find people on the same journey.
Explore (Home)
My Room is a wellness community where users connect through shared routines and experiences. Explore profiles, discover inspiring rooms, and find people on the same journey.
ROL AI
Rolly (ROL AI) is an AI-powered wellness platform that turns user input into personalized routines and supportive communities. I designed the conversation page to enable smooth, intuitive interactions that help users build sustainable wellness habits.
ROL AI
Rolly (ROL AI) is an AI-powered wellness platform that turns user input into personalized routines and supportive communities. I designed the conversation page to enable smooth, intuitive interactions that help users build sustainable wellness habits.
Profile
Profile
Designed to highlight user identity and preferences, the profile page lets users manage settings, privacy, and support in one place. Its clean layout promotes clarity, personalization, and a sense of ownership.
Designed to highlight user identity and preferences, the profile page lets users manage settings, privacy, and support in one place. Its clean layout promotes clarity, personalization, and a sense of ownership.
Final Design
Splash & Login Flow
Designed to convey ROL’s calm and wellness-focused identity, the splash screen creates a welcoming first impression. The simplified onboarding flow ensures quick, effortless access and encourages users to start their journey smoothly.
My Room
My Room is a wellness community where users connect through shared routines and experiences. Explore profiles, discover inspiring rooms, and find people on the same journey.
Explore (Home)
Rolly (ROL AI) is an AI-powered wellness platform that turns user input into personalized routines and supportive communities. I designed the conversation page to enable smooth, intuitive interactions that help users build sustainable wellness habits.
ROL AI
Rolly (ROL AI) is an AI-powered wellness platform that turns user input into personalized routines and supportive communities. I designed the conversation page to enable smooth, intuitive interactions that help users build sustainable wellness habits.
Profile
Designed to highlight user identity and preferences, the profile page lets users manage settings, privacy, and support in one place. Its clean layout promotes clarity, personalization, and a sense of ownership.
Final Design
My Impact
Impact
Standardized the design system by defining props, variants, and API parameters for each component, reducing redundant clarification messages between teams.
Standardized the design system by defining props, variants, and API parameters for each component, reducing redundant clarification messages between teams.
Bridged Communication
Bridged Communication
Structured proposal presentation slide based on competitive analysis and market research
Structured proposal presentation slide based on competitive analysis and market research
Secured Startup Package
Accelerated product release through organized iteration and QA documentation
Accelerated product release through organized iteration and QA documentation
Accelerated Launch
Reflection
I learned…
About Cross-Functional Communication and Design Implementation
Effective cross-functional communication with developers and PM was crucial for accelerating our app launch. Regular check-ins and clear documentation reduced iterations by catching implementation issues early and creating more feasible designs from the start.
About Managing Ambiguity in a High-Autonomy Environment
The startup environment forced me to make decisions quickly with incomplete information rather than waiting for perfect clarity. I developed mental frameworks—prioritizing user needs, technical feasibility, and strategic alignment—learning that fast iteration was more valuable than perfect first attempts.
The startup environment forced me to make decisions quickly with incomplete information rather than waiting for perfect clarity. I developed mental frameworks—prioritizing user needs, technical feasibility, and strategic alignment, learning that fast iteration was more valuable than perfect first attempts.
About Prioritizing Feedback Through Iterative Reflection
I learned that treating all feedback as equally important was making the design worse, not better. By categorizing feedback distinguishing real user problems from personal preferences—I became more decisive and focused my energy on changes that actually improved the product.
I learned that treating all feedback as equally important was making the design worse, not better. By categorizing feedback distinguishing real user problems from personal preferences, I became more decisive and focused my energy on changes that actually improved the product.
Reflection
Impact
Standardized the design system by defining props, variants, and API parameters for each component, reducing redundant clarification messages between teams.
Bridged Communication
Structured proposal presentation slide based on competitive analysis and market research
Secured Startup Package
Accelerated product release through organized iteration and QA documentation
Accelerated Launch Timeline
Reflection
I learned…
About Cross-Functional Communication and Design Implementation
Effective cross-functional communication with developers and PM was crucial for accelerating our app launch. Regular check-ins and clear documentation reduced iterations by catching implementation issues early and creating more feasible designs from the start.
About Managing Ambiguity in a High-Autonomy Environment
The startup environment forced me to make decisions quickly with incomplete information rather than waiting for perfect clarity. I developed mental frameworks—prioritizing user needs, technical feasibility, and strategic alignment—learning that fast iteration was more valuable than perfect first attempts.
About Prioritizing Feedback Through Iterative Reflection
I learned that treating all feedback as equally important was making the design worse, not better. By categorizing feedback distinguishing real user problems from personal preferences—I became more decisive and focused my energy on changes that actually improved the product.