Sehr zu empfehlen, um schnell etwas mit Mehr(Nähr-)wert zu bekommen. Einfach mal eine Banane schälen und reinbeißen. Quick Win: Kohlenhydrate (von den Guten), Kalium und Ballaststoffe. Mund abwischen.

Ein Thema, das sich kontrovers diskutieren lässt. Wireframes sind in der Tat nicht immer das Architektur-Mittel der Wahl. Aber in sehr vielen Fällen sehr wohl.

Was mir immer aufstößt, sind Pauschalisierungen, ohne Kontext.

Hierzu mal zwei Äußerungen des Autors:

It doesn’t take a good designer long to whip up a Photoshop mockup, and a good coder can create a HTML prototype in a short time too. Both can be reused in the final product (which saves time), and both are much closer to the real experience than a wireframe (which helps make the right decisions).

Mag sein. Aber a) sind Wireframes immer noch schneller und b) können die richtigen Personen auch auf Basis von Wireframes die richtigen Entscheidungen treffen – zum richtigen Zeitpunkt im Prozess. Es gibt natürlich aber auch Fälle und kleinere Projekte, in denen der Wireframe schon zur Kanone gegen den Spatzen mutiert. Es kommt darauf an.

My problem with your point is that because wireframes are so easy to modify, people get obsessed with shuffling things around until they obtain a perfect wireframe, but this really doesn’t accomplish much: a perfect wireframe does not translate into a perfect site, there are just too many factors that are left aside at such an early stage.

Ein perfekter Wireframe ist natürlich keine Garantie für ein perfektes Endprodukt. Ein guter Wireframe trägt aber zu einem soliden Fundament bei. Die Angst vor Leuten, die einen Wireframe zum Anlass nehmen, Dinge immer wieder hin und her zu schubsen, liegt in einer fehlenden Prozess- und Methodenkenntniss begraben. Es kommt darauf an, wann und für wen die Wireframes in Frage kommen.

Hierzu kann ich ein Buch sehr empfehlen. Dan M. Browns “Konzeption und Dokumentation erfolgreicher Webprojekte”. Darin geht es v.a auch darum, wann, in welcher Form man Deliverables (so auch Wireframes) erstellt und wem und wann man sie präsentiert. Das Buch habe ich vor einiger Zeit hier mal vorgestellt.

Erkenntnisse leben dadurch weiter, bleiben nicht unter vielen Worten verschüttet.

Vielleicht auch, weil sich das WLAN rar machte, fiel mir diese Methode besonders ins Auge. Graphic Recording. Hier z.B. zum Vortrag “MakerBot – The Robot That Sharing Built” (makerbot.com) im Rahmen der re:publica 2010.

Anna Lena Schiller macht das besonders gut. Eine imho mehr als interessante Alternative zu oft unüberischtlichen und wenig einprägsamen Meeting-Protokollen.

Brutal mag da etwas übertrieben sein, aber die Statements lassen erahnen, wie umfangreich und komplex das Management einer Website sein kann. Vielleicht habt auch Ihr schon in überraschte Gesichter geblickt, wenn es um Wartungskosten, Aufwände für frischen Content etc. ging. Oder Ihr seid daran verzeifelt, dass in großen Gremien, stundenlang über verschiedene Grüntöne diskutiert wurde.

Der o.g. Artikel listet 28 Punkte und Zitate. Von initialer Bedeutung sind meiner Meinung nach die Punkte:

• Direction bzw. Ownership
• Bunfights (interessanter Begriff) bzw. zu viele Stakeholder
• Speed Kills bzw. Go-Live in Rekordzeit

Gerade Direction und Ownership gilt es zu Beginn und für den späteren Betrieb eindeutig zu klären. Um erstens konsistent sein zu können und zweitens vorwärts zu kommen. Gerade an diesem Punkt scheitern viele Angebote, gerade dann, wenn es um Corporate Websites geht. Das endet oft darin, dass die Besucher einer Website förmlich erschlagen werden. Weil jede Abteilung meint, prominent auf der Startseite vertreten sein zu müssen.

Speed Kills beschreibt den Umstand, dass (leider) oft die Qualität der Inhalte und Usability/Barrierefreiheit, einem schnellen Go-Live geopfert werden.

Obwohl. Vielleicht ist das Managen einer Website doch brutal ;-)

Aber lest selbst: 28 reasons why website management is brutal.

Vor knapp einem Jahr habe ich mal etwas zum Redesign der BBC-Website geschrieben: Webdesign & GUI-Konzepte der Zukunft – Beispiel BBC.

