Design World

Don’t let these common UI mistakes kill your design!

August 09 ,2019

UI could make or break your site, it’s obvious. That’s why we all have to be careful when working on UI design so that the conversion rate could be optimized. To help you create a flawless website, people at Designveloper have done some research on common UI mistakes

1. Unorganized navigation

Navigation is one of the most important aspects when it comes to keeping your users stay on the site. You see, no matter how aesthetic your digital product is, if the navigation is not intuitive and arranged well, no one would ever use or explore your products/services. Imagine this, navigate a stupid menu is just like when we get lost in a maze that the fastest and most simple way of escape is to close the tab.

save-whales.com

So, why is navigation so crucial to a digital product? Well, it is the tool that helps us easily and quickly look for the content. At the same time, navigation assists users in reading through the web properly. As a result, poor-designed web navigation will throw away all sense of organization and structure.

Now, let’s move on to figure out some common UI mistakes designers make from time to time when working on navigation.

First thing first, designers do not use any visual cues on a navigation bar. When this happens, users are confused since they are not able to position themselves on the web/app.

Besides, they have to click or tap more than three times to access an important page. Not only does this experience cost time but it also irritates us.

Last but not least, your navigation does not meet user expectations, or in other words, the navigation doesn’t look right with users.

Above are the 3 main UI bugs that hide in plain sight and could happen to any web app or mobile app. But don’t worry, people at Designveloper have conducted several tips to avoid these critical yet common UI mistakes.

In the beginning, you should plan your navigation carefully, this is when you should logically design buttons for each feature and function of the product. This stage is also dubbed “sitemap creating phase”. And our tip to enhance your design is using a spreadsheet to organize the sitemap like this.

miro.com

Thank you, next! It’s essential to make your navigation understandable and simple as much as possible. This way, users will find what they need easier and faster. To execute this one properly, first, let’s use user-friendly vocabulary.

Secondly, UI designers should design the navigation in a consistent way across every page of the site. Consistent design is also a best practice to help your users get familiar with the menu and navigation. Furthermore, thanks to the consistent design, UI designers could fulfill user expectations.

The very last recommendation is that we must always find a way to remind where your user is. Highlighting the selected button or make the area around the label look different are two common approaches to perform this.

2. Neglecting the importance of typeface is one of the most common UI mistakes

While navigation is the tool that helps users find content easier, typefaces play a crucial role in creating a good environment to welcome the content and get to know your services and products. 

However, even the most experienced web designers make common UI mistakes related to typography sometimes because this is one of the most difficult design aspects to execute. That’s why people at Designveloper will help you solve all the typeface issues in this second part, but first, let’s figure out why typeface is important.

www2.pnwx.com

We cannot deny that images are the most impressive element of design, but if considering the message delivering ability, text is the better way of communication with users. Besides, a typeface is also the UI of language. Thanks to this element, we are able to let people know our tone and mood. Furthermore, at the moment you choose the right typeface, your product will be enhanced in terms of readability, accessibility, usability and of course, the overall graphic balance.

But on top of that, UI designers should aware that typeface is only a tool to support users’ decision making and honor your content, in other words, it has to draw attention from readers to the content, not the typeface itself. After all, we don’t want people to praise the font choice over the content, right? 

From the above knowledge, we have conducted several common UI mistakes related to typefaces that every UI designer should avoid.

a. Your font cannot be used in various screen sizes

We are living in a world of responsive time where everything must be flexible. This applies to our choice of typeface too. It’s important to pick up a font that is easy to read and scan through on different types of screens and devices. Because, firstly, designers could limit their time and effort spent on choosing various typefaces but focus on only a suitable one. Secondly, this practice also helps your design have a consistent and familiar look across platforms and devices. 

Below are some recommended typefaces designers could experiment on your web design:

common ui mistakes
Playfair.
Open Sans.
Varela
IBM Plex

b. You choose the typeface that is hard to distinguish between letterform

For some reason, font makers created typefaces that confuse readers with what they are reading. For example, we cannot tell the difference between the capital I with the lowercase l here. You see, the first rule every UI designer should learn by heart is not to make people think!

c. You treat typeface as content

Do you know many others believe the opposite that text should be a UI element too? The easiest explanation for this is when we use text as a functional element, it, apparently, is UI.

For the sake of this practice, let’s use all the knowledge you’ve got applying to design the text such as white space, consistent, focal point, etc. Let’s see an example from spotify.me.

Spotify.me’s “You are what you stream”

d. You don’t understand the use of your typeface

Here is another well-known issue of UI design too. The reason for this misunderstanding may be varied, however, it always happens when designers did not do enough research on the typeface and the function of the designated text. 

Let’s take Medium as an example here. They use serif fonts for long content so that users can focus on reading since this type of font is more readable and scannable. Besides, Medium’s designers decided to put san serif fonts to help users get things done. It means they could get from point A to point B easier. This decision is based on the fact that san serif fonts work better for short and small type size text.

3. Poor image and graphic choice

At the moment you get all the texts right, it’s time to pay attention to images. It’s always easier said than done, right? As a matter of fact, designers might fall in the trap of bad image choice from time to time. This happens since we designers have a huge amount of options when it comes to images. That’s why the next stop is 3 common UI mistakes you may make when picking up a photo for your design.

a. Poor quality

This is no doubt a factor to decide if your website is professional enough. And don’t be surprised when customers often link the quality of your site to the quality of the services and products. Even though poor quality images are easy to be spotted but a second check is necessary to avoid this basic problem.

bellads.info

b. Stock images are everywhere

The hard truth is stock photos always look fake and the mood that these kinds of imagery create is disbelief. Furthermore, stock images make no impression on the audience but the generic feel. As a result, many stock photos become memes because of its disingenuous look. 

It’s a stock? It’s a third wheel story? It’s a meme!

Gaining trust from your user is our mission here. And making the web looks authentic by using custom images plays an important role here. To practice this properly, don’t be afraid to snap photos all by yourself if the budget is limited, at least, your photos will speak what you mean, not some generic information. In case money is not the problem, hiring a professional photographer is always a good choice. 

c. There are too many images on the site

The old saying that “less is more” can explain everything. Too many images on a site will grab user’s attention more than what you intended. This leads to two issues: 1. Other UI elements have to scream for attention, most of the time they will lose against images, 2. Users don’t know where to look since the web has no focal point. 

That’s why limiting the number of images is the necessary practice to simplify and purify your website.


We hope this article has thoroughly covered everything related to navigation, typeface and images and some common UI mistakes for you.

If you are searching for a professional web design team, look no further than Designveloper. We offer a wide range of services from web design to web development. So tell us your ideas and let’s make it a real thing!

Related articles:

Also published on

Share post on