Gmail Redesign

Primary Research

Users prioritize responding to important emails first

To begin, I used several methods to uncover opportunities for Gmail. I conducted passive contextual inquiries to identify the average users’ baseline approach to getting through their inboxes. The typical steps they take are shown in this task analysis diagram:

After viewing users' natural behavior, they discussed their pain points with Gmail, which I summarized into a user journey map and user story to serve as my target user.

As a busy student who’s in their last year of undergrad and is looking for future opportunities, I want to be able to filter and organize emails in a way that’s less stressful, so that I can effectively manage my schedule, plan for my future, and have an enjoyable senior year.

“I’m stressed out about my future, and the last thing I need is for my email to be stressful too”

"I want to maximize my productivity and get less distracted by my emails"

"Seeing too many emails at once is overwhelming, especially when they aren’t organized"

"Typing out individual responses for each email is a hassle"

Competitive Audit

I explored what other email services offer and produced a chart of interesting features for my own design.

Feature Prioritization

Amongst these features, I ranked what to include in my redesign based on what was relevant to my target user:

High

Features that were useful to focus on and integrate into my redesign:

Rules
Notes/Comments
Quick Reply

Medium

Features found in Gmail, but could be optimized:

Customized inboxes
Contacts

Low

Features already found in Gmail:

Calendar to schedule and manage meetings
Email templates
Managing notifications

The filtering feature was beyond what's capable for this project because it might involve machine learning or AI.

Here are the main goals for this project from a holistic perspective:

User Goal: Quickly get through emails
Business Goal: Provide accessible email for users all over the world with a range of identities
Technical Goal: Maintain Google's brand, while adding features that are useful and easy to access

Information Architecture

Mobile Sitemap Desktop Sitemap

Users typically check and delete emails on mobile for on-the-go organization, and thoroughly read and reply to emails on desktop

I created sitemaps to break down how pages connect together based on use cases specific to mobile and desktop platforms. Then based on the sitemaps, I created wireflows to show the sequence that enables users to move through my redesign of Gmail.

Mobile Wireflow

Desktop Wireflow

Usability Testing

Log-Analysis (Mobile)Log-Analysis (Desktop)

Main actions like sorting, the "Add Rule" feature, and the "Notes" feature need to be more visible

I conducted 3 rounds of usability studies with existing Gmail users to validate whether my solutions solved user problems and accomplished user goals. I recorded observations of the first testing round into 2 Log-Analyses to identify what to improve.

Pattern Identification

Full Observation Brief

3 out of 5 participants had a hard time knowing what to do first with the sort feature, so it isn't immediately clear that they have to swipe to organize their emails
4 out of 5 participants saw a use for sorting
4 out of 5 participants had trouble finding the "Add Rule" feature, so this feature is difficult to find for almost all users
2 out of 5 participants struggled with finding the "Notes" feature, which means not everyone was confident with navigating this section

Phone App Design Changes

Lo-Fi Prototype

Mid-Fi Prototype

Hi-Fi Prototype

Users use their Gmail app to quickly get updates on their emails

Instructional Overlay & Sorting

Current Design: Google automates emails into "Primary," "Promotions," and "Social" tabs.

Contextual inquiries showed that my target user typically orders their emails with important/starred emails at the top and less important emails saved for later at the bottom. From this, the redesign's sort feature allows users to organize emails into more relevant categories, as well as definitively trash irrelevant emails with a swipe, thus decluttering their emails faster.
‍
The majority of my users thought the swiping feature was unique yet familiar but had trouble remembering the category names once they disappeared. They also liked that this feature gamifies what would otherwise be a boring chore.

Mid-Fi

Final App Design

Sort buttons directly on the home screen
Categories have the same color to show that there isn’t a hierarchy
Confirmation and undo button to avoid errors

Inbox

Current Design: Google shows all emails at once, and the user can switch between labels in the hamburger menu.

Considering a smaller screen size, having drop-down menus for separate categories instead of tabs is a great way to save space while allowing for a more seamless experience.

Lo-Fi

Final App Design

Encouraging empty state after the user finishes sorting their emails
Can further sort emails from the "Other" category

Final App Design

Desktop Design Changes

Lo-Fi Prototype

Mid-Fi Prototype

Hi-Fi Prototype

The desktop website fulfills users' main activities that are easier with a larger screen and keyboard

Landing Page

Current Design: Opens directly into a list of emails and the user has to switch between email accounts to view other inbox's emails.

I designed a more versatile page where users can edit and create new inboxes, which coincides with the app's welcome page.

Adjusted the scale of certain elements based on Fitt's Law and depending on their importance to the user

Add Rule

This feature allows the user to automate some of their email flow. One user said they'd use this to set reminders.

Feature is under a new icon rather than hidden in the 3 dot menu

Notes

Users can add additional information they’d like to remind themselves of before composing a reply.

More obvious "View Note" button that stands out against the email section and opens an editable pop-up
Can attach links to Google Workspace files

Quick Reply

Current Design: The user has to use workarounds like marking emails as unread, snoozing, or manually adding emails to labels in order to accommodate for a lack of flexibility.

"Respond Later" tab opens with a traditional list view, and selecting emails unlocks the "Quick Reply" button
Reduces distractions by having a focused single page for users to write responses to similar emails

Final Website Design

Final Takeaways

What was most important about this project was to add features that the user will actually use, which I was able to validate through user testing

This project allowed me to iterate from low-fidelity digital wireframes to a high-fidelity prototype with each stage improving on the last. I think having Gmail become more customizable and dynamic overall (which can already be seen under their “Settings”) will create the best flow for each user.

App standards

For a dedicated native app, I would look closer into Material Design and Human Interface Guidelines, especially with best navigation practices common for each operating system. Designing for Android typically uses a floating action button, whereas for iOS there are tabs at the bottom of the screen, so I'd make sure to modify the UI for each platform with future iterations.

Focusing on one feature

For this redesign, I noticed I spent extra effort on the "Quick Reply" section because that’s what users were regarded as the most useful. Other features could've been designed more in-depth. For example, with the "Rules" feature, I could do further research on what users would want as their options in the drop down menu. I would analyze post-launch metrics to decide which feature was the most impactful and then focus on that feature in future iterations.