In this project, the problem I was given was to create an email client design, first applied to a desktop and then applied to a mobile application. I developed the solution to include a simple, calming interface to remove some of the overwhelm that can come with doing email. I achieved this through the use of color, minimal elements, white space, and screens focused on the current task. 
Below are the other designed screens for the desktop version. The "Message Saved to Drafts" and "Success! Message Sent" notifications were timed to disappear after a few seconds. 
Below is some of my process. The first image is my sitemap & vision, the second is a sampling of some wireframes, and the third is the list of changes to make based on user testing feedback. 
Sitemap & Vision
Sitemap & Vision
Desktop Wireframes
Desktop Wireframes
Mobile App Wireframes
Mobile App Wireframes
Mobile App Wireframes 2
Mobile App Wireframes 2
User Testing Notes. Different colors represent different users.
User Testing Notes. Different colors represent different users.
User Testing Notes 2
User Testing Notes 2
List of Changes from User Testing
List of Changes from User Testing
Below are images of the mobile design: a mockup followed by screens in portrait and landscape orientations.
Personal dashboard area found by swiping to the left on the green bar.
Personal dashboard area found by swiping to the left on the green bar.
Phone Landscape Inbox
Phone Landscape Inbox
Phone Landscape Compose
Phone Landscape Compose
Phone Landscape "Saved to Drafts" Notification
Phone Landscape "Saved to Drafts" Notification
Phone Landscape "Success! Message Sent" Notification
Phone Landscape "Success! Message Sent" Notification
Phone Landscape Personal Dashboard
Phone Landscape Personal Dashboard
Overall, I greatly enjoyed this project. It was a fun challenge to adapt the email client we made for desktop to a phone application. It led me to think more deeply about how I use email on my phone and what my needs are when emailing on my phone.

You may also like

Back to Top