Kürzlich erschienen im BBC-Blog ein Artikel, der die Hintergründe auf dem Weg zum neuen und vereinheitlichten Look der Webseite beleuchtet: A new global visual language for the BBC’s digital services.

However due to the organic way in which the website evolved and the old structure of the business, with dozens of small design teams working independently of each other, the site had a fairly schizophrenic nature once you delved into its depths.

Es begann damit, dass man die einzelnen Seiten einfach mal ausgedruckt und an die Wand gepinnt hat. Aus eigener Erfahrung kann ich diese Methode sehr empfehlen. Sehr schnell offenbaren sich die größten Problemfelder, v.a. in Bezug auf die Konsistenz des GUI und der Elemente, die es pflastern. Ein Ansatz, den ich auch mal in Re-Design Retrospektive beschrieben habe.

Neben dem Wall of Shame Ansatz (Ausdrucken der Seiten), liefert der Artikel weitere sehr interessante Einblicke in den Analyse-, Konzeptions und Designprozess einer großen Nachrichtenwebseite.

Es mag auch bei BBC noch nicht alles perfekt sein. Aber vieles passt. Und es ist v.a. auch interessant zu sehen, wie in solchen Großprojekten gearbeitet und gedacht wird, welche Ziele, Grundsätze und Methoden hinter dem Endergebnis stecken. Es zeigt auch, dass ein solch umfangreiches Angebot nur dann konsistent sein kann, wenn ein Styleguide das Oberflächen- und Informationsdesign in geregelten Bahnen lenkt.

Der Ansatz der BBC ist für mich persönlich das, was ich mir von einem Nachrichtenportal vorstelle. Nur so voll wie nötig und im Endeffekt nicht so extrem überladen, wie man es von den meisten Angeboten im Web kennt. Darüber hinaus habe ich als Nutzer dann die Möglichkeit, die Sache an meine eigenen Bedürfnisse und Vorlieben anzupassen.

Dazu kam es aber trotzdem ;-) Die Diskussion ist – wenn teils auch etwas Pingpong artig geführt – nicht ganz uninteressant. Und offenbart zwischen den Zeilen weitere interessante Aspekte. So z.B. auch den des Einflusses von Redakteuren auf die Barrierefreiheit.

Wenn man aber 10 Redakteure hat, die HTML Code eingeben, wie sie gerade lustig sind, hilft weder das W3C noch ein Validator… ;-)

Stimmt bedingt, wie auch ein folgender Kommentar anmerkt.

Hier könnte einer der zahlreichen zertifizierten Entwickler in Ihrem Haus sicher weiterhelfen und den RTE ordentlich konfigurieren. Das kann schlechten Redakteurscode signifikant mindern.

Stimmt. Aber auch so lassen sich Fehler nie ganz ausschließen. Ein noch so gezielt konfigurierter Editor verhindert nicht alle Fehler. So war es auch bei uns im Fall einer großen Webseite, wo trotz zusätzlicher Schulungen und Guidelines für Redakteure, immer wieder mal Fehler auftraten. Aber auch das ist ganz normal.

Das Zauberwort heißt Qualitätssicherung. Auch eine fertige und zum Startzeitpunkt fehlerfreie Webseite, muss in regelmäßigen Abständen geprüft werden. Nur so lässt sich Qualität halten.

Eine Website ist eben nie fertig. Die Einhaltung von guten Standards und Prozessen ist auch und v.a. im Betrieb essentiell für die Qualität und den Fortbestand einer Webseite.

Also – unabhängig vom Thema Barrierefreiheit – ist es schlicht und ergreifend so: Es gibt keine automatische Hohmpäidsch (Artikel hier im Webzeugkoffer).

Ich habe es dabei v.a. auf die Aufwände für Kommunikation mit dem Kunden abgesehen. Aufwände für den Mailverkehr und Telefonate. Aufwände, die bei der Projektkalkulation – würde ich mal behaupten – oft unterschätzt werden.

Im konkreten Beispiel haben sich bisher 30 Stunden Gesamtaufwand ergeben. Knapp 4 Stunden sind für die Kommunikation mit dem Kunden draufgegangen. Also rund 13% für Kommunikation im Projekt. Wohlgemerkt ein 1:1 Projekt. Ein Kunde, ein Auftragnehmer.

Mir kommt das noch eine Spur zu viel vor und mein Ziel für kommende Projekte wäre, diesen Posten auf unter 10% zu drücken.

