Wird schnell mal ein Wireframe von einer bestehenden Website benötigt? Mit dem Bookmarklet Wirify ist das kein Problem und geht mit einem Klick. Das kleine Tool ist sehr hilfreich, wenn vor einem Redesign der Status Quo festgestellt werden soll oder bisherige Entwicklungen, hinsichtlich verschiedener Designparameter (Abstände, Weißraum, Platzaufteilung) überprüft werden sollen.
Die Agentur aperto hat unter dem Titel »Einfach-teilhaben.de im Usability-Test mit Menschen mit Behinderung« einen sehr interessanten Praxisbericht veröffentlicht. Leider sind solche Daten aus der Praxis (wenn Barrierefreiheit und Usability zusammenkommen) recht selten, weshalb der Bericht umso spannender ist.
Nach langer Zeit musste ich mich aufgrund eines Kundenwunsches für eine Website wieder mit dem Thema »Sitemap« auseinandersetzen. Sitemaps, das sind die Gebilde, die dem Anwender einen Überblick über die Struktur einer Website geben und als Navigationshilfe dienen sollen. Gerade bei einer komplexen Website wird gerne eine Sitemap verwendet, damit die mühsam ausgedachte und ausgefeilte Struktur dahinter auch deutlich wird. Zusätzlich wird eine Website gleich etwas für Suchmaschinen optimiert und die Linkdichte erhöht.
Die Visualisierung eines Einkaufskorbes wurde bei IconDock sehr schön gelöst:
Zusätzlich zu den üblichen »In den Warenkorb«-Button, wurde der Kontext des »Ich lege einen Artikel in meinen Einkaufskorb« aus dem Alltag sehr clever in den digitalen Einkaufsprozess übertragen. So kann ich ein Icon per Drag and Drop in den Warenkorb »Dock« ziehen, wo dieses abgelegt wird. Zusätzlich hat der Kunde jederzeit den Inhalt und Wert während des Einkaufs im Blick.
Gleichzeitig ist es ein anderes Erlebnis für den Nutzer, wenn er so einkaufen kann. Es macht einfach mehr Spaß, als nur einen schnöden Button zu drücken. Dies ist natürlich auch weiterhin möglich, wenn die Drag an Drop Funktion z.B. nicht funktionieren sollte. Gerade durch die »Spaß-Funktion« kauft sicherlich der eine oder andere Kunde auch etwas mehr, nur um die Funktion erleben zu können.
Designers are not Programmers: Designer mit Programmierkenntnissen denken meist schon im Designprozess über die spätere Umsetzung im Code nach. Das lässt sich kaum vermeiden. In seinem Blog hat Lukas Mathis recht anschaulich beschrieben, warum genau das schlecht ist. Denn dadurch wird die Möglichkeit gesteigert, dass gute Idee für das User Interface schon im Gehirn verworfen werden. Durch diese Scheuklappen werden meist optimale Ergebnisse im Hinblick auf Usability und User Experience verhindert. Via Martin Labuschin.
Mehrseitige Formulare (auch unter der Bezeichnung »Wizard« bekannt) sind eine gute Möglichkeit, strukturiert und übersichtlich Informationen vom Benutzer abzufragen. Dazu wird das gesamte Formular in kleine, gut zu verdauende Häppchen aufgeteilt und immer nur einzelne Teile dem Nutzer angezeigt. Dadurch können auch Teile mit Informationen aus vorherigen Schritten interagieren und dementsprechend andere Informationen oder Eingabefelder angezeigt werden. Wizard-Formulare eigenen sich daher besonders gut für umfangreiche und komplexe Eingabeprozesse.
Bei Programmierer sind »Design Patterns« schon recht bekannt und sie helfen allgemeine Probleme elegant zu lösen. Denn bei der Arbeit sind Systemarchitekten und Programmierer immer wieder mit alltäglichen Problemen konfrontiert. Auch im Webdesign werden Patterns immer häufiger eingesetzt. Die Lösungen sind meist allgemeingültig und dem Endanwender bereits bekannt. So dass er diese Pattern »wieder erkennt« und somit schneller mit der Website interagieren kann bzw. sich auf dieser besser zurechtfindet. Letztendlich helfen UI-Patterns dem Designer, eine Website zu kreieren die eine wesentlich bessere Nutzbarkeit für den Anwender schafft.
In dieser Liste habe ich elf interessante Ressourcen zu diesem Thema zusammengestellt, die dabei helfen sich in das Thema einzuarbeiten oder Patterns zusammengestellt haben.
Ich bin Christian Beier, 25, ausgebildeter Mediengestalter, Usability-Experte und Ruby on Rails Entwickler aus Potsdam/Berlin.
Mehr zur Person …
In diesem Weblog schreibe ich über Webdesign, Webdevelopment, Social Media, Usability und auch etwas über die Fotografie.
accessibility browser cms css design download ebook font fotografie ie inspiration intern javascript lesenswert medien netzwelt nuetzliches osx photoshop software tutorial webapp webdesign webentwicklung wordpress
Helge am 27.10.2011:
Zend Optimizer unter MAMP 2.x
Can am 18.10.2011:
Wirify: Bookmarklet das aus einer Website einen Wireframe macht
Pama Töckof am 03.02.2011:
IPTC in Photoshop und Aperture