Digital Web Magazine

Das Digital Web Magazine ist ein Non-Profit-Web-Magazin, das sich an professionelle Webdesigner und -entwickler richtet.

Für das Magazin schreiben hauptsächlich Webautoren und Designer, deren Artikel dann auf der Homepage veröffentlich werden.

Die Macher des DWM haben auf ein einfaches, übersichtliches Layout gesetzt, das das Lesen der Artikel erleichtert. Wenig Werbung, dezente Farben und klare Linien bestimmen das Erscheinungsbild.

Was mir bei dieser Internetseite besonders positiv aufgefallen ist, ist die Sortierfunktion, durch die sämtliche Artikel aus dem Archiv nach gewissen Kriterien geordnet werden. Weder ein dropdown-menu noch eine excelhafte Zeilen/Spalten-Aufteilung finden sich hier.

Die Suchkriterien (Artikel nach „topic“, „date“, „author“, „title“, „type“ sortieren) wurden als Menüpunkte direkt in die Navigation eingebettet. So kann man die Texte besonders einfach auffinden, ohne vorher eine Suchmaske zu Gesicht zu bekommen.
Im Hauptfenster werden die Links zu den Artikeln dann nicht einfach nacheinander angeordnet, sondern zusätzlich gleich gruppiert und mit Kategorie-Bezeichnungen versehen. Das steigert die Effizienz bei der Artikelrecherche.

Video – „Artikel Sortieren“

Citybike Wien – Terminal

Jede/r Wiener/in kennt sie: Die Citybike-Terminals, bei denen man ein für eine Stunde kostenloses Fahrrad ausborgen kann, um damit zur nächsten Bike-Station zu gelangen. Diese 50 baugleichen Bike-Terminals sind quer über das innerstädtische Gebiet an Plätzen mit hohem Menschenaufkommen verstreut.

Startbildschirm
Bevor man überhaupt erst eine Taste gedrückt hat, bekommt man folgenden Screen zu Gesicht:

Hier fällt auf, das die eigentlichen Bedienelemente links (weniger wichtige Optionen) und unten (Optionen zum Ausleihen der Räder, also wichtig) angeordnet sind, wo man sie als Erstuser nicht unbedingt vermuten würde. Einen ziemlich großen Platzbedarf hat der Informationsteil rechts (weißer Hintergrund), der ungefähr alle 8-10 Sekunden wechselt und somit Unruhe ins Design bringt.

Das Design selbst wirkt Frameset-artig, vielleicht wäre es besser gewesen, die häufig benutzten Bedienelemente mittiger anzuordnen, oder präsenter zu markieren. Das Interface-Design wirkt besser/schlechter, ganz je nachdem, welcher Infoteil gerade im Hauptfenster eingeblendet wird.

Startbildschirm – Detailansicht Fahrradausleihe
Der eigentliche Nutzen des Systems verbirgt sich hinter vier verschiedenen Zahlungsmöglichkeits-Buttons – die wohl etwas zu unauffällig mit der Aufforderung „Wählen Sie die Art der Entlehnung“ betitelt wurden.

Dann – Feedback – Das System ruft die vorhandenen (sprich die um das Terminal in verriegelten Radständern stehenden) Fahrräder ab:

Einmal registriert (auch übers Internet möglich), wird man mit eingeschobener Bankomatkarte sofort namentlich identifiziert, Benutzer-ID muss keine eingeben werden:

Man wählt aus den verfügbaren Fahrrädern. Sollte z.B Rad Nummer 3 bereits unterwegs sein, wird die Nummer durchgestrichen mit einem roten X angezeigt, diese kann man dann auch nicht anwählen.

Es folgt eine Passworteingabe, dann kann man das Fahrrad an der Station „entlocken“.

Fazit:
+ unkompliziertes System
+ schnelle Identifizierung
+ Übersichtskarte / mit allen Citybike – Terminals

- Sprachauswahl hat keine Auswirkung auf Infos im Hauptfenster
- nicht ersichtlich auf welchen Terminals noch freie Fahrradplätze sind

VO 2 – guidelines and patterns

Die „10 golden principles“ sind für ui-designer essentiell:

• verwende metaphern
• wahre die ästhetische integrität
• erhalte die konsistenz
• vermittle stabilität
• ermögliche direkte manipulation
• lass die nutzer »sehen und zeigen«
• eröffne einen dialog, gib feedback
• sei tolerant
• keep it simple
• übergib die kontrolle

Diese Prinzipien sind jedoch nicht mißzuverstehen als endgültige Gesetze, denen man als User Interface Designer zu folgen hat. Sie dienen vielmehr dazu, gewisse Fehlerquellen von vornherein auszuschließen, um somit zu vermeiden, in die falsche Richtung zu arbeiten.

Über Metaphern bei Symbolen ist wohl kaum zu streiten, eine falsch gewählte visuelle Signature lässt nicht sofort auf die Funktion dahinter schließen, eine richtig gewählte hingegen schon. Auch die Ideen des Feedback-Gebens und die der direkten Manipulation sind relativ unumstritten – wenn gut umgesetzt – als gutes uid definiert.