Es ist allerdings darauf zu achten, die Kommunikation nicht zu vernachlässigen. Ganz ohne das persönliche Gespräch oder die Mail zwischendurch geht es dann auch wieder nicht. Denn gute Kommunikation hat nämlich auch einen positiven Einfluss auf den Projekterfolg.

Kommunikation ist Arbeitszeit ist Projektaufwand

Bei der Kalkulation eines Projektes ist die Kommunikation fester Bestandteil. In Angeboten findet man diese nicht unbedingt direkt. Sie ist Bestandteil von Angebotspositionen wie z.B. “Projektmanagement-Aufwand”. Oder man hat eine Pauschale, die grundsätzlich draufgeschlagen wird und so in allen Positionen berücksichtigt ist.

D.h. wir müssen entsprechend Aufwände bei der Angebotskalkulation berücksichtigen. Aber auf der anderen Seite müssen wir als Anbieter auch an uns bzw. einer bestmöglichen Kommunikation arbeiten. Schätze ich also 30 Stunden Umsetzungsaufwand (inkl. Konzeption und Beratung), dann schlage ich etwa 4 Stunden drauf (13% aus obigem Beispiel).

Laut meinem oben formulierten Ziel möchte ich aber auf 10% oder darunter kommen. Also 3 Stunden für Kommunikation. Und ich denke, dass sich durch die Berücksichtigung einiger Grundregeln auch die 3-4% rausholen lassen. Ich berechne dann zwar eine Stunde weniger, biete aber auf der anderen Seite vielleicht ganz einfach einen besseren Service und kann einen besseren Preis machen. Gerade dann, wenn meine Kommunikation zielgerichtet und geordnet beim Kunden ankommt.

(Persönliche) Ansatzpunkte für bessere Kommunikation

Ich habe mir ein paar Ansatzpunkte identifiziert, die mir dabei behilflich sein können, zukünftig noch effizienter mit den Kunden zu kommunizieren:

Anfragen gesammelt beantworten: Gerade in der Endphase eines Projekts treten immer wieder Fragen auf oder den Kunden fallen noch kleine Fehler auf. Gerade kleinere Fehler treten oft an verschiedenen Stellen auf, werden aber im Prinzip durch das gleiche Problem verursacht. Daher lohnt es sich, die Anfragen erst mal etwas abzuwarten und dann später strukturiert zu beantworten. Am besten man einigt sich auf ein solches Vorgehen (Fehler beobachten, sammeln, dann Bugfixing)

Eher mal zum Telefon greifen: Ich habe mir angewöhnt, dass ich eine Frage, deren Antwort per Mail voraussichtlich länger als 3-4 Sätze werden wird, lieber gleich per Telefon beantworte.

So viel Erklärungen wie nötig: Ich neige manchmal dazu, Fragen etwas ausführlich zu beantworten. Zwei Probleme: Erstens schreibe ich dann mehr und damit länger. Zweitens kann es passieren, dass ich den Kunden mit allzu ausführlichen fachspezifischen Erläuterungen verwirre.

Kommunikation hat natürlich noch weitere Aspekte. Im größeren Rahmen, also nicht dem kleinen 1:1 Projekt, sind es dann v.a. auch Meetings von Projektteams, die als großer Zeitfresser zu berücksichtigen sind. In solchen Fällen kann der Kommunikationsaufwand durchaus auch mal höher ausfallen.

Nach ein wenig Recherche stelle ich fest, dass es doch einiges an Tipps zum Thema und Ansatzpunkte für Verbesserungen gibt. Daher gibt’s zum Abschluss noch ein paar Links zum Thema schlanke und effiziente Projektkommunikation.

Links zur schlanken Projektkommunikation

• Gesprächsführung in der Kundenkommunikation
• Effektiv per E-Mail kommunizieren
• Goldene Regeln für schlechte E-Mails
• A Little Less Conversation
• The Power of Good Communication

Und nicht vergessen. Auch die Projekt-Deliverables und Dokumentation können ein Ansatzpunkt für die bessere Kommunikation sein. Ich habe das mal am Beispiel Scribbles bzw. Skizzen beschrieben: Scribbles erzählen mehr als tausend Worte

Es besteht Nachholbedarf hin zur weiteren Professionalisierung des Webdesign.

Hier mal eine kleine Sammlung zum Thema, verbunden mit der Frage nach Euren Erfahrungen und Quellen.

Planung, Konzeptansätze und Deliverables

Die gelisteten Artikel liefern nicht den allumfassenden Plan und Konzeptansatz. Aber sie deuten das breite Spektrum und die vielen Betätigungsfelder ganz gut an.

