Visu: Schlechtes Design - Gutes Design

[mfd]

Immer wieder sehe ich unabhängig von der verwendeten Hard- und Software gar grausame Formen seine "Visualisierung zu gestalten".
Beliebtes Beispiel:
Überschrift: Licht
gefolgt von "Symbol Licht"
und danach den Text Licht
WARUM?
Würde nicht eines davon auch reichen?
Sind die heutigen Bildschirme einfach zu groß?
Hält dreifach besser?
Um den Nachbarn/die Oma/den Kollegen mehr zu verwirren?

Gerne würde ich hier ein paar allgemeine "Design-Regeln" sammeln was den Visu-Aufbau angeht.
Oder auch Negativ-Beispiele bzw. Verbesserungsvorschläge diskutieren.
Sicher könnte das Manchem einiges an unnötiger Arbeit ersparen oder zumindest ein paar Anregungen zur eigenen idealen Visu geben.

Wenn ihr also etwas seht was euch nicht zusagt, wissen wollt ob man etwas eleganter umsetzen könnte, eigene Erfahrungen oder Design-Regeln habt nach denen ihr beim Visu-Bau vorgeht - her damit.

[gaert]

Ich habe ganz simple Buttons gebastelt, die Beschriftung ist noch provisorisch

Die Größe ist für's iPad optimiert.

[JuMi2006]

Überschrift: Licht

Weil meistens der "Block" einen Namen braucht, also wird es ausgefüllt, denn Platz ist meist ausreichend vorhanden.

gefolgt von "Symbol Licht"

Sorry, aber Du hast mit den Icons angefangen, denn Platz ist meist ausreichend vorhanden.

und danach den Text Licht

Ja, weil Symbole nicht 100% passen und ehrlich, ich habe keine Lust 1000 Icons zu durchforsten. Da ist man mit nem kurzen Text schneller und Platz ist meist ausreichend vorhanden.

Würde nicht eines davon auch reichen?

Theoretisch aber ... hab ich die Sache mit dem Platz auf dem Display schon erwähnt? Ausserdem lassen sich Icons schneller mit dem Auge erfassen als die Texte durchzulesen. Für das Überfliegen von 50 Icons brauch ich (fiktiv) 5 Sekunden. Wenn ich das aber mit 50 Wörtern mache brauche ich (fiktiv) 10 Sekunden.

Hält dreifach besser?

Viel hilft viel.

Um den Nachbarn/die Oma/den Kollegen mehr zu verwirren?

Nein, Warum ... das ist doch nun wirklich idiotensicher.
Aber das Hauptproblem scheinen wirklich die gigantischen Displaygrößen zu sein. Dazu noch komische Formate wie 16:10 etc.

Interessanter ist dass ich mir bis auf 3 Ausnahmen seit gut 4-5 Monaten kein Diagramm mehr angesehen habe. Ausnahmen: Aussentemperatur, Stromverbrauch Haushalt/Wärmepumpe.

Visu ist Geschmackssache und im täglichen Leben muss die nicht feurig bunt sein. Ich gehe momentan sogar soweit und behaupte dass die Gira-App auf nem angenagelten Tablet vollkommen ausreicht. Dazu vielleicht noch eine umfangreichere Visu die browserbasiert ist damit man am PC oder sonstwo mal nach ein paar Details gucken kann. Wenn der erste Spieltrieb vorbei ist macht man das aber auch nur bei (vermeindlichen) Problemen.

Edit: Bitte nicht zu ernst nehmen

[nteucher]

Wenn der erste Spieltrieb vorbei ist ...

Das seh ich genauso... Mittlerweile denke ich dass es viel wichtiger ist, dass es übersichtlich und intuitiv bedienbar ist, als dass es grafisch "überwältigend" sein muss... Deswegen orientiert sich meine Ajax-Visu auch am Quad-Design mit ein paar Optimierungen

Gruß,
Norman.

[2ndsky]

Wie immer im Leben, kommt es auf den Einzelfall an

Ich verwende nun seit etwa zwei Monaten die smartVISU im mitgelieferten Standarddesign. Die Visu ist wirklich toll umgesetzt... vor allem die Widgets für shutter oder rtr sind schön und auch die Plots sind super. Mein Problem allerdings, ich steuere überwiegend mit dem iPhone und iPad und da brauchen mir die Widgets zuviel Platz. Daher habe ich jetzt angefangen, das Quadclient Design von Gira mit der smartVISU nach zu bauen. Weil dort ist IMHO der geringe Platz auf mobilen Clients ziemlich gut ausgenutzt.

Und bevor gleich Fragen kommen, wenn ich das dann fertig habe, gibt es das natürlich für jeden!

[MatthiasS]

Doch, klar, ernst nehmen. So wohl das Thema als auch jede Antwort.

