EvernoteRedesign

Final Project - GD76Maile Malin

Why Redesign Evernote?

Evernote is a great app for storing notes. It’s extremely useful for people to write quick notes on the go which sync automatically to the cloud and are then accessible online!

I chose to redesign Evernote because, although it is handy and I use it often, the many capabilities are hidden within the cluttered, overly complicated Android UI. It relies on icons that are not intuitive or commonly used. It’s as though the designers took the desktop application and shrunk it down into the mobile application, removing nothing!

Examples Navigation/Left & Right DrawerCluttered, excessive, Unnecessary items Does not auto-save Persistant Upgrade alerts

Alert pop-ups that freeze

RESEARCHLet’s start with some user interviews!

User Interviews

I interviewed three Evernote users to discover what they thought of the application as it currently exists.

AJ used the iOS app. Heidi had used Evernote for work.Mike mainly used the Evernote plugin for browsers

Empathy Maps

I mapped the quantitative results from the interviews into sections encompassing the user’s actions.● Tasks they performed● Feelings they exhibited● Influences that affected their interactions● What they said and did● Their overall goal for using the app● Pain points that affected their usage

Heidi:

Mike:

AJ:

Storyboards

Based on the interviews and empathy maps I then created a few storyboards showing situational tasks that the users performed using Evernote.

1. Coworkers working on a document together in multiple applications, including Evernote and the problem this caused

2. A user creating a note on the go to access at a later time

3. A user just discovering the hidden “Explore Evernote” option in the application he’s been using for a over a year

Storyboard #1

Storyboard #2

Storyboard #3

Visual User Flows

The research so far inspired the redesign of certain aspects of the application. Once I created the first iteration, I organized the screens into tasks as visual user flows. In order to test these screens out, I wrote a user testing script to read to each person tested.

Here are the tasks: ● Creating a new text note, adding a photograph to it and

saving the note● Finding an existing note by date● Moving it an existing note to a new notebook, and

renaming it

Visual User Flows

User Testing Script

User Testing Results

Based on the results of user testing the updated screens of the Evernote app● Add Note was very clear● The notebook icon was not clear and

highlighted the issue with Evernote’s reliance on random icons instead of text clues

● The SAVE feedback pop-up was helpful● Icons need the added text description as shown● New notes should not have an assigned

notebook, but instead a text hint ‘assign to a notebook’

Final iteration Invision Prototype

Microinteractions

● LOADING: Elephant trunk swinging● Auto- Saved feedback pop-up upon closing a note● Pinch/spread on document zooms in and out of the

document to better read/see image details.

LOADING SCREEN:Logo swings elephant trunk while loading

Actual Evernote loading screen shows the elephant logo static.

Pinch/Spread on document will increase, move, or decrease file in order to zoom out.

Actual Evernote application does not allow for zooming in or out of the image, so small document photos are impossible to read!

To the right you can see a screenshot of the app wherein the image taken is illegible because it is too small.

Autosave microinteraction:

Upon tapping the check or back button in the app, you are notified that your note was automatically saved!

Actual Evernote application does not autosave and will alert you with a generic box that asks if you’re sure you want to close without saving. See screenshot example ->

This microinteraction was created in Moovly and then downloaded and published to YouTube. However, at this time I’ve not received an email confirmation of either.

Autosave microinteraction:

Upon tapping the check or back button in the app, you are notified that your note was automatically saved!

Actual Evernote application does not autosave and will alert you with a generic box that asks if you’re sure you want to close without saving. See screenshot example:

THANK YOU!