An Introduction to Heuristics

What are heuristics and how do you best use them in a manner contextual to your product offering? Let’s look at what heuristics means…

So heuristics, the plural, means processes. A relatively vague concept, and when applied to user experience design there are multiple interpretations.

In the context of UX, we define heuristics as a set of rules, goals, or qualities that we want to design with in mind or that we want the experience to try to conform to or strive for. These rules, goals, and qualities guide the process, as they are constantly considered at every phase of the design development.

These are the qualities, these are the traits, these are the things I wanted to do or maybe it’s a set of rules that I check against.

The “4 Cs” to us are a limited set of heuristics that we use. This limited set of heuristics is something we apply to almost every project, and of course, we create contextual heuristics too with a specific project.

In this case, consistency means using the same elements for the same purpose in the same way. In other words, if you have a web page that has bullet points of a particular style and you’re using it to talk about a particular type of text, don’t switch the bullet point style on the next page. If they are orange and round, don’t switch them to the finger pointing to the right or some other style of bullet point, unless you actually are trying to say, “This is different, these bullet points are unique, they’re not standard.” You really want to have an experience that is consistent.

Again, consistency is defined as using the same element for the same purpose in the same way. On the contrary, rules are meant to broken — for a specific purpose. For example, a primary CTA might have a different or contrasting button style than the standard buttons used throughout the product. We intentionally break the “rule” to accomplish a specific goal, highlighting an important or desired action.

Coherency speaks to brand. When we talk about the definition of coherency, we’re talking about being united in forming a whole. When all the parts are united in forming a whole, it’s considered coherent. It speaks to the tone and the feel being united, and that it’s on brand. For example, you might use a font like Old English that might work for Juicy Couture as a fashion brand, but it probably wouldn’t work for Ralph Lauren.

It’s important to ensure the whole experience is coherent. It builds trust with customers, brings a level of professionalism, and makes products easier to understand and accomplish tasks. The human brain is very good at noticing when something is different, and it creates cognitive noise. Changing of fonts, sizes, colors, styles of elements, opens questions to the user like “Am I on the right site, is this a real site?” Or it might just create confusion, delaying the completing of a task, or causing the user to drop off completely from your site, or stop using your app. Medium is a great example of maintaining consistent typography. Every article looks great, no matter the quality of the article. It’s a pleasure to read, and its consistent across all articles on the platform.

If you have a particular style of writing, a particular tone that you were using, you want to make sure it’s coherent. If you’ve had two people author different parts of the content of your site, you want to ensure that the voice is the same, that it speaks in the same manner with the same tone. That’s really about the brand. Right? You want to make sure that things are being coherent and loyal to the brand, and speaking to the tone of the brand.

The next heuristic is context. Often when we talk about context it’s in the context of the user: about in the place where they are (physical location), at what time, and possibly, the mental state or other conditions that a user is in when engaging your product or service. What we’re talking about is providing context to the user. It’s about letting them know where they are, what’s expected of them, what affordances they have, how long they should expect to be there, and how do they exit.

A great example of this would be a checkout system on a commerce website. Checkout systems have been around for a while now, and we find we have a good set of best practices. We let people know this is the checkout process, that they’re on step one of four, what information they’re expected to enter here, etc. And how they can get out (exit), which is often a little bit hidden on a checkout system. But checkout systems provide all of that information when done well.

A good product provides helpful hints or contextual help to its users. An example of that would be a text field with “hint text” information in it. You’re reinforcing the idea, and giving a clue at what is expected to be entered. It removes confusion on the part of the user. We must remember that people scan things on the web. They look at things very quickly. So, you might want to give an example. A website might have a text field for first and last name which is a little uncommon (most people separate first name and last name). In this case, a helpful clue might be to give an example of “John Williams” in light gray font in the field. It’s about providing information to the user.

Directional arrows let people know that you can paginate left and right. An arrow at the bottom can indicate that there’s more information below the fold, perhaps it blinks or flickers or loads on a delay to indicate “Hey, I’m over here! I’m providing a clue, something that might not be obvious to you — this page can paginate.”

Other heuristics might be relating to or around the strategic use of color, contrast, sound, iconography, and other elements (all to the left). You might have specific rules of your own when designing.

You might have found other heuristics from other practitioners, but the most important thing to remember about heuristics is that they are context dependent.

Some things you might want to be very consistent, like the strategic use of typography. We consider “Am I using the right font in the right way?” Sometimes we’ll go into companies and work with clients where it looks like everything is consistent in terms of typography, but for example they’re using Verdana, Futura and San Francisco. There are all kinds of san serifs but they’re all slightly different and cause visual friction.

Your set of rules must also be contextual for the user. If you’re designing something for kids, for example, a learning tool, you might want to add “playful” to your base set of heuristics. With that in mind, the product should have a lot of in-app help, like a guided tour or a help icon that’s persistent for quick-access help.

You might want to use color a lot because children learn to classify things by color at a very young age. You might want to invoke fun and laughter through graphics, sound, and transitions.

On the other hand, you might be working on something that’s for a very specific military or medical purpose. In that case, you might look for things like minimal one-on-one training. You might be adding “highly efficient” to your base set of heuristics, designing graphics that are highly functional and identifiable in stressful situations to reduce cognitive load.

Graphics that are most functional when looking at something under the desert sun might not be the most aesthetically pleasing graphics. They might not look that great. When you have a consumer that’s making a decision for a phone app with a lot of competition, flashy graphics might be incredibly important. But, when you have a user that’s being assigned a particular piece of gear like in the military that’s a little different.

At the end of the day, keep in mind that heuristics are a set of rules, goals, and qualities that you want to design with in mind, or that you want your experience to try to conform to or strive for. Start with a baseline set of heuristics, but be sure to add your own that are contextual to your user and your project.

Related posts:

If you are wondering about how to fix shrinking gum. While your gums will not grow back on their own, there exists a new treatment to reverse the damage.Secret Tip to “Natural Fix For Shrinking Gums”!

Serverless has become an amazing tool for various use cases. Data processors, chatbots, APIs, you name it is now developed using serverless architectures. Today, I’ll walk you through creating a…

There are a lot of people who still don’t understand the blogging ecosystem but go ahead and take a shot at educating others on facts they’ve “seen around” the web. When it comes to Medium Writing…