Seeds: Digital Planner App
Project Specifications
Duration: ~150 hours
Tools:
- Figma
- Google Sheets
- Google Docs
- Whimsical
- Zoom
Seeds was inspired by the idea that when you sow the right seeds you can experience growth and flourishing, no matter what you have to tackle in life. I have talked to many people, especially young folks, who want to live healthy, full and productive lives. We try many ways to juggle our life plans and tasks. However, there are times we may experience frustration about our lack of ability to stay focused and meet the demands of a busy life. I want to help our generation and younger ones make good decisions for how to use their time, energy, and resources.
The Challenge
Since we not only have easy access to mobile devices but also spend most of our awake hours on our smartphones, I wanted to create an end-to-end mobile application that helps people cultivate the skills for managing life well and achieving their goals. This MVP (minimum viable product) explores what users need for an enjoyable, flexible, and personal digital planner.
Research
While this design challenge is personally very relevant for myself, I also know that “I am not my user”. It was important for me to empathize with my users properly and evaluate top features and UX/UI design patterns of market competitors. So I focused a lot of energy and time in this discovery phase guided by the following goals:
GOALS
1 Identify goal-setting habits and experiences of target users
2 Understand the process of how people set, track progress of, and achieve their goals
3 Identify the user goals, pain points, and motivations using an app for goal-setting
4 Propose features prioritization for building an MVP end-to-end mobile application
PRIMARY RESEARCH
Methodology & Recruitment
Survey made by Google Forms – 41 respondents from my personal network & the DesignLab community
User Interviews – 6 participants who had completed the survey
3-Day Diary Studies: 2 participants who had also completed the survey
Insights & Learnings Summary
COMPETITIVE ANALYSIS
Based on the commonly reported apps used by user research participants as well as the top habit tracking & task management apps in the Apple app store, I selected 10 apps to do a features comparison, SWOT analysis, and best-in-class highlight. The insights gained from these analyses informed which features & UX/UI design patterns to prioritize.
Features Comparison
SWOT Analysis
Best-In-Class Summary
PERSONAS
The insights gained from user research and the market competitors analyses helped me create 2 user personas as well as informed which features & UX/UI design patterns to prioritize.
Solution
The insights found in the research phase seemed to point at how users want an all-in-one digital planner that incorporates the best features of the top productivity tools used. So, why not combine the well-thought through UX designs of these current apps into a product that reduces the burden on our users to keep on top of multiple apps to manage their daily life demands and achieve their goals?
UX Design
Prioritizing the features, thinking through user flows, and mapping out the information architecture of the proposed app was definitely an iterative process. As new insights came up throughout the ideation and testing process, I kept coming back to these 3 components and modifying them
FEATURE ROADMAP
Without the constraints of this project, I listed out all of the features that both target users praised and market competitors included in their product. However, even in a project for a real client, there are constraints with time and resources. So I focused on designing for the P1 and P2 features in my MVP.
APP MAP (INFORMATION ARCHITECTURE)
After analyzing the IA of several productivity tools, I developed an app map based on the most important screens and features I needed for my MVP. I iterated on and used this structure as my guide during the ideation phase to inform how the the key tasks might be completed in the prototype & testing phase later on.
USER FLOWS
I tried out many of the productivity apps to go through 2 main user tasks I wanted to focus on: (1) Onboarding Flow and (2) Adding & Tracking Goals, Tasks Lists, and Reminders Flow. The diagrammed user flows below guided the flow of my mid-fi prototype for usability testing.
IDEATION
As I dove into sketching & wireframing, I wrestled with the thought of “why reinvent the wheel?” and explored design patterns that were common among the apps that were popular for productivity and task management. I wanted to ensure that the Seeds app would be intuitive and delightful for target users who would find it familiar to other apps they have used or are currently using.
- When considering how to do the sign-up/log-in screens for integrated social account linking as well as straightforward email or mobile account registration, I looked to Canva and Todoist as my inspirations because of their simple yet comprehensive user interface of these elementts.
- For the basic functionality of this MVP, my main inspiration came from the app I identified in the research phase to be best-in-class – iOS Habit Tracker – as well as Structured, a daily planner app, and Google’s Tasks & Calendar because all of these apps not only had high-ratings in the iOS app store but also because they provided a seamless and consistent user-experience of task management.
WIREFRAMES
I created mid-fidelity wireframes for the screens with which my user personas would most likely interact. The aforementioned apps that inspired my design ideation already did a good job with content layout and information architecture, so my aim was to combine the best of their designs to mock-up an all-in-one digital planner.
Testing & Iterations
USABILITY TESTING
Methodology
Moderated testing of mid-fidelity iOS mobile app screens using a clickable Figma prototype.
There were 3 participants total. 2 were recruited from initial research phase and were survey participants. 1 was recruited through the DesignLab community.
Task 1: Sign-Up
Task 2: Getting Started
Task 3: Add a New Goal
Task 4: Home Timeline
Task 5: Date Change
Overall Impressions
Results
KEY TAKEAWAYS
1 2 out of 3 participants expected more screens during the onboarding tasks and also mentioned that setting up notifications/preferences would be something they would likely do later
Fix: revise “Getting Started” flow to launch the onboarding screens of the main features of the app as well as “Skip” option
2 All were either intrigued or directly asked for more customization in the “Create New Goal” form. Some also wanted to the ability to have tags/labels associated with color-coding in order to filter their goals more easily
Fix: include more customization features such as how Google Calendar allows for asynchronous recurring events, goals, tasks, or reminders
3 Overall, all participants found the interface easy enough to understand but also were curious to see how “Goals”, “Events”, “Lists”, and “Inbox Reminders” are organized and interacted with
Fix: add more mock-up screens for these topics in the prototype and user guide
Visual Design
My aim for this phase of the process was to envision an interface that was a structured planner but flexible and simple so that the user would enjoy the freedom to customize particularly the colors and iconography of their app.
MOOD BOARD
Using Pinterest as inspiration for the feel and look, I explored colors, typography, imagery, iconography, and UI elements to inform how I would build the style guide and UI kit for this MVP.
STYLE GUIDE & UI KIT
HIGH-FIDELITY SCREENS
After synthesizing the insights from the usability test results and re-evaluating priority screens for my user flows, I incorporated the revisions into hi-fi screens and added new mock-ups for (1) an onboarding flow and (2) a goal tracking flow.
(Clickable prototype on the right, and also available on Figma)
Evaluation & Reflection
SOME ASSUMPTIONS
We assumed that users utilize tools to help them set and achieve goals. Based on the rise in productivity tools and an outcry from educators, parents, and teens themselves; we also assumed that a digital product for life management can help users reclaim focus and build good habits to achieve their goals.
WHAT I LEARNED
There’s no “one-size-fits-all” method when it comes to managing life demands and achieving one’s goals. Users themselves on the whole have tried and/or continued to try new ways to become more effectively productive. Similarly, designers and developers of productivity tools have also put in a lot of thought and care to create helpful product. By far this has been one of the most challenging design problems I have tackled because there was so much to learn about standard mobile UX/UI design patterns and microinteractions. I found at every phase of the design process and every obstacle I faced a greater appreciation of the patience and perseverance it takes to keep iterating on each deliverable.
NEXT STEPS
1 More usability testing of the MVP on more users of productivity tools would help increase confidence that this app is truly a MVP that is ready to hand-off to developers.
2 Collaboration with more seasoned UI designers, especially those with expertise in productivity tools, would not only be a valuable learning experience for me but also be a step in the right direction towards a more delightful user experience.
3 Making this app accessible on multiple device sizes (ie. web-based desktop, iPad, tablet, android, Apple watch) could reach more users as well as make this app much more flexible for users’ general productivity.
Next Case Study Project: