Gestaltung von Benutzeroberflächen
Gestaltungsgrundlagen
Gestaltung
«Because every person knows what he likes, every person thinks he is an expert on user interfaces.»
Paul Heckel
Weil jeder weiss was ihm gefällt, denkt jeder er sei ein Experte auf dem Gebiet der Benutzeroberflächen…
Gestaltung
Es ist nicht möglich, nicht zu gestalten.
Wer gestalten will, muss sehen lernen.
Gestaltungsansätze
! Technische Lösung ! Gestalterische Lösung ! Zufällige Lösung
Es gibt viele mögliche Ansätze, nicht nur ein einziger Ansatz.
Gestaltung
«… Design sollte das Produkt sozusagen zum Sprechen bringen.»
Dieter Rams
Gestaltung
«Design ist innovativ. Gutes Design macht ein Produkt brauchbar. Gutes Design ist ästhetisch. Gutes Design macht ein Produkt verständlich. Gutes Design ist unaufdringlich. Gutes Design ist ehrlich. Gutes Design ist langlebig. Gutes Design ist konsequent bis ins letzte Detail. Gutes Design ist…»
Dieter Rams
Gestaltung
«Design ist innovativ. Gutes Design macht ein Produkt brauchbar. Gutes Design ist ästhetisch. Gutes Design macht ein Produkt verständlich. Gutes Design ist unaufdringlich. Gutes Design ist ehrlich. Gutes Design ist langlebig. Gutes Design ist konsequent bis ins letzte Detail. Gutes Design ist…»
Dieter Rams
Gestaltung
innovativ brauchbar ästhetisch
verständlich unaufdringlich
ehrlich langlebig
konsequent
lösungsorientiert dem Zweck angepasst ansprechend einfach kein Kitsch prätentionslos klassisch durchgängig
Interface Design
Idee entwickeln Interface skizzieren Interface umsetzen
Interface Design
Ideen müssen einfach sein
"Most programmers spend the first 5 years of their career mastering complexity, and the rest of their lives learning simplicity."
Buzz Andersen
Die meisten Programmierer verwenden die ersten 5 Jahre Ihrer Karriere damit die Komplexität zu meistern, und den Rest ihres Lebens damit, Einfachkeit zu lernen.
Interface Design
“Design is not just what it looks like and feels like. Design is how it works."
Steve Jobs
“That's been one of my mantras - focus and simplicity. Simple can be harder than complex: You have to work hard to get your thinking clean to make it simple. But it's worth it in the end because once you get there, you can move mountains."
Steve Jobs
Das war eines meiner Mantras – Fokus und Einfachkeit. Einfach kann schwieriger sein als komplex: Man muss harte Arbeit leisten sein Denken zu befreien um es einfach zu machen. Aber es ist es schlussendlich wert, weil, wenn Du soweit bist, kannst Du Berge versetzen.
Interface Design
Layout
Layout Gestaltungsraster Interpretationsrichtung Weissraum Hervorhebungen Navigation
Workflow
Layout
Layout
Layout
Layout
Topnavigation
Funktionen Inhalt Datenmaske
Logo
Topnavigation
Liste 1 Liste 2 Logo
Ressourcen
Bücher über Typografie, Magazingestaltung, usw. Googlen nach «Gestaltungsraster», usw.
Auch Webentwickler nutzen ähnliche Tools: modulargrid.org grid.mindplay.dk gridpak.com 3x4grid.com
Typografie
Schriftgestaltung
Typografie
Schriftwahl Schriftgrösse Schriftfarbe
Buchstabenabstand Zeilenabstand Zeilenlänge (Spaltenbreite)
Auszeichnungen (Titel, Untertitel, Hervorhebungen…)
Schriftwahl
Erstelle einen Blindtext mit mehreren Zeilen. Nutze diese für die Texteinstellungen in Filemaker.
www.blindtextgenerator.de
Vergleiche Texte miteinander in den gleichen Einstellungen, sowohl auf dem Bildschirm wie im Ausdruck.
Die Verwendung der Schrift ist ausschlaggebend für die Wahl der Schrift.
Jemand musste Josef K. verleumdet haben, denn ohne dass er etwas Böses getan hätte, wurde er eines Morgens verhaftet. »Wie ein Hund! « sagte er, es war, als sollte die Scham ihn überleben.
Als Gregor Samsa eines Morgens aus unruhigen Träumen erwachte, fand er sich in seinem Bett zu einem ungeheueren Ungeziefer verwandelt. Und es war ihnen wie eine Bestätigung ihrer neuen Träume und guten Absichten, als am Ziele ihrer Fahrt die Tochter als erste sich erhob und ihren jungen Körper dehnte.
»Es ist ein eigentümlicher Apparat«, sagte der Offizier zu dem Forschungsreisenden und überblickte mit einem gewissermaßen bewundernden Blick den ihm doch wohlbekannten Apparat. Sie hätten noch ins Boot springen können, aber der Reisende hob
Schriftgrösse Zeilenabstand Zeilenbreite …
Jemand musste Josef K. verleumdet haben, denn ohne dass er etwas Böses getan hätte, wurde er eines Morgens verhaftet. »Wie ein Hund! « sagte er, es war, als sollte die Scham ihn überleben.
Als Gregor Samsa eines Morgens aus unruhigen Träumen erwachte, fand er sich in seinem Bett zu einem ungeheueren Ungeziefer verwandelt. Und es war ihnen wie eine Bestätigung ihrer neuen Träume und guten Absichten, als am Ziele ihrer Fahrt die Tochter als erste sich erhob und ihren jungen Körper dehnte.
»Es ist ein eigentümlicher Apparat«, sagte der Offizier zu dem Forschungsreisenden und überblickte mit einem gewissermaßen bewundernden Blick den ihm doch wohlbekannten Apparat. Sie hätten noch ins Boot springen können, aber der Reisende hob ein schweres, geknotetes Tau vom Boden, drohte ihnen damit und hielt sie dadurch von dem Sprunge ab.
In den letzten Jahrzehnten ist das Interesse an
Schriftgrösse Zeilenabstand Zeilenbreite …
Jemand musste Josef K. verleumdet haben, denn ohne dass er etwas Böses getan hätte, wurde er eines Morgens verhaftet. »Wie ein Hund! « sagte er, es war, als sollte die Scham ihn überleben.
Als Gregor Samsa eines Morgens aus unruhigen Träumen erwachte, fand er sich in seinem Bett zu einem ungeheueren Ungeziefer verwandelt. Und es war ihnen wie eine Bestätigung ihrer neuen Träume und guten Absichten, als am Ziele ihrer Fahrt die Tochter als erste sich erhob und ihren jungen Körper dehnte.
»Es ist ein eigentümlicher Apparat«, sagte der Offizier zu dem Forschungsreisenden und
Schriftgrösse Zeilenabstand Zeilenbreite …
Jemand musste Josef K. verleumdet haben, denn ohne dass er etwas Böses getan hätte, wurde er eines Morgens verhaftet. »Wie ein Hund! « sagte er, es war, als sollte die Scham ihn überleben.
Als Gregor Samsa eines Morgens aus unruhigen Träumen erwachte, fand er sich in seinem Bett zu einem ungeheueren Ungeziefer verwandelt. Und es war ihnen wie eine Bestätigung ihrer neuen Träume und guten Absichten, als am Ziele ihrer
Schriftgrösse Zeilenabstand Zeilenbreite …
Jemand musste Josef K. verleumdet haben, denn ohne dass er etwas Böses getan hätte, wurde er eines Morgens verhaftet. »Wie ein Hund! « sagte er, es war, als sollte die Scham ihn überleben.
Als Gregor Samsa eines Morgens aus unruhigen Träumen erwachte, fand er sich in seinem Bett zu einem ungeheueren Ungeziefer verwandelt. Und es war ihnen wie eine Bestätigung ihrer neuen Träume und guten Absichten, als am Ziele ihrer Fahrt die Tochter als erste sich erhob und ihren jungen Körper dehnte.
»Es ist ein eigentümlicher Apparat«, sagte der Offizier zu dem Forschungsreisenden und überblickte mit einem gewissermaßen bewundernden Blick den ihm doch wohlbekannten Apparat. Sie hätten noch ins Boot springen können, aber der Reisende hob ein schweres, geknotetes Tau vom Boden, drohte ihnen damit und hielt sie dadurch von dem Sprunge ab.
In den letzten Jahrzehnten ist das Interesse an Hungerkünstlern sehr zurückgegangen. Aber sie überwanden sich, umdrängten den Käfig und wollten sich gar nicht
Schriftgrösse Zeilenabstand Zeilenbreite …
Jemand musste Josef K. verleumdet haben, denn ohne dass er etwas Böses getan hätte, wurde er eines Morgens verhaftet. »Wie ein Hund! « sagte er, es war, als sollte die Scham ihn überleben.
Als Gregor Samsa eines Morgens aus unruhigen Träumen erwachte, fand er sich in seinem Bett zu einem ungeheueren Ungeziefer verwandelt. Und es war ihnen wie eine Bestätigung ihrer neuen Träume und guten Absichten, als am Ziele ihrer Fahrt die Tochter als erste sich erhob und ihren jungen Körper dehnte.
»Es ist ein eigentümlicher Apparat«, sagte der Offizier zu dem Forschungsreisenden und überblickte mit einem gewissermaßen bewundernden Blick den ihm doch wohlbekannten Apparat. Sie hätten noch ins Boot springen können, aber der Reisende hob ein schweres, geknotetes Tau vom Boden, drohte ihnen damit und hielt sie dadurch von dem Sprunge ab.
Schriftgrösse Zeilenabstand Zeilenbreite …
Jemand musste Josef K. verleumdet haben, denn ohne dass er etwas Böses getan hätte, wurde er eines Morgens verhaftet. »Wie ein Hund! « sagte er, es war, als sollte die Scham ihn überleben.
Als Gregor Samsa eines Morgens aus unruhigen Träumen erwachte, fand er sich in seinem Bett zu einem ungeheueren Ungeziefer verwandelt. Und es war ihnen wie eine Bestätigung ihrer neuen Träume und guten Absichten, als am Ziele ihrer Fahrt die Tochter als erste sich erhob und ihren jungen Körper dehnte.
»Es ist ein eigentümlicher Apparat«, sagte der Offizier zu dem Forschungsreisenden und überblickte mit einem gewissermaßen bewundernden Blick den ihm doch wohlbekannten Apparat. Sie hätten noch ins Boot springen können, aber der Reisende hob ein schweres, geknotetes Tau vom Boden, drohte ihnen damit und hielt sie dadurch von dem Sprunge ab.
Schriftgrösse Zeilenabstand Zeilenbreite …
Leserlichkeit =
SCHRIFT+ Schriftgrösse + Zeichenabstand + Zeilenlänge + Zeilenabstand
Leserlichkeit =
SCHRIFT+ Schriftgrösse + Zeichenabstand + Zeilenlänge + Zeilenabstand
Jemand musste Josef K. verleumdet haben, denn ohne dass er etwas Böses getan hätte, wurde er eines Morgens verhaftet. »Wie ein Hund! « sagte er, es war, als sollte die Scham ihn überleben.
Als Gregor Samsa eines Morgens aus unruhigen Träumen erwachte, fand er sich in seinem Bett zu einem ungeheueren Ungeziefer verwandelt. Und es war ihnen wie eine Bestätigung ihrer neuen Träume und guten Absichten, als am Ziele ihrer Fahrt die Tochter als erste sich erhob und ihren jungen Körper dehnte.
»Es ist ein eigentümlicher Apparat«, sagte der Offizier zu dem Forschungsreisenden und überblickte mit einem gewissermaßen bewundernden Blick den ihm doch wohlbekannten Apparat. Sie hätten noch ins Boot springen können, aber der Reisende hob ein schweres, geknotetes Tau vom Boden, drohte ihnen damit und hielt sie dadurch von dem Sprunge ab.
In den letzten Jahrzehnten ist das Interesse an Hungerkünstlern sehr zurückgegangen. Aber sie überwanden sich, umdrängten den Käfig und wollten sich gar nicht
Schriftgrösse Zeilenabstand Zeilenbreite …
Jemand musste Josef K. verleumdet haben, denn ohne dass er etwas Böses getan hätte, wurde er eines Morgens verhaftet. »Wie ein Hund! « sagte er, es war, als sollte die Scham ihn überleben.
Als Gregor Samsa eines Morgens aus unruhigen Träumen erwachte, fand er sich in seinem Bett zu einem ungeheueren Ungeziefer verwandelt. Und es war ihnen wie eine Bestätigung ihrer neuen Träume und guten Absichten, als am Ziele ihrer Fahrt die Tochter als erste sich erhob und ihren jungen Körper dehnte.
»Es ist ein eigentümlicher Apparat«, sagte der Offizier zu dem Forschungsreisenden und überblickte mit einem gewissermaßen bewundernden Blick den ihm doch wohlbekannten Apparat. Sie hätten noch ins Boot springen können, aber der Reisende hob ein schweres, geknotetes Tau vom Boden, drohte ihnen damit und hielt sie dadurch von dem Sprunge ab.
In den letzten Jahrzehnten ist das Interesse an Hungerkünstlern sehr zurückgegangen. Aber sie überwanden sich, umdrängten den Käfig und wollten sich gar nicht
Schriftgrösse Zeilenabstand Zeilenbreite …
Jemand musste Josef K. verleumdet haben, denn ohne dass er etwas Böses getan hätte, wurde er eines Morgens verhaftet. »Wie ein Hund! « sagte er, es war, als sollte die Scham ihn überleben.
Als Gregor Samsa eines Morgens aus unruhigen Träumen erwachte, fand er sich in seinem Bett zu einem ungeheueren Ungeziefer verwandelt. Und es war ihnen wie eine Bestätigung ihrer neuen Träume und guten Absichten, als am Ziele ihrer Fahrt die Tochter als erste sich erhob und ihren jungen Körper dehnte.
»Es ist ein eigentümlicher Apparat«, sagte der Offizier zu dem Forschungsreisenden und überblickte mit einem gewissermaßen bewundernden Blick den ihm doch wohlbekannten Apparat. Sie hätten noch ins Boot springen können, aber der Reisende hob ein schweres, geknotetes Tau vom Boden, drohte ihnen damit und hielt sie dadurch von dem Sprunge ab.
In den letzten Jahrzehnten ist das Interesse an Hungerkünstlern sehr zurückgegangen. Aber sie überwanden sich, umdrängten den Käfig und wollten sich gar nicht
Schriftgrösse Zeilenabstand Zeilenbreite …
Jemand musste Josef K. verleumdet haben, denn ohne dass er etwas Böses getan hätte, wurde er eines Morgens verhaftet. »Wie ein Hund! « sagte er, es war, als sollte die Scham ihn überleben.
Als Gregor Samsa eines Morgens aus unruhigen Träumen erwachte, fand er sich in seinem Bett zu einem ungeheueren Ungeziefer verwandelt. Und es war ihnen wie eine Bestätigung ihrer neuen Träume und guten Absichten, als am Ziele ihrer Fahrt die Tochter als erste sich erhob und ihren jungen Körper dehnte.
»Es ist ein eigentümlicher Apparat«, sagte der Offizier zu dem Forschungsreisenden und überblickte mit einem gewissermaßen bewundernden Blick den ihm doch wohlbekannten Apparat. Sie hätten noch ins Boot springen können, aber der Reisende hob ein schweres, geknotetes Tau vom Boden, drohte ihnen damit und hielt sie dadurch von dem Sprunge ab.
In den letzten Jahrzehnten ist das Interesse an Hungerkünstlern sehr zurückgegangen. Aber sie überwanden sich, umdrängten den Käfig und wollten sich gar nicht
Schriftgrösse Zeilenabstand Zeilenbreite …
Farbe
Farbgestaltung
Farbe
Farbe Helligkeit
Farbkontraste Helligkeitskontraste
Farbe
Farbe lenkt hin – oder lenkt ab
Farbe
Farbe
Hervorheben (Orientierung) Führen (Prozesse) Lenken (Optionen)
Wo bin ich? Was mache ich? Wie finde ich zurück?
Ressourcen
Harmonische Farbpaletten finden und erstellen:
kuler.adobe.com/create/color-wheel/ colorschemedesigner.com
Ressourcen
Ressourcen
Die Farbauswahl in Mac erlaubt es, eigene Farbpaletten anzulegen.
Workflow
Interaktionsgestaltung:
- Logischer Programmaufbau - Weniger Felder, Funktionen, usw., dafür workflow-orientiert. - Orientierung - Feedback - Optionen nur da zeigen, wo sie nötig sind
Workflow
Eine Steinskulptur eines Künstlers entsteht dadurch, dass unnötiges Material entfernt wird.
Workflow
Was geschieht in welcher Reihenfolge? Was gehört zusammen? Wie lässt sich das in der Gestaltung abbilden?
Der Schlüssel zu einer besseren Benutzeroberfläche: Fragen stellen, sehen und hören üben.
Workflow
Unser Workflow ist hier vorerst zu Ende…
Gestaltung von Benutzeroberflächen – Grundlagen Karsten Risseeuw, www.kursiv-software.com
Danke für das Bewerten dieses Vortrages
Vielen Dank unseren Sponsoren
Top Related