There is a simple fact that people’s life, working and study habits have drastically changed since the start of COVID-19 in 2020, especially for still who still work remotely. While we do save a lot of time from commuting, but staying isolated at home, lacking physical interaction with peers, constant procrastination, and social media distractions throughout the day hinder our productivity and motivation.
Therefore, I took the initiative and designed this product "DailyUp" under this circumstances. My involvements in this project include conducting semi-structured interviews, designing low-fidelity interfaces, prototyping the interaction using InVisionStudio, and testing user flows.
In the end, my project was featured as "the Best Interface Design in Visual" among 25 students.
People feel less motivated to keep up with their work/study and are distracted by social media when they work remotely at home.
In order to address this problem, I designed a mobile app that helps users manage time with priorities and maintains a healthy life style while avoiding distractions from social media.
Prototype Here
Deck Here
Have you ever wonder into this scenario: Taking a 5-minute break but actually running into an hour scrolling through short videos on TikTok but feeling guilty about time passed afterwards. Or another situation might be like: Cramming all assignments and works on due dates because there is no incentives to finish them early, resulting in exhaustions and risks of missing a deadline. Does above sound like you? I know, same here :(
I went out and interviewed with 6 young adults around my age, including 5 college student and 1 working professional who just fresh out of college, to further validate my initial hypothesis and to investigate their pain points. The semi-structured interview uncovers a fact that not only do people’s study and working habits hugely changed, but their productivity and efficiency also decreased due to increased screen time at home, for those who work or study remotely.
I don’t feel I am motivated working at home for the entire day because I cannot feel the sense of competition working with my coworkers at company. I really wish to do some exercises but I never feel I have time...
I really want to get rid of social media, but when something pops up on my phone, I just could not help myself clicking that notifications. I often feel guilty about my time wasted on those apps.
Before diving into the design process, I did around of competitive analysis to learn the current time management tools: what they are doing well or not well, and what features that they are lacking.
Summarizing from this around of competitor analysis, I learned that those products all help users manage their time and stay focus, but they are lacking of the social engagement. So this is what I try to improve for my later design stage.
Google calendar allows users to create tasks on a specific date, categorize tasks, and develop a habit or goal. Users also could set reminders based on tasks they created. However, the app just simply remind users to complete a task instead of motivates them to develop a habit or a goal.
TickTick is a little bit more advanced than Google Calendar. It has the same features of Google calendar with an additional feature of ranking priorities of tasks. Again, users could be unmotivated if they just create tasks and have no motivations or incentives to complete them.
Trello allows users to ranks priority of tasks based on users’ preferences. It is good for team task management but not for personal motivation.
Focus Keepers keeps tracks of users’ statistics, but only for three days if users do not upgrade to pro account. Users will not get any panelization if quitting the app. It is nice for timing but could be better if there is a reward system.
Good reward system on keeping track of users’ time of focusing on tasks. However, there is limited activities (tasks) that users could log into the app and visualize them in a calendar format.
"Busy young adults who work at home need a way to improve their productivity and have a balanced lifestyle because the sense of self-accomplishment and satisfaction motivate them to be more positive towards life."
Based on the insights from the semi-structured interview, THE design challenge, and the JBTD framework discussed above, here are main prioritized goals I am helping users to achieve:
These are considered as main features because according to the user insights, users need to stay effective on their work. In addition to primary features, I decided that the secondary feature is to promote users better engaging with peers, including features like social feed, leaderboard, and user statistics as motivation boosters.
I mapped out the key user flow of the mobile app based on the prioritized features discussed above, which serves as the framework for designing high fidelity product in the later stage.
.png)
I sketched out my vision for the app, including the micro-interactions that allow users to efficiently manage their time while progressively achieving their goals. You can view my detailed sketch in the link below.
View Sketches & Annotations
Based the sketches and a round of feedback from my design classmates, I transformed low-fidelity sketches into mid-fidelity wireframes, which set a solid foundation for the usability testings.
In this stage, I did two rounds of tests to make sure my mid-fidelity designs make sense before moving into high-fidelity prototypes.
I tried multiple variations of our primary features to explore possibilities before jumping into high-fidelity designs. I mainly experimented with interaction patterns and user interfaces that work best for users with ease.
Design A got majority of votes! According to users, who are all left-handed, floating action button is more accessible and reachable placing at the lower right corner of the screen.
I tend to think about fulfilling the entire page with specific information details. However, it turns out that users prefer the second design with a better visual information hierarchy: The task title and the description of the task are tight together and the date is highlighted on the top right corner. In addition, Design B allows users to add multiple or no pictures by preferences instead of forcing users to add at least one picture by default from my initial design.
In order to help users avoid clicking a wrong choice, I designed an additional interaction of “Select” and “Next” (shown in Design B) so that users would have time to think about selecting a correct choice while staying on the same page. However, it turned out that users could finish this task more efficiently with Design A than Design B because users reflected that they could click “<” on top left to go back the last page if clicking wrong.
After settling down with design variations, I decided to do another round of usability testing to see if overall flow would make sense. Therefore, this round was testing about users' feeling and experience of completing a testing task. See "BEFORE" and "AFTER" for the design revision.
Summarizing all of the testing insights from the mid-fidelity wireframes, as well as static high-fidelity mockups, I leverage InVision Studio to and prototyped these key features.
.gif)
The visual system serves as a guide at the beginning of the high-fidelity design stage, which ensures the overall visual consistency across the product.
This was my first end-to-end independent UX project! It was definitely a great experience for me to comprehensively practice my research and interaction design skills! Through the process, I not only had opportunities to practice my user research and testing skills, but also to level up my UI design skills by learning varied mobile design guidelines as well as trending mobile UI patterns.
I was initially over-ambitious about my app was going to be: Adding many cool gamification features and fancy UI animations. First-time users can learn to use the app and tend to make decisions by themselves. What if we make decisions for them and smooth their learning curves? The concept of MVP taught me that we only need a product with just enough features to address the users' needs.