Programm Layout Messprogramm

[progopa]

Hallo,

ich programmiere zur Zeit an einem Zeitmessprogramm.
Die Oberfläche hat eine Reihe Schalter, welche bestimmte Zustände schalten.
Bezüglich des Design gibt es einen kleinen "Richtungsstreit".
Zeigt man Schalterzustände durch die Farbe des Button selbst an oder
läßt man die Schalter im Windows-Style und ordnet z.B. neben dem Schalter ein
farbiges Signalelement (z.B. LED als Bitmap) an ?
Oder gibt es noch andere Vorschläge zur Lösung?
Um meine Frage verständlicher zu machen, habe ich 2 Beispielgrafiken angehängt
und wäre für Vorschläge/Meinungen dankbar.

Mit Gruß Op.

[himitsu]

Mit Status-Icons in den Buttons?


Nja, mal bissl Geschichte:

Vor 9x/DOS machte man alles so quitschbunt, wie in deinem ersten Beispiel.

Dann versuchten "seriöse" Programme sich an den Style des OS anzupassen.

Seit XP, aber vorallem seit Vista/Win7 macht man es mit schön bunten 3D-Icons und mit viel Transparenzen
und seit Win8/Win10 (Metro) macht man alles lötzlich im Metro-Style, also total verblasst, einfarbig und hässlich plattgedrückt.

[Der schöne Günther]

Deine persönliche Meinung in Ehren, aber flache Icons sind überall, auf Displays wie auf Printmedien. Microsofts "Metro" war, auf Computerdisplays, da nur der Vorreiter. Glitzericons sind fast völlig verschwunden, und das ist auch gut so. Oder würdest du lieber perspektivische Icons mit Farbverläufen auf Verkehrs- und Gefahrenschildetn sehen wollen?

Zur Frage mit farbigen Buttons: http://ux.stackexchange.com/q/49991

Das erste Bild finde ich überaus verwirrend: Die Buttons sind mit einer Tätigkeit beschriftet. Was sagt mir die Farbe? Einmal "Achtung" und einmal "ungefährlich"? Wenn du einen Status anzeigst finde ich es, wie auf dem zweiten Bild, mit einem extra Indikator sehr übersichtlich. Aber ich verstehe auch auf dem zweiten immer nicht was jetzt ein Schalterzustand ist bzw was mir die Farben sagen sollen. Dass man den Counter gut starten und resetten kann, eine Startbereitschaft aber schwierig ist?

[jobo]

Ich weiß nicht, ob man das anhand von 3 Beispielschaltern ergründen kann, ohne das Gesamtsystem zu kennen.
Ein visualisierter Schalter hat ja auch im Touch Zeitalter keine Haptik. Alles was wir malen ist Mimikri von ehemals Hardware in 3d und es ist nur ein schwacher Abklatsch, egal welche Farbe.
Die Farbe spielt also schon eine besondere Rolle und ist eine Sprache mit verschiedenen Bedeutungsebenen, je nach Kontext, aber eben eine Sprache.

Kamera an = grüne LED
Kamera aus = rote LED

Kraftwerk an = grüne LED
Kraftwerk vor Kernschmelze = rote LED

Messung läuft = grüne LED
Messung aus = rote LED
oder
Messung fehlerhaft = rote LED?

im Filmstudio
Aufnahme läuft = rote LED
Aufnahme läuft nicht = grüne LED

usw.

Das Delete Bild aus dem Link oben ist auch ein gutes Beispiel.
Meine Sprache wäre
grün=save
rot=delete
und zwar immer, durchgehend, im ganzen Programm.
Welche Farbe ich grundsätzlich für eine potentiell beliebige Aktion wählen würde, wage ich mir auf die Schnelle aber nicht auszudenken.

Kill Process = rot wäre okay oder?
Kill Malicious Process = rot? Meinem Rechner wird es gut tun, also lieber grün?

Du kommst also wohl nicht drumrum- unabhängig davon, ob es nun sexy aussieht oder nicht- ein Konzept für Deine Schaltelemente und Anzeigen zu entwerfen. Wenn Du Dich dabei zufällig an weit verbreitete Verfahren hälst, kann man vielleicht auf eine recht intuitive Bedienung hoffen.
Radiobuttons oder Wippschalter benötigen vielleicht gar keine LED, außer der Grafiker war gar kein Grafiker oder kann es nicht.

Noch ein Beispiel aus der analogen Welt(misslungener Fortschritt):
Wer von Euch hat einen Herd (den er auch benutzt)?
Moderne Geräte haben nervige Touchbedienung (Bei Nässe auf der Oberfläche schon nicht zu gebrauchen, aber das nur am Rande). Ich hoffe diese "Erfindung" wird bald wieder verschwinden.
Alte Geräte haben einen Drehknauf je Herdplatte, der eine Rastung besitzt und gute Knäufe haben auch noch ein gerichteten Griff (Pfeil förmig) auf dem Knauf. Bedeutet in der Praxis, ich kann blind den Herd bedienen, ich kann aus 5 m Entfernung sehen, ob eine Platte an ist (bei genug Licht), ebenso aus 1cm Abstand die Platten bedienen ohne hinzusehen. Ich kann ganz banal jeden Schalt-Zustand fühlen.
Sprich: gleichzeitig mit einer Hand per Schneebesen im Topf rühren, mit der anderen die Hitze runterdrehen und dabei mit meinen Augen in die Augen meiner Frau schauen und sie küssen.
Alles gleichzeitig, krass oder?
(und dabei piept es nicht mal, während ich die Temperatur der Platte ändere)
Ja und ich glaube, Ingenieure haben sich irgendwann mal bei diesen Drehknöpfen ein paar gute Gedanken gemacht.

