Buttons mit Symbol noch zeitgemäß?

[HCB]

Ich grüße euch,
mal ne Frage allgemein:
Sind die Buttons z.B. in einer Warenwirtschaft noch zeitgemäß, wenn diese bunte Symbole oder Icons haben?
Z.B. beim Button speichern: ✓ Speichern oder X Schließen. Und soll man noch darauf achten, dass der Button mit Unterstrich z.B. unter dem S eingefügt wird?
Es wird doch eh nur noch mit der Maus bedient, oder täusche ich mich?

Eure Meinungen dazu würde ich gerne erfahren.

LG Harry

[himitsu]

Die AccelChars / ShortCuts gehören sowieso immer rein.
Standardmäßig sind sie heutzutage "leider" ausgeblendet. (ALT drücken, oder im Windows per Default aktivieren, siehe Barrierefreiheit > Tastatur)

Leider halten sich NEUE Anwendungen nichtmehr an Standards, z.B. Notepad rendert jetzt alles via 3D mit GPU-Unterstützung und im Hauptmenü wird nie etwas unterstrichen, sondern immer nur bei ALT als Hint angezeigt.



Nja, bei den Icons geht es ja wieder zurück ins letzte Jahrtausend, also schlicht, einfarbig (schwarz) und ohne 3D-PseudoSchatten.

Außerdem Buttons nahezu unsichtbar, ganz ohne Rahmen und wenn doch, dann nur eine hauchdünne Linie anstatt einem 3D-igen Rahmen.
Vor allem für "Verneinung/Ablehnung" sind Knöpfe fast unsichtbar (kein Rahmen und extrem unauffällige Caption) zu designen.


PS: Es gibt einen Windows-Style-Guide. (aber MS Office hat sich noch nie dran gehalten, der eigene Installer sowieso nicht, auch die neuen Einstellungen-Fenster nicht und neuerdings nichtmal mehr Notepad und Paint)
https://learn.microsoft.com/en-us/windows/apps/design/
https://learn.microsoft.com/en-us/wi...ace-principles

[dummzeuch]

Also die Shortcuts würde ich nicht entfernen, es gibt immernoch genügend Leute, die wissen, was sie bedeuten und sie nutzen, um effizienter zu sein. Dasselbe gilt für die Tab-Reihenfolge (ich flippe immer aus, wenn die nicht stimmt, am schlimmsten ist, wenn ich das selbst versemmelt habe).

Was die Symbole auf (Bit-)Buttons angeht: Die sind schon seit Jahrzehnten aus der Mode. Das heißt aber nicht unbedingt, dass sie nicht sinnvoll sein können. Ich persönlich setze sie aber so gut wie nicht mehr ein.

[himitsu]

Zitat:

ich flippe immer aus

Manchmal auch absicht.

Wegen einiger PowerUser müssen wir da beim Einfügen/Entfernen von Controls aufpassen, da sie sich blind durchklöppeln und es dann knallt, wenn sich die Reihenfolge ändern würde. :stupid:
Auch alles noch schön DOS-ig, also mit ENTER, anstatt TAB.



Ach ja, ICONs natürlich mindestens als PNG und am Besten noch übertrieben interakiv animiert. :zwinker:
https://www.facebook.com/groups/delp...71519699576742

[Jasocul]

Zitat:

Zitat von HCB (Beitrag 1537019)

Es wird doch eh nur noch mit der Maus bedient, oder täusche ich mich?

Alle Buchhalter fallen vor Lachen vom Stuhl und müssen wegen Atemnot reanimiert werden.:mrgreen:
Ernsthaft:
Ich entwickle im Bereich Buchhaltungssoftware und kenne keinen Buchhalter, der irgendwas mit der Maus macht. Die Tippen ohne auf den Bildschirm oder die Tastatur zu sehen. Ich habe schon Extremfälle erlebt, bei denen immer ein separater numerische Block zur Verfügung steht, damit genug Platz für die Unterlagen ist. Die normale Tastatur wird weggelegt und ich habe auch schon jemanden gesehen, der bewusst keine Maus angeschlossen hat und alles mit der Tastatur macht.

