Notion Catchup
.gif)
Notion Catchup is an iOS widget-based feature to help mobile users to add a quick note on Notion.
Notion has been one of the most popular note-taking in the current Market. However, the unsatisfying note-taking experience on mobile prevents users from using the app flexibly.
As a result, the case study aimed to provide a new feature to enable mobile users to catch up with the flashing ideas or information and convert them into notes in few seconds. Simultaneously, it speeds up the note organizing process.
The case study and the designer have no affiliations with Notion.
PROBLEM SPACE
Around 66% of the users reported that they are unable to keep their immediate thinking in mind before adding notes on Notion mobile.
After talking to some power users(also prior users) of Notion around me, I found most of them struggled with taking notes on mobile immediately.
3 of 5 participants complained they fail to grab their thoughts before they started to add the note on the 'right page'. Some participants agree that those usability problems prevent them from using the Notion regularly, such as too long loading time, complicated adding note process, unable to recall last immediate notes location, etc.
Thus I started to realize taking quick notes has become one of the main activities users would have on Notion mobile, even influencing the motivation of using Notion.
DISCOVERY
"Find the best place for my new note" overload users and distract them from the essential task of note-making and revisiting.
Though Notion aims to provide a well-organized workplace for users, repeated prompts of moving notes and the complicated migrating flow usually distract users from the note-taking process. Users tend to consider where they should place their notes before creating the content. However, the fact shows that the more extra consideration before taking note, the less focus they can have on their noting task. Aside, users may spend more time recalling their note location only for correcting the random title they made for their hurry note.
GOAL
How might we create quick access for note-taking and organizing with minimum distractions and less repeated work?
Based on my discovery, I wanted to come up with a solution to minimize distractions on the note-taking journey without breaking the existing structure and features of Notion. After walking through the Notion with other users, I decided to leverage the iOS widget and redesign the existing UX components to shorten the note-taking journey both outside and inside the app.
PROTOTYPE
Check it out on Figma 👉
DESIGN DECISION
I aimed to inform users of the note-taking process with a minimalist design.
DECISION BREAK DOWN
Quick Jot Down: Optimize the workflow to get notes ready at hands
Noticing that repeated notes locating work prevents making and organizing quick notes, here I keep the visual distractions and routine actions(e.g., loading animation and tapping text field to start editing) as little as possible.
By pushing organization work back, I directed users from the widget straight to the editing interface with the keyboard popped up and commonly used tools shown up first to kick off their jotting.
Keep Notes Clean: Stick the to-be-organized list on the top
Quick notes is cool, but organizing can be painful when there laying a pile of 'untitle's.
Thus, I created a 'CATCHUPS' bucket for all the yet-to-organize items sticky on the top of navigation to remind users of unorganized notes. It enables users to categorize notes by simply drag and drop either slide and delete.
I explored the various visual layout to better showcase relevant information of notes in 'CATCHUPS'. By using the following criteria, I found the best design to meet my goal:
1. Does it show the relevant information about every single notes?
2. Does it inform users of the yet-to-organize items clearly?
3. Is it easy to find in the app?
4. Is it overwhelming when there are numerous items shown at once?
EMERGING CHALLENGE
How might we reduce the accidental errors during note adding?
Rushed actions(in the app) are more likely to result in accidental clicks and frequent errors. After user testing with the earlier version prototype, several users complain the unclear state-switch between edit and preview leads to their saving notes without any error check or confirmation. And it may result in more typos or accidental inputs in their notes.
Thus, I redesigned UI controls and their interactions to clarify the edit and preview state. When users enter the editing state, cursor and keyboard popping up prompt users to do edit actions; Top bar collects the common state-switch controls, including confirm and cancellation for users to check updates proactively. After confirming, the cursor disappearing and the keyboard collapsing for preview. Simultaneously, top bar would switch to show the note title to help users have a complete overview of the editing note.
IMPACT
Compared to the previous design, the overall note-adding workflow has been reduced by 20%.
As the testing result showed, the time spending on creating a new note on Notion mobile has decreased around 40% after the redesign. The overall note-adding workflow has been reduced by 20% in the revised design. Even though I didn't collect the quantitative result of note-revisiting and organizing notes workflow, I received positive feedback from users, reporting it much easier to find and reorganize the quick notes they made previously.
Date
Position
Responsibilities
More
Mar 2020
UX Designer
User Research
User Flows
Wireframing
Prototyping
Usability testing
-
