5 Common Mistakes In UI Design
Today I want to share the 5 most common mistakes in UI Design and that any marketeer, manager or project leader should identify to safeguard the digital platform’s quality.
The UI Designer (User Interface Designer) is accountable for the presentation of the information architecture. They choose how the information is displayed through colors, elements and patterns, using their creativity and common sense. Their aim is to always foster an attractive yet simplified interface, so that the design does not overlap the content.
Many times, the UI Designer, due to their ignorance or extreme creativity, neglects some rules of thumb of User Interfaces and commit mistakes.
So, after all, what are the mistakes that one should pay attention to?
1 - Incorrect use of Colors
Colors can make a project much more good-looking and intuitive, if properly used, enticing sensations and associations in the end user. It is important that the UI Designer, before they start a project, chooses the suitable color palette, thinking of what they want to convey.
Many times, the palette will depend on the design created for the site’s brand and, in those cases, there is a limitation and, for consistency reasons, it is important to follow the palette that the brand already relies on for its visual identity. This can be positive or negative, positive because it means that someone has already thought about that palette, but negative because the UI Designer may not agree with the color choice.
In other cases, such limitation fostered by the visual identity pallet may not exist, which makes the UI Designer free to choose the project’s colors, or at least the secondary colors, always keeping some connection with the brand’s visual identity.
A good color to be used is the blue, it is a neutral color unlike red, yellow and green, which are clearly associated with error, attention and success messages. It’s also a great color for being one of the few that people with color blindness can see. Obviously, when following this logic, all interfaces would be blue, which would not be positive at all, but this is some food for thought and a justification for why so many popular sites use blue as their main color (Facebook, Twitter, Linkedin, among others).
It is also important to use shades proportionately. According to Goethe’s theory:
“He explains that if a color is brighter by nature, like yellow for instance, it should be combined with a naturally darker tone, in which the ratio between the two colors must be such that the brighter color occupies a smaller area than its counterpart.” (BARROS, 2009).
As one can perceive, it is very important that the UI Designer chooses the right palette for the interface and understands a tidbit of the psychology of colors.
2 - Absense of Style Guide
A Style Guide, generally speaking, works as a visual guide to ensure the visual coherence of a project, hence avoiding inconsistencies in the project’s graphic design, for instance radio buttons of different colors and sizes, which should be uniform, or too many types of fonts, among other situations.
As a rule of thumb, a UI Designer starts a project and, after readying the first page, creates the Style Guide. Therefore, when they craft the following pages, they will already have many graphical elements prepared in the Style Guide, simplifying the creation of the remaining pages and ensuring that the coherence between them is kept, and, as new elements are created in the new pages, they will be added to the Style Guide.
The Style Guide is like a list of elements of the project, to which all the graphical elements that will exist in the project are added, ready to be used when needed. For developers, having a Style Guide is also great, to organise themselves in the website’s development and, again, to keep the interface’s consistency.
3 - Design Without Content
Often, there is a tendency to start interfaces without content, this has happened to all designers already, and will continue to.
All designers love Lorem Ipsum, because with it they can create an aesthetically pleasing design, adapting the unreal “content” as they want, but that is an illusion, because this content will be later replaced by the final content, and will not look that good, certainly.
It is important to a UI Designer to understand that content is the most important part of the website, and using Lorem Ipsum creates the illusion of the opposite.
The ideal is to have the content structured for each page of the interface, before the interface itself starts to be designed, and this is a task that can be provided by the client or the copy of the company responsible for the project and, when I say content, I’m not only talking about text, but also images and even small interactions and animations, because these elements work together as well.
In the latter case, and creating the layout with Lorem Ipsum, it is important, as soon as there is final content, to have the UI designer adding it to the designed interfaces, and simulate the layout of the pages with this same content, the developer cannot be the only one accountable for adding these contents.
4 - Scant attention to the responsive
Nowadays, a responsive site is something crucial, and, usually, when an interface is designed, it is conceived having in mind the desktop and mobile versions. But, generally speaking, it is clear that a UI Designer is more careful when outlining the desktop version than when they do the mobile. But why?
It’s simple, a UI Designer always begins with the design of the desktop layout and, only after that, comes the mobile. Because of this, it is assumed that the former is the site’s main design, also the largest and most important, but such is an illusion.
It is proven that, as we speak, more people are online via mobile devices (smartphones/tablets) than via conventional computers, and this factor must be taken into account when designing an interface.
One must place the responsive version of the website above the desktop, and drawing the responsive version for the minimum resolution supported (320px for example) is not enough, one also needs to think and outline how the information will appear in tablets (768px and 1024px), and that rarely happens, the way the responsive is adapted to these resolutions is something usually conducted by the developer, and this cannot happen.
5 - Design Without Performance
When we talk about the low performance of a website, the developer is always the one to blame, or the development team. But the truth is that the website’s future performance must also be thought during the interface’s creation. The excessive use of images or decorative elements on an interface will result in a slower website, or a website with images too compressed and quality-lacking.
The inclusion of interactions and animations suggested by the designer can also make the site slower, ensuring the balance is therefore important. Animations are important, they make a website more dynamic, reduce the cognitive load and avoid the “blindness to change”, but can also make the site significantly slower.
As I mentioned at the beginning of this article, these are common mistakes, all UI Designers have done them already, but it’s better if we try to avoid them.