• Basiskoffer für die Reise durchs Netz: Beschreibt was man auf der Projektreise immer bei sich haben sollte.
• Das perfekte Konzept gibt’s natürlich nicht. Aber man kann sich annähern.
• Checklisten für die Projektplanung
• Planning a Website: Bisher sind das zwei Teile (Wireframes und Konzept, sowie Content-Strategie)
• How Much (work) is a Website? A lot!
• User Experience Deliverables

Beruf Webdesigner?

Kann man Webdesigner lernen? Die folgenden Artikel zeigen, woran es noch mangelt und was von Webdesignern heute gefordert wird bzw. auch gefordert werden sollte.

• Webdesigner haben es schwer!
• Das Leistungsspektrum von Webdesignern
• Traumjob Webdesigner – Medienberufe in der Übersicht
• The State of the Web Design Profession
• Web Design Education Sucks

Klar wird auch, dass es nicht den Webdesigner gibt. Man muss auch Schwerpunkte setzen: Webdevigner oder Webdeseloper?

Nicht zu denken an die ganzen Teildisziplinen wie z.B. Informationsarchitektur, Userexperience (UX), etc. Sind das alles Berufsbilder für sich? Kann eine Person das alles abdecken? Nein. Zumindest nicht jedes Gebiet als absoluter Experte. Gefragt sind also auch Kommunikationsfähigkeiten, die dabei behilflich sind, mit anderen zusammenzuarbeiten.

Den Webdesigner gibt es also nicht? Sieht ganz so aus. Es kommt auf die Spezialisierung an und z.B. darauf, ob man eher konzeptionell/analytisch, gestalterisch oder technisch veranlagt ist.

Ein ganzheitlicher Prozess

Webdesign(er) kann mehr ;-) Für neue Leser dieses Blogs verweise ich nochmal auf einen meiner Artikel. Webdesign: Ein komplexer und permanenter Prozess, wo ich im Ansatz aufgezeigt habe, wie umfangreich die Sache ist.

Beim Betrachten eines Wireframes, kam mir heute der Gedanke, dass der “Skizzenlook” seine Vorteile hat. Das kommt natürlich auch auf den Betrachter und die Phase im Designprozess an. Eine Skizze vermittelt direkt den Eindruck von Unvollkommenheit. Genau das kann gewünscht sein.

Occasionally, the designer still feels the need to communicate the interface with a style which invites change by suggesting incompletion. Computer Based Sketchy Wireframes

Das Problem bei cleaneren Varianten besteht darin, dass Laien sie oft mit dem konkret zu erwartenden Design gleich setzen. Nicht selten sind dann Anmerkungen wie z.B. “Das ist aber etwas farblos”. Eine Skizze stellt das von vorn herein klar und man konzentriert sich eher auf die Organisation der Oberfläche.

Foto: flickr

Webdesign: Ein komplexer und permanenter Prozess soll Ausgangspunkt für weitere Artikel gewesen sein. Die darauf folgenden sollen die einzelnen Phasen und Abschnitte näher beleuchten. Es geht zunächst um ihren Beitrag zum Konzept.

Die Analyse einer bestehenden Website und die Inspiration sowie die Beeinflussung durch aktuelle Trends bilden die Ausgangsbasis. Eine Website muss (neu) ausgerichtet werden. Das Ziel besteht darin, auf der aktuellen Basis bereits möglichst viele konkrete Anforderungen und Ideen für einen Neustart zu finden.

Zur Erinnerung die Hauptphasen im Prozess:

• Projektplanung
• Analyse & Inspiration
• Informationsarchitektur
• Webdesign & Usability
• SEO & Onlinemarketing
• Qualitätssicherung
• Betrieb & Management

Die Projektplanung lasse ich in diesem Zusammenhang mal außen vor. V.a. die Phasen 2 und 3 bedienen das Konzept und liefern die zentralen Anforderungen an Webdesign im engeren Sinne.

Analyse und Ausrichtung

Die Analyse erfolgt meist in zwei Richtungen – da oft bereits eine Website vorhanden ist.

• Blick zurück: Re-Design Retrospektive und Qualitative Analyse vor dem Relaunch haben sich bereits damit beschäftigt
• Ziele, Zielgruppen sowie Kunden- und Nutzeranforderungen

Ein Relaunch dient nicht nur dazu, der Website ein neues Gesicht zu geben. Es steckt noch viel mehr dahinter.

Die Ausrichtung

Warum zurückblicken, wenn man doch jetzt alles neu macht? Ganz einfach: Aus Fehlern lernt man. Außerdem deckt eine gezielte Analyse so einiges an Optimierungspotential auf. Ziele, Strategien, Zielgruppen und definierte Szenarien helfen uns dabei, die Ausrichtung zu finden. Jedes Website-Konzept sollte damit beginnen.

