Visualizing Time in a Productivity Tool: A UX Case Study

Michelle Yang
Cornell DTI
Published in
9 min readFeb 24, 2018

--

Introduction

It is common for Cornell students to be really involved in project teams, fraternities, part-time jobs, etc. However, it is also common for Cornell students to struggle with their balancing all aspects of their academic lives.

Although there are many productivity apps out there, they tend to just show you what you need to do, without a lot of consideration of how to get the user to do start or how to improve the experience of doing work.

I am a product designer on Cornell Design and Tech Initiative (CDTI) working together with a team of product managers, designers, and developers to resolve pain points associated with this prevalent issue on campus. This case study details the work I contributed

Target Users

Cornell students that have problems with time or task management.

Our Goal

To design and develop a time management web app to help Cornell students better plan their tasks—and actually complete them.

User Research

Before I joined the team, members of CDTI conducted in-depth, contextual interviews with 12 Cornell students in Spring 2017 to identify overarching themes and trends in our target audience. They interviewed students of various ages and majors to ensure we were gaining accurate and diverse insights.

Experience Map

When I joined the team in Fall 2017, I had my team and I make an experience map and affinity diagram with the resulting data.

Experience map, showing what actions/feelings people do/have when trying to finish tasks. Yellow post-its are positive emotions, pink are negative emotions.

Negative Reinforcement and Pessimistic Attitudes

From constructing the experience map, we concluded that the typical time management experience consists of the following steps:

  1. Record Task
  2. Plan Task
  3. Break Down Task
  4. Remember Current Task
  5. Procrastinate
  6. Do Task

The bolded steps is the part of the experience that trigger the most emotions, both positive and negative.

This implies that users tend to be fine with assessing and planning their tasks, but find it hard to actually start doing the task.

Additionally, users mention feeling “stressed”, “unmotivated”, and “too lazy”. Overwhelmingly, users said the fear of failure or the threat of bad grades keeps them motivated to do work.

Affinity Diagram

A portion of the affinity diagram, showing the most common answers given in user interviews. The numbers in parentheses indicate the number of times the answer appeared in our user research.

Procrastinating Despite Knowing What Needs to be Done

As you can see in the right two columns, the most common theme mentioned was procrastination.

Specifically, students say they know when and what they need to be doing, but they will still procrastinate anyways.

Market Research: Competitor Analysis

From the left: Todoist, Google Calendar, and Apple Notes. Three common tools students use to manage their tasks.

The most commonly used tools mentioned in the user interviews were Google Calendar and Apple Notes.

Some interviewees mentioned using planners and whiteboard calendars.

The strength that all the products above share is that they are very freeform and versatile.

Although many interviewees mentioned Apple Notes, the interviewees all used it in different ways. Its minimal interface and basic functionality allow it to be used in whatever way desired, which can be changed up just as easily. Hence, it takes little activation energy to start inputing tasks and deadlines.

Interviewees who used planners expressed similar sentiment, saying how it is easy to “write outside the lines” (i.e. cross out things, write in the margins, etc.). However, multiple interviewees stated that they often forget to write things in their planner or forget to flip through their planner to check deadlines.

Procrastination Research

I felt that in order to better answer the questions above, I should find if there were any studies on procrastination to understand why people do it. Bouncing through a chain of semi-related research papers, I was finally able to find the works of Joseph Ferrari, Ph.D and professor of psychology at DePaul University, who specialized in studying procrastination. You can find two comprehensive articles I refer to here and here.

  1. About 20% of the global population are chronic procrastinators.
  2. Although there can be many reasons why people procrastinate, poor emotional management is likely to be at its foundation.
  3. More specifically, procrastination is stems from troubles with self-control. “You know what you ought to do and you’re not able to bring yourself to do it. It’s that gap between intention and action.” — Timothy Pychyl of Carleton University.
  4. Procrastination is self-defeating behavior that can be triggered from either a negative state (fear of failure, perfectionism) or a positive one (the joy of temptation).
  5. According to a study by Dianne Tice in 2001, students give in to temptations and procrastinate if it lifts their current mood as a result.

With that being said, possible interventions include breaking up tasks into smaller, manageable chunks. Systemically, Ferrari suggests that we should shift from punishing lateness to rewarding earliness. However, dealing with the foundational issue of emotional management is more difficult. What may work is countering the self-defeating behavior by practicing self-forgiveness. From a survey study with 119 students, the students who forgave themselves for procrastinating on their first exam were less likely to repeat on the second one.

Determining Our Product Concept

Brainstorming Wildly

