SONOS x SLeep

Sonos+Banner+%281%29.jpg

Design Challenge | Autumn 2019 

Team: UX Designer, Software Engineer, Hardware Engineer, Sound Engineer, Video Specialist

Role: Lead UX Designer


OVERVIEW:

Throughout the course of two weeks during my first semester of junior year, I participated in a challenge sponsored by Sonos, one of the world’s leading speaker manufacturers. I was placed in a multidisciplinary group and was tasked with designing, engineering, and prototyping a new enhancement to connect with the Sonos API, but with a twist.

CHALLENGE:

How do we design or build an experience that transitions people between spaces?


RESEARCH:


BRAINSTORMING:

After receiving our tasked challenge, my group met up to have a brainstorming session of how in the world to answer this question. While the question is intriguing, the ambiguity of it left us with a million questions and ideas of how to answer it.

Below, you can see just a few ways we thought about potential problem statements.

 
IMG_6295.jpeg
 

One thing all of us agreed on was it’s hard to wake up in the morning. Alarms scare us, our phones tempt us, but most of all we just don’t want to get out of bed. While exploring the space of moving in and out of bed, we decided to flip our problem on its head and talk about the process of falling asleep. There’s been plenty of apps done before to help students wake up in the morning, but less so that help move you into bed at night. 

Our idea wasn’t just to play relaxing music, it’s to have a tool to guide you into your bedtime routine with the assistance of Sonos.

Problem Statement:


Sonos users want an extension to their Sonos ecosystem that guides them into bed at night so they can get a better night's sleep and be more productive the next day. 


Screen Shot 2019-10-06 at 7.02.37 PM.png

Personas + Initial Research:

The interviews that we conducted were between the five of us. We asked each other questions about our sleep process, what our days were like that led us into bed, what our nightly routines are and so on. From the compilation of data that we found, I made a use case to personify who would be using our extension.








PROTOTYPING:


LOW-FIDELITY WIREFRAMES:

Once we had a general idea of what an audience member might be looking for in this app, I went into low fidelity wireframes.

IMG_6457.jpeg
IMG_6462.jpeg
IMG_6461.jpeg
IMG_6464.jpg



FEEDBACK:

Based on the initial wireframes, I got a mix of reviews from the various engineers. From the sound engineer, I learned that the sounds were going to be created in increments of wavelengths rather than pockets of color frequencies.

New evaluation of sound start based on feedback

New evaluation of sound start based on feedback

This required the first design change. Second, the hardware designer brought up the need for a “home base” to link out where each of the loops of the app start (such as the settings, the on boarding quiz, and when it’s actually running). Lastly, from the software engineer I learned that we needed to change the format of the clock, as well as update the levels of sound selection. Working with the engineers was incredibly beneficial because their constraints and ideas actually forced me to be more creative in how I redesigned. Coming back to the wireframes and having a clearer vision in mind that aligned with the rest of my groups allowed me to make more efficient design decisions.

New clock feature based on group feedback

New clock feature based on group feedback

Additionally, I had to remove the sleep analysis page because it was out of scope given our time constraints and the engineers knowledge of tech-wellness functionality. In addition to all of these pieces of first-round feedback, I had to do research on the branding and design of Sonos.

AESTHETICS:

Once we finalized the functionality, I moved into designing the aesthetics of the app. Wanting in to be on-brand with the Sonos ecosystem, I dove into their branding guidelines and what the stand-alone Sonos app interface looks like.

 
Competitive Analysis Collage.png
 

I chose to lean heavier towards the company’s branding rather than it’s app interface because I wanted this to be notably different than the traditional Sonos UI. Also, rather than having this be a traditional app experience, I wanted it to be more of a journey that the user takes, with the emphasis being on the on boarding and its function.

HIGH-FIDELITY WIREFRAMES:

After collaborating coming back to the drawing board for a second round of iterations, I was able to create a final set of wireframes. Some important changes to note are the addition of the clock and the levels of sound verifiers based on previous collaboration efforts the whole team had. Click through the prototype below to see our final iteration!

 

TAKEAWAYS:

Add empathy research - since we were on a time crunch for this project, there wasn’t much opportunity to get true user feedback. One facet of research that guides me through each of projects is empathizing with the user. Without having the time to interview and understand real users, I felt that the empathy for the user was missing in my designs and could’ve addressed the issue even further.

Go with the flow - again due to the time crunch constraint, there wasn’t much opportunity to iterate the user flow. Once we had the first idea of how the app would loop, we stuck with that one. Moving forward, and coming back to this project, I plan to spend more time iterating through user flows to insure the architecture of the app is the most functional it can be.