Google Planner
An laid-back planner for spontaneous spirits
Context
Hackathon @Tufts
Timeline
1 week in Feb 2022
My role
UX & UI Designer
Disclaimer: this is a concept project that is not officially affiliated with or sponsored by Google
Achievement
Our design was recognized as the runner-up at the Hackathon among 5 other teams.
competitors
Who’re already on the playing field?
Out of the 3 themes given at the hackathon, our team chose "productivity & efficiency.” We then identified 2 popular types of productivity products & analyzed 1 example for each category
Type 1: calendar apps
Google Calendar
Type 2: Task management apps
Asana
Shared characteristics
Structurally complex & afford diverse editing & organizational features
Display exact task start & end time; allow unlimited tasks per day
It seems that…
Many existing productivity tools primarily facilitate effortful & precise planning, which is helpful for some but stressful for others.
personas
Who's planning, and who's not?
There are 3 types of planners (or non-planners) that most of us have met at some point.
The Organized Boss
Plans even their leisure activities down to the minute
The YOLO Friend
Comfortably plays everything by the ear
The Aspiring Planner
Wants to plan but is scared of the work & stress involved
Who’s all set?
The organized boss
is satisfied with existing products like Google Calendar & Asana
The YOLO friend
feels comfortable without any planner tools.
Who’s left hanging?
The aspiring planner
wants to somewhat manage their time with a scheduling tool that’s not too complex and demanding & is left with few existing tools at their disposal.
Hear from an aspiring planner himself
And this is where Google Planner kicks in…to answer the question of…
How might we help people plan without stress?
v1
Build first, revise later
At the Hackathon, our team prioritized building screens to communicate the UX before fine-tuning the UI. Therefore, at that time, we did not ground our designs within an existing design system.
key features
Approximate task time
1. Tasks are assigned to general times of the day instead of exact hours.
Traditional approach
Our approach
2. Task durations are estimated, not exact.
Our app simply asks users to estimate the duration of a task by dragging a bar. To help the user escape the stress of not finishing a task at the exact minute that it’s planned to end.
Design Inspiration
The iOS UI for volume and brightness adjustment.
But our bar lies horizontally instead of vertically. To better map to how people conceptualize physical qualities in language:Volume is "high" → verticalDuration is "long" → horizontal
Constraints for task prioritization
Although the word “constraint” often gets frowned upon, it sometimes clears our minds.
Therefore, our app introduced 2 limiting features that nudge the user to prioritize most important tasks & avoid getting overwhelmed.
1. Limited number of tasks
The user can add up to only 6 tasks per day.
2. Limited time to plan
The user will be timed when adding tasks.
Imported events
The user can imports events from external apps such as Google calendar to see mandatory commitments and plan tasks accordingly.
The user will be timed when adding tasks.
Imported mandatory commitments
outcome
We won a (small) award!
Our team’s design was recognized as the runner-up at the Hackathon among 5 other teams.
After the 1.5-day hackathon, I further developed the team’s project in my own time by 1.) testing our prototype & 2.) iterating the UI using Material Design by Google.
testing & feedback
Some feature to be taken away
Removing the “limited time to add task” feature
The feature, originally designed to nudge them to prioritize the most important tasks, ended up causing them too much stress that practically prevented them from planning.
“Being timed just makes me panic and freeze”
And some feature to be added
Our user also expressed a desire to see records of their past task, which would help them learn about their work capacities and become better planners
v2
When the Google planner started to look more Google
As a fun learning exercise, I decided to add some constraints to the UI design of our project, using Google’s latest design system: Material You.
process and decisions
Task duration signage
V2 maintained the design in v1 that task durations should be approximate, not exact.
However, to adopt only Material You components, v2 moved away from the sliding bar design in v1.
V2 uses Google’s segmented button to allow the user to set a task as either short, medium, or long.
What turned copy into icons?
At first, the segmented button displayed words.
Ultimately, I used hourglass icons to indicate task durations on the app’s home page instead of varying tile heights. Because tile heights, commonly used by calendar apps to display exact times, could be misleading.
Now that approximate task durations are indicated by icons on the home page, they must also be communicated by icons on the pages for adding or editing a task in order to create an internally consistent user experience.
Color
Ruth Kedar, the designer behind the iconic Google logo, on choosing colors for the logo:
"We ended up with the primary colors, but instead of having the pattern go in order, we put a secondary color on the L, which brought back the idea that Google doesn't follow the rules."
Google Planner adopted the “secondary color on the L” as its primary color to honor the app’s rule-breaking creativity as a productivity tool that urges users to accomplish more by planning less.
reflection
Takeaways
Deliver & revise
Participating in this 1.5-day Hackathon was my first taste of rapid ideation. The short time frame forced our team to take ideas out of our heads and start drawing fast and frequently. Doing so made me realize that prototyping early and quickly was not only feasible but also could be an overall beneficial practice that, as obvious as this may sound, helped us brainstorm designs by visualizing and comparing different options.
Design systems still leave space for creative freedom
When I first entered UX, design systems were the “AI” of the time: some designers feared that design systems would ultimately render many UX design roles obsolete. However, working with Material You showed me how many design problems were still left unsolved and how many creative choices were left open despite working with a design system. Just like having a dictionary doesn’t automatically make one a poet, design systems do not negate the magic designers cast to bring products to life.
more projects