How to Use Mental Models for a Stunning Web Design

How to Use Mental Models for a Stunning Web Design Using mental models in web design to improve user experience, engagement and goal performance, if you’re not familiar with mental models — take a look.

These days, almost every business runs its own website – with varying degrees of success. Fortunately, you don’t need magic tricks to make your page rank high and attract users. It all comes down to a couple of factors that can be easily explained.

Even though they are unfamiliar to many, mental models are among the most important aspects of human-computer interaction. This concept is by no means new, yet it certainly is the future of web design. Their main purpose is to improve the functionality of your website and user experience. In this article, we’ll explain everything you need to know about mental models and why they’re crucial in modern web design. Let’s go!

What Are Mental Models?

First, let’s quickly dive into the history and definition of mental models. The term was coined by a Scottish psychologist and philosopher, Kenneth Craik, in 1943. Craik used it to describe the ways of how the world works, as perceived by other people. Mental models, which refer to patterns that can be observed and studied in the real world, are also relatable in the digital form.

You may be wondering, how is that? Mental models are based on beliefs instead of facts. They consist of the users’ opinions on how a particular system, like your website, works. As such, they’ll plan their future interactions with it based on predictions about it. These predictions then contribute to their mental model of said system. 

While individual users are bound to have different mental models, they are sure to share some common characteristics. If you want to use mental models to improve your web design, you will focus on these similarities. It’s a complex process, and if you’ve never used them before, you may feel a bit lost and not know where to start. However, there are companies, such as Edge Marketing, that focus on recalibrating your business’s digital image to provide you with the best user response.

What’s the Difference Between UI and UX?

These two abbreviations appear whenever the issue of mental models is brought up. You may be wondering what UI and UX are and how they are different.

UI, or user interface, is the point of interaction between a human and a computer. It refers to communication within a device, including display screens, desktop design, keyboards, and a mouse. It also consists of the ways through which users interact with a website or an app. UI deals with tangible concepts, such as the elements of visual design, including colors and typography.

UX, or user experience, evolved from the improvements to UI. Once there was something to interact with, people could have all sorts of different reactions to a website and its offer. As such, user experience covers all aspects of users’ interactions with the brand, its products, and services. Peter Morville, a specialist in information architecture, defined an effective UX design as something that’s useful, usable, credible, valuable, desirable, accessible, and findable. 

While UI deals with the observable aspects of website design, UX focuses on conceptual factors. Mental models combine these two aspects, directly influencing the appearance and reception of your website.

Mental Models in Web Design

According to Jakob’s Law of the Internet User Experience, “Users spend most of their time on other sites” – that is, other than yours. As such, other sites are going to influence their mental models to a considerable extent. Internet users will have specific standards and expectations regarding web design. That’s why many sites or apps look very similar to each other and share the same features.

Here’s how mental models work in web design. Throughout the years of internet use, people have learned how things work online. They browse the web and perform various operations, more and more often without even thinking. For example, they can go to any page related to online shopping and know that a search box will be on the homepage, while the shopping cart link is going to be placed in the upper right corner. A logo will be in the top left corner, and the links they visit are likely to change color. A page that doesn’t conform to these standards will be confusing, and many users will find it difficult to navigate. 

If you notice that your website doesn’t work the way it’s supposed to, it probably means your clients have different mental models. They think your page should operate differently, and if you don’t implement changes fast enough, they’ll be frustrated, which can prompt them to leave negative reviews or even stop using your site. That’s why implementing the right design that’s going to fit your website’s purpose and agree with your clients’ mental models is so important.

Mental Model Mismatch

Understanding the concept of mental models is your best bet to improve the usability of your website. However, sometimes you may think you have a great idea, but after implementing it, your users, unfortunately, disagree with you. Even though the project was ambitious and carried out to the letter, people still found it impractical and difficult to follow. 

That kind of situation is a mental model mismatch. It happens when your design experience exceeds that of your users. As such, people who use your website consider it too complicated and overwhelming. Despite your best efforts, they don’t understand how the onscreen elements work and what they do. This means that the UX gets worse as the cost of interaction increases. 

Whenever users fail to understand the new interface, they tend to get frustrated and may even quit using it whatsoever. Don’t get discouraged, though! Even the best design agencies sometimes make these kinds of errors. Now you may be wondering how to avoid mental model mismatch? We’ll explain it right now!

Mental Model Matching Techniques

Even after a few missteps, you can get back on track and improve your website’s design. Here’s what you should consider doing to make it more user-friendly:

Think About Your Users

The first step you have to take if you want to have a successful website is to determine your client base. Depending on your website’s content, you’re going to attract users of different nationalities, ages, and even genders. All these factors impact your page’s usability, as not all users are going to exhibit the same mental models. That’s why you should consider analyzing your client base.

You can perform your user research and gather data, as well as all the essential statistics. With these data, you can create user personas that represent an ideal client base of your website. Based on this information, you can then design your website to fit the mental models of your user base. Feel free to test some solutions and adjust your ideas as you go. Keep an eye on user satisfaction and feedback; if you cater to your clients’ needs, they’ll keep coming back to you.

Follow Certain Trends

People might not even be aware of how much planning goes into website design. Still, they prefer some websites over other, similar pages, thus generating traffic and profits. These more successful pages may be better known, reliable, or may offer things other pages don’t. However, there’s a simple explanation: they’re also more user-friendly. 

Many trends in design occur as a way to improve usability and user experience. Some of them also cater to a specific age group or a particular type of industry. However, it all boils down to making the UI as user-friendly as possible to increase the UX. All these trends became popular because what they have to offer really meets user expectations. Consider doing thorough research on them. If you think your client base is going to find the new design more user-friendly, feel free to make some adjustments.

Learn From the Big Sites

While observing trends and applying them to your website is generally a good idea, copying everything you see is just the opposite. Sometimes the already available patterns are too widespread and generic to be an excellent match to your website. Adding to that, some mental models work well for certain types of websites. However, when you apply them to your website, having an entirely different business model and client base, it might be a huge miss. Also, you may simply dislike the way they look and refuse to apply them despite their popularity. That’s why you should consider checking big, authoritative websites from your field and see how they do it.

Steve Jobs once said, “Good artists copy; great artists steal.” While following his quote to the word is not advisable, you should think about the underlying meaning of these words. If you look at the websites of extremely successful brands, like Apple, YouTube, or Netflix, or at websites considered authoritative in your field, you’ll know that their success doesn’t come from anywhere. 

When it comes to those who made it big in the industry, you can be sure that behind the success of their websites, there’s an adequate mental model – or a well-blended mix that speaks volumes to their users. Figure out what makes a website so popular and usable, and try to implement it to your advantage. Nevertheless, keep in mind that well-known brands operate in a different context. Some of their UI elements may be worth copying while implementing others is not going to work on your page. As such, you can get inspiration from the big players and focus on the usability and purpose of your website.

The Bottom Line

Mental models are the future of successful web design. Understanding your users’ needs and expectations is key to making your website both useful and popular. Remember that your clients already have experience from using other websites; thus, they’ll want you to implement similar patterns and provide them with certain features. Make your page unique but usable; observe trends and the big names in the industry, and do your best to cater to your user base. If you put your clients first, you’re bound to have a successful online presence, regardless of your chosen field.

by Chris London of Pixel Productions Inc. The Everything Design Company