When bad UI strikes: what good UI looks like and how it is achieved
Hands up, who has ever experienced the pain of a bad, unintuitive, clunky user interface/UI?
(Few clients, you’d better not have your hands up!)
But seriously, you can find bad UI in a lot of places. From cluttered pop-up boxes to poor load time optimization, many businesses continue to miss the mark — and miss out on sales as a result.
So if we’re all digital experience users, which we are, and we all know the pain of bad digital experiences, which we do, then why do products continue to launch with bad UI, and what can be done about it? Let’s explore.
What is UI? The good, the bad, and the ugly
The first challenge is this: the difference between good and bad UI can be subjective. The same can be said for any design, anywhere (to you, the color red might look brave and bold, but to your friend, it’s symbolic of danger.)
But here’s something requiring less debate: the difference between good and bad UI can be the difference between a market-leading product and failure. 66% of people prefer to engage with a well-designed website when given 15 minutes to view the content. Younger customers have very little tolerance for bad UI. Millennials are “less forgiving” of old designs and are hungry for new trends, while Generation Z craves personalization and authenticity from a brand’s UI.
It’s research and findings like this that help put the subjectivity of UI aside and instead offer up guiding principles that all designers can follow.
The principles of good UI design
Design, but don’t over-design — give your users control
The most important part of the user interface is the user. Without the user, your product has no audience and no means of ROI… unless you’re building an AI, but that’s a whole different situation.
The user should be front of mind in every design decision made. They should feel empowered to do everything they want to do with your product, which means giving them control. The UI should also be simple and intuitive, with clear signposting, so they can quickly master your experience.
If you’ve ever reached for a “Back” button on an app and not found it where you’d expect, then you know all too well how bad that lack of mastery feels.
Reduce cognitive load
Let’s focus a little more on what “intuitive” means in UI.
By definition, it means that users should know how to interact with your UI without conscious reasoning. Here, UI designers can use semiotics and heuristics to help guide the way — you want your users to feel like they’ve been in your app or on your website before, even if they haven’t.
We’re living in a digital age of convenience, after all. Almost anything with just a couple of clicks — and users don’t want to face a steep learning curve or think too hard when using products. This is especially true of mobile applications, where the user is often limited to single-hand actions.
Ease of use is good, a cookie-cutter template is not
The calling cards of intuitive UI include a clean layout, clear signposting, and colors, graphics, and shapes that all carry meaning. Bad UI, on the other hand, is cluttered, packed in, and offers up far more information than a user needs.
Think of it this way: every piece of unnecessary information is like noise that distracts the user from the ultimate end goal, whether purchasing a product or booking a call. Developers and design teams need to really think about what is required and what can be left out to avoid building bad UI.
And yet, there is such a thing as being too sparse or borrowing just the same design assets as your competitor brands. A templated approach to UI design might work fine as a minimum viable product or get you soft-launch-ready. Still, when delivering a rad digital experience, you need to avoid cliches.
You’re looking for an intuitive and simple user interface that still stands out from the crowd.
Make user interfaces consistent
Most digital experiences span several devices: mobile, desktop, tablet, and maybe even smartwatch. And when it comes to great UI design, consistency is key.
There will be specific user interface principles for each of these canvases — the target size for touchscreen devices should consider an adult’s fingerprint, for example, but that size will differ on devices of different sizes! But your overall UI aesthetic and rationale should remain the same.
You don’t want users moving from the desktop version of your product to the app and having to learn a totally new set of design cues and symbols.
Examples of good and bad UI
Good UI
You can’t talk about UI without mentioning Pinterest. Their photo-centric, waterfall design is often considered gold-standard for great UI.
Pinterest combines a simple, clean card design with a waterfall flow, offering users a distinct, smooth, and seamless experience. Subtle colors and shades increase visibility and give the perception of “clickability,” which helps the user feel like they’re performing a physical action even when using a touchscreen.
Bad UI
A few years ago, fashion retailer Boden found itself heavily criticized by the UI community thanks to its egregious title dropdown menu seen below. Amazingly, this infamous feature still exists on the brand’s website and is a great example of how to make a simple task too hard. (See the little arrow at the end of the visible list! How much longer do you think it goes on?)
Remember: asking customers to open an account is asking for their data. We should show appreciation for that data by offering a clean, decluttered UI.
Avoid bad UI with the best design partners
Following the design principles mentioned earlier in the article will get you started on your journey to better UI. Avoid clutter, use buttons wisely, lean into intuitive cues, and put the user first.
Looking for an even easier way to deliver a product with great UI? Get in touch with Few.