Introduction
Background
In today’s fast-paced world of work and education, achieving goals require not just will but a well-considered plan. This was the motive behind the creation of Outline, a task management app designed to help students plan projects and build habits with the assistance of Artificial Intelligence (AI).
As a student, I’ve often felt overwhelmed by the demands of school, work, and extracurricular activities, constantly struggling to find enough time for everything. Outline was born out of this frustration, offering a solution that provides a clear and actionable roadmap for success.
One of the app’s standout features is its ability to integrate seamlessly with a user’s Google Calendar, merging new schedules with existing ones. This ensures a holistic approach to time management, empowering students to balance their goals while staying on top of their busy lives.
Challenges
Complex User Needs:
Balancing the simplicity required for daily habit tracking with the depth needed for project planning.
Varied User Personas:
Catering to users with different goals, such as learning a skill, improving health, or managing a creative project.
Prototype Limitations:
The app exists as a Figma prototype, limiting direct user interaction data and requiring creative methods to gather feedback.
Tools
Figma & Wireframe.cc
Role
Reasearch & UX/UI
Timeline
November - December 2024
Research
Research Objective
The was a lot of research done for the development of Outline. This is research was mainly to understand how students form habits, take up tasks and manage projects. I did qualitative research where I interviewed five students from my school. With the research, I sought to gain insight on their take on task management. It was a very exciting and engaging part of this project. I also wanted to identify user pain points in existing task management apps and their willingness to explore how AI can simplify task planning and execution. The following section explain my research process from the user needs , user pain points and the key findings.
Primary User Needs
The broad goal of the users are very simple. They want an intuitive application platform that is easy to use with a clear and simple interface. The users also seek the ability to customize tasks. Given the flexibility to the users allows the adapting of tasks to achieve unique goals. Finally, users also wanted smart suggestions. The ability to get suggestions on how to achieve tasks is a very important resource to students.
Primary User Pain Points
There were a few obstacle that stood in the way of students achieving their goals. One of the main pain points was consistency with planning tasks. It is difficult to stay consistent. A lot of students forget to tracking progress leading to them not following through with tasks and building habits. There is also students being poor integration with other tools. There a different task management apps but they are not able to connect teach other to form one system of task management tools. The final pain point is inefficient task input. It takes so long to add and edit tasks in other task management tools.
Interviews
As explained, I conducted interviews with students to get to understand the task management problems. I had three goals in my user research questions. They are:
Understanding current behavior
Common pain points of task management
Exploring ideal features
The diagrams below are the responses from the interviewees on these topics.
Understanding current behavior
Pain Points of Task Management
Exploring Ideal Features
Key findings
Based on these interviews I came across this realization.
Users prefer tools that are simple, accessible, and fit their specific habits.
Many struggle with being consistent due to overwhelming to do lists and difficulty breaking tasks into achievable steps.
The use of AI tools that suggest tasks and habits are highly appealing to users.
From these observations I was able to draw a user flow diagram.
Define
Persona:
Meet Alex, a busy college student passionate about learning new skills like playing the guitar and starting creative projects.
Goals: Build consistent habits and complete personal projects.
Challenges: Managing time effectively while balancing school, hobbies, and social life.
User Journey:
Current State: Struggles to track tasks with scattered tools.
Future State: Uses the app to plan, track, and stay motivated.
Key Features:
Habit Builder: Set and track recurring habits.
Project Planner: Break projects into tasks and deadlines.
Custom Task Creator: Add tasks outside predefined categories.
AI Suggestions: Smart scheduling based on availability and goals.
Design
The Creative Process
The process of making this prototype was very fun and engaging. I first of did a lot of brainstorming to generate a lot of different ideas and streamline it all into one. The next step was to create a wireframe for the app. It was a session of rough sketching erasing until I made a design I liked. I then made the prototype designs in Figma and made changes constantly. This iteration of design was highly influenced by feedback from early testers of Outline. The following paragraphs provide further explanation of the user interface and branding.
UI Highlights
For the Outline UI, I was looking for a clean layout with minimalist design and clear action buttons. These features are important for intuitive navigation. The minimalist approach also helps the user to focus on their tasks and eliminates clutter. The task flow follows a very logical path: a user adds a task, defines its type as either a habit, project, or custom, and then defines the necessary details, such as deadline and frequency. Further enhancing productivity, the UI integrates AI-powered suggestions that make personalized recommendations for optimal scheduling. This balance of aesthetics with functionality creates an intuitive and efficient user experience, personalized to meet the needs of task management in the modern world.
Branding
The name "outline" was chosen as a reflection of the apps focus on creating a guide for users to complete tasks. The branding of Outline was focused on creating a cohesive and user centric identity that is modern and productivity focused. The visual design features an sleek logo, clean typography and a minimalist color palette. The color palette were changed on the first test with the users. One of the users described it as too jovial. The user was right. The colors green yellow and symbolize happiness and nature. These are great themes but they are not aligned with the goal of the app. I decided to use the color blue giving the themes of calm, trust and motivation. I also made a simple logo symbolizing moving forward with the letter O. From the design of the app interface to the marketing materials, every little element is made with consistency in mind to provide one seamless experience at every touchpoint. This considered approach to branding helps build trust and recognition and cements the product as a reliable and innovative solution within the productivity space.
Wireframe for Outline
Previous Design and Final Design
Branding Elements
Test
Prototype Testing:
Recruited 5 friends to test the Figma prototype.
suggestion of adding your emotion to
Goals:
Evaluate ease of task creation and navigation.
Test clarity of habit tracking and project management flows.
Identify potential improvements in the user interface.
Findings:
Successes:
Users found the task creation process intuitive.
Habit tracking was clear and easy to use.
Challenges:
Some users wanted clearer differentiation between habits and projects.
A few found it difficult to customize task durations.
Revisions:
Added a clearer flow for selecting task types.
Improved customization options for task details.
Enhanced the visual hierarchy to guide user attention.
Final UI
Home: Overview of habits, projects, and tasks.
Add Task Flow: Intuitive steps for creating habits, projects, or custom tasks.
Tracking Page: Progress visualization for habits and project milestones.
AI Insights: Suggestions for optimizing time and maintaining consistency.
See Prototype
Next Steps
What's Next
The next phase of this project is to transition the prototype into a functional app. I will be using React Native to create the app and Firebase for storing data. I am working with my close friends Abdul and Kofi to make that a reality. Abdul , a computer science and data major, will handle the use of data base to contain user information and measuring the apps performance. Kofi , a computer science and accounting major, will be responsible for the back end usage and functionality. I will be in charge of the front end development and the integration of AI using the Open-AI APIs. I am already familiar with the use of react in the creation of apps so this would not too difficult.
Furthermore, I will be expanding user testing to a larger group. In the research conducted, I only tested this prototype with a few college students who were close friends. Being able to test this app with other students from other colleges will provide more feedback necessary for the development of Outline. For instance allowing students from Europe to test the app would be different students from Africa. This will allow for the creation of an app that satisfies all students no matter where they come from.
Finally, I am looking forward to adding accommodation settings as times goes on. I would want to add setting s that allows people to create task plans without even opening the app. For instance, a person can just create a task plan by just having a conversation with Siri about the plan and what to do. I think it would be a great addition to the app to help others especially people with disability.
Key Lessons
In all, this project has taught me a lot of lessons. From waking up early to create prototypes to sleeping late into the night so the ideas do not slip way. The following are the key takeaways from the Outline project.
First and foremost, every good product balances simplicity with functionality. The end users want to be able to interact with a tool that is both powerful and intuitive. This was very evident in the creation of the initial prototype. Users prefer an app that is easy to navigate. For instance the add task label made it easier for users to know where to add to the initial list.
Also, this project thought me the power of feedback. The early tests of the app were able to provide a lot of valuable insights that shaped the app's design. For instance the changing of the back and next buttons to different colors was a suggestion from one of the early users. This was a small but significant change that improved usability.
Finally, the Outline project was build on iterative design. This project was successful because of the regular revisions made. This ensured the app aligned with the user needs and expectations.