Die Website der Agentur New York Webdesign. Sehr stimmiges Webdesign mit vielen kleinen Details, die es zu entdecken gibt.

Der Kulturbanause Jonas Hellwig stellt das Konzept des Zen Coding vor. Nach etwas Einarbeitung und Umdenken im Coding verspricht es bequemeres und schnelleres Coden: Zen-HTML/CSS/Coding: Schneller, besser, cooler!

Was gilt es grundsätzlich bei der Konzeption von Websites und Inhalten für das mobile Web zu beachten? Antworten sucht das Upload Magazin: Publizieren fürs Mobile Web – Grundlagen.

Zwei Artikel zu den Themen Ausbildung und Professionalisierung im Webdesign:

• The Role of College for Web Designers
• The Sorry State of Web Design Education

Informationen im Überfluss. Ganz besonders betroffen sind die Websites der Nachrichtenmagazine und tun sich schwer bei Layout und Informationsdesign: Old News: News Sites.

Auch beim Prototyping ist es ratsam möglichst schnell, möglichst konkret zu werden. Man läuft sonst Gefahr wichtige Details zu übersehen.

In other words, even though you’re doing all the “right” things by prototyping and iterating, are you still leaving out too much detail and falling foul of the Romeo and Juliet effect?The Romeo & Juliet effect, and how it applies to design

Der Screenshot stammt vom Portfolio der Designerin Denise Chandler.

Das kommentierte Paket Links mit hohem Webkrauts-Gehalt.

• Barrierefreiheit beginnt mit Ladezeiten: Diese Barriere betrifft alle!
• Moderne Semantik: Einleitung zur Einführung in HTML5 bei den Webkrauts.
• Was ist ein (HTML-) Fehler und wie schwer wiegt er? Das Streben nach Null
• Non-UX Designers Can Pay Attention to User Experience Too! Ein paar Tipps, wie man schon mit kleinen Schritten großes bewirken kann.
• Prototyping zu praktizieren ist am Anfang schon schwer. Noch schwieriger ist die Etablierung dazugehöriger Prozesse und Methoden in bestehende Designprozesse: Integrating Prototyping Into Your Design Process
• Krieg der Welten könnte man meinen: How Does User Experience Design Fit into Marketing?

Eine Überschrift aus einem der o.g. Artikel hat mir letzte Woche besonders gefallen:

Walk a Mile in The Users Shoes

First Look is a showcase for new features and services that we’re developing for NYTimes.com. The First Look blog gives you the opportunity to talk with our editors and developers – and lets them talk to you.

Beide profitieren von solchen Aktionen. Die Entwickler bekommen Feedback der Leser, das wiederum im Idealfall den Nutzeranforderungen direkt zu Gute kommt. Aber auch für uns Webdevigner oder Webdeseloper kann es ganz interessant sein, wenn andere Einblicke in ihre Methoden und Prozesse gewähren.

Das neueste dort vorgestellte Feature nennt sich Sunday Browsing. So will man dem (v.a.) wochenendlichen analogen Lesevergnügen ein Stück weit näher kommen. Dabei ist man sich natürlich auch der Grenzen bewusst.

Think of it as an attempt to provide the Sunday Times experience anytime. Of course, there are parts we can’t replicate: the satisfying crinkle of the paper; the circular stain of your coffee; the smell of newsprint.

Dieses neue Feature läuft derzeit noch unter dem Arbeitstitel “Article Skimmer” (engl. skimming = dt. blätternd). Es sollen möglichst viele Artikel, auf dem zur Verfügung stehenden Platz des Bildschirms, angeteasert werden. Das soll das Scannen der vorhandenen Informationen erleichtern.

Das Wireframes Magazine ist eine noch kleine, aber bereits sehr feine Quelle zum Thema Wireframes. Die beiden letzten Artikel befassen sich z.B. mit verschiedenen Arten von Wireflows. Wireflows sind eine Weiterentwicklung der “normalen” Wireframes. Im Dezember 2007 habe ich, auf Markup, auf einen Artikel zum Thema Wireflows verwiesen: Documenting the Design of Rich Internet Applications: A Visual Language for State.