Aber: Wie weit dürfen uid-Designer nun wirklich in eine Anwendung (und somit in den späteren Arbeitsablauf des Users) eingreifen? Ein Programm, dem der User ausgeliefert ist, das viele (auch ungewollte) Vorgänge für ihn/sie erledigen will (Stichwort: smarttags) ist wohl genauso wenig zielführend wie eine komplexe, undurchschaubare Anwendung, in dem der User „alleine“ dasteht – ohne Tutorials und Hilfestellungen. Gute ui-Designer handeln immer im Sinne des Benutzers – auch wenn sie mit den 10 golden principles brechen.

In die Zeit eingreifen…

Was haben Videorecorder, Stereoanlage, DVD-Player, Handy, Mp3-Player und Herduhren gemeinsam? Sie alle bieten uns ein Interface, um die Zeitanzeige zweimal jährlich auf Sommer- oder Winterzeit umzustellen. Und sie alle arbeiten mit vollkommen verschiedenen Mitteln.

Fallbeispiel Herduhr (Firma AEG)

Fürs Zeitumstellen beim Herd in meiner Küche brauche ich beide Hände, um damit drei Knöpfe gleichzeitig bedienen zu können. Intuitiv ist das natürlich nicht, da zusätzlich die Symbole äußerst schlecht gewählt worden sind.

Deren gibt es zwar nur vier, trotzdem kommt man bei Gedrückthalten nur eines Knopfes und dem Betätigen des Wahlrades nicht weit – die richtige Kombination aus zwei Knöpfen entscheidet, ob man fortan in der Küche weiter den Sommer- bzw. Winterrhythmus lebt. Somit fordere ich (mit zynischem Unterton): Herde ans Internet!

Lösungsvorschlag:
Wenn man nur das große Wahlrad rechts im Bild betätigt, passiert nichts, es ist mit keiner Funktion belegt, das haben die Hersteller verschenkt. Unabsichtliche Betätigung kann auch nicht der Grund gewesen sein, da sich das Wahlrad mit Widerstand bewegen lässt. Eine wichtige Funktion (z.B. Alarm einstellen) hätte hier noch Platz gefunden, man hätte auf einen Knopf verzichten können.

VO 1 – the good, the bad and the ugly

Die uid-Einführungsvorlesung (ich werde diese Abkürzung von nun an für User Interface Design verwenden) befasste sich mit den grundlegenden Prinzipien des Designs, die anhand von gut, schlecht und furchtbar umgesetzten Software-Designs Beispielen erklärt wurden.

Wie in allen anderen technischen und künstlerischen Produktentwicklungssparten (Architektur, Industrial Design usw.) kann auch in der Softwareentwicklung das Look & Feel darüber entscheiden, ob und wie gerne User mit dem Produkt arbeiten wollen. Hierbei gibt es gewisse etablierte Richtlinien, DO’s und DON’Ts.

Ein paar Punkte, die mir da so einschiessen:

DO’s.
+ Design soll Mittel zum Zweck sein
+ Übersichtlichkeit
+ leichte Bedienbarkeit
+ „sprechendes“, selbst erklärende Betitelungen
+ Funktionen, die der User selten braucht, wichtigeren unterordnen und erst dann zugänglich machen

DON’Ts.
- keine unnötigen Gimmicks
- mit uid-Paradigmen wie OK/Cancel-Buttons brechen
- Error-Message-Jokes (auch wenn für Entwickler noch so lustig)
- unlogische Funktionen
- den User „warten“ lassen, keine Reaktionen zurücksenden
- den User für dumm verkaufen

Ein Gedanke zu den Symbolen (Kapitel 10):
User Interface Design ist dann problematisch, wenn sie sich mit vermeintlich „sprechenden“ Symbolen an verschiedene ethnische Gruppen richtet, die unter Umständen komplett verschiedene Auffassungen von Zeichen haben. Was in Mitteleuropa als höfliche Geste gilt, kann anderswo Entrüstung und Verwirrung auslösen.

Allerdings: Eine standartisierte Welt mit einheiltichen Zeichen/Symbolen und in weiterer Folge uidesigns würde uns doch furchtbar langweilen. So ist es doch viel spannender, dass es (noch) kein Patentrezept für uid in sämtlichen Softwareanwenungen gibt.

resign?

warum der titel resign? was sind die inhalte dieses blogs?
nun, der titel ist doppeldeutig.

resign nicht im sinne von (engl.) aufgeben, sondern der untertitel „REvisiting deSIGN“ ist paradigma dieses design-life-blogs zur LVA user-interface-design auf der TU wien, den ich im wintersemester betreuen/befuellen/hegen und pflegen werde.
revisit (engl.) also übersetzt mit wieder besuchen, nochmal ansehen.

das ist also das ziel. design zu hinterfragen.