Calm Cuppa — Mobile App UI/UX & Digital Brand System
UI/UX Design, Custom Illustration
2026
UI/UX Designer & Illustrator
Client Name
Calm Cuppa (Internal Project Concept)
Credit
UI/UX Design & Illustration: Aprar design
Project
Mindfulness, relaxation, and wellness mobile application design system.
Request
Create an ultra-welcoming, accessible user interface that reduces cognitive overload and encourages daily mindfulness.
Establish a playful, story-driven character motif as a core visual asset to guide users through the app sections.
Integrate a warm, comforting color scheme that stands out within the modern wellness app ecosystem.
Ensure UI elements, layouts, and interactive screens are optimized for high readability, responsive screen scaling, and clear digital navigation.
Design Concept
UI/UX Architecture & User Flow
To ensure the digital interface directly promotes wellness, the user experience was mapped to prioritise calm, friction-free interactions:
The Tea & Drink Hub (Main Screen): Employs large, thumb-friendly touch targets and clear card modules displaying tea recipes, reducing decision fatigue for users looking to unwind.
The Interactive Wellness Flows: The yoga timer and music playback interfaces utilise spacious, open screen padding and minimal controls, helping users keep their focus strictly on their relaxation practices.
Custom Character Integration & Social Extension
To make the application feel uniquely comforting and personal, a dedicated vector character is fully woven into the operational design framework:
In-App Guidance: The custom character serves as a soft visual anchor across various interaction states—resting comfortably during music playback or guiding the user through active yoga poses.
Out-of-App Marketing: The asset carries over perfectly to social extensions, like the curated Instagram graphics, establishing an instant, welcoming emotional bridge that feels cohesive across both the app store and daily media touchpoints.
Brand Colour Palette & Cultural Significance
The primary palette departs from cold, clinical app aesthetics, using soft, warm, mid-tone hues to emulate cozy comfort:
Sunlit Marigold (#F5A623): Evokes the bright, restorative warmth of brewing herbal teas and sunny morning energy.
Matcha Green (#7DA172): Grounded in nature, providing a restful, soothing organic tone for navigation backdrops and balanced visual interfaces.
Blossom Pink (#F39FA9): Injects a youthful, welcoming sense of playful joy and emotional accessibility across key buttons and highlights.
Cream & Off-White Base: Serves as a low-contrast background tone, significantly reducing screen eye strain during late-night or early-morning use.
Design Execution & Scalability
The overall visual strategy successfully balances rich information density with an inherently clean, minimalist digital framework. By blending custom digital character artwork directly into functional UI components, the app transforms from a standard utility tool into an emotionally engaging companion platform.
The system's modular component design scales flawlessly between complex layout views—such as deep menu lists and media players—and highly simplified components like icons, system badges, and notification popups. This comprehensive scalability guarantees that Calm Cuppa delivers a uniform, high-quality, and deeply relaxing visual experience across all screen sizes and responsive digital configurations.
Calm Cuppa — Mobile App UI/UX & Digital Brand System
UI/UX Design, Custom Illustration
2026
UI/UX Designer & Illustrator
Client Name
Calm Cuppa (Internal Project Concept)
Credit
UI/UX Design & Illustration: Aprar design
Project
Mindfulness, relaxation, and wellness mobile application design system.
Request
Create an ultra-welcoming, accessible user interface that reduces cognitive overload and encourages daily mindfulness.
Establish a playful, story-driven character motif as a core visual asset to guide users through the app sections.
Integrate a warm, comforting color scheme that stands out within the modern wellness app ecosystem.
Ensure UI elements, layouts, and interactive screens are optimized for high readability, responsive screen scaling, and clear digital navigation.
Design Concept
UI/UX Architecture & User Flow
To ensure the digital interface directly promotes wellness, the user experience was mapped to prioritise calm, friction-free interactions:
The Tea & Drink Hub (Main Screen): Employs large, thumb-friendly touch targets and clear card modules displaying tea recipes, reducing decision fatigue for users looking to unwind.
The Interactive Wellness Flows: The yoga timer and music playback interfaces utilise spacious, open screen padding and minimal controls, helping users keep their focus strictly on their relaxation practices.
Custom Character Integration & Social Extension
To make the application feel uniquely comforting and personal, a dedicated vector character is fully woven into the operational design framework:
In-App Guidance: The custom character serves as a soft visual anchor across various interaction states—resting comfortably during music playback or guiding the user through active yoga poses.
Out-of-App Marketing: The asset carries over perfectly to social extensions, like the curated Instagram graphics, establishing an instant, welcoming emotional bridge that feels cohesive across both the app store and daily media touchpoints.
Brand Colour Palette & Cultural Significance
The primary palette departs from cold, clinical app aesthetics, using soft, warm, mid-tone hues to emulate cozy comfort:
Sunlit Marigold (#F5A623): Evokes the bright, restorative warmth of brewing herbal teas and sunny morning energy.
Matcha Green (#7DA172): Grounded in nature, providing a restful, soothing organic tone for navigation backdrops and balanced visual interfaces.
Blossom Pink (#F39FA9): Injects a youthful, welcoming sense of playful joy and emotional accessibility across key buttons and highlights.
Cream & Off-White Base: Serves as a low-contrast background tone, significantly reducing screen eye strain during late-night or early-morning use.
Design Execution & Scalability
The overall visual strategy successfully balances rich information density with an inherently clean, minimalist digital framework. By blending custom digital character artwork directly into functional UI components, the app transforms from a standard utility tool into an emotionally engaging companion platform.
The system's modular component design scales flawlessly between complex layout views—such as deep menu lists and media players—and highly simplified components like icons, system badges, and notification popups. This comprehensive scalability guarantees that Calm Cuppa delivers a uniform, high-quality, and deeply relaxing visual experience across all screen sizes and responsive digital configurations.
Aprar design