Google Docs
For this project, my group and I redesigned the Google Docs mobile app. In a two-week sprint, we were able to discover and address user defined weaknesses within the current app through the addition of useful features.
feature concept
redesign
mobile

Project Overview

Experience

User Research
Task Flows
Mid-High Fidelity Wireframing
Prototyping
Material Design/ HIG Guidelines

Deliverables

High-Fidelity Mobile Prototype
Mid-Fidelity Wireframes
Journey Maps
Task Flows

Design Tools

Sketch | InVision
Whimsical
Miro

Duration

2 weeks

Team

Jessica Truong
Habib Sarwary

Role

UX/UI Designer
Project Manager

Problem

As a part of Google Drive, a file sharing ecosystem, Docs should be the primary app for note taking on the go. Unfortunately, Docs is losing users to competing apps like Notion, OneNote and other built-in apps that offer sleeker and smoother experiences on familiar interfaces. Our goal for this project was to give Google Docs a refresh and make it competitive and desirable as a mobile note taking app in 2020.

Solution

We delivered a high fidelity prototype incorporating easy-to-find editing tools, a tidied templates catalog, the ability to meaningfully organize and sort documents on the dashboard, and checkboxes to a modern but familiar interface.

User Research

Key Insights

After conducting 4 user interviews and synthesizing our data via affinity mapping, we came up with a few key insights. While users admitted Docs was their go to app for collaboration, they were quick to point out that it was definitely not on the top of their mind when it came to personal use. Though Docs was nifty for word processing on the go, it failed to meet user needs for more personal mobile note taking. Docs was, however, convenient because it was easy to access and widely used, taking away the inconvenience of downloading and onboarding prior to collaborations. From these key insights we were able to move forward and define both our target audience and opportunities for our redesign.

User Likes

  • Convenient
  • Familiar
  • Everyone has it— easy to collaborate

    ‍

User Dislikes

  • Disorganized
  • Lacks versatility
  • No UI updates
  • Difficult to access all features on mobile app

100% of Users

Reported having issues with
the editing tool bar

75% of Users

Only use Docs when collaborating and switch over to other apps for personal use
View Affinity Map

Target Users

While most users can agree that Docs is sufficient as a word processor, it falls short in the realm of note taking. We wanted to cater to a target audience that would seek to use this app for personal use in addition to creating professional documents, and create one product that would consolidate the functionality of the two main uses.

After synthesizing the data we gathered from our user interviews (via affinity mapping), we created two personas reflecting the user needs and pain-points we discovered.
  • Jacob: a busy and organized graduate student that needs to access Docs for both his dissertation and to create lesson plans for classes he TAs
  • Olivia: a pharmacist that uses Docs to plan group events and take notes for work
Jacob
Olivia

Jacob Tharp

"Busy, organized, and efficient"
Location: Culver City, CA
Job: Graduate Student

Behaviors:

Frustrations:

Goals:

  • Always on the go from lab, to class, and then to discussions
  • Is busy but appreciates organization and efficiency
  • Not having access to features like checkboxes to make lists
  • Finding templates on mobile can be time consuming and overwhelming
  • To have the capabilities of a word processor and a note taking app in one place
  • To have increased organization in Docs to find what he needs ASAP
View Jacob's Journey Map

Olivia White

"The host and planner"
Location: Santa Monica, CA
Job: Pharmacist

Behaviors:

Frustrations:

Goals:

  • Spearheads events and trips for her friend group and family
  • Creates organized documents that all her friends can collaborate on
  • Takes throrough notes during meetings/conferences
  • Spend too much time looking for basic features
  • Lack of features for personal use
  • How long it takes to create and share a document on the mobile app
  • Find versatile document features all in one place
  • Share documents with all her friends in the quickest way possible
View Olivia's Journey Map

Opportunities

Though users preferred using other apps for non collaborative tasks, we found that they did use Docs often. We discovered features users found handy in their preferred mobile note-taking apps and aimed to fill in the gaps. Almost all of our users made lists using virtual tools and pointed out that check boxes were essential to most of their lists. Users pointed out their use of apps such as Notion and Dropbox Paper due to their versatile editing tools and templates. Lastly, users were frustrated with the dashboard sorting options which did not help them organize or find their desired documents. With this in mind, we moved on to competitive comparative analysis.
Added Versatility
Adding standard note-taking tools such as check boxes, in-app drawing, and easier access and use of tools such as tables
Organized Editing Tools
Centralizing all text editing tools for faster mobile word processing
Sorting by Categories
Reinventing sorting options to provide meaningful context to existing and new documents

Feature Analysis

Competitive Analysis