[BUG]

Zitat:

Zitat von jobo (Beitrag 1298842)

Alte Geräte haben einen Drehknauf je Herdplatte, der eine Rastung besitzt und gute Knäufe haben auch noch ein gerichteten Griff (Pfeil förmig) auf dem Knauf.

Wieso alte Geräte? Der Großteilteil der neuen Herde hat Drehknöpfe, du hast dich anscheinend nur verkauft :mrgreen:


Zum Thema:

Die bunten Buttons sehen einfach unprofessionell/hingefrickelt aus. Wenn ich so etwas auf Screenshots sehe, dann muss es schon in sehr knappes Angebot an ähnlichen Programmen geben, dass ich so ein Programm auch nur herunterlade.

Icons in den Buttons fände ich in Ordnung, aber etwas sprechender als eine farbige LED dürfte es sein. Für eine Uhr würde ich in Richtung Multimedia-Icons gucken (Start ▶, Stop ■, Pause || , Zurück zum Start |◀◀) oder auch sprechende Abbildungen z.B. eine Hand über einem Buzzer für "bereit"; dann müssen aber auch die anderen Icons in dem Stil sein.
(Außerdem: Was macht denn "Bereitschalten" überhaupt?)

Für wichtiger als die Icons halte ich es, das die Oberfläche zum Nutzungskonzept passt.
Soll die Uhr im Hintergrund laufen? Dann wären Shortcuts und ein Tray-Icon nützlich. Über das Menü des Tray-Icons sollte sich das Teil dann auch bedienen lassen.
Soll die Uhr gut sichtbar sein? Dann sollte es eine Option geben, die Uhr immer im Vordergrund zu halten, vielleicht auch mit transparentem Hintergrund.

[progopa]

Erst einmal vielen Dank für die Meinungen.
Die "bunten" Schalter sind die Schalter aus der TMS-Software mit Farbverlauf, da ist nichts selbst gebastelt.
Das Programm läuft als einziges auf dem Rechner.
Start und Ziel sind Lichtschranken.
Start kann die Zustände "Start inaktiv", "Start freigegeben" und "Lichtschranke passiert" (Zeit läuft) haben.
Zwischen den Zuständen Freigabe und inaktiv kann mehrfach hin und her geschaltet werden.
Der jeweilige Zustand soll optisch schnell zu erfassen sein. (Stress)

z.B.
Start gesperrt keiner darf in den Startraum
Start bereit Fahrad in Position - Start ist noch nicht erlaubt.
Start wird freigegeben (Starter hebt Flagge)
Messung beginnt mit dem Passieren der Lichtschranke.
Es sind also 4 Statusmeldungen für die Startlinie, die optisch erkennbar sein sollen.



Gruß op

[bcvs]

Ich würde die Statusmeldungen aber auf keinen Fall über die Farbe der Buttons anzeigen.

z.B. ein roter Button "Start Bereitschaft": Rot steht dabei ja wahrscheinlich für den Zustand "Start nicht bereit". Bedeutet der rote Button jetzt, dass der Start momentan nicht bereit ist und mit einem Buttonklick erst bereitgeschaltet wird? Dann würde die Farbe des Buttons dem Buttontext wiedersprechen: Ich klicke auf rot heißt doch: ich sperre etwas und nicht wie der Text lautet: ich gebe etwas frei.

Also besser: Statusmeldung über separate Farbflächen oder Icons und daneben Buttons, deren Beschriftung sich je nach Staus ändert "Start freigeben" oder "Start sperren".

[progopa]

Ich habe jetzt eine Lösung mit "neutralen Schaltern und einer Statusanzeige per Radiogroup probiert.
Das Umschalten ist per Schalter(mit Hotkey) oder in der Groupbox möglich.
Wirkt wohl informativer.

[mensch72]

Ich würde es in etwas wie die rechte Variante machen, aber mit etwas "grauer 3D-Haptik" der Textbuttons und daneben "farbigen Symbolen" stat purem Farbindikator, weil:

