Writing a new blog

I'm moving on. Follow me in a new blog.

I’ve been writing here since 2012. Some posts have been extremely popular. For example this one topped the hacker news and received over 30,000 visitors in 2 days and Google engineers responded to that. Others were less popular but nevertheless, this blog receives roughly around 60 visits per day. This makes me feel responsible to write regularly, but due to shift in my interests, I haven’t been updating it lately.

This blog is only about specifying UX errors in other products and suggestions on how to improve them. It’s about the details. As I’ve been working as a UX Engineer I’ve learned a lot during the past few years that I want to share. The new blog is going to have a higher level view and look into the process of product design and development and how to prevent such errors to happen in the first place.

But this is going to change because I have started another blog where I write about UX and product development. Check it out: https://medium.com/@alexewerlof

Amazon Kindle dictionary is sometimes useless

Problem

Amazon Kindle paperwhite is one of the best things I’ve bought this year. It costs almost as much as a Nexus 7 but has the following advantages:

  • The battery lasts much longer, even though the display doesn’t go to “sleep” as quick as a tablet (actually I have set it up to be on for 5 minutes since last interaction)
  • The whole UX is centered around books & reading. It doesn’t have any apps and distractions. No email or whatsapp notifications. Just pure joy of reading. No temptation to play games or check out Facebook either. It has a browser that is dead slow and its monocolor screen makes its usage limited to emergency.
  • It comes equipped with the world’s most famous online book store with good deals. Many awesome books are cheaper in electronic format. In fact I started to giveaway my paper books as gifts and buy their electronic version. I have close to 100 books in my pocket!
  • The backlight is adjustable to levels way below most LCD screens and that makes it super useful for reading in the bed and total darkness
  • It weights lighter so it’s quite practical to hold it with one hand
  • There are a bunch of official plugins and apps that allows sending files directly to your Kindle from Chrome, Windows, Mac etc.
  • It has a built-in dictionary that shows the meaning of words and phrases with the touch of a finger.
  • The e-ink screen is very similar to a paper.

So Kindle is mainly a device built around a paper-like screen. Here is a comparison between the Kindle and paper version of the same book:

kindle and paper version side by side

kindle and paper version side by side

However it has some downsides that are not easily forgivable:

  • The screen is very very very slow in rendering stuff. Even turn of a page is a UX hiccup. Reading PDFs is practically useless because of the slow pan and zoom. Forget scrolling.
  • Images just look weird. Amazon has worked a lot on the UX for text (which is the main part of many books) but when it comes to images and sometimes text with special frames, don’t expect anything but a scrambled unreadable picture.
  • The screen can’t show colors. Buying a Kindle version of 100 things every designer needs to know about people wasn’t very useful since many of those colorful illustrations loose their meaning on e-ink screen.
  • Occasionally some top sellers have a higher price for ebook compared to the printed version. It’s probably publishers’ desperate try to resist the electronic revolution.

This post however is not about any of those deal-breakers. It’s about that dictionary that comes with Kindle.

So here is how it works: when you’re reading a book, if you want to know the meaning of a word you just long-press it and the dictionary shows up:

Kindle dictionary

Kindle dictionary

As you can see the word “self-indulgence” has a recursive translation of “self-indulgent” in it. By the way if you knew what “self-indulgent” mean you would probably guess the meaning of “self-indulgence” and didn’t need to wait 2 seconds for the dictionary to tell you what it is.

Apart from making the user feel stupid, this dictionary misses an important feature: let’s say the user doesn’t know what “self-indulgent” means in the dictionary definition. Even if she hopelessly long-taps on the word “indulgent” in order to have a better guess, nothing happens. In other words the dictionary doesn’t work for the words it is using to describe another word.

That is annoying considering how many words actually give a recursive definition in the dictionary! But this problem isn’t only specific to recursive definitions. It is about any word in the dictionary.

Solution

A good dictionary is supposed to provide descriptions in simple words so that the user doesn’t have to look them up. But if that is not the case, at least provide a mechanism to be able to search the hard words from the description.

What do you think? What is your experience with Kindle? Would you change something to improve its usability?

Chrome added an annoying translation feature

Problem

Recently Google has added a built-in translation feature to Chrome that has some usability issues. Since these issues haven’t been fixed in the past couple of releases, they might be here to stay. So here is how it works: if you visit a page that is in a different language than your system language (or the main Chrome language), Chrome shows that little popup in the image below and asks if you would like to translate the page. Neat feature if you occasionally use it. However that is not the case when you often visit pages with another language. By the way, there’s a joke that goes like this:

