ui design

When Gmail launced a new inteface, Mailbutler's email plugin needed a new design as well.

women working

Problem

Mailbutler for Gmail is a Chrome extension that supercharges Gmail with a suite of productivity tools, designed to help you declutter your inbox and to write faster and stronger emails.

In 2018 Google pushed out a major revamp to its Material Design guidelines. The new design language meant big changes for Gmail.
Which meant that Mailbutler's plugin also needed to be fully integrated with Gmail’s Material Design interface to fit with the new design.

sketch ui design

Project

The design was based on insights gained from customer service on user experience, research on Google material design and Mailbutler's brand guidelines.

I was the only designer working with a team of 3 developers.
I started the project with drawing up gmails interface in illustrator to have a clear prototype to work with and to share with developers throughout the project.

ui design

Icons

The icons needed to be simple and legible to work in 17px. The previously outlined icons were difficult to see in the new interface. I, therefore, designed new solid styled icons with a similar look, so that existing users could still recognise each icon for each feature.

icons

Login

The login screen was a good place to be a little more creative and to show the company's brand identity and logo. The leaves are slightly moving in the background to beautify the experience.

ui design

Material Design

The design was made to be transparent so that the user feels like Mailbutler's interface is part of Gmail, while still keeping with Mailbutler's brand.
To do this I used similar UI patterns as Gmail, to give new users some grounds of familiarity to begin interacting with the product.

Most features are reached from within the compose window, this created a rather small space to work with, while still leaving most of the window blank for the user to write their email.

ui design

Promotion

For the promotion, I worked with the head of communication and marketing. Where I created graphics for different media channels like; social media, Product Hunt, newsletter and Chrome store.

ui design

The impact

A little more than a month after launch the number of subscribers had increased with 68%.

ui design