Dan Browns Buch beschäftigt sich mit der Erstellung und Präsentation von “Deliverables” wie Wireframes, Sitemaps und Flowcharts für Webdesigner. Es gibt Webdesignern, Informationsarchitekten und Interaktionsdesignern einen praktischen Leitfaden zur Hand. Es geht dabei nicht nur um bessere Ergebnisse aus dem Webdesignprozess heraus. Gerade auch die Beschreibung und Erklärung von Designentscheidungen kann, durch die Befolgung der enthaltenen Tipps, deutlich erleichtert werden. So werden Webdesignprojekte transparenter, für alle am Projekt Beteiligten.

Inhalt

Kapitel eins und zwei beschreiben wichtige Dokumente, die es zu Anfang zu erstellen gilt. Dan Brown beschreibt den Aufbau, Sinn und Zweck der Dokumente, sowie ihren Platz im und Beitrag zum Prozess. Er beantwortet so auch die Frage danach, wann welche Informationen relevant werden, um somit Webdesignprojekte besser strukturieren und organisieren zu können. Er unterteilt die Dokumente in “User Needs Documents” (Stichwort User Centered Design) und “Strategy Documents” (Stichworte Annalyse und Entscheidung).

Das dritte Kapitel, der zentrale Abschnitt des Buches, beschäftigt sich dann mit den, im engeren Sinne, relevanten Dokumenten für den Designprozess: Sitemaps, Flowcharts, Wireframes und Screendesigns.

Er fasst sie als “Deliverables” zusammen. Eine direkte deusche Übersetzung dieses Terms ist, wie so oft, nicht zu finden. Das Wörtebuch schlägt schlicht “Ergebnisse” oder “lieferbare Ergebnisse” vor. Dan Brown definiert sie, für den Kontext des Buches, etwas treffender als:

A document created during the course of a web design project to facilitate communications, capture decisions, and stimulate innovation.

Mehrwert

Dan Brown beschreibt zunächst jeweils den grundsätzlichen Sinn und Zweck der einzelnen Dokumente. Dann geht er auf den Aufbau und verschiedene Variationen ein. So werden viele Leser eigene Methoden darin wiedererkennen. Oder aber auch Ansätze und Anregungen für die Verbesserung eigener Prozesse finden. Ganz nebenbei erhält man damit auch Argumente an die Hand, die es einem ermöglichen, anderen zu erklären, warum man dies und das dokumentieren muss. Denn zu oft stößt man leider noch bei vielen Menschen auf Unverständnis oder sehr sparsame Gesichtsausdrücke, sobald man die Worte Prozess und Dokumentation in den Mund nimmt. Doch kann man gut argumentieren und hat einen Prozess mit einem guten Ergebnis durchlaufen, sind die meisten danach positiv gestimmt.

Metadaten

• Taschenbuch: 368 Seiten
• Verlag: New Riders; Auflage: 1 (14. September 2006)
• Sprache: Englisch
• ISBN-10: 0321392353
• ISBN-13: 978-0321392350

Das Pencil Project liefert ein kostenloses Add-On, das auf der Gecko Engine aufsetzt. Es ist als Plugin für Firefox (ab Version 3) erhältlich und gerade mal 400 KB schwer.

The Pencil Project’s unique mission is to build a free and opensource tool for making diagrams and GUI prototyping that everyone can use.

Eine günstige Alternative, wenn z.B. das Kleingeld für MS Visio oder vergleichbare kommerzielle Software fehlen.

Die Anwendung wird aus dem Firefox heraus gestartet. Die angefertigten Skizzen etc. können dann als PNG-Datei gespeichert und verschickt werden. Die Abbildung unten zeigt einen auf die Schnelle erstellten Wireframe.

Das Tool ist erprobt auf GNU/Linux 2.6 mit GTK+, Windows XP und Windows Vista. Zum Tool: Pencil Project