Dark patterns – die dunkle Seite des Webdesigns
Veröffentlicht am 23 August 2010 | Keine Kommentare
Darkpatterns.org – eine Seite, die uns klar aufzeigt, wie Webdesign nicht umgesetzt werden sollte und die einige schmutzige Tricks benennt, die einem unwissenden User in den Weiten des Internets begegnen können.
Normally we think of bad design as consisting of laziness, mistakes, or school-boy errors. We refer to these sorts of design patterns as Antipatterns. However, there’s another kind of bad design pattern, one that’s been crafted with great attention to detail, and a solid understanding of human psychology, to trick users into do things they wouldn’t otherwise have done. This is the dark side of design, and since these kind of design patterns don’t have a name, I’m proposing we start calling them Dark Patterns.
Liquid Information Navigation
Veröffentlicht am 19 August 2010 | Keine Kommentare
Zugegebenermaßen klingt die Idee, dass jeglicher Text auf einer Website verlinkt sein kann, also als Hypertext und gleichzeitig als Navigationsersatz fungiert, klingt ziemlich radikal. Ein wenig praxistauglicher angewandt, bietet die Idee des “Liquid Information Navigation” jedoch interessante Möglichkeiten, wie das ReadWriteWeb Blog in seinem aktuellen Design zeigt.
1. Beim Markieren von Text und dem Loslassen der Maus erscheint eine kleine Suchblase.
2. Klickt man auf die Suchblase, wird eine Suche nach dem markierten Begriff durchgeführt und in einem Overlay angezeigt. Dabei wird sowohl auf RWW als auch außerhalb gesucht.
In Wikis ist die “liquide” Art der Textverlinkung als zusätzliche Navigation zwischen den einzelnen Wiki-Artikeln ja auch schon längst durch den User gelernt und akzeptiert.
Im Artikel finden sich noch weitere Beispiele für Liquid Information Navigation – einem Begriff, der sicherlich in Zukunft interessant bleiben wird.
Facettierte Navigation – Strukturierung der Facettenwerte
Veröffentlicht am 20 Juli 2010 | Keine Kommentare
James Kalbach hat eine nette Zusammenstellung von aktuell verwendeten Darstellungen von Möglichkeiten der Wertauswahl bei facettierter Navigation erstellt. Er gliedert sie in:
- Hierarchie (z.B. über eine Baumstruktur)
- Liste (flache Liste von Werten zu einer Facette)
- Binär (oft mit Checkboxen)
- Kontinuum (z.B. über Sliderauswahl oder Direkteingabe von Werten)
- Skala (z.B. als fixe Von-Bis-Werte)
Eine der größten Herausforderungen ist sicherlich die Darstellung von langen Wert-Listen. Ebay löst dies über die Verwendung von “Mehr/Weniger”-Buttons pro Facette, die jedoch durch einen vollen Seiten-Reload das Verlieren des optischen Fokus’ beim User zur Folge haben.

Bei Zappos.com werden die gelisteten Werte einer Facette teils in Tabellen, teils als normale Listen dargestellt, die jedoch in in der Höhe begrenzen, scrollbaren Boxen stecken, was die Bedienung unnötig erschwert und auch optisch grenzwertig aussieht.

Einen recht ungewöhnlichen Weg geht der Shop von Stylus.com, der zum einen auf stark optische Navigation setzt und die Facetten sehr dezent als Dropdown-Reihe über die Produkliste setzt. Auf diese Weise sind die Werte einer Facette platzsparend verstaut, jedoch für den User nicht mehr auf einen Blick scanbar.

Auf dawanda.de wird das Problem der langen Werte-Listen zwar auch nicht konsistent gelöst, jedoch werden Werte, die eine andere Darstellung als Text erlauben, entsprechend anders dargestellt (z.B. die Auswahl von Farben) oder durch entsprechende Icons unterstützt.