Keeping all the insights from the research phase in mind, my fellow designers and I started brainstorming—a lot. The key was to think without restraint and

Many questions went through our heads as we sketched our hearts out. How might we visualize work that needs to be done? How might the user interact with their tasks? How might we design our product to be as stress-free as possible? How might we motivate the user to actually get their work done—and sustain a productive lifestyle?

Just a few interface sketches from brainstorming!

As a team of designers, we all explored a wide variety of different concepts by drawing interface sketches. Some of these ideas were based on working in short time intervals, visualizing when/what your peers are studying, gamification, combining lists with calendars, crowdsourcing study plans, and more.

Shaping Down the User Requirements

Based on our user and procrastination research, we came up with a set of basic requirements that our product must meet in order to satisfy the users and accomplish our goal.

  1. Breaking Up Tasks — the product needs to promote breaking tasks up into smaller chunks, a method of intervention mentioned in my procrastination research.
  2. Sense of Accomplishment—the product needs to give users a sense of accomplishment. A majority of the users we interviewed mentioned that they enjoyed checking off/crossing off tasks they finished.
  3. Motivation to Start—the product needs to motivate users to start on their assignments. Users specifically said that starting their work is the hardest part.

Ruling Ideas Out Based on Feasibility and Impact

Our productive brainstorming produced a lot of creative, diverse approaches to our core problem.

Planning the Product Structure

With the user requirements in mind, our team of designers, PMs, and developers met up to determine what our product structure will be like. For us designers, our biggest concern is making sure the structure of our product is not overwhelming or intimidating to procrastinators as to not add stress on already stressful situations. Additionally from the market research, we agreed that the structure should be minimal and freeform like Apple Notes, which makes it easy to start using right away.

The initial sketch that inspired the product’s structure. After showing this to several Cornell students, many of them praised the idea for its simple yet effective structure.

From our meetings, we decided on these four aspects of the structure:

  1. Today—This prominent section shows users what he/she needs to get done today. Having the user focus solely on one day at a time promotes users to break down their work into chunks that they can do day by day—which is something psychologists recommend.
  2. Look Ahead—This section shows your tasks for the rest of the week (or month). This section is to provide context for the user so that they can be better prepared for what is to come. Additionally, planning what needs to be done each day is easier when you see the bigger picture.
  3. Motivator—The motivating factor to the product will keep the users motivated to actually do the work they planned. We had many ideas of what the motivation would be, so we explored them later on through wireframes.
  4. Task (and subtask)-focused—As a team, we decided to move forward with designing a task-focused product rather than also designing for events. Previously, we designed an MVP version in a sprint in which users could add both tasks and events. In a series of design critiques, several people said the interface was confusing at first glance. All the visual distinctions between tasks, events, and subtasks were hard to pick up. As a result, we decided to omit events from the product to keep it simple. Students want to get their work done, and tasks fit in with that mental model.

Designing the Look Ahead Section

Content Requirements

I was in charge of designing the Look Ahead section. To guide my designs and establish what needs to be done, I made a list of content requirements.

Exactly How Much Ahead Should We Show?

Encourage Thinking About Tomorrow

I started off designing a modular week view. When I first started designing the week view below, I wanted to bring extra attention on what needs to be done tomorrow. With our student procrastinator in mind, I want students to focus 80% of their energy on completing today’s task. But I also want them to be prepared for tomorrow as well. That is why I designed Tomorrow with different visual treatment than the rest of the week, by bringing it forward with a shadow to create a minimal, material design effect.

A month view exploration to the left, a week view exploration to the right.

Month vs. Week

After showing my month vs. week explorations to my fellow designers and PM, they unanimously preferred just showing a week view for two main reasons:

  1. Realistically, procrastinators are barely focusing on the long term, let alone several weeks ahead. In fact, showing a month’s worth of difficult work ahead of them could very well trigger an impending fear of failure or any other self-defeating behavior that leads to procrastinating.
  2. We are aiming to keep our initial interface design functional and minimal.

Showing Less Than a Week

I personally felt that a week view did not feel minimal enough, so I explored how the the Look Ahead section might look with only showing 3–4 days.

After showing my explorations to my team, the team thought that showing 4 days was a good sweet spot between showing sufficient amount of information ahead of time and keeping the interface minimal and focused on achieving bit by bit. Showing 3 days worth of information only felt too short and small.

Of course, to promote planning ahead, we thought that the user should be able to see the rest of the week if they want to.

How Might We Differentiate Tasks and Subtasks?

As mentioned in my procrastination research, a possible intervention is breaking down tasks into smaller chunks. This is a strategy we want to encourage throughout our product.

--

--