top of page
Starred 17.png

An organizational app that uses gamification, prioritization, and self care to help users improve their time management.

starred 3.png

Overview

Starred is an organizational app that allows adults to keep various areas of their life organized and helps them improve their time management.

Problem Statement

Existing organizational apps do not do enough to help users stay on track. While they may provide users with basic organizational tools, many people lack the time management skills that are a critical component of organization and task management. Starred goes further than existing organizational tools by helping users improve their time management, increase their motivation, and reduce any stress that may come up when organizing tasks.

Users and Audience

Starred helps both organized and unorganized adults. It’s primary audience is 23-50 year olds who appreciate digital forms of organization and are looking to become more organized and better at time management.

Roles and Responsibilities

I served as the UX/UI designer. 

Project Scope

The scope of the project was to conduct research and complete an interactive high fidelity prototype of the red routes of Starred.

Design Process

The process for designing Starred started with secondary research and interviews, followed by synthesizing research results using an affinity map, two empathy maps, and two personas. After research, the design of Starred developed through sketches, guerilla testing, user flows and stories, wireframes, and a style guide. This work led to a low fidelity prototype which was further developed through two rounds of usability testing that resulted in a high fidelity interactive prototype.

Secondary Research: 

 

Process: Secondary research into strategies for time management was conducted online.

 

Purpose: This research provided a starting point for considering which features should be included in Starred in order to help people improve their time management. Grounding the features of Starred in research helped ensure the final features would be truly helpful for users. 

 

Insights: Secondary research revealed that time management can be improved by using rewards to increase motivation and priorities to stay on track. It also showed that time management is improved when people find ways to reduce stress, such as practicing reflection so that stress does not become a distraction.

Starred 20.png

Interviews: 

 

Process: A mix of three organized and two unorganized interviewees were recruited using an online screener. Interviews with each person were conducted over the phone and recorded for note taking purposes. The interviews delved into what problems people have with time management and what strategies they’ve tried for managing these issues.

  

Purpose: The interviews served to support secondary research and ensure that the design of Starred is based on users' real life needs and preferences.

Insights:  The interviews revealed that features for encouraging reflection and prioritizing would be especially important components of Starred.

Starred 30.png

Affinity Map: 

 

Process: An affinity map was created by writing points from the interviews on post-its and placing them in groups as they seemed to naturally fit. These groups were then assigned appropriate titles.

Purpose: The affinity map helped organize information collected from the interviews and pull out common themes among the interviews. It also became a resource to refer back to throughout the design process as a reminder of which features are important to users.  

Insights: During this process, a clear understanding emerged of what features people look for in organizational tools, how much stress impacts people’s ability to manage their time, and how prioritization and reflection has benefited people

Starred 19.png

Personas: 

 

Process: Personas were created to represent the two main types of users that emerged during interviews.  

Purpose: These personas helped clarify the two types of users in Starred’s audience and their different concerns. The personas then served as a helpful reminder throughout the design process of the different needs Starred would have to address in order to appeal to both types of users in its audience. 

Insights: The personas showed that Starred would need to appeal to both highly motivated professionals who value prioritizing and people who struggle with time management, organization, and feelings of stress and self doubt.

Starred 24.png

Empathy Map: 

 

Process: An empathy map was created for each persona. These maps laid out what the personas may feel, think, say, and do when approaching time management of daily tasks. The maps were filled in by using sentiments shared by interviewees. 

Purpose: Creating empathy maps made it easier to relate to users, develop a sense of empathy for their pain points, and determine which problems Starred would need to address.

 

Insights: One of the key takeaways of the empathy map was how it further emphasized the way thoughts and feelings of stress can get in the way of users managing their time. This reinforced the idea that Starred needed to reduce users’ stress to support their time management.

Starred 29 (2).png

Sketches: 

 

Process: Basic sketches were used to start visualizing the features that research showed Starred needed. 

 

Purpose: Sketching allowed several ideas to be considered in a short period of time before moving onto more in depth depictions.

 

Insights: During sketching ideas emerged for how to incorporate rewards into Starred by using gamification and a point system to increase users’ motivation. Additionally, ideas were developed for a reflection page that would help users process stressful thoughts and reduce the distraction caused by stress. Sketching also allowed for consideration of common requests for organizational tools that had emerged during interviews and the affinity map. This included features like a general notebook section for jotting down quick notes and a highly visible place for top priorities to be listed.

Guerilla Testing: 

Process: Guerrilla testing was performed on sketches with five participants. Participants were asked to complete different tasks when referring to the sketches.

 