Was den QC betrifft, so war der bis zu aktuellen Version das Paradebeispiel für völlig verkorkste Benutzerführung. Eine Schaltfläche, die die Farbe gewechselt hat nach Zustand ist ja gut, darauf dann den invertierten Zustand schreiben, Verwirrung perfekt. Dazu noch ein hauchdünnes Icon, bestehend aus zwei Farben und einer Darstellung, die das ganze invertiert. Wenn man weiß, wer dafür verantwortlich ist, fragt man sich schon, wie manchmal Professuren verliehen werden

Der neue QC macht vieles besser, noch zwei Kleinigkeiten, und ich werde Fan, zumindest was die Darstellung auf dem Iphone betrifft. Für einegroße Visu bleibe ich bei der Männervariante.

Back on Topic, die ursprüngliche Fragestellung ist mehr als berechtigt. Ich mag es am liebsten auch so reduziert wie möglich, dabei habe ich zwei Prinzipien:

- der Zustand wird mit EINEM einzigen Element signalisiert
- Icon dezent und relativ abstrakt

dazu das Beispiel aus dem QC: die Grafikanfänge vom QC-Design waren vielversprechend. Hier hat man schon gesehen, dass die von einer professionellen Agentur (wenn sie nicht gerade am Tischtennisspielen waren) kamen. Leider gab es viel zu wenig abstrakte Icons, Wichtiges fehlte.

Inzwischen ha man da nachgebessert, hat aber den Ansatz völlig verwässert. Die Symbole sind zu detailreich und schauen nicht mehr so gut aus. Und da kommen wir zum Thema Text versus Icon:

Will ich auf Text verzichten, brauche ich detaillierte Icons. Das ist von der Größe her schwierig und in vielen Fällen wird es auch nicht mehr selbsterklärend. Auf 30 x 30 Pixel grafisch anspruchsvoll den Unterschied zwischen einem Herd und einem Herd mit Backofen herauszuarbeiten, das wird schwierig.

Genauso bei der Beleuchtung: Will ich auf Text verzichten, muss ich quasi die Leuchte in ihrer Form als Icon abbilden, damit es selbsterklärend wird oder von Gästen bedienbar. Das halte ich für eine komplexe Visu nicht für machbar, außerdem sieht das sicher seltsam aus.

Deswegen für mich:

Relativ Abstraktes Icon, das den Zustand signalisiert, Schaltfläche mit Text

[2ndsky]

Ja, weil Symbole nicht 100% passen und ehrlich, ich habe keine Lust 1000 Icons zu durchforsten.

Außerdem, wenn die Symbole zu detailreich werden, dann ist es nicht mehr intuitiv IMHO. Ich finde z.B. die Symbole von Gira genial. Wenn ich "malen" könnte, würde ich mir solche basteln.

Nicht falsch verstehen @mfd. Ich bin froh, dass es hier jemanden gibt, der eine wirklich umfangreiche Icon Bibliothek gebaut hat, die man frei für sowas verwenden kann. Mir persönlich wären aber weniger und einfachere Symbole wichtiger. Als Beispiel um das zu verdeutlichen das Icon für Flur. In deinem ist da eine Türe, ein Schuhabtreter mit Welcome drauf und ein Schrank in dem Jacken hängen. Gira hat da einfach eine Türklinke mit Schloss darunter. Ist für mich absolut ausreichend. Oder Ankleide... dort hast du einen Schrank mit lauter Details rein gemalt, bei Gira ist's n einfacher Kleiderbügel.

Weil nun aber der Kleiderbügel mehrdeutig sein kann (Garderobe, Ankleide...), brauche ich eine zusätzliche Beschriftung dafür. Dennoch denke ich, ist es so viel intuitiver. Selbst wenn ich zwei Kleiderbügel auf meiner Visu habe, so habe ich IMHO doch schneller identifiziert (zusammen mit dem Text) um was es bei einem Raum geht, als wenn ich mir erst die ganzen Details eines Icons ansehen muss.

Bitte die Kritik nicht falsch verstehen, sie soll konstruktiv sein und hoffe, dass das auch rüber kommt.

EDIT: MatthiasS war schneller

[gaert]

Ich bin eher ein Fan von Szenen - das Schalten von einzelnen Leuchten sollte m.E. eher in den "Admin-Bereich" der Visu verlagert werden.

Damit meine ich nicht, dass alle möglichen(!) Szenen mit hunderten Buttons abgerufen werden können, sondern nur die wirklich sinnvollen - sprich: Szenen, die den Alltag am besten widerspiegeln!

Im Prinzip hat doch jeder so seine Rituale, der typische Tagesablauf ist doch immer recht ähnlich. Zum abendlichen Fernsehgucken wird letztlich immer eine bestimmte Lichtstimmung hergestellt - und zwar jeden Tag die gleiche.

Wenn ich so manch überfrachtete Visu sehe, wird mir regelmäßig schlecht Verwirrt oft mehr, als es nützt. Ich versuche mich da eher an Apple-Produkten zu orientieren und halte alles so minimalistisch wie möglich. Nur ein Beispiel: Temperatur... Interessiert mich wirklich die Temperatur auf's 10tel Grad genau? Ist es wirklich wichtig, ob's draussen 22,5 oder 23 Grad sind? Nein, behaupte ich mal Daher habe ich die Temperaturanzeige ohne Zahlen gelöst - diverse Icons zeigen einfach an, ob alles im grünen Bereich ist quasi.