What do you call a person who knows three languages? Answer: Trilingual. What do you call a person who knows two languages? Answer: Bilingual. What do you call a person who knows only one language? Answer: American.

So probably “Americans” designed Chrome but for the rest of the world, this is just a painful UX.

Why U visit pages in other languages?

Why U visit pages in other languages?

Let’s demonstrate with an example. Baidu is one of the most popular search engines in China. When you go to www.baidu.com you just want to start typing in the search box. This is a standard behavior in www.google.com. Many people do it almost mechanically without even looking at the screen. However the translation popup gains the focus and doesn’t let you type. You have to click “Nope” or press “Esc” key on the keyboard so that the page regains the focus and you can type again. Note: as one reader reported, while the popup is open many other keyboard combinations on the browser level don’t work either. For example CTRL+W doesn’t close the tab.

Baidu in English Google Chrome

Baidu in English Google Chrome

Unfortunately this awesome language aid creates a bad user experience on many websites. The only options that are available for preventing this UX issue is to disable translation on the entire site or for that particular language altogether. But that’s not good if for example you are learning that language and still want to have some help when you need it. Besides there is a hidden tax: Chrome analyses every page upon load to guess its language and see if it needs translation. This costs an extra CPU usage and battery life for every single page (not a good thing on mobile devices). If you click “Nope” and visit the page again (or just refresh it), the stupid popup is going to ask you the same question again like you never rejected it a few seconds ago. Yup! Computers are stubborn, specially when programmed carelessly. It’s ironic that in an age where popup blockers are a built-in feature of the web browsers, they return even more annoying. Check out the comments on this post and Hacker News to see that people have actually left Chrome for its rivals just because of these UX issues.

Never translate this site or language

Never translate this site or language

Another examples: Try searching prices on prisjukt.nu (Sweden’t Pricerunner) and you have to pay that popup tax before you can do anything on the page. This annoyance appears in almost every interactive website that is in another language.

Reminder

The UX wasn’t better before. There was a yellow bar at the top of the screen that asked if you want to have the page translated. This made the page jump a little to the bottom (to make space for that yellow bar) right after it was loaded. This visible jump was annoying. For example if you were going to click a button or link before Chrome found out that this page is in a different language, the page would jump right before you click the button. This special sequence of events may not sound very likely but has happens a lot. For example when a user is a regular visitor, his/her brain remembers where to click (for example navigation bar, menu or links) but this sudden jump makes it harder for the motoric part of the interaction and slows it down. This creates the perception that Chrome is slow even though it was just the language detection feature that took place after the page was loaded. The new interaction model with popup solves that problem. However the yellow bar still exists on the Chrome for mobile browsers (Chrome UX designers figured there was something off with it, so they changed its color to white probably to make it less distracting! Didn’t it help?).

Chrome mobile translate

Chrome mobile translate

Solution

Add an option to disable this proactive popup approach.

Let the users choose if they want automatic translation

Let the users choose if they want automatic translation

There is a similar setting under Settings > Languages (hidden under advanced settings):

Chrome Settings > Languages

Chrome Settings > Languages

This checkbox can be selected by default to comply with the current behavior of Google Chrome (occasional users of this feature will not be bothered to leave it selected). But when the user deselects this checkbox, Chrome should give up on guessing the page language every single time. Though the translation icon will be right there if it’s needed (see image below):

The translation button is still there

The translation feature is still there

If the user chooses “Nope” on a page, please remember this answer and don’t ask on every single load. The popup has a little tiny arrow at its top that makes it clear where it is coming from. User will be able to translate the page when needed. If usability tests show otherwise, add a “translate” menu item to the page menu right after “Find…”.

The translate menu in Google Chrome

The translate menu in Google Chrome

PS. one of the readers kindly suggested that such workaround already exists on Chrome. All you have to do is to disable translation altogether (using the aforementioned Settings > Advanced Settings > Languages) and whenever you want to translate a page, just right click and choose the translate menu item as shown below:

Chrome has a page-wide translation menu already

Chrome has a page-wide translation menu already

What is your experience with Google Chrome’s translate feature?

PS. If you’re from Google, take a look at the comments in Hacker News and help us reach the right people to fix this problem.

Google’s Response

This post got a lot of attention (10,000+ views) and fortunately it was noticed by Google engineers. Here is their comment:

I’m Kenji Baheux on the Chrome team and have been overseeing this feature with our UX team.

