Back to Portfolio

Leave Me Alone

Productivity and Focus Mobile App Design

Methods

Goal-Directed Design
User-Centered Design

Tools

Adobe XD
Adobe Illustrator
Discord

Roles

Interaction Designer
Visual Designer
User Researcher

Course

Interaction Design I

Timeline

FEB 2019 - APR 2010
(10 Weeks)
View the interactive prototype

Introduction

Premise

Leave Me Alone began from a wish that people would be less dependent on their phones and be more present with friends and family. Our phones are so important to us. We use them as a utility to accomplish tasks, consume media, and stay connected with others on a global scale. But do our phones truly connect us? Or are our phones distracting us from the real world? People are constantly scrolling, typing, clicking and swiping. How can we keep something so essential from being overused? How can we combat phone addiction? My team and I have designed a solution. Leave Me Alone is an IOS app intended to keep our users off their phones at times when the real world is more important. Whether the user needs help to keep from texting and scrolling while out with friends and family, or needs to remove distractions while studying or working, Leave Me Alone will allow users to achieve these goals.

My Role

Through this project I was able to learn a number of new skills and build on prior skills. I took on the roles of interviewer and facilitator across different interviews. I was able to work in a team to map interview variables and create personas. My main role was that of visual designer. I created our mobile app prototype based on requirements and user feedback. I also gave the app its visual treatment to create the look and feel that best fit our users' goals.

Process

Goal Directed Design Process

Research
users and the domain
Modeling
of users and use context
Requirements
definition of user, business, and technical needs.
Framework
of behaviors, form, and content
Refinement
development needs

To design the Leave Me Alone app, my team followed the Goal Directed Design Process. Goal Directed Design is a design methodology, developed by Alan Cooper, that keeps user goals at the focal point of the entire process. The process begins with a literature review and competitive audit to gain a knowledge base on the subject. The next step is subject matter expert interviews and user interviews. The first round of user interviews is intended to identify the goals, activities, and tasks of potential users. Attributes from these interviews are then mapped to find patterns and correlations of attributes and goals. From these commonalities, primary and secondary personas are created, to represent main user and secondary user scenarios. Personas are fictional people created to represent the goals of multiple users, while still focusing the design process around an individual. From the personas, a list of design requirements is created. Using these requirements, designers create sketches and prototypes to demonstrate ideas. The rest of the process is a cycle of testing the prototype on users and making refinements until the product is ready for developers.

Research Phase

Literature Review and Competitive Audit

To begin the process, we conducted research to inform us on the subject matter and investigate apps and software in the same niche. We knew it would be important to have an understanding of human behavior and what general motivations people have. We also needed to look into the psychology and motivations behind phone addiction and why it is so prevalent amongst young people. Next, we compiled a list of competitive apps and programs in the same niche. The two main apps we focused on were “Forest” and “Freedom.” “Freedom” is an app and website blocker that blocks sites during a timed session. The key feature of this program is that it allows the user to select which apps and website he/she would like to block during a session. “Forest” is a productivity app that keeps users from leaving the app by rewarding them by growing virtual trees and killing their virtual tree if he/she leaves the app. The important aspect of this app is that it does not actually block users out of other apps, it simply uses a system of rewards and punishment to make users more productive. This research became an important reference as we continued the process.

User Interviews

With the information we gained, we were able to find trends and map variables. Through this we found that certain variables clustered together. With some variables most of our interview subjects clustered together in the same area. With others we saw two distinct groups of behavior, with some outliers. The most important cluster we found was the most of our subjects valued being present in the real world over anything else. The other interview subjects clustered around the motivation of wanting to disrupt binging of distracting media. These two clusters became the guiding light in creating our primary and secondary personas.

Mapping Our Findings

Early user interviews are a crucial step in the Goal Directed Design Process. We interviewed six college students from the ages of 18-25. We set out to ask these subjects high level questions, learn about their goals and motivations, and encourage story-telling of their experiences. From these interviews, we found out about users’ goals, motivations, and how they use their phones. We asked them what role a phone plays in their life. We asked them what was valuable to them about their phones. We learned what about their phones wasted their time or was an issue. We learned what they want out of life and relationships. We learned what being more productive and connect to the world would mean to them. Through asking questions like these we discovered what a user end goals and life goals might be.

Modeling Phase

Personas

Our primary persona, Michael, is a social persona. He enjoys going out with his friends for a coffee or dinner. He and his friends always struggle to stay off their phones and in the moment. Michael needs an app that can quickly and automatically keep him from being distracted in these situations. He would like his friends to have the app and all be able to work in a group to stay more present and hold each other accountable.

Our Secondary Persona, Emily, is not as social as Michael. She likes to stay in and keeps busy with homework. But she also loves to consume media online. She often finds herself distracted by watching Netflix, binging YouTube, or scrolling Instagram when she needs to be focused on school. Emily needs an app that will keep her off her phone for a set amount of time so she can stay productive.

Requirements Definition Phase

Design Requirements

Framework Phase

Sketches/Wireframe

We began the layout of the app with low-fidelity sketching, imagining how our personas would move through the app to accomplish their goals. At first, we did not focus on the layout of each screen, rather, we thought about what tasks the users would need to complete on each screen and what screens they would need. As we figured out these higher-level questions, we started to wireframe the layout of each screen and think about how each would make our user feel.

Refinement Phase

Michael's Scenario (Primary Persona) - Key Path Scenario

As a heavy digital calendar user, Michael would likely have his Google Calendar synced with Leave Me Alone. This allows Leave Me Alone to recognize when he has an event planned and send him a notification. Michael can simply click on the notification bubble to be taken to the event screen, where he can see event details, add other LMA users into the event, and start the event.

As Michael adds his friends into the event, each will receive a notification prompting them to open the app. When Michael starts the event, the whole group will have the simple "Leave Me Alone" screen on their phone, meaning they can't leave the app without the rest of the group knowing.

Michael has a short list of contacts that he can call during an event. If one of these people texts him, he will be given the choice to ignore the text or reply within the app. If anyone else texts him, he'll receive the notification when the event ends.

When the event ends Michael is congratulated on screen and told how long he was in the session. Through our user interviews, it became apparent to us that the "congrats" screen must make the user feel that they accomplished something. We incorporated confetti and exciting typography to create the desired feeling.

Emily's Scenario

Emily often binges Netflix, YouTube, or social media. If she catches herself being too distracted when she has homework piling up, she will open Leave Me Alone and go to the timed session screen. Here she can set the timer to a reasonable amount of time and start the session. With the session running she will need to stay in the app to achieve the goal. However, Emily has a list of 5 apps she can access from within Leave Me Alone, as well as a list of contacts she can call. When the timer runs out, Emily is congratulated in the same manor as Michael's scenario. However, Emily is also prompted to rate her productivity during the session. This is an important metric for her to make sure that even without her phone, she didn't find a way to be distracted. To let Emily feel in control, she has three color options for the timer screen so she can set the screen to the mood of her choosing.

User Testing

We used the information gained from our early user interviews to wireframe and prototype what we felt was the best set of solutions to the problems at hand. However, the only way to know which solutions work and which don't is to test our idea on actually users. So, we took the prototype to users. We let them go through the app to see how they expected the app to work, and how quickly they could learn how to complete tasks. We learned what didn't make sense to them, what made sense to them, and what was visually pleasing. We found out if the app would allow our users to achieve their goals. Design is an iterative process. The first attempt is never right Leave Me Alone is no exception. We took the valuable feedback from our users and refined our prototype until it met our users' goals.

Final Design

The most valuable feedback we got from users is that the phrase "leave me alone" did not them feel very pleasant. While they felt it worked as an app name, they did not want the phrase to be all they could see during a session. So to keep with the positive and motivational them of the app, we added six more encouraging and playful phrases to accompany "leave me alone." These seven phrase rotate through a timed session or event.

By following the Goal Directed Design process, we designed Leave Me Alone to help our users achieve their goals of being more productive and more present in the real world!

View the interactive prototype
Made in Webflow