Microsoft – OneNote

Collaborative organization for note-takers

As the types of and volumes of notes increase, users need flexible ways to navigate and organize large sets of notes they create alone or in collaboration. I explored new organizing experiences and views for various kinds of notes, both loose and in collections to showcase to the broader OneNote UX Team.

Project Background

What is OneNote?

OneNote is a note-taking and personal information management application for collecting, organizing and sharing digital information.

Problem: The current design utilizes a column structure inspired by a notebook concept of having sections and pages. Although this organizational system works, it does not scale well in terms of searching large collections of notes. The notebook concept itself can also be very limited towards what a user may envision a digital notebook can do.

Opportunity

As the types of and volumes of notes increase, users need flexible ways to navigate and organize large sets of notes they create alone or in collaboration. The team needed to explore new organizing experiences or views for various kinds of notes, both loose and in collections.
‍

How might we design an experience that allows flexible ways for users to navigate and organize large sets of notes they created alone or in collaboration with others?

flexible: enable more than one view or experience
navigate: make it easy for users to find and use their notes
organize: enable users to easily arrange and store notes

Discovery

Encoding and recalling notes

To become familiar with the opportunity space, I reviewed prior research to learn more about the complexities of various mediums and purposes for note-taking. This research helped me better understand different motivations for organization, searching, and viewing of notes.

Baseline OneNote experience

Once I understood the opportunity space, I performed a product audit of OneNote mobile and online to understand the baseline experience of our organizing and viewing experiences across various platforms using Jakob Nielson's usability heuristics.

Some questions I started with were:
• Are objects, actions, options regarding organizing notes visible?
• Are there accelerators for both the novice and expert user?
• How are search errors prevented or mitigated?
• How can you arrange and store notes?
• Are searching, viewing, and organization functionalities consistent across different platforms?

Comparing organizational experiences

After understanding the limitations and gaps in our search, organizing, and viewing experience, I spent some time looking at direct and indirect competitors to understand how they handle similar challenges to their audiences.

Interviews: students and working professionals

The product and competitive audit allowed me to build effective and realistic questions with the team for our interviews and surveys. We conducted 6 interviews with students and working professionals to understand intent and motivation behind their digital note-taking experience. After that, we were able to validate these patterns of behavior at a larger scope (50 people) through an online survey.

"OneNote sucks at syncing so I use Google Docs for collective notes with other people because of comments and real-time syncing"

"I switched to Notability because it can search my handwriting and pdf's when I use an iPad"

"I use Evernote for work but I never know if I need to add onto parts of older notes or if they are completed when I work with my team"

"My team has been adding onto a continuous document separated by dates for months so it's hard to view all our notes collectively"

How can we build a cohesive vision of these experiences?

After conducting interviews and surveys, I led the team to synthesize our data through an affinity diagram over Miro. We were able to build two personas that were a collective understanding of several pain points, behaviors, goals, and needs when it comes to note-taking.

Where do opportunities lie within their journey?

Building a cohesive vision of a student and working professionals' story helped me further parse their day-to-day experience into actionable design opportunities that fit into their pockets of frustration. This helped me prepare for design requirements to narrow our focus on explorations and ideations.

Explorations

Wireframes

From the research and discovery, the team and I explored some early ideas to get a better sense of which direction we would focus on. A few areas of focus were flexibility of viewing options, cross-platform notes, search, and collaboration.

How do we prioritize opportunities?

Even though there were various opportunities to design for individual search, viewing, and organizing experiences, the team decided to narrow the focus on collaborative organizing experiences by creating an impact versus effort matrix.

Our rationale was because:
‍COVID-19: online collaborative spaces will become more demanding and common
‍RESEARCH: Organization within OneNote has traditionally come from the perspective of individual note-taking rather than collaborative note-taking
‍COMPETITIVE AUDIT: OneNote can benefit from combining its note-taking space with more of a workspace for its users. Often times, the work that users complete for work or school become their notes (EX: Google Docs is used as a workspace/productivity application that doubles as a note-taking one)

Through many explorations, we designed three new features that answered the question of:

How might we...

Testing

Accessibility, testing, and refinement

The team and I performed usability studies with students and working professionals remotely to test our designs and make adjustments. We gathered a lot of positive feedback with our design directions, where participants were ecstatic to see their input come to life. We also shifted our focus on refining our designs to ensure our integrations were accessible. As a designer, I have a huge responsibility of making designs accessible to people with permanent and temporary disabilities. The tab stops indicate the interactive elements with arrows demonstrating how one might traverse through a group of interactive items.