Bei Buchhaltern ist das wirklich extrem, aber ich selbst nutze die Maus auch sehr selten. Sobald ich die Shortcuts einer Anwendung verinnerlicht habe, brauche ich die Maus kaum noch. Die Tastatur ist dann einfach schneller und ich muss die Position der Hände nicht mehr wechseln. Manchmal muss ich erstmal auf den Tisch sehen, wo die Maus überhaupt liegt.

Icons bei Buttons:
Das war zur Anfangszeit von Windows cool und zeigte was möglich ist. Außerdem erhöhte es den Spaßfaktor mit Windows zu arbeiten. Heute sehe ich da nur noch wenig Sinn für diese Icons. Für internationale Anwendungen, die nur in einer Sprache geliefert werden sind Symbole hilfreich, wenn man der Sprache nicht mächtig ist. Oder wenn kein Platz für den Text ist, bzw. ein Symbol mehr aussagekraft hat. Z.B.: Weißes Fragezeichen auf blauem, kreisförmigem Hintergrund. Jeder weiß, dass damit zusätzliche Hilfe abgerufen werden kann. Das ließe sich zwar auch textlich darstellen, aber das Symbol ist einfach bekannt.

[HCB]

Ok, danke für die Hinweise. Dann werde ich wohl mal die Symbole bei den Buttons weglassen und die ShortCuts bei allen Buttons einfügen.
Z.B. habe ich einen Button Speichern, Abbrechen, Schließen. Der Shortcut bei Speichern ist S, Abbrechen mit A und Schließen??? S geht ja wohl nicht mehr also habe ich C für Schließen.
Gibts da irgendwelche Standard-Regeln?

[Rollo62]

Zitat:

Zitat von HCB (Beitrag 1537019)

Sind die Buttons z.B. in einer Warenwirtschaft noch zeitgemäß, wenn diese bunte Symbole oder Icons haben?

Allzu bunte Icons und Buttons waren bei mir schon immer unzeitgemäß :-D
Zuviel des Guten lenkt meiner Meinung nach stark ab, verwirrt und stört bei den wesentlichen Dingen.

Ich finde aber dezente Farben, z.B. für OK-grün und Cancel-rot nicht schlecht,
wenn es sich eben um sehr entscheidende Auswahlen handelt und diese Farben einen natürlichen Sinn ergeben.
Das, zusammen mit ansonsten schlichten, neutralen, einfarbigen Icons finde ich gar nicht so schlecht.

[Hobbycoder]

Für eine bessere farbliche Hervorhebung für z.B. Den Speichern bzw. Abbrechenbutton
habe ich mir vor lngerer Zeit auch mal einen eigenen Button gemacht.
So kann ich wiederkehrende Farbschemen in den Dialogen gut erkennbar umsetzen (und noch ein paar andere Gimmicks)

Die Farbe des Buttons frei einstellen, aber auch den Rahmen. Das kann noch mit Hovereffekt variiert werden,
Text- und Iconplatzierung, Textfarbe natürlich, und ein Badge ist auch noch mit drin.

Ich hab mal ein paar Bilder davon angehängt.
Wenn den jemand haben will, wäre ich bereit zu teilen.

[himitsu]

Wir sind visuelle Lebewesen, drum nutzen wir ja auch einen Bildschirm.
Da sind "einfache" Bilder schneller zu erkennen, als erst einen Text zu lesen und zu verstehen. (jeder Buchstabe ist ein Bild und die dann auch noch im komplexen Zusammenhang)
Drum helfen auch farbige Effekte.

Welches von den beiden "Speichern" muß ich jetzt eigentlich drücken, wenn ich speichern möchte? :angle2:

Was auch echt blöd ist, sind negierende Bezeichner.
z.B. ein NICHT wird sehr leicht überlesen.

Gibt es auch Experimente mit Kindern.
Positive Aussagen haben mehr Wirkung, als Negative.
* Wenn du wartest, dann bekommst du später Zwei.
* Wenn du das jetzt nicht isst, dann bekommst du später Zwei.

[Phoenix]

Schaut Euch doch einfach mal moderne Anwendungen an.

Google Mail: überall Symbole.
Office 365: überall Symbole.
Chat GPT: Symbole für Bilder, Fotos, Files, Voice-Mode...

