Designing an automated temperature control system to reduce insomnia
Timeline
6 Weeks (Apr-May 2022)
Role
Product Designer
Type
Personal Project
Skills
Product thinking. interaction design, usability testing
Project Context
Design brief
As part of my Computer Engineering course, I was tasked with designing a mobile experience that addresses a real world user problem. For this project, I focused on improving sleep quality by helping users maintain uninterrupted rest throughout the night.
Problem space
Many people struggle to maintain uninterrupted sleep due to temperature fluctuations throughout the night. Extreme heat or cold can lead to insomnia, nightmares, and reduced deep sleep, negatively affecting mood, focus, and daily performance.
Where the Experience Broke Down
PROBLEM DEFINITION 🎯
Current Workflow
People often wake during the night feeling too hot or too cold, disrupting sleep cycles and reducing overall sleep quality. Despite wanting better rest, many lack tools to understand when disruptions occur and how temperature impacts their sleep.
How might we regulate a user's sleep environment to maintain optimal temperature and ensure uninterrupted, high-quality sleep?
Understanding the Existing Experience
PRIMARY RESEARCH 🔎
User Interviews
I conducted interviews with high school students to uncover sleep-related challenges, behaviors, and motivations.
SECONDARY RESEARCH 🔎
Competitive Analysis
I then analyzed existing smart thermostat and sleep applications to evaluate their user experience, interaction patterns, and visual design.
Key takeaways
Use simple, clear icons for easy navigation
Incorporate intuitive temperature controls (e.g., blue/red gradients)
Prioritize minimal home screen with temperature as focal point
Allow users to set precise temperature values
Use night-themed color palette to promote calmness
Designing a Clearer Path Forward
IDEATE 🖌️
Rapid Sketches (Crazy 8's)
I sketched eight low-fidelity interface concepts to explore different layouts and interaction patterns. This helped identify which designs aligned with research insights and discard less effective options.
One concept stood out: a vertical temperature slider, clean layout, and icon-based secondary features, which closely matched competitive analysis findings.
IDEATE 🖌️
Storyboarding
I used storyboarding to visualize how the user, fan, wristband, and app interact over time. This revealed the value of logging sleep data, allowing users to correlate body temperature with sleep quality and identify optimal sleeping conditions.
IDEATE 🖌️
Lo-Fi Wireframes
I moved into low-fidelity wireframes, building on my initial ideation sketches.
IDEATE 🖌️
Mid-Fi Wireframes
With the overall page structure completed from the lo-fi wireframes, I refined the designs into mid-fidelity and prototyped key interactions and flows to prepare for usability testing.
Prototype prior to usability testing
Refining Through Critique
FEEDBACK 💬
Usability Testing
I recruited 5 high school students across different grade levels to gather diverse feedback from the target user group.
Research Goals
Validate that interactions (tapping, swiping) feel intuitive
Ensure icons are easily understood
Assess whether the app effectively teaches proper sleep hygiene
What did I learn from usability testing?
Users struggled to understand icon purposes (sleep logging, expandable sections), indicating need for clear labels or supporting text.
Users lost interest when reading long articles → shorter, more scannable content would help users stay engaged while reading articles.
Scrollability wasn't obvious to users → visual scroll indicators would help users discover and access additional content.
Dragging to expand information wasn't intuitive to users, indicating some type of explicit tap targets and familiar affordances were needed instead.
Users would rather faster learning due to their tight schedules.
ITERATE 🔁
Design Decisions
Design decision #1: sleep logging feature
How should we to present the sleep logging feature?
Icon-only sleep logging
Users struggled to interpret the icon’s purpose
Increased friction for core task
Relied on users guessing the interaction
Labeled “Log Sleep” action
Makes the primary action immediately clear
Reduces cognitive load by removing ambiguity
Supports faster task completion for first-time users
Why labeled action:
Usability testing revealed sleep logging wasn't discoverable with an icon alone. Since users are often tired at night, clarity was critical. Explicitly labeling the action ensured users could log sleep quickly without interpreting abstract symbols.
Design decision #2: educational content length
How much educational content should be shown at once?
Long-form articles
Users lost interest before finishing
Overwhelming in sleep-focused context
Reduced knowledge retention due to density
Shorter articles + progress bar
Keeps users engaged with digestible content
More scannable
Progress bar communicates additional content availability
Why shorter articles:
Testing showed users were more likely to skim or abandon lengthy articles. By shortening content and focusing on key takeaways, the app better supports quick learning without disrupting wind-down routines. The progress bar also signals there's more to explore.
Design decision #3: expandable content access
How should additional sleep insights and data be accessed?
Drag-to-expand interaction
Not discoverable to most users
Relied on hidden gestures with no visual cue
Caused users to miss important information
Tap-to-expand with arrow icon
Clearly signals more content is available
Uses familiar UI patterns users understand
Reduces confusion and improves discoverability
Why arrow icon:
During testing, users rarely attempted to drag the information panel because there was no indication it was interactive. Replacing the gesture with a visible arrow made the interaction intuitive and ensured users could easily access deeper insights when needed.
Bringing the Experience Together
PROTOTYPE ▶️
Final Designs
What This Project Taught me
REFLECTIONS 💡
Lessons Learned
Clarity comes from iteration
This project reinforced that strong design rarely comes from the first pass. Through repeated testing and refinement, I saw how features that felt intuitive to me often needed adjustment for real users. Small, targeted changes, like clarifying icons or simplifying interactions, had a big impact on usability. I've learned to treat iteration as a core part of the design process, not rework.
Making interactions explicit
I learned the importance of making interactions obvious rather than relying on users to infer functionality. Elements lacking clear visual cues created friction, even in a simple interface. Prioritizing clarity through labels, affordances, and straightforward patterns helped users navigate with more confidence and less cognitive effort.
REFLECTIONS 💡
Next Steps
Expand user research beyond high school students
Due to time constraints, I focused on high school students. I would broaden research to include university students and parents of young children to understand how sleep needs and temperature preferences vary across life stages, enabling more personalized experiences.
Design for accessibility and visual preferences
Future iterations would explore both dark and light mode options to improve accessibility and accommodate individual preferences. Providing users control over visual settings would ensure the experience remains comfortable and inclusive across different environments and needs.
