cft

10 Rules for Better UX Design

Understanding these rules will allow you to plan better and create better designs. Let’s begin.


user

Jon Haines

3 years ago | 5 min read

There’s a quote attributed to Albert Einstein that goes something like this:

If I had an hour to solve a problem I’d spend 55 minutes thinking about the problem and 5 minutes thinking about solutions.

Whether or not Einstein stuck to this exact ratio in real life is tough to say, but it gives a good insight into understanding how to effectively approach a problem. Planning is the majority of the battle.

Execution because easier once a good plan of attack is devised (Interestingly, there are indications of Abraham Lincoln saying something similar regarding the time it takes sharpening of his axe, but no real proof of his quote exists).

Human beings have done many studies on how humans perceive and/or interact with technology.

In a series of articles, I will look at these laws and effects and how they apply to User Experience. Understanding these rules will allow you to plan better and create better designs. Let’s begin.

1.) Jakob’s Law

To the left, I grabbed six landing page images from a site I love — lapa.ninja. I haven’t seen any of these sites beforehand, but I can tell you that each of these have somewhat similar styles and familiarity.

Jakob’s Law tells us that users prefer when sites or applications work in a similar way to ones we have already used. Tinder is a good example of this, as it was the pioneer of the swipe-left/swipe-right function.

Now, not only do we see other dating apps (Bumble, for example) have that same functionality, but non-dating apps have added the ease of swiping to their own arsenal, such as apartment-hunting and job-hunting applications.

Click here for the video.

2.) Fitt’s Law

Take a look at the two forms on the left side. Both contain the same information, but the form on the right has a much smaller submit button, which is also farther away.

Fitt’s Law predicts that the time required to rapidly move to a target area is a function of the ratio between the distance to the target and the width of the target.

This indicates the larger green button of the left form will more likely do a better job at users responding to the form.

Be cautious not to make target areas too big though.

Click here for the video.

3.) Hick’s law

Remember back when you had a tiny family TV in the living room and you and your older sibling would fight over which of the 10 channels you would watch on Tuesday night?

And now, how you have access to thousands of channels, a handful of streaming services, YouTube, and more, but still can’t find what to watch with you significant other? Welcome to Hick’s Law.

Hick’s Law states that the time it takes to make a decision increases with more choices. Take a look at the Head & Shoulders image. How long would it take to find the correct shampoo for your scalp.

When building a site or application, make sure that there are a minimum amount of Call to Actions to aid your user.

Click here for the video.

4.) Miller’s Law

Take a look at the 21 animals in the image to the left. If you were given 30 seconds to memorize all of them, would you be able to? What if some were animals, but some were objects? Or places? Those who are better are memorizing details would shift to a chunking method — perhaps by grouping all the mammals into one group or something similar.

Miller’s Law states that the average person is able to retain seven items in their memory, plus or minus two. Your users never want to work too hard.

Always present information in chunks, such as phone numbers separated by hyphens. Similarly, when presenting users with a longer task, provide a progress bar to let them know how long the current task will take.

Click here for the video.

5.) Weber-Fechner Law

In 2006, Facebook was a new platform mainly for college students that was growing in popularity. That year, it added the controversial feature called the Newsfeed, which led to a plethora of angry users.

Eventually, users got used to the feed — some probably couldn’t imagine the site without it.

Rolling out the Newsfeed was never going to be easy for Facebook. It was such a drastically new feature that felt invasive to users that were already used to the platform.

The Weber–Fechner law states that the slightest change in things won’t result in a noticeable difference. However, any sort of huge redesign will most likely result in many users not liking it.

Click here for the video.

6.) Parkinson’s Law

Remember that time in college when your philosophy professor gave you two whole weeks to write about the Allegory of the Cave? Remember how you spent 13 days playing Rock Band in a friend’s dorm until you finally realized it was time to write an essay about Plato?

This is Parkinson’s Law — any task will inflate until all of the available time is spent. If you want users to take action, you need to give them a solid deadline.

Have a 40% off deal? Users are more likely to take action if they know it ends soon. Udemy is notorious for these kinds of deals.

7.) False-Consensus Effect

The U.S. political divide has widened over time. Trump supporters from the middle of the country have a hard time understanding liberals and city-dwellers can’t get red states. Each complains the other lives in a bubble.

The False-Consensus Effect is a phenomenon that we assume others share our own beliefs and will behave accordingly. We lack the empathy to understand the world of another person and it leads us to a miscommunication.

When designing, this is especially important, with empathy being such an overused phrase in UX in general. Design for the user’s pleasure, not your own.

Click here for the video.

8.) The Aesthetic-Usability Effect

Have you noticed that most smart phones today followed Apple’s touchscreen design? Apple’s introduction of the iPhone in the early 2000’s led to a wave of clean design. It led to websites having more whitespace and looking a bit more sleek and modern.

This is the Aesthetic-Usability Effect. We, as humans believe that attractive things work better. This effect has allowed the UX industry to grow substantially in the past few decades. A good-looking website or application has less to proof than a site or app that is crude-looking.

Click here for the video.

9.) Zeigarnik effect

One thing I love about Duolingo is its ability to keep users coming back for more. Look at the progress bars in the image. As a user learning a new language, I would be inclined to get those progress bars to completion.

The Zeigarnik effect states that we remember incomplete or interrupted tasks at a better rate than completed ones.

A famous practitioner of this is writer Ernest Hemingway, who famously said, “When you are going good, stop writing,” giving him all the motivation to continue at a later time.

Click here for the video.

10.) Picture Superiority Effect

There is a common belief that food items on menus that contain an image perform better than those without an image and text alone. This is what’s known as the Picture Superiority Effect, being that images are more likely to be remembered than words.

In addition to this, users are more likely to lean towards choices that contain images as opposed to ones with text alone. No wonder Instagram has boosted the restaurant industry.

Click here for the video.

Upvote


user
Created by

Jon Haines


people
Post

Upvote

Downvote

Comment

Bookmark

Share


Related Articles