Aber: Überall nur outlines, keine bunten Bilderchen. Alles SVGs, damit sie skaliert werden können wenn jemand mit Kontrastschwäche sehr nah ranzoomen muss.
Überall ARIA-Tags drauf, damit Screenreader die auch sinnvoll vorlesen können.

Usability wird immer wichtiger.

[HCB]

Sind das nicht Web-Anwendungen? Da sind ja sehr viele Symbole und Bilderchen zu sehen.
Ich meinte Desktop-Windows Software für Firmen wie Warenwirtschaft etc.

LG Harry

[Uwe Raabe]

Zitat:

Zitat von Rollo62 (Beitrag 1537050)

Ich finde aber dezente Farben, z.B. für OK-grün und Cancel-rot nicht schlecht

Das hat aber eher verwirrende Folgen bei Leuten wie z.B. mir, die mit einer rot-grün Schwäche gesegnet sind. Die beiden Speichern-Buttons im Screenshot von Hobbycoder sind ein echtes Paradebeispiel, bei dem ich allein anhand der Position des Buttons entscheiden muss, welchen ich denn nehmen soll.

Übrigens liegt die Delphi IDE mit den beiden Buttons für Datei hinzufügen/entfernen auch auf einem der vorderen Plätze. Die Plus/Minus-Zeichen in den Icons sind eigentlich nur im High-DPI Modus auf 4K zu unterscheiden (immerhin), der aber aus verschiedenen Gründen in der Regel nicht einsetzbar ist. Hier hilft am Ende auch nur die Position des jeweiligen Buttons.

Wenn es denn schon Farben sein müssen, dann doch eher blau/gelb, da es für diese Kombination nur ganz wenige Betroffene gibt. Ist dann für Voll-Farb-Sehende halt nicht mehr wirklich dezent. Also vielleicht doch besser keine Farben?

[dummzeuch]

Zitat:

Zitat von HCB (Beitrag 1537046)

Ok, danke für die Hinweise. Dann werde ich wohl mal die Symbole bei den Buttons weglassen und die ShortCuts bei allen Buttons einfügen.
Z.B. habe ich einen Button Speichern, Abbrechen, Schließen. Der Shortcut bei Speichern ist S, Abbrechen mit A und Schließen??? S geht ja wohl nicht mehr also habe ich C für Schließen.
Gibts da irgendwelche Standard-Regeln?

Abbrechen benutzt standardmäßig Esc und sollte dann keinen weiteren Shortcut haben.
Was Konflikte angeht:
Ich würde für Schließen das C nehmen (wegen Close als englischer Übersetzung), aber ich weiß nicht, ob es da irgendwelche Standards gibt.

Wobei: Wieso gibt es überhaupt Abbrechen, Speichern und Schließen? Was macht denn Schließen genau?
Ich hätte nur zwei Buttons genommen: Abbrechen und Speichern (bzw. Abbrechen und OK, aber mit Speichern ist es eindeutiger). Speichern würde dann auch den Dialog schließen.

[Uwe Raabe]

Ist der Standard-Shortcut für Schließen nicht Alt-F4?

[HCB]

Zitat:

Wobei: Wieso gibt es überhaupt Abbrechen, Speichern und Schließen? Was macht denn Schließen genau?

Das ist ein Bearbeiten-Dialog in dem Änderungen eines Artikels vorgenommen werde können.
Ändert man etwas an den Einträgen und will man dann doch nicht, setzt der Button Abbrechen wieder in den Browse-Modus und der Dialog bleibt offen, Speichern ist klar und Schließen schließt eben diesen Dialog.

[Phoenix]

Zitat:

Zitat von HCB (Beitrag 1537055)

Sind das nicht Web-Anwendungen? Da sind ja sehr viele Symbole und Bilderchen zu sehen.
Ich meinte Desktop-Windows Software für Firmen wie Warenwirtschaft etc.

Das sind Business-Anwendung.
Die UI-Technologie ist dabei ja erstmal unwichtig.

