Evernote 10’s user interface renewal is shockingly bad
Nine sins that Evernote 10 for Mac has committed in its user interface, breaching some of the most basic UI design principles.
(If you’re not a Medium member, click here to read this article.)
I’ve been a long-time user of Evernote, ever since 2011, with over 23,000 notes in total. So you can say I’m one of its loyal customers.
With the release of Evernote 10 earlier this month, however, I’ve made up my mind: I’m going to migrate all of my notes to another note-taking app.
It’s not because of the removal of several features, as heavy users such as Darryl (2020) complain. It’s because I’ve lost my faith in Evernote design team after learning about Evernote 10’s appalling user interface design.
Nine design glitches of Evernote 10
I take time to list up what I find irritating about Evernote 10’s user interface. There are 9 of them:
- Lack of responsive design
- Confusing UI for searching over all notes
- One extra click for clearing the search field to search over notebooks
- Clicking an icon does not show the list of shortcut notes. You have to hover over it.
- Sorting note titles in the descending order (i.e. Z to A) by default
- Selecting a note with arrow keys does not preview its content
- Code blocks cannot be coloured (and all the colours are gone in the existing notes)
- Two clicks to open a link
- One extra click to send feedback, and it’s modal
Let me go through these one by one in detail. A few notes before moving on:
- I’m a MacOS user. Evernote 10 for Windows may behave differently, although it shouldn’t be the case if Evernote succeeds in cross-platform consistency in user interface as it claims with Evernote 10 (Evernote Team 2020).
- As I just did in the previous bullet point, I use the Author-Date referencing system in this article, to refer to books and web articles. References are attached at the end of this article.
- In the screen shots below, you’ll often see Japanese characters as I’m a native Japanese speaker.
#1: Lack of responsive design
Responsive design, making the layout flexible with the width of an application window, has long been the norm in web design ever since this design principle was popularized by Marcotte (2010).
Ten years on, Evernote 10 breaks it blatantly:
It feels like a website made more than a decade ago.
Personally, I often use Evernote side by side with another application. But Evernote 10 demands more than half of the 1440 inch-wide screen of my MacBook Pro to show its content without being cut off. That’s unacceptable.
#2: Searching over all notes
[Updated on 28 Oct 2020] This section is revised in response to a Reddit comment on this article (svferris 2020).
The beauty of Evernote lies in its ability to search over any kinds of notes you have taken in the past. Evernote 10’s user interface design for this core functionality irritates me quite a bit, however.
Imagine we’re seeing a particular notebook (i.e. a collection of notes) and then wants to search over all notes, including those outside the currently opened notebook. We expect one click of a search icon and perhaps one more to remove the restriction of search within the current notebook. But what we see after clicking the search icon is this:
There is no indication that we have an option to search over all notes, or at least I thought so (more on this later).
After a bit of struggle, I found the way to go forward as follows: click the blue “add filter”, even though we want to remove the filter on this occasion. Then we see this:
Now click the blue “clear” and then finally we’re able to search over all notes.
[Added on 28 Oct 2020] After publishing this article, however, I’ve learned from a Reddit comment on this article (svferris 2020) that the user is actually allowed to search over all notes by default. Let me reproduce the screen after clicking the search icon when my notebook called “HTML/CSS” is opened:
It turns out that the notebook “HTML/CSS” is only a suggestion to be used as a search filter. By directly typing a search word, the user can search over all notes(!).
But is it what this screen indicates intuitively? Another Reddit user defends me:
“To be fair when you look at the search box it’s not clear that the search term it’s offering is only a suggestion, it looks like it’s already an applied filter.” — BJbh6vyh765hvvg (2020).
In the previous versions of Evernote (now available as Evernote Legacy, thankfully), we were always given two choices after clicking the search field on top right: search over all notes or within the current notebook.
This is more intuitive in my opinion.
#3: Clearing the search field
Evernote allows the user to search over notebooks as well. For heavy users like me, the number of notebooks can be quite a few (I have 291 of them). So it’s an essential feature.
Evernote 10 remembers the previous search term. That’s fine in itself. But clicking the x button at the right end of the search field not just erases the previously entered term but also — against my expectation (and I believe many users’ as well) — blurs the search field so you cannot type a search word immediately after. You have to click the search field again:
The convention for the x button in the text field is to clear the previously entered text for the purpose of entering a new phrase. Blurring the search field goes against the user’s expectation and demands one extra click.
Evernote app design team LOVES one extra click. This UI pattern comes up again and again in #5, #6, #8 and#9 below. I’ll call it one-extra-click-ism.
Today’s web design minimizes the number of clicks significantly, by putting all the contents into one single page and letting the user to scroll the page to find information. It’s mainly because clicking a link to another page of the site may take some time to load a new content, which can frustrate the user who will then leave the site.
Most users are now used to this user interface paradigm. Being forced to click one extra time makes us feel the pain. At least I do feel the pain.
It’s one big reason why I don’t trust user interface designers in the Evernote team anymore. They don’t keep up with the user interface design trend.
#4 Seeing the list of shortcut notes
Well, Evernote 10 designers sometimes allow the user to skip one extra click, but in a wrong way.
Evernote users can give a particular note a star for quick access. It’s called a “shortcut”. In the previous versions of Evernote, clicking the star icon in the side navigation bar shows the list of “shortcuts”.
In Evernote 10, clicking the star icon doesn’t do anything. Sometimes the list of shortcuts only briefly appears and then immediately disappears:
It took a few minutes for me to figure out that the user has to hover the cursor over the star icon, and wait for a second, to see the list of shortcuts:
It’s okay to add this hovering feature. But the most natural thing for us to do over the icon is to click it, not to hover it. Clicking the star icon should also show the list of shortcuts, and there’s no harm to allow this interaction pattern. But Evernote 10 rejects the most natural user action — clicking an icon — completely. That’s not a pleasant user experience.
User interface should be permissive as much as possible. That’s one of the core principles of user interface design:
“Users make mistakes; forgive them.” — Apple Computers (1987), page 8
#5 Sorting notes
As we’ve already seen in all of the previous four cases, Evernote 10 goes against the user’s expectation quite often. Sorting notes is another example.
The user can sort notes either by title, by date updated, or by date created. When we choose to sort by title, we expect to see those notes with the title starting with A, B, and C come first.
No, Evernote 10 thinks those with Z, Y, and X should come first:
Of course, we are allowed to reverse the sort order (one extra click again). But once we choose another sorting option (by date updated or by date created) and return to the sort by title, Z, Y, and X come first again…
For sorting by dates, the descending order is more natural. More recent notes are always more likely to be relevant for us. For note titles, however, it’s a different story…
I guess it’s the fault of Evernote developers who fail to change the default sorting order by the type of sorting. Worse, they also fail to let the app remember the user’s previous choice.
#6 Previewing notes
Ever since email apps arrived, it’s the application’s default behaviour to preview the content when the user selects it in the list. Evernote 10 ignores this convention, going against the user’s expectation again.
Pressing the arrow keys (down and up) in the list of notes DOES NOT change the note preview on the right. To see the note, you need to click it in the list (one extra click again).
This is very annoying to me. In the previous versions of Evernote, I often use arrow keys to go through the list of notes so I can quickly browse many notes at once. To do this with Evernote 10, I have to click each note title one by one…
What’s the rationale behind this design decision? Maybe Evernote developers simply forget to attach event handlers for pressing arrow keys.
#7 Colored lines of code
As an aspiring web designer who can also code, I often use Evernote to take note of what I learned about JavaScript. It requires code blocks in the note, inside of which the program code is shown in a monospaced font. Evernote 10 messes up the code block, as if it wants to get rid of coders from its user base.
When learning how to code, I often color the particular line of code to visually stress the important part or the part changed from the previous step. I then use the same color for the text outside the code block, to explain what the colored line of code does. So it’s visually immediate where to look for, to understand the purpose of colored lines of code:
Evernote 10 removes all the colors from blocks of code, however. Gone are all my efforts to make the notes on programming easy to understand.
By the way, exporting notes from Evernote to Notion — a note-taking app that I’m considering to migrate into — will also remove the color from code blocks. Which means it’s likely to be due to the failure of exporting all the style information of notes in Evernote (and the use of exported data by Evernote 10).
#8 Clicking the link test
One-extra-click-ism goes wild here. Clicking the link text in a note does not immediately open the linked webpage or the linked note. Instead, the linked URL pops up with the Edit option to click. To see the linked webpage or note, you need an extra click of the URL.
To edit the link URL, the previous versions of Evernote required the right-clicking of the link text. Then choose “Link > Edit” in the pop-up menu. That was more in line with the user’s expectation derived from daily experiences of surfing over the net: if you want to do something else than seeing the linked page (e.g. copy the link address), you right-click the link text.
Once again, Evernote 10 ignores the user’s expectation, or their “mental model” if we use the jargon well-known in the user interface design literature. Designing user interface in line with the user’s mental model is one of the first things to learn in any user experience course today (e.g. Klemmer 2015). Evernote designers seem to forget about it.
Also, Evernote 10 requires two clicks both for jumping to the linked page/note and for editing the link URL. It’s certainly better to allow just one click to jump to the linked page/note while requiring two clicks (right-click and then click) for editing the URL.
#9 Sending feedback
One-extra-click-ism prevails to the last resort for the frustrated users: sending feedback. (Indeed, I have sent feedback several times by now.)
To be fair, Evernote 10 does a good job here. In the previous versions of Evernote, it’s impossible to send feedback quickly (I don’t even know how). With Evernote 10, I learned this functionality when I was hovering the cursor at the bottom left corner. The phrase “Send feedback” pops up, which tells me I can send complaints by clicking an icon at the bottom left.
Clicking this “Send feedback” icon, however, DOES NOT immediately take you to the feedback form. You will see this instead:
Clicking the green button will take you to the feedback form — one extra click again — in a browser tab. But there’s another sin in this user interface design: it’s modal. That is, the user cannot do anything else than dealing with this pop-up dialog box.
Back in 1987, Apple published its famous Human Interface Guidelines (see Hodson 2016 for detail). In it, user interface designers were advised as follows:
“You should sparingly use this type of dialog box, because it restricts the user’s freedom of action. For this reason, the main use of a modal dialog box is when it’s important for the user to complete an operation before doing anything else” — Apple Computers (1987), page 59
Is it important for the user to decide whether to send feedback before doing anything else? I don’t think so.
Evernote designers even ignore the user interface design principle already known more than 20 years ago. I can no longer trust them to provide a great user experience of taking notes.
Didn’t test users complain?
Evernote 10 was released after over 144,000 test users participated in its Beta Program and must have sent feedback to Evernote design team (Small 2020). I cannot believe the majority of these 144,000 people didn’t complain any of the above 9 user interface glitches.
Or maybe I’m wrong. If you think any of the above 9 “glitches” is actually a good design feature, please let me know by submitting a comment to this article. I’d love to learn more about user interface design.
Or test users did complain, but Evernote management decides to ignore them for the sake of a bigger purpose. What can this bigger purpose be? If you happen to know it, please let me know by submitting a comment to this article. I’d love to hear it.
Responses to this article
[Added on 28 Oct 2020] To my surprise, immediately after this article was published, a Reddit user created a discussion thread by sharing this article (woam4821 2020). Below are some responses in this thread:
“Nice summary of the extra clicks and counter-intuitive design in the Evernote 10 desktop app.” — woam4821
“Outstanding post & really details a lot of the shortcomings in V10.” — IndyScan
“Great post — I had such high hopes for the future of evernote, but looks like it’s back to the drawing board for me. They haven’t done themselves any favours and left an open goal for Notion” — PropaneFitness
Seems like I’m not alone. :-)
References
Apple Computers (1987) Apple Human Interface Guidelines: The Apple Desktop Interface (Addison-Wesley, 1987)
BJbh6vyh765hvvg (2020) “A comment to ‘Evernote 10’s user interface renewal is shockingly bad’”, reddit.com, Oct. 27, 2020.
Brooks, Darryl (2020) “Is Evernote Still the Best?” The Startup , Oct. 16, 2020.
Evernote Team (2020) “Introducing the New Evernote for Windows and Mac”, Evernote News, Oct. 7, 2020.
Hodson, Bryant (2016) “Rediscovering Apple’s Human Interface Guidelines from 1987: UX Lessons from the Dawn of the Personal Computer”, Prototypr.io, Apr. 26, 2016.
Klemmer, Scott (2015) “Mental Model”, a video lecture in Design Principles: An Introduction by University of California San Diego
Marcotte, Ethan (2010) “Responsive Web Design”, A List Apart, May 25, 2010.
Small, Ian (2020) “Unlocking Evernote’s Future”, Evernote News, Sep. 16, 2020.
svferris (2020) “A comment to ‘Evernote 10’s user interface renewal is shockingly bad’”, reddit.com, Oct. 27, 2020.
woam4821 (2020) “Evernote 10’s user interface renewal is shockingly bad”, reddit.com, Oct. 27, 2020.
If you’re interested in UI/UX design, you might find interesting the following articles of mine:
