Entwickler-Ecke :: Thema anzeigen - Wie gestaltet ihr eure GUIs?

digi_c - So 12.03.06 09:38
Titel: Wie gestaltet ihr eure GUIs?

Hallo,

meine Erfahrung zeigt mir, das wir Delphis immer dazu neigen extravagante GUIs zu gestallten, wie sieht den das bei euch aus, haltet ihr euch ganz penibel an die Styleguides oder "klatscht" ihr die Komponenten einfach drauf?

Bei uns ist es z.B. so das die GUI sehr unterstrukturiert ist und teilweise in solchen Fensterausschnitten Toolbars sind, was eigentlich ziemlich komisch aussieht ich aber auch nict wüsste wie es anders gehen soll, da das z.B. Plugins sind. Bei Gelegenheit werde ich mal einen Screenshot anhängen...

JayK - So 12.03.06 10:34

Naja das GUI hängt ja wohl sehr stark vom Programm ab... :?
Jenachdem, was man mit dem Programm machen soll kommen die Kompos irgendwo hin bei mir.
Controls für denselben oder anknüpfenden Aufgabenbereich kommen zusammen (in die eine Ecke ;-)) und die Toolbars sowie das MainMenu sind immer oben ^^
TabOrder wird bei mir ungefähr jedes 4. Release gefixt, nachdem sie zuvor total durcheinander war. ;)

Ich meine, es kommt auf das Programm an.

Gibt es da wirklich Styleguides für? :o wo stehen die? Täte mich mal interessieren, was ich alles "falsch" mache :mrgreen:

GTA-Place - So 12.03.06 11:36

Ich gestalte die GUI so, dass sie gut aussieht und da gehe ich nicht nach irgendwelchen Styleguides.

Motzi - So 12.03.06 12:26

Ich achte schon darauf, dass es gut strukturiert und intuitiv bedienbar ist. Gutes Aussehen hat eher Nachrang! Ich halte mich nicht bewusst an irgendwelche Styleguides, sondern mach es eher nach Gefühl. Im Endeffekt entspricht es aber trotzdem oft im weitesten Sinne den Styleguides..

Gausi - So 12.03.06 12:50

GUIs sind ne Sache für sich, finde ich. Das Problem, das man als Programmierer hat ist es ja, dass man seine eigene Aufteilung für logisch und klar hält, weil man sie sehr gut kennt.
Problem ist es, sich in einen Menschen hineinzuversetzen, der das Programm nicht kennt. Ich versuche, auf einige grundlegende Sachen zu achten.

