29 March 2016

Don’t make me think !

UX is all about emotions.

A great app comes with many great aspects, some of them being the code, or the idea of the app itself. What your user sees (the User Interface or UI) requires particular attention from the designer and will often be what the user likes or dislikes first. But what is paramount, to me, is what the user feels through your design, how he experiences the app, all the elements gravitating and evolving around it. That is the user experience, commonly known as UX.

It goes from gathering information about what your users like, what they use most, how they feel about it, what is your target audience, when, where, how  they use the app. It is how they look at your UI, how data is preloaded or not, and much more. UX is a titan, so let’s define a scope.

Today, I’m gonna talk about friction specifically.

ux-path

 

UX is, among other things, how well your app behaves considering what your users want to do. It’s anticipating what they want, and building everything to be ready and efficient about it. It’s taking the most efficient path, making your users feel at home, or on a comfortable luxurious ride. Friction on the other hand, is making your users work.

A good UX is displaying your main feature somewhere visible, accessible, and easy to use. For example, the Terms and Conditions should rarely be available on your home screen. It’s the kind of feature you tend to hide away in the Settings section (let’s face it, no one reads that document anyway). Learning where to place features is probably the first step in the UX user manual, if there ever was one. Users needs to be guided, because they do not want to think. They need to know what you want them to do, why you want them to do it, and it has to be simple.

When it comes to the main feature of your app, the process (not the concept) has to be obvious, and straight up visible on the home screen. A good example is any mail app. The main feature is to read emails, which are shown right on the home screen, the email list. There is no “Dashboard” menu where you can select “Inbox”, because that’s what you want, and since it is what you want, it’s made so you’re already there (efficiency, remember?). If you want something a bit special, like your outbox, you’ll find your way in the hamburger menu. Another big feature is the ability to send emails, which is also visible on the home screen (either the navigation bar on iOS, or the floating button on Android). Again, dead simple to find and understand.

If you know what the user wants, do it straight away. If it’s his choice, make it clear and big. And most importantly, do not let your user get lost. Nobody likes to be lost.ux-crossroads

A good UX also combines simple things that make your life easier.

For example, the way you display your features and how you want your users to interact with them is highly important. Choosing between a dropdown menu and a segmented menu is critical ; one is smaller but hides all the possible choices, the other one displays every possible option but takes more space on the screen. Usually, if you have 4 items or less, you should opt for a segmented control ; statistics show that user interaction is much higher when you let them know what’s possible straight away. The following screenshot from Luke W. is a good example of how the app changed it’s design, and made user interaction drastically decrease when they switched to the drop down menu. Naturally, they switched back to the segmented control. This is also an opportunity to remind ourselves how important analytics are.tab-vs-dropdown

Now imagine an email textfield. Use the appropriate keyboard of the phone so you don’t have to switch over and over again to type an @ and a dot. Also try to display a list of known emails from your contacts, according to the first letters you typed. That way, you could type the first 3 letters of an email and you’d be good to go ! That’s a step in the right direction.

Entering a typo in an email is also a classic. Many times I will see an alert pop up saying “Invalid email !”,  this is bad UX. The typical alert is very invasive : it blocks the rest of the UI and forces to user to interact. Most of the time, the only interaction the user can have is by typing “Ok”. See how pointless that is ? Asking users to answer a popup that only displays one possible answer means you should not use a popup.

Instead, show them their mistake, they’re smart enough. Good UX behaviour would be outlining the textfield area in red, or maybe add a shaking animation or a discrete label in red font explaining the situation. This way, the user is actually still able to write, and is still fully aware of the situation.

A good rule is to not pop an alert unless you need user interaction and the story actually changes according to the answer. Here is a nice UX  example, where entering wrong data in a password is clear, but users are still able to interact in any way they want. It is very easy and enjoyable to use, yet surprisingly simple.

What happens when you hit “Login” without a password !

 

Friction itself can (and should) be discussed for a long time, there is always room for improvement. You can always reduce the number of textfields, guess phone numbers, pre-fill data, skip screens and processes, remove popups, reduce load on screens, and so on. Spend as much time as possible on UX, it will drastically improve how your app feels.

This is a continuous process for you and your testers : talk and think about the app, redraw, rethink, redo. And even when you think you’ve finally reached something decent, you’ll change it in no time. What works now might not be efficient for the state of your app in 6 months, or a year from now. Your app is an evolving creature, and that includes its code, UI and UX.

UX is  being critical of your own choices.

Gil Sand
Published by Gil Sand

“Programming is the art of writing essays in crystal clear prose and making them executable.” ― Brinch Hansen