- Wenn es Touch Bedienung ist, MUSS sich etwas auf aktiven Flächen tun, wenn ich den Finger dort hin halte ("Haptik", z.B. für die Zeit der Berührung dunklere Tastenfarbe)
- wir gegen bei Touch sogar soweit, das wir eine Aktion erst "KeyUp" auslösen, also "wenn die Taste losgelassen" wird.. hat den Vorteil das man wenn man die falsche Taste mit dicken Fingern erwischt hat und das ja "sieht", den Finger noch auf die richtige Taste "verschieben" kann, ohne etwas auszulösen
- pure Farbinikatoren wo rot,grün,gelb vorkommen haben wir abgeschafft, weil es erstaunlich viele Menschen mit Rot/Grün Blindheit (oder Sehschwäche) gibt
. daher wie beim Ampelmännchen: jede Farbe hat auch ein eindeutiges "einfaches" Symbol was zumindest direkt auf die Farbe schließen lässt. (wir bemühen uns aber, doch auch etwas den Buttontext symbolisch zu repräsentieren, weil so auch Leute damit klar kommen können, welche die/eine Sprache nicht 100% verstehen und davon gibt es heut zu Tage immer mehr, aber die merken sich "Bildchen")

Wichtig bei realer/"langsamer" Anzeige von Stati per Indikator und sofortiger/"schneller":
- wenn man die Haptikanzeige des/der Buttons blockiert, solange etwas übertragen/abgewartet wird, wirkt das bei Benutzung der GUI sehr inkonsitent und wenig vertrauenserweckend, weil man nie "ein richtiges Gefühl" für den Touch bekommt, also wann&wie erkennt der Touch meinen Finger sicher/schnell/Punkt
- wenn die Haptikvisualisierung immer geht und Funktionen im Hintergrund "nicht blockierend" laufen, dann muss es eine "einheitliche" Visualisierung für "In Bearbeitung, Symbolanzeige noch nicht aktuell, bzw. nicht mehr aktuell" geben

Nehmen wir einen Lichtschalter auf einem per Funk kommunizierendem Tablet, welcher immer anzeigt ob das zugehörige Licht gerade an oder aus ist und man es mit einer Tipfunktion "umschalten" kann... da kann die Funkverbindung auch mal gerade dann schief gehen, wenn geschaltet werden soll... wenn man mit der Status/Symbolanzeige immer wartet bis der neue Sollzustand erreicht ist, dann könnte es sein das dies dem Benutzer zu lange dauert und er nochmal oder gar ungeduldig ganz schnell mehrmals drückt das Licht in diesem Fall dann flackern könnte wenn alle Befehle stur gepuffert werden.
Wir arbeiten daher mit "Sollwertanzeige", stellen also das InfoSymbol sofort um und übertragen erst dann im Hintergrund den Schaltbefehl. Das wirkt in der Touch GUI flüssiger. Wir stellen da um das Symbol noch einen "Rand" oder "Punkt" dar, welcher wieder verschwindet nach TimeOut-Zeit X oder wenn der (neue oder alte) Istzustand real bestätigt verfügbar ist... richtig "gültig" sind nur "pure Symbole"... das ist aber eine Feinheit welche nur Servicekräfte beachten. Anwender freuen sich über die super schnelle Reaktion des Systems und beschweren sich eh wenn etwas nicht schaltet, ganz unabhängig was in dem Moment zu sehen ist:)


Und so wird aus ein paar simplen Buttons welche nur fix irgendwas reales per Touch steuern sollen ganz schnell eine Wissenschaft, wenn man es draußen selbsterklärend und sicher durch OttoNormalNutzer verwendbar sein soll.

Zum Test wenn schnell mal was gehen soll, setze ich auch einen Standardbutton und schreibe Quick&Dirty auch mal direkt ins OnClickEvent vom Form die Testfunktion ohne Rücksicht auf blockierte GUI und konsistente Statusindikatoren... Ausliefern würde ich sowas nie, aber muss oft erklären warum denn wo doch nun "die neue Funktion geht" ich nun noch Zeit fürs GUI oder auch MMI(also Mensch-Maschine-Interface) haben muss!

[BadenPower]

Zitat:

Zitat von progopa (Beitrag 1298839)

Bezüglich des Design gibt es einen kleinen "Richtungsstreit".

Einmal abgesehen vom Aussehen der Oberfläche würde ich die Einteilung etwas anderst machen.

Du hast eigentlich 3 Bereiche, welche von einander getrennt sind:

1. vor der Startbox
2. in der Startbox
3. auf der Strecke

Für jeden Teilbereich würde ich eine eigene Anzeige machen.

zu 1.

• grüne Led = Zugang zur Startbox frei
• rote Led = Zugang zur Startbox gesperrt (entwerder ist sie schon belegt oder es findet kein Rennen statt usw..)

zu 2.

• grüne Led = Fahrer in der Startbox darf starten
• gelbe Led = Fahrer soll sich zum Starten bereit machen
• rote Led = Fahrer darf nicht starten (Strecke belegt usw..)

zu 3.

• Zeitanzeige mit der gemessenen Zeit
• grüne Led = Messung läuft (Zeitanzeige zeigt 00.00.00 solange Startlichtschranke nicht durchquert wurde)
• rote Led = Messung beendet (Zeitanzeige zeigt gemessene Zeit, wenn Ziellichtschranke durchquert)

Die Aufteilung hätte den Vorteil, dass Du flexiber bist. Es könnte dann auch schon jemand in der Startbox warten, wärend sich ein Anderer noch auf der Strecke befindet.