generelle Übersichtlichkeit. Oben ein Menü, Evtl. eine Toolbar. Unten ggf. eine Statusleiste, in der einige Infos angezeigt werden. Buttons generell nicht zu groß und nicht zu klein, einheitlich beschriftet (fängt schon damit an, ob der erste Buchstabe groß oder klein ist, und nicht mal "Anzeige" (Substantiv) und mal "Erneuern" (Verb) etc.) Desweiteren versuche ich, zueinander gehörende Bedienelemente/Anzeigen in einer Groupbox o.ä. zusammenzufassen, und diese dann übersichtlich auf dem Formular zu verteilen.
Das ist manchmal recht schwierig, da man oft einen Kompromiss zwischen kompakter Darstellung und Übersichtlichkeit wählen muss.
Ein absolutes NoGo ist für mich, dass sich die Form in der Größe verändern lässt, ohne dass der Inhlat darauf reagiert (d.h. es entstehen große graue Flächen oder Teile werden verdeckt). Ebenso unverzeilich (bis auf einige Ausnahmen) ist es, wenn man dem User nicht die Möglichkeit gibt, das Hauptfenster zu verschieben oder in der Größe zu verändern. Ein unabschaltbares StayOnTop oder FullScreen ist ebenso ein Grund, dass Programm sofort in die Tonne zu kloppen, wie auch die aus Programmierer-Ehrgeiz entfernte Titelleiste, sodass man das Programm nur noch über ein Menu oder Alt-F4 beenden kann ("Schaut mal, was ich kann...").
Steuerung. Zu einer guten GUI gehört, dass man sie nicht nur auf eine Art bedienen kann. Grundsätzlich versuche ich, sämtliche Funktionen auf verschiedene Arten anwählbar zu machen. Hauptmenü, PopUp-Menüs, Hotkeys, Buttons, Leertaste, Return, F-Tasten. Eine Funktion, dei beim Doppelklick auf ein Listenelement ausgeführt wird, sollte z.B. auch bei Druck auf die Return-Taste ausgelöst werden. Eine vernünftige Tabulator-Reihenfolge gehört auch dazu (und ja, das vergesse ich auch regelmäßig :oops: ). Prinzipiell sollte der User das Programm so bedienen können, wie er es von anderen Anwendungen gewohnt ist. Ziel sollte es sein, die Anwendung so weit wie möglich nur mit der Maus und nur mit der Tastatur bedienbar zu machen.
Bei Operationen mit Dateien (z.B. ein Bildbetrachter, Rename-Tool, Mediaplayer) halte ich eine Drag&Drop-Fähigkeit vom Windows-Explorer aus für ein absolutes Muss.
Sehr schön finde ich auch, wenn man Gimmicks einbaut, die man nicht auf Anhieb bemerkt, sondern nur im Hintergund arbeiten. Ein Beispiel: Man hat eine sortierte Liste. Drückt der User die Taste "T", wird das erste Element markiert, was mit T anfängt. Hat Null Einfluss auf die Übersichtlichkeit des Fensters, ist aber recht praktisch.
Eingaben und Fehler. Nach Möglichkeit falsche Eingaben von vorneherein unterbinden. Wenn gewisse Funktionen aus unterschiedlichen Gründen gerade nicht ausgeführt werden können/dürfen, dann gehören die entsprechenden Bedienelemente deaktiviert. Ein nichtsbewirkender Klick ist genauso frustrierend wie ein freundliche gemeintes ShowMessage. Soll z.B. eine Zahl eingegeben werden, sollte man im Edit keine Buchstaben erlauben, oder direkt ein SpinEdit nehmen.
Geschwindigkeit. Dauert eine Aktion etwas länger, dann sollte man den User dezent darauf hinweisen. Nicht unbedingt durch ein aufpoppendes Fenster, aber evtl. durch eine Anzeige in der Caption oder in einer Statusbar. Desweiteren ist dann eine Progressbar angebracht, die über den Fortschritt informiert, und eine Abbruch-Möglichkeit des Vorgangs.
Wenn ich im normalen Betrieb das Programm regelmäßig für ein oder zwei Sekunden nicht bedienen kann, ist das schlecht und erzeugt Frust. Ein regelmäßiges "keine Rückmeldung" ist tödlich.
Speicherung. Bei komplizierteren GUIs halte ich es für sinnvoll, die ggf. vorgenommenen Änderungen des Users zu speichern und beim Neustart zu übernehmen. Dazu gehört z.B. die Fenstergröße und Position, sowie die Größenverhältnisse innerhalb der Form (d.h. z.B. die Splitter-Positionen).

Ob das nun einem offiziellen Style-Guide entspricht - keine Ahnung. Das ist das, was sich bei mir im Laufe der Zeit als sinnvoll herausgestellt hat.

digi_c - So 12.03.06 20:19

Ich muss nochmal schauen, im MSDN gibt es ein komplettes Buch aber schaut mal unter Suche im MSDN

UI GUIDE

Obwohl sich MS meiner Meinung nach selber nicht sonderlich an die eigenen Vorgaben hält, siehe MS Office Oberfläche, das neue XP Sidebar Konzept, die sich laufend verändernden Explorer Sichten,...

Ich persönlich probiere so gut wie möglich die Standart Win Controls zu nehmen und nicht mir selber welche zu malen (meistens sind die nicht wirklich 100% Einstellungsunabhängig, Stichwort veränderte Win Farbschemas). Anordung so wie ich denke gegliedert mit Tabs,.... Von irgendwelchen bunten Bildchen halte ich nicht sehr viel, der Anwender soll damit gut arbeiten können *basta* meine Coolness tobe ich lieber im About Dialog aus ;)

GTA-Place - So 12.03.06 20:30

http://www.guidebookgallery.org/
Da gibt's noch nette Screenshots ;-)

Delete - Mo 13.03.06 12:10

In erster Linie funktional an den Standards orientiert und bei kleinen Tools kommt mein weißer Banner oben hin als Erkennungsmerknmal. Halte ich übrignes auch für wichtig, wenn man seine Programme bekannt machen will.

digi_c - Di 14.03.06 10:15

Danke GTA-Place,d er Link ist wirklich anschaulich :D

Ich meinte den hier: http://msdn.microsoft.com/library/default.asp?url=/library/en-us/dnwue/
http://www.openusability.org kennt vielleicht auch nicht jeder.

Gausi kann ich zu 100% zustimmen, so geht es mir auch lieber das einbauen, was man selber nützlich findet als irgendwelche "coooolen" Grapischen Gimmicks einzubauen. Aber stimmt schon wenn man wochenlang an einem Programm feilt verliert man den Blick dafür.