The smartphone brings convenience to our daily life. But it crosses the line from a helpful tool to one that undermines our personal well-being.
Hourglass is a smartphone case with the attached app, encouraging people to get rid of phone addiction and reduce screen time.
Individual project (Interaction Design, 3D modeling & printing, Video editing)
Nov.2019 - Dec.2019
Photo | Becca Tapert
How to help people deal with the addiction to screens and improve their digital wellbeing?
In the course ‘Consumer Electronics Design’, we were required to create an innovative concept for consumer electronics. I spent a lot of time on exploration and brainstorming. I was not able to find a solid idea for a long period. During that time, my mobile screen time skyrocketed.
I felt anxious, turned my phone over and obliged myself to focus on the current task. Suddenly, a new idea popped up. Can I make the back of the phone meaningful to users? Can I design something to help people get rid of phone addiction and reduce screen time?
Phone cases are ordinary, unobtrusive and have a high degree of freedom in customization. When people don’t want to be distracted by notifications, they will turn their phones over and can only see the phone case. I came up with the idea of designing a smartphone case that encourages people to flip their phones, thus limiting phone usage.
“I wanted to stop picking up my iPhone every time I felt even a moment’s mental pause.”
According to the Georgetown computer-science professor Cal Newport, “willpower, tips, and vague resolutions are not sufficient by themselves to tame the ability of new technologies to invade your cognitive landscape.” Thus, the intention of my design is not to let people control their mind or will power, but to give users nudge to choose a focused life consciously.
I started brainstorming ideas with low-fidelity sketches. The focus was on the information displayed on the phone case and on the mechanisms to attract users to turn their phones over. Finally, I chose to use the metaphor of hourglass to represent the concept.
First, an hourglass is a device used to measure the passage of time, which is consistent with the topic of this project. Secondly, the action of flipping the phone is reminiscent of flipping the hourglass. I would like to leverage this connection to help users to bring more awareness to their behaviors.
The first version of the phone case includes time, date, to-do list, and timer. The app consists of three parts -- to-do list management, case customization, and hourglass. For the phone case, I edited the image in photoshop to describe the concept rapidly.
I conducted two rounds of peer testing to collect feedback on the concept and interaction. Through the testing, I realized that the primary principle is to avoid driving users to distraction. And things like information structure needed to be adjusted.
Need a music controller on the case
Prefer analog hourglass than a physical one
No desire for customizing the background image
Add more gamification in the app
Reorganize the app structure
Go on with the analog hourglass
Delete unnecessary features
Set the hourglass as the focal point
I iterated the case and app based on the feedback collected in the peer testing. Moreover, I assumed that the group mode would also be an effective way to motivate users by keeping pushing each other, so I added this feature in the new version. The pages went black because I want to make the hourglass stand out more and keep the visual style of the application minimalistic and consistent with the case design.
Age between 22 - 30
Use phone over 1 hr per day
Not participated in previous peer testing
Have intentions of overcoming phone addiction
Total (30 mins)
Briefing (5 mins)
Scenario 1 - 4 (5 mins / per)
Reflection (5 mins)
The calendar is not that important
Some wording confused users
Love the group mode
The app navigation is not clear
Would like to see hourglass on the case as well
Delete unnecessary features
Add titles on each page
Enhance connection between the app and the case
Design the onboarding process to help users explore
The onboarding flow introduces users to the main features of the case and app. It explains the core benefits and how to achieve benefits via the system.
Users can use this system on their own or stay focused with friends. By creating/joining a group, they can set the total screen time for themselves and friends and keep fishes together. Through usability testing, this mode is welcomed by most of the participants. Social connectivity is an important part of helping users reduce their mobile phone usage time
With software like Sketch and Figma, I could create high-fidelity prototypes just in several minutes. However, it could be dangerous to rush into this so quickly. On the one hand, without thinking through the information architecture and the voice of the app, such decisions might not wash. On the other hand, it lies good chances to understand the users’ mental models at the formative stage. Testing with wireframes ensures that users are not influenced by the visual design so that they can focus on the interactions.
Video has an incredible power of increasing engagement. To better express my concept and realize the effect I’d like to demonstrate, I learned how to create liquid sloshing around in a container in Cinema 4D. By watching tutorials and reading manuals, I managed to achieve the effect I’d hope for. I got a sense of fulfillment from this work, which drove me so far as a designer and a life-long learner.