mobile app

For Android and iOS designed from scratch.

Product

This app works as a mobile companion app to Mailbutler's web apps. It helps customers keep track of how their emails are performing when they are not in the office and improve collaboration with their teams within email management.

- My role: I was the only designer working with a team of two developers, a project manager, a UX editor and a customer expert.

illustration email productivity
Email productivity.

Problem areas

•In the first release you can not send emails with Mailbutlers features within the mobile app for techincal reasons. Customers had to use one of Mailbutlers web extensions for either Gmail webmail, Outlook, or Apple Mail to send emails.

• If you customers did not use the web extension, the app could only show tasks and notes that had been shared with them by a team member.

• Mailbutler's previous UI components were designed only for the web and needed to be redesigned to also work with with ios and Android.

wireframes mobile app
Sketching ideas.

Research

The design was based on Mailbutler's brand guidelines, insights gained from customer service, user data, competitor research, user testing on prototype and beta testing.

wireframes mobile app
Wireframes for testing layout in more detail.

Icons

New larger icon was designed with more detail. The bowtie on the avatars is part of the brand as a recurring element.

icons

android Register & Login

Once you have downloaded the app, a welcome screen appears, informing users that they also need to install the web app to get the full experience.

ui design
Welcome, Signup and login screen with android keyboard.

android Activity & Account info.

The app gives you notifications of the latest most important activity.

In the first tab in the app, you see the Activity feed, where you get a list view of all your activity.

If you click on your avatar in the top left corner you see actions remaining in your subscription plan, upgrade and links to support and feedback.

ui design
Notifications, activity and account information.

apple Emails

A list of all emails sent with a Mailbutler feature. To open the email or add a note or task to it, you slide the row to the left.

As soon as a tracked email has been opened or a link has been clicked, the user can click the double checkmark/link icon on the left to see detailed information on when, where, and with what device/browser the email/link was opened with.

ui design
List of emails and tracking details.

apple Notes

Conventional email messages are unalterable – once sent, and it is difficult for a user to add new information. Notes allow sender and recipients to easily add information to specific emails without sending a new email.

ui design
Notes for iOS with overflow menu & team sharing option.

android Tasks

With Tasks, the user can extend an email message's context through assigning todo items. To work more efficiently within teams tasks can be shared with a team or organization and anybody with access to the task can mark it as completed.

ui design
Tasks for Android with overflow menu & team sharing option.

Beta release

At this point, a beta version of the app was released. Where existing users who had previously been asking for a mobile version, were invited to start using the app and encouraged to report on any issues they might have or give suggestions for features and other ideas.

ui design
Illustration for landing page and email invitations.

Onboarding

For the public release, empty states illustrations were added to explain to new users the importance of using this app in collaboration with a Mailbutler web extension.

mobile beta release

Work from anywhere!

For the release, I developed the overall look of the campaign in collaboration with the marketing manager.

The app was released in September 2019.

Animation for social media, blog, email and landing page.

second release

The technical issues of not being able to send emails from the app were solved in the second version of the app.

android Composing an email

You click the floating round button similar to composing an email in Gmail and can add Mailbutler features like tasks, follow-up reminder, signature or use message templates.

UI design, composing email
Composing an email in Android with Mailbutler features.