designweb online social-media● pmmb.de Blog

Auf Knopfduck

„And action!“

Interaktion auf Bildschirmen ist ohne Schaltflächen und Buttons nicht denkbar. Auf den ersten Blick bloß ein einfaches UI-Element, jedoch lässt sich einiges falsch und manches richtig machen, beim Entwurf von Buttons, Schaltern und Knöpfen. Es ist eine gute Idee Buttons zum Einsatz zu bringen, die auch als Buttons erkennbar sind. Was macht also eine gelungene Schaltfläche aus?

ERKENNBARKEIT
Rechteckige Knöpfe existieren in der digitalen Welt schon sehr lange. Ob sie gerundete oder spitze Ecken hängt vom Sil der App oder der Website ab, jedoch die Nutzer sind mit ihnen vertraut.

button_02
Mac OS 5 Meldung mit Button

Selbstverständlich kann man auch kreativer sein und zum Beispiel Kreise, Dreiecke oder sogar kundenspezifische Formen verwenden. Dabei ist jedoch zu bedenken, dass ausgefallene Ideen ein wenig riskant sein können. Es muss sichergestellt sein, dass jede Form auch als Schaltfläche erkannt wird – durchgängig, die gesamte Benutzreroberfläche betreffend. Das Button-Design sollte der Nutzererfahrung, Nutzererwartung und Nutzererlebnis förderlich sein – Vertrauen, Bindung und Sicherheit schaffen. Also keine Überraschungen, bitte.

SCHATTEN UND HÖHEPUNKTE
Räumliche Hervorhebungen machen es oft leichter Buttons zu erkennen.

KLAR UND DEUTLICH
Die Etikettierung der Schaltfäche muss eindeutig sein. Signets und Beschriftungen eindeutig ganz konkreten Aktionen zugeordnet werden können. Wann ist ein Label zu abstrakt? Was passiert, wenn ich auf „Kontakt“ drücke oder auf „Service“?

bildschirmfoto-2016-11-14-um-17-55-58
Android Schaltfläche mit Steuersymbolen

GRÖSSE UND AUSDEHNUNG
Wie verhält sich die Größe der Schaltfläche zum Restlichen Inhalt der Seite oder des Bildschirms? Ist der Knopf gut zu drücken? Wie weit ist er von anderen Schaltflächen entfernt?

OPTISCHE RÜCKMELDUNG
Schaltzustände sollten ablesbar sein:
Neutral, aktiv, geschaltet, geklickt, gedrückt…

PLATZIERUNG
Und: Eine gute Schaltfläche will auch gefunden werden.

 

● pmmb.de MarkenKommunikation