Zumal das, was nicht im Web läuft sowieso in ein paar Jahren in Vergessenheit geraten wird. Wir stellen bei zig unserer Kunden seit etwas über Jahren 10 alte Desktop-Anwendungen auf Web-basierte User-interfaces um. Unter anderem ist da auch die ein oder andere WaWi drunter, ERP-Systeme, CRM-Systeme etc. Und diese sind alle noch am Markt. Von denen, die sich das "mal angehört" haben und dann nichts gemacht haben weil "zu teuer" oder "will ja keiner" gibt es stand heute schon gute 2/3 der Firmen nicht mehr.

[Hobbycoder]

Zitat:

Zitat von Uwe Raabe (Beitrag 1537056)

Die beiden Speichern-Buttons im Screenshot von Hobbycoder sind ein echtes Paradebeispiel, bei dem ich allein anhand der Position des Buttons entscheiden muss, welchen ich denn nehmen soll.

Ist ja wohl klar, dass das ein freud'scher Fehler war, weil ich die eben schnell nebeneinander gesetzt habe. Natürlich würden die in einem Programm nicht beide gleich beschriftet sein.
Aber die Kombi farbliche Unterscheidungen + Buttonbeschriftung+mögliche einfache Symbole sollte für jeden die Bedienung ermöglichen. Für stark Sehbehinderte Menschen, die eine starke Vergrößerung benötigen, müssen dann die barrierefreien Darstellungsoptionen des BS herhalten.
Außerdem waren meine Buttons für meine Anwendung und rein B2B. Das heißt zwar nicht, dass nicht auch dort Menschen mit Sehbehinderung arbeiten könnten, mir ist aber keine Fall bekannt wo an meiner Software jemand dieses benötigte.

[TomyN]

Zitat:

Zitat von HCB (Beitrag 1537063)

Das ist ein Bearbeiten-Dialog in dem Änderungen eines Artikels vorgenommen werde können.
Ändert man etwas an den Einträgen und will man dann doch nicht, setzt der Button Abbrechen wieder in den Browse-Modus und der Dialog bleibt offen, Speichern ist klar und Schließen schließt eben diesen Dialog.

Die ersten beiden beziehen sich auf die Beschreibung, die dritte auf das Fenster. Wäre nicht Zurück anstelle von Schließen sinnvoller?

Ansonsten mache ich es so:
Entweder Icon + Mouseoverhint oder Nur Text. Text + Bild halte ich für veraltert.

[Sherlock]

Ich finde, ausgerechnet Office Anwendungen sind keine guten Usability Beispiele, da die jedem UI Trend hinterher hecheln oder auch gerne mal vorweg nehmen wollen - mit Ausnahme eventuell von Tabellenkalkulationen. Grau auf Grau ist da noch das offensichtlichste Beispiel. Aber die ganzen Buttons nur noch per Maus bedienen zu können ist für jemanden, der repetitive Arbeiten durchführt, und seien wir ehrlich, das ist die schweigende Mehrheit, ein Graus.
Einfach mal folgenden Ablauf im Kopf durchspielen: kurzen Text schreiben / Zahlen eingeben, Programm diesen Text oder die Zahlen verifizieren lassen, weitere Daten eingeben, Programm einen Abgleich durchführen lassen, Ergänzungen eingeben, Programm nach Übereinstimmungen suchen lassen, noch etwas eingeben, speichern. Von vorne anfangen.
Das kann jetzt schnell und das kann langsam gemacht werden, beide Lösungswege haben weder mit dem Computer noch mit dem Anwender zu tun, es liegt am Programm. Welche der folgenden beiden Möglichkeiten ist wohl die schnelle Lösung?

1. Programm erlaubt alle Schritte über die Tastatur durchzuführen
2. Programm benötigt Maussteuerung

Welche davon benötigt allerdings keine Einarbeitung? Und darum wird ganz offensichtlich Variante 2 vom Management gekauft. Während Variante 1 nach wenigen Stunden Einarbeitung bereits die Produktivität/Datenverarbeitung deutlich steigert, wird es bei Variante 2 nie dazu kommen, weil "Hand weg von der Tastatur und Maus suchen, dann Pfeil suchen und steuern und irgendwann passend klicken" schlicht lahm ist. Das sollte auch ein Entwickler merken, sobald die große Welt der Keyboard Shortcuts sich ihm offenbart hat. Leider stirbt das Wissen um diese Shortcuts offenkundig aus.

