Evernote for iOS / January 2017
Evernote is a note-taking and productivity app used by millions, and enables people to keep their digital lives effortlessly organized.
Throughout my tenure at Evernote, I've had the opportunity to design for every one of our platforms—Mac, Windows, iOS, Android, and Web. But most notably, throughout the past year, I led the redesign for a brand new version of Evernote for iOS—the second iOS redesign that I've been a part of.
Read more about the redesign process in my Medium article here.
“Version 8.0 brings with it an entirely new design, a bunch of refinements to what had become a hopelessly overwrought service, and a renewed focus on what Evernote is actually for.”
Design process
A design-driven approach
In a fairly unique situation, the iOS redesign was largely driven by design. After aligning with Product that this project was worth investing in, I was given the freedom to take time and explore the possibilities, run research sessions to validate our ideas, and find the ideal approach. Throughout the process, I partnered closely with our product manager and engineers. Our process involved continuous user research, building a functional prototype, and many rounds of iteration.
Discovering pain points
We knew the Evernote app had become cumbersome and inefficient. Creating notes and navigating between them took longer than it should. Some of the most significant pain points that we identified included:
An overloaded and complex UI
Too many taps to navigate between notes and notebooks
Slow to open the app and create a note
Sub-optimal speed and performance, both actual and perceived
Finding our north star—key goals and design considerations
To begin to address some of the most common pain points, I created a set of design considerations to adhere to during the design process. These included:
Increase efficiency for content creation and retrieval
Simplify the overly complex UI
Refresh and modernize the visual design and expression of Evernote's brand
1. Increase efficiency
Mobile is all about speed; we simply don't have the patience to spend time hunting and pecking within an app. Being a productivity app, people rely on Evernote to jump in, capture a thought or find some relevant information, then get on with what they were doing.
Quick access with the tab bar
With all the benefits of a tab bar, we chose to house the most important and heavily-used sections here. Users gain quick access to their notes, search, and shortcuts, and can easily toggle between each section.
Notes at the speed of thought
“Time to note" was another key factor. Users should be able to open the app and jump right into a new note, with as little friction as possible.
The prominent green new note button is now nicely situated in that sweet spot above your thumb. Tap once to create a text note, or long press for more options.
More ways to search and browse
Other areas we focused on for efficiency were navigation between notes and notebooks, and retrieval, through both searching and browsing experiences. We introduced a global search—accessible through the tab bar—where users can search by keyword for notes, notebooks, or tags.
We also added contextual search and filter functionality, where users are able to narrow down note lists by keyword, tags, or reminders.
2. Simplify the UI
Evernote is an incredibly powerful tool, but we often hear feedback that it's too complicated and overwhelming. Our goal here was to find the delicate balance between simplifying and burying less important actions, and preserving our rich, differentiating features.
We feel Evernote should grow with you; start simple, and surface the advanced features you need at just the right time.
Start with notes, organize later
(or don't!)
Upon launching the app, users land in their note list, able to see their content right away. In the previous version, users landed in a home screen, and had to choose where to begin.
New users can simply start taking notes, and may never need to organize further. Advanced users likely leverage notebooks for organizing their content, and can switch between notebooks to change their view.
Remove the clutter
We constantly asked ourselves, what's most important and serving a purpose, and what's just noise getting in the way? Identifying the note you need, or finding the right notebook stood out.
3. Modernize the visual design
Introducing a brand new version of the app gave us the opportunity to revisit and refresh our visual design language. Gone is the vast sea of green. The approach was to let the UI recede and stay out of the user's way.
Color with a purpose
While the Evernote brand is known for being green, we found that using it in large amounts was just too much. With the ability to refresh the visual design, we aimed for a more minimal approach to the UI.
Using a base palette of cool grays, green is now used sparingly and with more purpose. Green now indicates action and areas of focus, rather than an element of decoration.
On the left is the previous version, and on the right is the redesigned note list.
Let the content shine
One design change that I was particularly excited about is the new view for displaying notes in a list.
In the previous version, notes were displayed uniformly in a dense list. The new note snippets have varying heights to optimize showing the contents of each note. This can help users identify a note while browsing more quickly.
Users are also able to customize their view to choose the small, medium, or large size, as well as whether to display images or only titles.
Add color and style to your notes
One of the new features we were able to bring with the redesign was the ability to add more formatting options to notes. Users had been asking for the ability to change text size and color for quite some time, so we were excited to start to add in this functionality. And this is just the beginning, there's a lot more to come!
“In the previous version of Evernote Mobile, the interface tried to do too much. Now it’s similar to the browser-based interface of Evernote web—clean, uncluttered, and simple.”