Mobile App Conceptual Redesign
The Client
TeuxDeux is a popular scheduling app that allows users to create short-term list reflected in a weekly and monthly view, as well as offering a Someday list option for tasks that don’t require a deadline (ex. “books I want to read”). Its main appeal lies in the way it emulates the offline note-taking experience, allowing its users to quickly write out tasks, while giving options to edit, repeat, and assign deadlines. It's as simple as its quick, and its devout followers swear by its ease of experience as an efficient and assistive mobile application.
The Brief
Currently, TeuxDeux is unable to create long-term tasks. Our team was tasked to see how we might be able to add this benefit while helping the user reconcile deadlines and deliverables at the start of the project. Given TeuxDeux is highly revered for its simplicity, we would need to implement this upgrade while making sure not to erase what makes TeuxDeux a viable and valuable product for existing users.
Timeline: Two (2) Weeks
Our Team / My Role
I was in a team of (3). Very quickly we defined our roles and solidified our strategy.
My responsibilities:
Research: I conducted interviews, help define the problem/solution, contribute to researching competitive analysis and helm the task of creating personas.
Ideation: I took the lead on iteration; creating the initial sketches based on the research and managing the team’s additional contributions.
Design: I would contribute by creating specific wireframes on Sketch.
Together, our team would conduct usability tests and collaborate on revisions.
My teammates, Heidi and Alissa
Research
Kicking off the assignment, we first needed to define the problem and solution, analyze the competition, and ultimately determine the user persona we were designing for.
Research: Interviews
In our efforts to fully define the problem and solutions, I helped in conducting interviews. Participants were selected as those who use day-to-day scheduling apps and not necessarily TeuxDeux exclusively.
My question topics included:
What are your current methods to list keeping?
What are some of the advantages/disadvantages you’ve faced with your current method?
How you you negotiate both short and long-term planning?
When planning, do you think more visually or with type?
Do you color code when categorizing?
Are setting and visualizing deadlines important to you?
What reminders do you prefer (alerts, texts, emails, etc)?
I prefer to use TapeACall Pro for interviews
“I chomp at the bit when it comes to long-term planning. If I’m not able see the big goal, it’s hard to figure out the best ways to get there.”
— Actual User Quote
Research: The Problem
Through user research interviews and competitive analysis, we were able to define the problem.
Research: Competitive Analysis
In order to create an ideal e-commerce site, it was essential to study the current leaders in the field. In order to do this, we looked at popular scheduling apps such as TopDoIst, Trello and MinimaList.
Key Takeaways:
While Trello and MinimaList use color coding and subcategory lists, Teux Deux does not offer this.
Trello and MinimaList have a consistent Global nav, while TeuxDeux’s changes depending on what screen you are on
ToDoIst gives positive reinforcement with progress bars, while TeuxDeux holds back on similar affirmation language.
MinimaList is similar to TeuxDeux in its simplicity.
An abbreviated look at the competition
A high-level heuristics display
Research: Heuristics
Following our Competitive Analysis, I took the lead in noting the heuristic results of Trello and MinimaList, two popular scheduling apps.
Key Takeaways:
TeuxDeux replicates the offline experience really when when crossing off objects, almost like a real notebook in hand. Unfortunately, navigation can be confusing as global navigation icons change frequently.
Trello is an efficient desktop platform, but doesn't work as well as a mobile application lacking basic functionality especially in regards to its less-than-intuitive intuitive design.
MinimaList, was the least efficient in terms of errors. It's easy to make a mistake and lose entries, and that can present a constant frustration for the mobile user.
Research: The Solution
Based on our multiple areas of research, the solution took form. This gave us an informed direction in which to continue design.
Research: Personas
Once we solidified the problem and solution, I wrote two personas that helped as a guide as we prepped for iteration.
Pat The Primary - is a Type-A planner. Pat loves creating lists, and feels a sense of triumph when doing so. Pat feels very anxious when he can’t do that.
Sam The Secondary - is a visual person. She mostly uses her phone, but isn’t afraid to use a piece of paper to make quick notes. As a commuter with an active lifestyle, Sam needs to make lists to keep on schedule and stay focused.
Ideation
Now that research was complete, it was time to move onto ideation. During this phase I took the lead on sketching and also created wireframes.
A look at the monthly view versus a weekly view
Ideation: Sketching
Once we synthesized our research, we moved on to the sketching phase. I took the lead on producing the initial drafts.
When initially iterating on designs, I tried to address on a few key areas:
Given we wanted to focus on longer term tasks, we wanted to show a broader visualization than just a daily view - so we tested users on opening on both a monthly and weekly view.
We also wanted to incorporate color coding when making longer term tasks - that way, users can use shades and color to best categorize. We implemented this in both the weekly and monthly view.
Ideation: Sketching (continued)
We wanted to create an intuitive timer that helped the user create deadlines for each task, as well as setting reminders.
We wanted to improve upon the Someday lists by establishing a new icon and place of orientation so users would more readily use it.
These are some initial ideas of how a user could set a deadline and reminder
Ideation: User Flows
While deciding on an appropriate user flow(s), we as a team decided to create (3) paths.
Flow #1 - will focus on a user creating a long-term task and setting a color code and reminder.
Flow #2 - will focus on a user making a subcategory list.
Flow #3 - will focus on the user entering a new task in our new and improved Someday list.
“Navigation makes sense. Easy to follow.”
— User Feedback on sketches
“I prefer opening to the weekly rather than monthly view.”
— User Feedback on sketches
Ideation: Wireframes
Now aided with data pulled from usability testing, we were able to conform sketches into high-fidelity wireframes using Sketch.
I took the lead in designing the subcategory user flow/RSVPS (Flow #2).
A sample of my wireframe work
A look at the evolution of Someday list icons
Usability Tests: Findings 1
Once wireframes were complete, we underwent (3) testing rounds in order to reveal potential usability problems.
Insights:
Currently, TeuxDeux’s global navigation buttons change based on where you are in the app. This is a feature we didn’t anticipating developing as it was a part of the original design, but new users commented how it made their experience difficult.
Interestingly, during usability tests, seasoned TeuxDeux users also expressed not being fond of the navigation icons prior to our developments, and expressed they would love to see a new iteration.
As a result, we added a monthly view icon next to the weekly view icon, as well as moving the Someday list icon to the header so everything was expressed in the global navigation.
Usability Tests: Findings 2
Insights:
We received feedback that the process of setting deadlines could be simplified. Our first attempt made the user scroll through (3) screens which was a big ask.
In addition, users were confused on how we originally established reminders, preferring instead that we outline the days of the week.
As a result, we simplified the process for the user, consolidating the steps to two screens and finding a way to reflect an easy-to-use weekly view when setting reminders.
A look at the evolution of our deadline designs
A look at the evolution of Someday list icons
Usability Tests: Findings 3:
Insights:
Users didn't like our original Someday list logo, which forced us to rethink the design.
Our icons evolved from a notebook logo which wasn’t intuitive to the user, then to lined paper which was found to be confusing due to its small size, before finally landing on more pronounced line paper icon which tested positively.
Prototype
Having made adjustments thanks to usability testing, we were prepared to present our work.
Prototype: Demo 1
Here we demonstrate how users can set a long-term task, complete with setting a color code and deadline.
Prototype: Demo 2
Next, we demonstrate how users can create a subcategory list.
Prototype: Demo 3
Finally, we demonstrate how users can add an event to their Someday list.
Takeaways
After we presented our TeuxDeux App, we received some really beneficial feedback about our methodology from start to finish.
Things that worked
We received overwhelmingly positive feedback on our research.
People found our design decisions to be successful, both in helping meet the brief but also remaining true to TeuxDeux’s existing aesthetic.
People noted how effective we were in incorporating user feedback to solving issues brought forth in usability testing.
Things to look at in V2
It was suggested we allow users to ID color codes should we ever do a second revision.
It was suggested we look at clarifying the Someday list icon for future revisions.
We learned that saving file names correctly will help save tons of time!