3. Wie plant ihr eure Benutzeroberfläche für eure Anwendung?

Wie plant ihr eure Benutzeroberfläche für eure Anwendung?

  • ?

    Hi,

    ich habe vor ein kleines Programm zu schreiben und
    bin nun am überlegen wie ich die Oberfläche aus der Benutzersicht
    am besten gestalte.
    Zum programmieren nehme ich fertige GUI Tolkits, aber das soll jetzt nicht das Thema sein, mit geht es eher um die gestalterische Anordung der Oberfläche.

    D.h. ich überlege mir gerade wo ich
    in meinem Programmfenster Buttons hinsetze, wo Schalter, was die können sollen
    und wo und was ich alles in Untermenüs und Co setze.

    Daher eine frage an euch.
    Habt ihr da ein paar Tipps so daß am Ende eine gute übersichtliche Programmoberfläche herauskommt?

    Wie plant ihr so etwas?

    Nehmt ihr einen GUI Builder und baut damit testweise mal ein paar
    Konzepte zusammen oder zeichnet ihr kurz Skizzen die die Programmoberfläche Schritt für Schritt aufzeigen?

    Oder noch schlimmer und progammiert ihr einfach ohne Konzept drauf los
    und paßt es dann hinterher an?

    Würde mich mal interessieren wie ihr an die Sache herangeht.

    0
  • ?

    Tjo,

    also das gute bei GUI Buildern ist ja, das man hier sehr das Layout auch nachträglich ändern kann (zumindest im selben Formular).

    Von daher kann man es sich hier noch leisten, "drauf los" zu gestalten.
    Erst recht bei kleinen 1 Mann-Projekten.

    Die Funktionsfähigkeit des Programms ist ja schon vorüberlegt.

    Man muss natürlich überlegen, für wen man das Programm schreibt.
    Für mich selbst, bzw. Anwender mit ähnlicher Arbeitsweise:
    Da kann man ja On-The-Fly überlegen, wo man jetzt am liebsten Draufklicken würde für die Funktion.

    Ansonsten musst du wohl jemandem aus dem Endanwenderkreis über die Schulter schauen beim Test, wo er klemmt.

    Generell ist es ja schön, dass man nicht im luftleeren Raum anfangen muss.
    Jeder Entwickler ist ja selbst auch schon Anwender gewesen.
    -Mit welchen Programmen arbeitest du am liebsten?
    -Wieso empfindest du das Arbeiten dort als angenehm?

    Und dann gibt es noch einige Artikel zu dem Thema GUI-Entwicklung:
    Da werden dann solche Dinge erläutert wie Metaphern-Links und dass Bedienelemente nach vorraussichtlichen Arbeitsschritten in Leserichtung angeordnet werden sollten.

    0
  • P

    Man kann sich auch die verschiedenen Style-Guides fuer GUI's anschauen, z.B. von Microsoft (in der Platform SDK Dokumentation), oder auch fuer fremde Betriebssysteme wie AmigaOS (Amiga User Interface Style Guide; das ist/war einer der besten), oder von MacOS / MacOS X.

    0
  • R

    Folgender Thread dürfte interessant sein: Software-Ergonomie/GUI-Gestaltung

    0
  • C

    Moin Moin

    Oftmals wird das Aussehen der Applikation durch den Kunden bzw. durch die Konventionen der Firma vorgeben.

    Aber mit einer guten GUI steht oder fällt der Sinn eines Programmes. Ich kann nur empfehlen diesen Punkt nicht zu unterschätzen.

    cu CodeHure

    0
  • S

    Das beste was man machen kann ist IMHO

    Software should be designed neither for users nor by them, but rather with them.

    bezieht sich natuerlich nicht nur auf die Oberflaeche 😉

    Wichtig ist, dass das GUI moeglichst unabhaengig von der Funktionalitaet ist (Doc/View, MVC und Co lassen gruessen), denn man muss das Interface auch noch sehr spaet aendern/anpassen koennen. Und so kann man auch schon funktionalitaet implementieren ohne auf die Designer warten zu muessen...

    0
  • ?

    Shade Of Mine schrieb:

    Wichtig ist, dass das GUI moeglichst unabhaengig von der Funktionalitaet ist (Doc/View, MVC und Co lassen gruessen), denn man muss das Interface auch noch sehr spaet aendern/anpassen koennen. Und so kann man auch schon funktionalitaet implementieren ohne auf die Designer warten zu muessen...

    Und wenn man das so machen will, wie geht man da am besten vor?

    Wie macht man das GUI möglichst unabhängig vom darunterliegenden Code?

    Gibt es dazu irgendwelche Tutorials, Einführungen dazu?

    Reichen z.b. Funktionsaufrufe zum abstrahieren aus?

    So daß dann, wenn ich also einen Button klicke folgt,
    rufe Funktion XY aus

    also so:

    Pseudocode:

    int main()
{
  if (ButtonPressed(12));  // 12 = Button Name 
    machDies(Funktion12); // 
  ....
}

machDies(int x)
{
  if x == Funktion12
    Funktion12(); // rufe Funktion 12 auf
  return 0;
}

funktion12()
{
 mach irgendwas....
}

    Kann man das so machen, oder geht das eleganter?

    0
  • S

    Gui Design? schrieb:

    Und wenn man das so machen will, wie geht man da am besten vor?

    Schau dir mal Document/View und Model-View-Controller an
    Das sind Konzepte wie man diese abstrahierung durchfuehren kann.

    Wie macht man das GUI möglichst unabhängig vom darunterliegenden Code?

    Du eliminierst jegliche Businesslogik in den Views. Hoert sich simpel an, ist es aber nicht immer 😞

    Gibt es dazu irgendwelche Tutorials, Einführungen dazu?

    Ich kenne leider nur: http://fara.cs.uni-potsdam.de/~kaufmann/tuts/mvc.pdf
    In OOP Fuer Dummies ist auch ein schoenes Beispiel drin. Aber nur fuer MVC lohnt es sich natuerlich nicht das Buch zu kaufen, aber vielleicht mal in einer Bibliothek reinschnuppern und das Gras/Schaf/Wolf-Spiel ansehen.

    Reichen z.b. Funktionsaufrufe zum abstrahieren aus?

    Ein erster Ansatz, aber reichen wird es nicht.

    Kann man das so machen, oder geht das eleganter?

    Ja, zum Glueck geht es eleganter. 🙂

    Schau dir in meinem Tutorial mal das TicTacToe an: http://tutorial.schornboeck.net/dl/tictactoe.zip
    Ist zwar weit davon weg perfekt zu sein, aber du wirst sehen, dass man die Visualisierung von der Businesslogik vernuenftig trennen kann.

    0
  • ?

    Ich werde mir das Tutorial mal ansehen.

    Danke für die Tipps. 🙂

    0
Anmelden zum Antworten