Aber dafür hat ein sogenannter Usability Ingenieur dann tagelang über die Grautöne gebrütet...

Aber BTT: Icons in Buttons finde ich überflüssig und zu anfällig für Fehldarstellungen in HiDPI und Fehlinterpretationen in verschiedenen Kulturkreisen.

[Rollo62]

Ich halte das MaterialDesign von Google für eine elegante Lösung.
Wenn man sich auch mehr an der gängigen Symbolik aus dem Mobilbereich anlehnt, umso klarer wird die Funktion.
Wenn man natürlich das nicht für andere Zwecke mißbraucht.

Wichtig wären mir nur rudimentäre Strukturen, weil ich zum Beispiel die Header von Win11 nicht sehr vom Hintergrund unterscheidar finde.
Liegen mehrere Fenster übereinander dann klickt man leicht in das falsche.

[Willie1]

Hallo Leute,

ich sehe schlecht und da sind oft Symbole nicht gut zu erkennen. Menschen, die schlecht sehen können, schätzen die Wespenfarben Gelbund Schwarz. Ich habe eine Tastatur mit gelben Tasten und großen schwarzen Zeichen.

Manche Buttons bei Delphi stammen noch aus der Steinzeit. Wer kennt noch Disketten, der jünger als 30 ist? Gibt es aber immer noch in der Symbol-Bilder Sammlung.

Gruß Willie.

[TomyN]

Du wirst lachen.... ich habe erst letzten Monat Disketten + Laufwerk gesucht (und zu bezahlbaren Preisen gefunden. Das USB-Floppydrive hat mein Win10 ohne Murren direkt erkannt).
Allerdings nicht für die Nutzung für den PC sondern für ein Lichtstellpult aus den 90ern :-)

[Rollo62]

Zitat:

Zitat von Willie1 (Beitrag 1537073)

ich sehe schlecht und da sind oft Symbole nicht gut zu erkennen. Menschen, die schlecht sehen können, schätzen die Wespenfarben Gelbund Schwarz. Ich habe eine Tastatur mit gelben Tasten und großen schwarzen Zeichen.

Ich arbeite deswegen einfach mit immer größeren Bildschirmen :-)

Man kann halt nicht alle Fälle richtig gut abdecken, rot/grün, gelb/schwarz, und so weiter.
Es gibt deshalb ja auch noch die Option der Styles, bei den Apps, was ich eigentlich sehr gut finde.

Nur leider stört mich da etwas, dass diese meistens auf Marketing-Zwecke ausgelegt sind oder auf spezielle Design-Vorlieben
und irgendwas nachahmen wollen.
Ich finde da eigentlich keines Out-of-the-Box, was mir passen würde.

Insbesondere mit den "HighContrast" Styles komme ich nicht gut klar, da bleibe ich lieber beim Original Light/Dark-Modus,
denn die Betriebssysteme sind ja auch darauf schon sehr gut abgestimmt.

Styles find ich aber noch aus einem anderen Grund problematisch.
Stell Dir vor, Du bekommenst einen Kunden in die Hotline, der seine App bis zur Unkenntlichkeit verschandelt hat,
so dass eine Fehlersuche schwer wird.
Deshalb Styles nur in Maßen und nicht jede Farbe einzeln einstellbar.

[bcvs]

Zitat:

Zitat von Willie1 (Beitrag 1537073)

Wer kennt noch Disketten, der jünger als 30 ist? Gibt es aber immer noch in der Symbol-Bilder Sammlung.

Dazu gab es hier schon mal eine Diskussion:
https://www.delphipraxis.net/193822-...ern-icons.html

[Rollo62]

Wie wäre es damit?
https://fonts.google.com/icons?hl=de...uery=file+save

[Willie1]

Zitat:

Zitat von Rollo62 (Beitrag 1537084)

Wie wäre es damit?

Gefällt mir gut. Ich verschenke meine Programme aber es gibt Abmahnvereine, die auf sowas lauern. Urheberrecht!

[Willie1]

Zitat:

Zitat von TomyN (Beitrag 1537076)

Du wirst lachen.... ich habe erst letzten Monat Disketten + Laufwerk gesucht (und zu bezahlbaren Preisen gefunden. Das USB-Floppydrive hat mein Win10 ohne Murren direkt erkannt).
Allerdings nicht für die Nutzung für den PC sondern für ein Lichtstellpult aus den 90ern :-)