Please accept my apologies for the trouble. We’ve been listening and are making the following changes:

1. we won’t show the infobubble and rely on the omnibox icon if the focus is on an editable field. https://crbug.com/313100 (fixed in M36)

2. the infobubble will stop stealing the focus: you will be able to type, perform shortcuts, scroll the page and so on.https://crbug.com/378643

3. we are experimenting with the idea of never showing the infobubble again and solely rely on the omnibox icon as soon as we observe more than X negative actions within a given timeframe T (starting with X=2; T=24h) https://crbug.com/379035

4. A few other adjustments around the “translated” infobubble (e.g. will not be shown for automatic translation, will not show up if the “translating” infobubble has been dismissed).https://crbug.com/319628

I’m eager to hear additional feedback and would appreciate if you could play with the feature in Canary as we land the different changes.

Windows 8.1 forces the user to interact in a way that doesn’t work

Problem

Wacom is world famous for digital pens and its professional Intuos series are used by millions of artists all around the world. It looks something like this and connects to the computer through a USB port:

Wacom Intuos 3

Wacom Intuos 3

After connecting a Wacom Intous 3 pen Windows took a couple of minutes to download and install some drivers. But the absolute positioning system which is one of the main features of digital pens didn’t work so I headed to Wacom’s support site and installed the latest drivers for Windows 8. So far so good. Now Windows 8.1 behaves like it’s a tablet PC with Touch interface. This is smart. It even shows this little keyboard on the taskbar that allows me to type with the pen:

Windows 8.1 touch keyboard

Windows 8.1 touch keyboard

However apparently Windows 8.1 fails to detect the touch gestures with this pen (I can live with that). The problem is when Windows tries to teach me touch gestures and the only way to get rid of this “compulsory education” is to do the gesture which is impossible with this device! Windows shows this black popover at the left side of the screen asking the user to swipe from the edge:

Windows 8.1 teaches the user to swipe the edge to switch between applications

Windows 8.1 teaches the user to swipe the edge to switch between applications

It reads like this: “Swipe in from the edge to go back to the last app you were using. Tip: begin with your finger outside of your screen”. So I tried swiping left, right, top, bottom, clicking, double clicking with pen and mouse. But nothing helped. I guess the key message is to use my “finger”. This is not OK. If the user was forgiving for the misdetection of the device, this annoying education makes them regret it. As I’m writing this, the popover is still there and there’s no way to get rid of it. So after finishing this post I’m going to try the old time Windows recipe: restart.

Solution

PS. This section is about interaction design solutions but if you are a user having this issue, the quickest solution is to move your mouse cursor to the top left of the screen.

  1. Don’t force the user into any sort of education. Sometimes they can’t do it. Sometimes they have other important things to do and want to skip it. Sometimes they already know how it works. There are tons of reasons why people don’t want to be forced into learning something so don’t force them if you want them to like your products.
  2. Do more usability testing with popular devices like Wacom. This device is being used professionally all around the world and when things don’t work out smoothly companies loose money. I would expect Windows to download the original driver or give equally well functionality. The new Windows is behaving like how Linux was behaving a few years ago: many devices didn’t have good support in Linux and when they did, often some of their features didn’t work. I haven’t used Linux lately but Mac OS X installed my Wacom automatically upon connecting it and it worked like a charm. Windows should catch up if it wants to reclaim its dominant position in the market.
  3. As one dear reader mentioned, it is possible to disable these “mandatory educations” altogether. However, that may need a little extra search. Here is a good explanation how to turn them off (Note: Group Policy only exists in Windows 8 pro). As of writing this post, that question is viewed 3704 times. This post has been visited 2541 times in less than 3 hours. So I assume this is a quite hot topic. I wonder if Windows designers will fix it. I’ll contact Microsoft and share their insight on this page. Meanwhile you can head to Hacker news and see what other people say about this issue.
  4. Add a close button to the popover to let the users close this modal, persistent, sticky popover:
Windows 8.1 educational popover with close button

Windows 8.1 educational popover with close button

Windows 8.1 doesn’t run apps in the corresponding screen

Problem

Windows 8.1 just like its predecessors has a good support for multiple screen. With the return of the start menu, you can “pin” apps to your taskbar. This makes an icon that allows you to quickly run an app. Even though the taskbar is exactly duplicated in every screen, clicking an app icon in one screen doesn’t guarantee that it’ll open in the same screen.

This behavior can be quite annoying specially if you’re using a projector. Here is a little image to illustrate the issue:

Image

Trying to run an app in the left screen may show the app in another screen

Mac OS X has the same issue. So when you run an app you really can’t predict where it will show up. It probably shows up where it ran last time, but that introduces an element of surprise since the user expects to see the action (click) and the effect (app) appear close to each other.

Solution

There are a few solutions to this issue.

  1. The easiest one is to run the app in the screen where the user has clicked the app button.
  2. When user clicks the button using an animation guide their eye to the screen that contains the app. Mac OS X uses this technique, though still the first solution makes it more predictable.
  3. If the designers can’t agree or confirm the design decision with usability tests, have some sort of setting in control panel that allows the user to choose weather the new apps load where they last showed up or close to where the run action is initiated.
  4. Allow the user to run the app in the current screen with some sort of right-click menu on taskbar. Something like this:

Image

Adobe is really persistent about updating

Problem

Adobe Acrobar reader has this update dialog that shows up every now and then. The dialog has a Yes and No button but that’s just an illusion. The No button is practically not clickable and not focusable! But if you keep clicking on it eventually the dialog disappears. This has happened several times and every time I have to press the No button harder! So I decided to take a snapshot, blog about it and contact Adobe regarding this issue.

Adobe Acrobat update dialog

Adobe Acrobat update dialog

I personally don’t like it when a part of the system is aggressively asking for update. Particularly when it is Adobe. We haven’t forgotten Flashback, one of the biggest Mac security issues. I know the virus wasn’t made by Adobe, but when an application trains the user’s mind that it needs to be updated often, that very user experience will be an easy target for hackers.

Even though this dialog has a No button, Adobe is actually forcing you to press Yes. It’s not nice. It’s not intuitive. It’s not respectable. It’s annoying.

Solution

There are three solutions to this issue:

  1. First of all, improve the quality of your software to reduce the number of updates. There are many applications on a system. If each of them wants to update every now and then user experience will reduce. Remember: no one buys a computer for the purpose of updating it. People buy a computer to have some tasks done (work or game or whatever). Don’t get in their way, even for seconds.
  2. Do the updates automatically behind the scene. I really like the way Google Chrome updates itself. It’s very subtle. It’s polite. The menu icon will glow to indicate an update. The update will automatically install on your next browser lunch. It remembers the tabs and goes exactly to the state it was before the upgrade. That’s good user experience.
  3. The least you can do is to make the No button clickable. The very fact that there is a button that only works when someone is punching it angrily shows Adobe user experience designers either don’t feel responsible, or don’t care for the user’s peace of mind.

Note

Adobe’s Flash update window shows unnecessarily too often. Maybe I’m an exception, but I haven’t bought my computer for spending time updating system software. I happen to own a copy of Cretive Cloud as well. Adobe updates happen so often that sometimes I think updates are being pushed for the sole purpose of advertisement.

Adobe Flash Update Screen

Adobe Flash Update Screen

iPhone doesn’t allow you to change the default hotspot name easily

Problem

We had a power outage at work and even though my work laptop has a battery but the wifi network needs electricity to work. After a few minutes of internet suffocation, I decided to share the internet on my iPhone and keep working. But it was then that I discovered iPhone wasn’t really built with the ambition of being in everybody’s hand. My company has an interesting policy of giving every employee an iPhone and apparently I wasn’t the only one who was sharing his phone’s internet. So I saw something like this when trying to connect my Mac to my iPhone:

Image

Everybody sharing their iPhone hotspot

Good for Apple, I felt like this:

Image

iPhone hotspots everywhere

So naturally I went to the most logical place to change the hotspot name to something customised in order to find it. But there’s no such settings:

Image

iPhone personal hotspot settings

There’s no such setting so the first thing I do after being connected to the Internet is search for how can it be done. Turns out you have to change your phone’s name in order to change the hotspot’s name. It may sound logical but is pretty limiting. See how HTC One allows you to choose your hotspot name (needless to say this opens up in hotspot settings where it belongs):

Image

HTC One hotspot settings

But for iPhone, you’re supposed to leave the hotspot settings, go to General > About and chance your phone’s name:

Image

iPhone 7 change name

A little unexpected but as a user put it “let down by apple yet again! i jailbroke my iphone 4 n installed an app called myWi it allows you to change ssid” (source).

The irony is that Apple is famous for paying attention to user experience but in practice there are many simple cases like this that are problematic.

Solution

Allow the users to edit their hotspot SSID name in the settings of Personal Hotspot.