Case Study: Anchor
Helping users build emotional awareness and consistency through simple, low-friction mental health check-ins
Project at a glance:
Problem: Users struggled with consistent mental wellness due to emotional fatigue, unclear progress, and overwhelming tools.
Solution: A calm, mobile-first wellness app focused on reflection, awareness, and simple daily actions.
Focus: Emotional clarity, habit consistency, low cognitive load
Outcome: A low-pressure experience that supports regular mental check-ins without overwhelm.
Designer - Dylan Fenton | Role - UX/UI Designer | Platform: iOS | Tools Used - Figma | Timeline - Dec. 2025 (1.5 weeks)
Problem & Opportunity
Many mental wellness tools demand high emotional energy at moments when users have the least to give. Common challenges included:
Overly complex flows during emotionally vulnerable moments
Lack of structure for daily reflection
Inconsistent navigation that increased cognitive load
Progress tracking that felt abstract or discouraging
In emotionally sensitive contexts, even small usability issues compound friction.
The Problem
This created an opportunity to design a system that:
Supports quick, low-effort emotional check-ins
Prioritizes clarity over depth during moments of stress
Encourages consistency through habit-friendly patterns
Provides reassurance without demanding engagement
The Opportunity
Understanding the emotional friction in existing mental health apps
Goals & Design Principles
What Anchor set out to achieve
Reduce emotional and cognitive friction during use
Support daily reflection with minimal interaction cost
Establish predictable patterns to build trust and habit
Keep users oriented without instructional burden
Primary Goals
These goals were defined early to ensure the product reduced pressure rather than introducing new expectations
Design Principles
Cognitive load reduction
Progressive disclosure
Calm visual hierarchy
Mobile-first interaction design
Clear primary actions at each step
Soft guidance rather than forced flows
Glanceable content suitable for short sessions
Emotional safety through consistency and tone
Design decisions favored repeat use and emotional accessibility over feature density.
UX Priorities
Information Architecture
A lightweight hierarchy that prioritizes ease of use over complexity
Anchor App
Home
Reflect
Profile
Explore
Log Mood
View Patterns
Preferences /
Privacy
Learn About Anchor
Account Settings
Mood History
Low-Fidelity Wireframes
Translating structure into simple, low-pressure interactions
This phase reduced rework later and clarified interaction intent.
Landing Page
Mood History
Low-fidelity wireframes focused on:
Validating structure before visual styling
Establishing predictable layout rhythms
Testing interaction flow in emotionally sensitive contexts
User Flow Diagram
App Launch
Welcome Screen
Get Started
Login
Home
Log Mood
Profile/Settings
Explore w/o Logging In
Learn About
Anchor
Log Mood
(Optional)
Exit
Log Mood
Profile / Settings
Create Account
Optional Context (Skip Anytime)
Home
Early user flows emphasized:
A single clear entry point per session
Short decision paths during emotional check-ins
Easy exit without penalty
This ensured users never felt trapped, rushed, or overwhelmed.
High-Fidelity UI Screens
These high-fidelity screens translated validated low-fidelity structures into detailed, interactive layouts.
Clear hierarchy for primary actions
Readable, accessible spacing
Consistent navigation with efficient content density
Primary actions were placed within thumb-reachable zones to support ease of use during low-energy moments.
Onboarding / Landing Page
Home
Profile & Settings
Mood History
Visual Direction & UI System
Designing a calm, supportive interface that minimizes emotional friction
This UI system supports reflection without pressure, allowing users to engage only as much as they feel comfortable.
The color system was designed to feel calm and non-clinical, avoiding high-contrast or emotionally charged colors that could feel overwhelming during low-energy moments.
Typography prioritizes readability and warmth over visual impact, ensuring text feels supportive rather than instructional.
Primary typeface: Quicksand
Color System
Typography
Components & Interaction Style
90B9C3
357961
BFDAF5
377B64
434343
287437
377B64
AF3C31
Login
Password:
Results & Impact
Reduced friction during emotionally vulnerable moments
Faster repeat interactions through predictable flows
Clear hierarchy that supports reflection without overwhelm
Key UX Outcomes
Cognitive load reduction
Progressive disclosure
Mobile-first interaction design
Reusable component system
Design Principles Applied
Expansion of reflection tools and emotional tracking
Scalable support content without redesigning core flows
Flexibility for multiple wellness goals
What This Design Enables
Validating structure first clarified primary actions, reduced decision fatigue, and supported quick, low-pressure mental check-ins.
Reflection & Next Steps
This project demonstrates my approach to UX design: validating structure first, refining interaction through iteration, and applying visual design intentionally to support real user behavior.
Key Learnings
Structure drives usability
Validating layout and flow early reduced friction and increased confidence in later design stages.
Context shapes interaction design
Designing for emotionally vulnerable moments reinforced the need for simplicity, clarity, and restraint.
Consistency builds muscle memory
Repeated patterns helped users feel grounded and supported across sessions.
Opportunities for Future Iteration
Usability testing focused on emotional clarity
Expanded reflection and progress indicators
Accessibility refinements for low-attention use
Validation of scalability with additional user roles