UX Patterns for UI Design

Subscribe now

Podcast Episode as video

Today a hands on UX topic that you can implement immediately. Namely, we want to introduce you to two UX patterns that will give your user experiences a real quick win!

But first...

What are UX Patterns and why do they come so handy for UI Design?

As the name suggests, UX Patterns are certain patterns that can be used as a general basis for any user interface. So UX Patterns are certain rules that you can always follow, for example, if you are unsure how to design a button. The nice thing is, UX Patterns are based on user research, which you don't have to do anymore.

There are a few of them and we want to show you two in the current podcast episode.

Picking up users and keeping them informed: the Stateful Button.

The stateful button is a button with an integrated status indicator. When users interact with an application, machine, website, etc., it is often unclear what the current status is. Did the request work? Is something still loading? Did something perhaps even not work?

The Stateful Button is an intuitive and elegant way to improve the user experience so that users know what the current state is. Without annoying pop-ups and the status change is guaranteed to be noticed because the focus stays on one UI element, namely the button!

So: feel free to try communicating status indicators through the button, which changes its appearance or text depending on the status. If you are unsure how to implement the implement the whole thing, feel free to contact us!

Stateful Button

Icon+Text

Buttons can often be confusing. As Moritz tells at the beginning of the podcast episode: due to misleading buttons without explanation and text he didn't dare to send an SMS from the user interface of his car. Who knows where the SMS will end up if you click on some weird button?

But this should really not happen! This fear of doing something wrong is triggered by insufficiently communicated consequences of a click.

UI and UX designers as well as product developers should consider that users might be put off and confused by buttons that are not 100% understandable. There are few icons where you can assume 90% that users will understand them because they are so common and ingrained. But: this is an exception.

The UX Pattern at this point: use icon+text and when in doubt, prefer text only. User research has shown that purely textual buttons are also quite well accepted and understood by users.

Therefore: Listen to our UX pattern episodes if you want to design good buttons!

Have fun and let us know what you think of the UX Patterns episodes and what topics you want to hear more about!

Discover more UX Design content!

  • The user as the center of the frontend

    So wie Häuser für ihre Bewohner gebaut werden, sollten auch bei der Entwicklung eines Frontends seine zukünftigen Benutzer mit einbezogen werden.

    2020-02-07

  • Design Systems — and what Lego has to do with it

    A design system is extremely important for smooth and efficient development of digital products with a UI. It should be a fundamental part of your development process.

    2021-01-15

  • The UX Checklist

    Check now whether the project is well-positioned ✔User-centered ✔Reality checks ✔Mindset. Be on the safe side with our UX checklist and all-important UX rules at a glance!

    2021-01-14

  • Good User Experience (UX) always wins

    Why good UX changes everything and why product has to offer the same experience as a smartphone.

    2020-05-20

Published by Lisa on 2021-04-16

Sparked your interest? Discover our services!