CalmConnect
What?
A workplace wellbeing platform that helps remote teams check in with each other and strengthen transparency through surveys and visualized insights.
For who?
Distributed teams and managers who want to create an open, stigma-free space to discuss wellbeing, offer support, and prevent burnout.
My role
Led interface and design and prototyping during the initial hackathon, collaborating with teammates on research, concept ideation, and system mapping.
Later revisited the project independently to refine the UX, update the interface, and prototype a more engaging survey experience.
Duration
1 day (initial hackathon) + 3 weeks (solo revamp)
Tools
Figma
Figma Make
Why This Matters
The shift to remote work during the COVID-19 pandemic made it harder for teams to recognize stress and emotional fatigue early on. CalmConnect encourages proactive wellbeing conversations by helping teams visualize how they're doing and identify areas that need support.
What Users Need
Research showed that lack of support and loneliness/isolation are the biggest contributors to burnout and stress. They need a system that could balance anonymity with empathy and insight.
The Solution
CalmConnect gathers data from quick, anonymous check-ins from team members and visualizes patterns through clear, data-driven dashboards. The result helps normalize mental health discussions and empowers managers to respond with care and awareness.
The Hackathon: Designing Under Pressure
This project emerged as part of a one-day hackathon where our team was challenged to design a digital solution addressing burnout in remote work environments. With less than 24 hours to complete the challenge, we quickly divided roles, conducted lightweight research, and built a prototype that prioritized emotional connection within teams.
Research & Understanding the Problem
The Design Challenge
The COVID-19 pandemic redefined how people work, offering flexibility while also erasing the boundaries between professional and personal life. Remote workers faced increased pressure to stay constantly available, often leading to burnout and isolation.
Our design brief asked us to create a system or experience that restores work-life balance by addressing mental health, overworking, and social disconnection in remote environments.
Key Research Insights
Lack of support is the leading contributor to burnout, stress, and anxiety in the remote workplace.
Loneliness and isolation can lead to increased stress and bad decision-making.
New college grads struggle to make friends and find community when joining hybrid teas, especially if the team has pre-COVID bonds.
Feeling included in the workplace can contribute to increased productivity.
Framing the Problem
Research revealed that remote worker struggled not only with maintaining work-life balance, but also with feeling emotionally disconnected from their teams. The lack of casual interaction and open dialogue around stress made it difficult to identify when someone was overwhelmed.
We wanted to design a tool that would make these emotional check-ins natural and non-intrusive, something that helps teams see and support each other without adding to digital fatigue.
Defining the Approach
How might we...
create a workplace system that promoted open communication about mental health while preserving privacy and empathy among team members?
Design Goals
Normalize emotional transparency
Encourage teams to check in on their mental wellbeing without stigma or discomfort.
Foster connection through shared insight
Provide a visual representation of how teammates are doing to prompt empathy and awareness.
Integrate seamlessly into daily workflows
Make emotional check-ins quick, lightweight, and compatible with existing workflows.
Competitive Analysis & Ideation
To ground our concept in existing workplace wellness tools, our team conducted a competitive analysis of two platforms: Ginger (now Headspace Care) and First Up. Both aimed to improve employee wellbeing, but from very different perspectives.
While these tools measure productivity and offer self-help, few products promote collective awareness or de-stigmatize emotional transparency within teams. This inspired our team to design a tool that blends data visualization with empathetic communication to help teams understand each other's emotional health without judgment.
Ideation
With limited time during the hackathon, we rapidly conducted a brainstorming session and discussed ideas that could merge the best features of both competitors while solving their weaknesses.
Our solution focused on three core ideas:
Quick well-being surveys to capture employees' stress levels, moods, and workloads.
Anonymous team data visualizations that highlight overall morale and collective stress levels.
Manager dashboards to provide organizational insights.
Hackathon Design
After identifying key gaps in existing tools, our team rapidly designed and prototyped CalmConnect, a workplace wellbeing system that helps remote teams open up about mental health in a safe, data-driven informed way.
The final presentation consisted of:
Human-centered personas to set the stage of our product and establish core users.
A mobile app where employees complete quick, anonymous wellbeing surveys.
A data visualization dashboard with team-wide summaries that help both employees and managers track morale and identify pain points.
A system flow mapping how visibility scales across roles, from individuals to managers to leadership.
Our team prioritized clarity and empathy, ensuring each feature served our core goal: normalizing mental health conversations at work and advocating for support.
After the hackathon, I revisited CalmConnect to explore how the concept could evolve with more time and refined design thinking. My goals for this revamp were to:
Challenge myself to create a more cohesive, visually balanced interface
Enhance realism by refining survey questions to reflect real workplace stressors
Strengthen cohesion between the survey flow and data visualization for a more polished experience
This revamp became an opportunity to apply the skills I'd developed since the hackathon, moving from fast-paced ideation to thoughtful design rooted in systems thinking.
Moodboarding
Exploring Visual Language
To set a clearer visual foundation, I browsed examples of wellness, productivity, and health app interfaces that communicated calm, balance, and focus. I collected visual patterns emphasizing clean layouts, soft gradients, and inviting color palettes to guide the tone of the redesign.
Restructuring & Drafting
Transforming Sketches to Systems
I started with low-fidelity sketches to establish a more grounded flow based on the original hackathon design. I added a homepage to anchor the experience and emphasize return engagement. These sketches helped me identify and refine the structure before moving into low-fidelity wireframing.
Building on the sketches, I created lo-fi wireframes that structured the survey and visualization experience. These wireframes formed the foundation for me to use Figma Make to explore high-fidelity layout possibilities and realistic interaction patterns.
Co-Designing with AI
Accelerating the Process Using Figma Make
To accelerate the high-fidelity stage, I used Figma Make to quickly generate layouts based on my lo-fi wireframes and visual moodboard. This tool helped me iterate faster and test visual structure quickly.
I treated Figma Make as a creative partner, not a final solution. I manually refined each output, adjusting proportions, typography, and interactions to ensure that each screen and interaction conveyed clarity, calmness, and cohesion.
The Final Prototype
The final version of CalmConnect builds on the original concept but delivers a more polished experience that encourages consistent emotional check-ins.
Readily available insights encourage employees to reflect on wellness trends.
Refined survey content reflect realistic work-related stressors and daily challenges.
Wellness dashboards visualize team data in a clear, supportive way.
Unified design system reinforces calm.
Final mobile prototype
Before completing a survey: Users see pending tasks and locked insights.
After submitting a survey: Insights are unlocked to reveal team-level wellness data.
Employee Data Visualization: After completing the survey, employees are shown an anonymous summary of the survey data.
Reflection
Working on CalmConnect reminded me that design is never finished. The original hackathon project taught me the value of teamwork and rapid iteration under pressure, while the solo revamp pushed me to slow down and approach designs with a more intentional process.
Revisiting this project also showed me how much I've changed as a designer, from focusing solely on execution to thinking systemically about user experience, scalability, and visual cohesion. Experimenting with AI tools like Figma Make also reshaped how I view the design process. Rather than replacing creativity, AI accelerated exploration and allowed me to focus on the human-centered elements (empathy, clarity, and emotional impact).
This project reaffirmed that thoughtful design takes time and iteration, but at its core it's still about creating experiences that make people feel seen and supported.