Einen weiteren interessanten Ansatz zur Darstellung von Facettenwerten in Listenform stellt das Projekt “Elastic lists” von Moritz Stefaner vor. Als platzsparende Variante kommt es jedoch auch nicht in Frage, erhöht durch die sichtbare Interaktion aber den Spaß beim Bedienen.
Social Networks im echten Leben
Veröffentlicht am 15 Juli 2010 | Keine Kommentare
Eine interessante Slideshow von Googles User Research Lead für Social (Paul Adams), über soziale Netzwerke im virtuellen und echten Leben.
Urlaubslektüre: Neuro Web Design
Veröffentlicht am 11 Juli 2010 | 1 Kommentar
Ich habe im Urlaub endlich mal wieder ausgiebig Zeit zum Lesen gehabt und endlich “Neuro Web Design: What Makes Them Click” von Susan Weinschenk ausgelesen. Das Buch liest sich recht flüssig und teilt sich in 11 Kapitel auf, die dem Leser aufzeigen, welche Teile des menschlichen Gehirns bei bestimmten Entscheidungsprozessen (bewusst und unbewusst) aktiv werden. Dabei werden viele aktuelle Studienergebnisse vorgestellt und stets der Bogen zur konkreten Anwendung im Web Design gespannt. Am Ende von jedem Kapitel gibt es immer nochmal eine nützliche Zusammenfassung der Aussagen.
Ein kurzweiliges Buch, das sicherlich für interessierte Leser manch bereits bekannte Theorie wiederholt, jedoch durch die Aktualität der Studien immer noch etwas Neues zu bieten weiß.
Es gibt außerdem eine Präsentation für diejenigen, die sich das Buch nicht gleich kaufen mögen:
Videoload.de – Barrieren bei der Registrierung
Veröffentlicht am 22 Juni 2010 | 1 Kommentar
Sicherheitsfragen zu erstellen, die dem User gezeigt werden, wenn er sein Passwort vergessen hat, sind ja an sich eine feine Sache. Bei der Registrierung bei Videoload.de haben sich die Programmierer jedoch eine fiese Stolperfalle beim Setzen der Sicherheitsfrage ausgedacht: Die Antwort auf die Frage muss aus unerfindlichen Gründen aus mindestens 6 Zeichen bestehen. Dies erfährt man jedoch erst durch eine Fehlermeldung, die erscheint, wenn man sein Registrierungsformular abschicken möchte:

Es gibt durchaus plausible Antworten auf die verschiedenen Sicherheitsfragen, die weniger als 6 Zeichen enthalten – für den User eine sehr nervige Erfahrung an dieser Stelle und absolut unnötig!
Faceted Navigation – Wie geht man mit vielen Facetten um
Veröffentlicht am 31 Mai 2010 | Keine Kommentare
Dazu hat James Kalbach zwei interessante Blogbeiträge verfasst, in denen er mit vielen verschiedenen Beispielen beschreibt, wie man einer großen Masse an Facetten Herr wird:
> Faceted Navigation: Showing more values (Teil 1)
> Faceted Navigation: Showing more values (Teil 2)
This post is about how to handle the display of values, in particular how to show additional values.
Endlich, endlich…
Veröffentlicht am 28 Mai 2010 | Keine Kommentare
… komme ich meinem Traum-Gerät mit aufrollbarem Monitor einen konreten Schritt näher: Sony zeigt ein aufrollbares, hauchdünnes OLED Display.
Negatives Feedback in Usertests – wie lockt man es heraus?
Veröffentlicht am 25 Mai 2010 | Keine Kommentare
Die größte Herausforderung bei der Durchführung eines User Tests besteht darin, möglichst wertvolle und ehrliche Aussagen des Users über die getestete Oberfläche zu erhalten. User tendieren natürlicherweise dazu, während des Tests aufgetretene Probleme am Ende positiver zu bewerten, als sie eigentlich von ihnen wahrgenommen wurden. Ein paar Tipps und Tricks, wie man die User ermutigt, ehrliche und vor allem ruhig auch negative Antworten zu geben, sind gerade bei UX Booth erschienen.
Have you ever sat in a user testing session, watching a user really struggle with the task at hand only to have them tell you at the end everything was easy and straight forward? How do you encourage these participants to be negative? I’ve discovered a few techniques that might be able to help.
Zusammengefasst sind die vorgestellten Tipps:
- Versichere den Test-Usern, dass du selbst die zu testende Oberfläche nicht entworfen hast (dies nimmt ihnen die Scheu, Kritik zu äußern).
- Mache den Test-Usern klar, dass du die Oberfläche testen willst, nicht sie selbst (dies nimmt ihnen die Angst Fehler zu begehen und sie zuzugeben).
- Gehe mit den Usern im Testprozess schrittweise zurück und sprich sie auf Problemsituationen an, die dir während des Testens aufgefallen sind (dies hilft ihnen, sich am Ende des Tests besser an bestimmte Problemsituationen zu erinnern und diese zu erklären).
- Habe eine weitere Person dabei, die alles protokolliert, das der Test-User tut (dies garantiert, dass du genug Zeit hast, den User durch den Test zu führen und dass trotzdem alle wichtigen Informationen für die Auswertung festgehalten werden).
Radioball
Veröffentlicht am 25 Mai 2010 | Keine Kommentare
Flach ist langweilig – unter diesem Motto wurde dieser Ball-Prototyp entwickelt, der ein UKW Radio samt Bedienungskonzept beinhaltet. Ich mag am liebsten den “Like” Wabenaufkleber für den Lieblingssender, bin aber bei der Staubanfälligkeit des empfindlichen Innenlebens etwas skeptisch.
Teague Radioball from ben collette on Vimeo.