Ich hatte mir 2012 ein ext. Diskettenlaufwerk von IOMega gekauft und musste feststellen, dass über die Hälfte der Disketten aus der Zeit 1988-93 nicht mehr lesbar waren. Ade... Quick-Basic und Turbo-Pascal Programme. Die Festplatte (100 MB!) war kaputt gegangen. Disks waren als Backup absolut nicht geeignet.

Nachtrag: auch selbst gebrannte CD mit Bildern aus der Zeit 2002-3 sind heute nicht mehr lesbar. 500 Jahre alte Bücher lassen sich noch lesen aber wie sieht das mit digitalen Daten in 500 Jahren aus.

[Uwe Raabe]

Zitat:

Zitat von Willie1 (Beitrag 1537087)

Ich verschenke meine Programme aber es gibt Abmahnvereine, die auf sowas lauern. Urheberrecht!

Ich denke nicht, dass bei Einbettung dieser Icons irgendjemand was abmahnen kann, denn auf der Seite steht auch:

Zitat:

Google Fonts makes it easy to bring personality and performance to your websites and products. Our robust catalog of open-source fonts and icons makes it easy to integrate expressive type and icons seamlessly — no matter where you are in the world.

[himitsu]

Zitat:

Buttons mit Symbol noch zeitgemäß?

eigentlich ist es eher andersrum
nur noch Buttons, ohne Text
am Besten auch mit einem Design, was niemand mehr versteht

z.B. die Schnellsettings in meinem Android, die waren fürher Icons mit kleinem Text drunter,
jetzt ist der Text weg und das UI hatte beim letzten großen Update ein neues Design bekommen.
nun weiß ich erstmal nicht mehr, was welche Funktion sein soll ... vergesse ständig immernoch, wie der WLAN-Hotspot jetzt aussieht.

[bcvs]

Ja, das fand ich auch ärgerlich. Die Beschriftung kann man aber wieder einschalten:

Einstellungen - Benschrichtigungen und Statusleiste - Symbolbeschriftungen nicht anzeigen ausschalten
(schönes Beispiel für doppelte Verneinung)

[Samorion]

Die waren bei meinem neuen Handy standardmäßig an :angel2:

Außer natürlich ich verstehe nicht welche Schnellsettings gemeint sind.

[himitsu]

Zitat:

Zitat von Willie1 (Beitrag 1537073)

Wer kennt noch Disketten

Stell dir das Symbol der Diskette einfach als ein Synonym für Speichern vor, also wie so ein ägyptisches oder japanisches Symbol, welches "Speichern" bedeutet.

Wir, und auch andere Sprachen, verwenden oft noch Symbole und Bezeichnungen/Namen, von Dingen, welche heute selbst keine oder eine komplett andere Bedeutung besitzen, als wie es ursprünglich mal war.

Statt dem Zahnrad, für Einstellungen, müssten wir ja sonst auch heute ein Bit hinmalen.

[Uwe Raabe]

Zitat:

Zitat von himitsu (Beitrag 1537099)

Statt dem Zahnrad, für Einstellungen, müssten wir ja sonst auch heute ein Bit hinmalen.

Das Bit würde dann aber so ziemlich für jedes Icon passen.

[dummzeuch]

Zitat:

Zitat von himitsu (Beitrag 1537099)

Zitat:

Zitat von Willie1 (Beitrag 1537073)

Wer kennt noch Disketten

Stell dir das Symbol der Diskette einfach als ein Synonym für Speichern vor, also wie so ein ägyptisches oder japanisches Symbol, welches "Speichern" bedeutet.

Wir, und auch andere Sprachen, verwenden oft noch Symbole und Bezeichnungen/Namen, von Dingen, welche heute selbst keine oder eine komplett andere Bedeutung besitzen, als wie es ursprünglich mal war.

Statt dem Zahnrad, für Einstellungen, müssten wir ja sonst auch heute ein Bit hinmalen.

Guter Punkt, den man auch in anderen Bereichen beherzigen sollte. Ich sach' nur "unbeschrankter Bahnübergang".