Von Icons halte ich aber grundsätzlich nicht viel. Warum muss man jedes Utensil (Waschmaschine, Trockner, Herd, Lampe, etc.) krampfhaft mit einem Bildchen symbolisieren? Platz für Text gibt's doch genug Und auch hier tendiere ich eher dazu nicht die einzelnen Geräte zu schalten, sondern "Szenen" (durchaus mit komplexen Logiken) abzurufen. Beispiel Waschmaschine: Diese wird nicht explizit eingeschaltet, sondern es wird eine Szene "Waschtag" aktiviert. Die Beleuchtung der Waschkammer schaltet sich dann bei Bedarf (Dunkelheit) für die typische Dauer der Beladung zu, nach Ablauf von 1,5 Stunden wird mitgeteilt, dass die Waschmaschine fertig ist und ein Hinweis zum Wäscheaufhängen angezeigt. Dieser Hinweis bleibt dann solange bestehen, bis die Wäsche potentiell trocken ist (Aussentemperatur). Dann wird ein Hinweis zum Reinholen der Wäsche angezeigt, usw.

Das Beispiel ist etwas vereinfacht dargestellt - ich habe noch etliche solcher Funktionen gebastelt. Dies ist m.E. gerade der Vorteil eines "intelligenten" Bus-Systems - soviel wie möglich sollte doch der Logik überlassen werden, sonst brauche ich doch kein Bus-System... Ich will nicht, dass in der Visu alle Leuchten angezeigt werden, die man irgendwo vergessen hat - ich will, dass die Logik vergessene Leuchten ausschaltet.

[2ndsky]

Ansichtssache. Die Szenen liegen bei uns auf Tastern, denn dazu will ich nicht jedes mal an die Visu rennen. In der Küche ist also eine Szene für Kochen, im Esszimmer eine für Essen und im Wohnzimmer eine für TV. In dem Bereich hängt aber nur ein Tablet an der Wand zwischen Ess- und Wohnzimmer. Die Visu dann aufzurufen, um für die Küche die Szene Kochen zu aktivieren fände ich blöd.

Wir haben alle wichtigen und regelmäßig genutzten Funktionen auf Tastern. Alles was dann doch mal feingetuned werden muss (z.B. auch um Szenen zu ändern) wird über die Visu gemacht. Daher brauch ich in der Visu keinen Button für die Szene selber (der ist zwar drin, wird aber extrem selten verwendet).

[gaert]

Auch bei mir liegen die Szenen natürlich auf Tastern. In der Visu können darüber hinaus eher Einstellungen vorgenommen werden (Szenen verändern, etc.).

[DerRenovator]

Interessanter ist dass ich mir bis auf 3 Ausnahmen seit gut 4-5 Monaten kein Diagramm mehr angesehen habe. [..]

Diesen Satz möchte ich nochmal hervorheben.

Ich glaube, man neigt dazu, viel zu viel darzustellen. All die Infos, die die teuren Sensoren liefern, sollen natürlich irgendwo ihren Platz finden, und die tollen Features der Visu sollen ihre Verwendung finden. Aber dient das dem Benutzer?

Eine Reduzierung auf das Wesentliche, ohne seine Visu zu überladen, halte ich für die entscheidende Leistung. Auf diesem Weg bin ich selber noch am Anfang...

[2ndsky]

Diagramme und Plots sind toll, um seine Installation zu überwachen und Dinge zu optimieren. Später sind diese jedoch (bis auf wenige Ausnahmen) eher sekundär. Ich möchte diese zwar irgendwo in der Visu aufrufbar haben, aber einen prominenten Platz würde ich dafür nicht reservieren (Platzverschwendung).

EDIT: interessanter sind da eher solche Energieampeln, wo ich auf einen Blick sehen kann, ob sich der Verbrauch auf einem normalen Level bewegt. Wenn dabei etwas aus der Reihe tanzt, kann man immer noch anhand der Plots an unprominenten Stellen in der Visu checken, warum das so ist.

[Axel]

Visu: Schlechtes Design - Gutes Design

Exakt deswegen bin ich ein Freund einer freien Visualisierung. Denn damit liefere ich mich keinen Konzept aus und kann frei die Gestaltung bestimmen aber auch individuelle Anpassungen vornehmen.

Nach dem Motto "weniger ist mehr" Handel ich ebenfalls. Meine Seiten sollen in erster Linie alles darstellen was täglich Verwendung findet. Ohne langes erklären habe ich saubere und einfache Symbole in einer 2D oder 3D Visu. Alles weitere befindet sich in anderen Ebenen, die ich über das Einstellungssymbol Aufrufe. Eine Art Layer.

Der Spagat zwischen Rational und Emotional muss eine Visu und generell APPs erfüllen, damit es auch Spaß macht diese zu bedienen.