Purpose: Guerrilla testing showed which aspects of the initial layout made sense to users and which aspects of the design needed to be clarified.

 

Insights: During testing, participants indicated that they wanted clear icons for every label and for every aspect of Starred to be clickable so that they had multiple ways to navigate to relevant pages. This feedback was incorporated into future versions of Starred to improve users’ experience.

Starred 26.png

User Flow: 

Process: A user flow was created in order to lay out an initial idea for how users would navigate Starred and the buttons that were needed to complete each action. This user flow incorporated feedback from participants of guerrilla testing on how they would prefer to navigate Starred.

 

Purpose: The user flow was an important part of figuring out the best layout for Starred and which pages were needed.

 

Insights: The user flow continued to be adapted as more efficient ways of completing actions were found and as users gave feedback on Starred’s navigation during usability testing.

Starred 11.png

User Story: 

Process: A user story was created to outline the actions that users want to complete on Starred. The actions most essential to the success of Starred were marked as high priority.

Purpose: The user story helped clarify the potential scope of Starred features and which features should be focused on throughout development.

Insight: The user story highlighted that, while Starred required basic organizational tools, it is features that other organizational apps do not have, such as a top priorities section and reflection page, that were essential for Starred to stand out from competitors.

Starred 28.png

Wireframes: 

 

Process: Initial sketches of Starred were transformed into polished wireframes by using feedback from guerilla testing, user flows, and user stories to make improvements.

Purpose: The wireframes allowed for Starred’s layout and basic function to be further developed without this work being distracted by style details.

 

Insights: The wireframes laid out a clear understanding of how Starred would function and provided the foundation for adding in style details.

Starred 13.png

Brand Platform, Moodboard, and Style Guide: 

Process: Once the layout of Starred was established in wireframes, the style details of Starred were developed. This process involved creating a brand platform, moodboard, and style guide.

Purpose: Laying out the design plan through a brand platform, moodboard, and style guide allowed for visualization of the design and consistent application across each screen of Starred.

Insights: The final design direction for Starred is fun and simple while still being professional. This style eases users’ stress while still being professional for work settings.

Starred 21.png

Low Fidelity Prototype:

Process: A low fidelity prototype of Starred was created by combining the layout that had been developed in wireframing with the style direction that had been determined. InVision was used to make this prototype interactive.

 

Purpose: The low fidelity prototype allowed for all the previous design work to be assessed together.

Insights: In the low fidelity prototype of Starred, the design was too busy. The prototype revealed that future versions of the design would need to focus on simplifying screens and increasing white space.

Starred 35.png

Usability Testing: 

Process: Two iterative rounds of usability testing were completed. Both rounds of testing included five participants who were asked to complete tasks on the prototype and share their thoughts.

 

Purpose: The feedback from round one of usability testing was used to make several improvements to Starred. The second round of usability testing confirmed that these improvements had addressed users’ concerns. 

Insights: Feedback from the first round of usability testing revealed that there were a few changes needed to make Starred successful. 

  • Make the Reflection page easier to find

  • Add additional features to the Care page to further help users manage stress

  • Make the process for redeeming rewards more intuitive

Starred 16.png

High Fidelity Prototype:

Process: Feedback from usability testing and general impressions of the design were used to make widespread improvements to the low fidelity versions of Starred. 

Purpose: The high fidelity prototype addressed concerns with the low fidelity version and improved the user experience and design of Starred.

Insights: The high fidelity prototype successfully resolved problems in the function of the low fidelity version. Additionally, the design became less busy, with increased white space and greater focus on the features that were important to users resulting in a clean and polished design.

Outcomes and Lessons

The final version of Starred is a product that is rooted in research and user feedback. Prioritizing user feedback in every design decision helped transform Starred into a product that functions well for users and meets the original goal of Starred helping users improve their time management.

The main takeaways from this design process were:

  • Always refer back to the research when designing a new feature

  • Don’t hesitate to make large changes based on user feedback

  • When questioning a decision, rely on usability testing to provide the answer

These lessons can be applied to all future projects and will help improve any UX product. 

What’s Next  

The Starred project is complete and meets all intended organizational and time management goals.

 

Additional features for potential future consideration could include the following: 

  • Link Starred to people’s digital calendars

  • Further add to the gamification by creating more animations and mascot interactions

These possible additions offer options for adding to Starred in the future. However, the overwhelmingly positive feedback from users show that the original goals of developing an app for improving organization and time management have been met. The lessons learned from the successful development of Starred can be applied to other future projects. 

bottom of page