Zunächst gleicht man die Zielsetzung der Website mit ihrer ursprünglichen ab. Ist diese noch die Gleiche? Oder haben sich neue Ziele ergeben und sind alte Ziele nicht mehr relevant? Gleiches gilt für die Zielgruppen und weiterführend für die allgemeinen Nutzeranforderungen.

Die Analyse

Die durch die Fragen nach der Ausrichtung gewonnenen Anforderungen nutzt man dann zur Analyse der bestehenden Website. Wo kann sie diese Anforderungen noch erfüllen und wo gibt es Nachholbedarf? Die Ergebnisse dieser Analyse und die zuvor definierten Anforderungen (Ausrichtung) fließen in das Konzept mit ein. Hier sind Szenarien und konkrete Usecases sehr wichtig. Es bringt wenig, sich ziellos über die Website zu klicken und darauf zu hoffen, möglichst viel Futter zu finden.

Was sind Szenarien und Usecases? Es handelt sich bei Usecases, wörtlich übersetzt, um Anwendungsfälle. Szenarien können selbst wiederum mehrere Usecases beinhalten. Um an dieser Stelle nicht zu ausführlich zu werden, reduziere ich das Ganze auf zwei wesentliche Fragen, die man sich stellen sollte:

Auf welchen Wegen und aus welchen Beweggründen kommen die Besucher zur Website? Welche Ziele verfolgen sie, welche Aufgaben werden sie auf der Website zu lösen haben (oder wollen) und welche besonderen Merkmale besitzen sie?

Mit den Antworten darauf im Hinterkopf, ergibt sich ein klareres Bild von der bereits existierenden Website und den konkreten Anforderungen an die neue. An Hand der Szenarien und Usecases lässt sich besser einschätzen, was eine Website leistet und weiter leisten muss.

Inspiration

Ohne den Blick auf aktuelle Trends und Best Practice, geht’s auch nicht. Der Blick über den Tellerrand.

Was ist Inspiration und kann man sie erzwingen? Zum zweiten Teil der Frage: Nein. Verkrampfung blockiert.

Unter Inspiration (von lat.: inspiratio = Beseelung, Einhauchen von „spiritus“ = Leben, Seele, Geist) versteht man allgemeinsprachlich jene mentale Kraft, die neue Ideen hervorbringt.Definition bei Wikipedia

Besser trifft es, sich inspirieren lassen. Die Mentale Kraft schöpfen, die neue Ideen hervorbringt. Und wenn möglich nicht zum Kopieren verleitet! Inspiration beeinflusst ganz stark die Phase, in der Design sichtbar wird und in ästhetischer Hinsicht entsteht.

Hierbei ist man bei weitem nicht auf branchenübliche Webdesigns oder Webdesign Showcases begrenzt. Inspiration liefern auch andere Quellen. Wobei das die Webdevigner unter uns wohl am besten beurteilen können, auf was es hier ganz speziell ankommt.

Weitere Quellen sind z.B.

• Printmagazine
• Fotografie
• Natur
• Architektur
• Inneneinrichtungen
• u.v.a.

Die wirklich kreativen Geister wissen, wo sie sich die nötige Inspiration verschaffen. Vielleicht geschieht vieles aber auch ganz einfach unterbewusst. Manch einer sieht sogar in Visitenkarten eine Art Inspirationsquelle.

Abschließend noch ein paar Worte zu aktuellen Trends. Sie sind wichtig und werden im Regelfall nicht von uns selbst gesetzt. Aber wir müssen hier und da aufsetzen. Zum einen, weil sie neue und verbesserte Methoden hervorbringen, zum anderen, weil man es von uns erwartet, bei gewissen Dingen dabei zu sein. Die Erwartungen setzen dabei nicht nur die Auftraggeber, sondern auch und v.a. die Nutzer und Kunden des Angebots.

Weiterer Lesestoff

Hier verweise ich auf die Links zum Artikel Webdesign: Ein komplexer und permanenter Prozess (im Text und eine Liste am Ende des Artikels).

Ausblick

Analyse und Inspiration bilden das Fundament des Konzepts. Der nächste Teil wird sich dann näher mit der Informationsarchitektur beschäftigen.

Beim Schreiben dieses Artikels haben sich außerdem wieder einige Ansatzpunkte für weiterführende Betrachtungen ergeben. Auch dazu mehr im Rahmen des weiteren Programms.

Foto: Floor concept