We wanted to know what what features differentiated sleeker note taking apps from Docs. We noticed that Docs lacked what are now considered basic functions like checkboxes, drag and drop options for components on the page, and the ability to create and add a drawing to a page. In terms of organization, we realized that other apps organized editing tools in a more efficient way as well. We focused our attention on features Docs lacked that we could add to our prototype.

Checkboxes

While most other note taking apps have checkboxes, it is still a capability that Google Docs has yet to implement on their application.
Notes
Evernote
OneNote
Notion
Bear

Organized Editing Tools

While many of Docs text editing tools cannot be accessed in the menu above the keyboard, other apps have consolidated all of these tools on one location.
Notes
Evernote
OneNote
Bear

Feature Prioritization

While there were many useful features we came across in our research, we decided to focus our attention on immediate user needs using MoSCoW prioritization (shown below).

Must Have

  • One centralized location for tool bar and text editing
  • Check lists for note-takers
  • An organized dashboard with categories

Should Have

  • Organized templates gallery
  • Revamped modern UI
  • Notifications on comments

Could Have

  • Drag and Drop option
  • Excel features (adding, subtracting, formulas, etc.)
  • Reminders
  • In app drawing

Wont Have

  • Scan document feature
  • Voice Memos
  • Chat feature
Docs
Notion
Notes
DropBox Paper
Sharing Options
Character/Word Count
Character/Word Count
Checkboxes
Templates
Track Changes
Editing Tools in One Location

Ideation

Initial Sketches

After getting a better idea of what we wanted to include in our final product, we started off sketching some potential ideas for our wireframes. Hover over any of our sketches below to zoom in!
Docs
Notion
Notes
DropBox Paper
Sharing Options
Character/Word Count
Character/Word Count
Checkboxes
Templates
Track Changes
Editing Tools in One Location

Mid-Fidelity Wireframes

After sketching by hand, we moved onto digital tools, using Sketch to create some of our first wireframes. We wanted to visualize what some of our features would look like within the existing app and we incorporated them into our mid-fidelity wireframes.
Docs
Notion
Notes
DropBox Paper
Sharing Options
Character/Word Count
Character/Word Count
Checkboxes
Templates
Track Changes
Editing Tools in One Location

Usability Testing

Feedback and Changes

After completing the first iteration of our high-fidelity prototype, we asked 3 users to go through it to test the functionality of our redesign and collect feedback. 3/3 users were able to complete both of the task flows with 1 or less errors. Though the flow of our prototype made sense, some of our usage of icons was confusing to our users. We went ahead and addressed these changes in the next iteration of our prototype.
3/3 users were confused about the icon on the right indicating more options
Before
After
1 user who was new to Docs was confused by the checkmark to finish editing
Before
After
We used an icon that was used as a viewing option, not a table
Before
After

Interactive Prototypes

Olivia

Olivia will be creating a Friendsgiving document and then sharing the link with her friends.
‍
In order to improve her experience we added categories and a pop of color to the dashboard and subsequent screens. We also consolidated all the document tools above and in the keyboard to create a streamlined search for whatever she might need (in this case, a table). Sharing with friends is also just two clicks away once the document is completed!

Jacob

Jacob will be creating a new lesson plan, sharing it with the professor, and asking for feedback in the comments.
‍
We created an option to sort by categories on the dashboard, allowing Jacob to see all his lesson plans upon entering the app. We also organized the templates gallery so he can access exactly what he needs without having to see all the options in between. In order to keep track of what him and the professor have covered, he uses checkboxes for the list he's created. After sharing, Jacob is able to comment on entire documents, allowing him to ask for general feedback.

Moving Forward

Future Directions

Since this was a 2-week design sprint, we didn't have the opportunity to explore all of the features our users would have liked to see in Docs. If we had more time to work on this concept project, we would have tried to incorporate some of the following features us and our users were excited about and run another round of usability testing:
  • Allowing users to edit headers and footers on the mobile app
  • Adding formulas and/or allowing tables to have some calculating abilities to consolidate some of the functionality between Docs and Sheets
  • Chatting features for easier real-time collaboration

Lessons Learned

During this project, I learned...
Feature Prioritization is Key
Feature prioritization is the key to moving forward in open ended design projects that can take many different directions. It is important to keep the users needs in mind while making every feature decision.
User Research > Biases
As someone who had used Docs for all my adult life, I didn't realize how unintuitive Docs felt to new users, especially the mobile app. It was interesting to explore pain points I wouldn't even have imagined and it was only possible through user research.
OverviewUser ResearchFeature AnalysisIdeationUsability TestingPrototypesMoving Forward

View More of My Work

Google DocsFinliVissersDaily UIs