mobile app

For Android and iOS designed from scratch.

mobile app

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.

loading-screen
Loading screen.

Problem areas

•You can not send emails with Mailbutlers features within the mobile app. Users have to use one of Mailbutlers web extensions for either Gmail webmail, Outlook, or Apple Mail to send emails.

• If you don't use the web extension, the app can only show you tasks and notes that have been shared with you by a team member.

• Mailbutler's previous UI components were designed for the web and needed to be redesigned to work 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

Register/Login android

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.

Activity & Account info. android

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.

Emails Smiley face

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.

Notes Smiley face

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.

Tasks android

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.