Designing UCLA’s Digital Wellbeing Platform
Building a digital home for health and wellbeing for 40,000+ UCLA students.
How might we make campus support feel easy to discover during the moments students need it most?
- Role
- UX & UI Designer & Branding
- Timeline
- 2021
- Collaborators
- Creative Director · Product Strategist · Marketing · UCLA Resilience Program
- Related public product
- Be Well Bruin
Impact
Designed and developed UCLA’s Be Well Bruin digital wellness platform, helping students more easily discover campus resources that support their academic, emotional, physical, social, and financial well-being.
Working closely with the UCLA Resilience Program and the creative agency, I translated product strategy into responsive user experiences - from user flows and wireframes to prototypes, design systems, illustrations, and front-end implementation. The platform launched as a centralized resource hub serving more than 40,000 UCLA students. The publicly available site now organizes more than 100 campus resources and provides personalized guidance to help students navigate support services. (bewellbruin.ucla.edu)
The Challenge
Students often know support exists - but not where to find it.
UCLA offered a wide range of wellness programs across different departments, creating a fragmented experience that made it difficult for students to discover the right resource when they needed it.
The challenge was to transform a complex network of services into a single, approachable experience that felt clear, welcoming, and easy to navigate.
Design Principles
Reduce friction
Finding help should feel easier than searching for it.
Design with empathy
Wellness experiences should feel welcoming, approachable, and supportive.
Clarity builds confidence
Simple navigation and clear information empower students to take the next step.
Designing the Experience
I helped translate product strategy into an end-to-end digital experience by:
- Designing responsive user flows, wireframes, and interactive prototypes.
- Creating a scalable design system to maintain consistency across the website.
- Designing custom illustrations that aligned with the Be Well Bruin visual identity.
- Developing front-end experiences that balanced usability, accessibility, and responsive behavior.
- Working directly with stakeholders to iterate on designs and align the experience with the program’s goals.
Rather than presenting students with a long directory of services, the experience focused on helping users quickly identify relevant resources through intuitive navigation, approachable visual design, and personalized guidance.
On mobile, the same system stays light, glanceable, and easy to navigate.
Visual identity
Beyond the product experience, I created a flexible illustration system that reflected the product personality. Each element was designed to be remixed across photography, marketing, and digital touchpoints while maintaining a cohesive brand identity - hand-drawn motifs that give the brand warmth and personality.
