Infografik: Die Anatomie einer perfekten Website
Drüben im Hubze-Blog hat Scott Ayres die Infografik The anatomy of a perfect website von R.O.I.Media geposted. Ein gelungene Ansammlung und Gegenüberstellung von ganz verschiedenen Aspekten der Website-Produktion.
Wer übrigens solche Infografiken ähnlich gerne mag, wie ich, kann ja auch mal das Pinterest-Board Marketing & Social Media von Priit Kallas abonnieren … darüber bin ich nämlich auf diese Grafik gekommen.
von Matthias Zellmer
myBalsamiq – Online Wireframing
Schon lange ist bin ich ein großer Freund und eifriger Nutzer des Wireframing-Tools balsamiq (früher Balsamiq Mockups). Es ist für mich als Web-Architekt einfach das Desktop-Wireframing-Tool meiner Wahl.
Kürzlich wurde die Online-Version des Tool myBalsamiq überarbeitet. myBalsamiq ist dadurch zu einem Kollaborationswerkzeug aufgewertet worden. Für die Menschen mit denen man die einzelnen Wireframes teilt, kann man durch vier verschiedene Modi (private, website, blog und wiki) deren Zugriffsmöglichkeiten regulieren. Am eingeschränktesten ist der Zugriff bei private und am freisten bei wiki. Weiter können Wireframes kommentiert werden, Gruppendiskussionen sind möglich, auch per integrierter Skype-Funktionen und eine Versionierung gibt es auch. Die Zusammenarbeit kann zudem in verschiedenen Projekten organisiert werden.
von Matthias Zellmer
Tool-Tipp: Balsamiq Mockups
Persönlich mag ich ja lieber den Ausdruck Wireframe, aber das Synonym Mockup ist auch okay. Vor allem wenn er zur Benennung eines so interessanten Tools wie Balsamiq Mockups herhalten darf.
Das Interessante an Balsamiq Mockups ist, dass die Wireframes die man dort zusammenstellt das Aussehen eines Papier-Wireframes haben. Das nimmt den Wireframes die Anmutung des Fertigen. Dies hilft, sie auch vom Look & Feel her am Beginn des Entwicklungszyklus zu platzieren. Was möglicherweise ein paar grundlegende Erläuterungen zur Einordnung im Bezug auf die in dieser Projekt-Phase noch nicht wirklich möglichen Vollständigkeit der dargestellten Elemente und Funktionalitäten erspart. Auch finde ich die zur Verfügung stehenden Wireframe-Elemente (Controls) recht gut ausgewählt. Ein paar kleine Beispiele:
Weitere Komponenten und Design-Patterns wie etwa ein Facebook oder ein Menus- und Buttons-Set gibt es auf der Site mockupstogo.net. Wie man eigene Controls erstellt, hat sich mir noch nicht ganz erschlossen, aber fürs Erste sollten die vorhandenen für die allermeisten Anwendungsfälle reichen.
Die Desktop-Variante von Balsamiq Mockups basiert auf Adobes AIR-Technologie und für 79$ kann man die nervigen Kauf-Erinnerungen eliminieren, die alle 5 Minuten aufpoppen. Eine Investition, die sich lohnen könnte. Ich werde Balsamiq Mockups bei einem der nächsten Projekte auf jeden Fall mal intensiver testen.
von Matthias Zellmer
Das UXcamp – ein kurzer persönlicher Rückblick
Samstag und Sonntag war ich auf dem UXcamp in Berlin. Was ein UXcamp ist, hatte ich ja schon vergangenen Donnerstag grob beschrieben. Und um es gleich vorweg zu sagen: Das Wochenende war echt anstrengend, aber es hat sich mehr als gelohnt. Die Organisation war super und die Sessions, zu denen ich gegangen bin, durchweg interessant und lehrreich. Auf keinem der Barcamps, die ich zuvor besucht habe, habe ich die Qualität der Sessions als so konstant hoch in Erinnerung. Das spricht eindeutig dafür, dass das Konzept der Themen-Barcamps durchaus viel Sinn macht.
Besuchte Sessions am Samstag
Nach der großen Vorstellungsrunde und der Session-Planung am Samstag früh, bin ich zuerst zur Session “Visual Modelling in UCD Process” von Holger Deist gegangen. Holger, der bei SAP arbeitet, hat die Methoden der nutzerorientierten Gestaltung vorgestellt, wie sie bei SAP Anwendung finden. Diesen Einblick in die Arbeitsweise eines so großen Konzerns fand ich sehr eindrucksvoll und war Holger auch dankbar, dass seine Session nicht mal ansatzweise eine Werbeveranstaltung für SAP war. Das sich alle Firmenvertreter im Bezug auf das Repräsentieren ihres Arbeitgebers sehr charmant zurückgehalten haben, ist generell eine Tatsache, die mir auf dem UXcamp im Vergleich zu anderen Barcamps sehr positiv aufgefallen ist.
Sehr überrascht hat mich die Session “Besuchte Hyperlinks” von Marian Steinbach. Anhand der wirklich simplen Problem- bzw. Fragestellung “Wie soll man es im Bezug auf Design vs. Usability mit der Kennzeichnung von besuchten Hyperlinks halten?” wurden sehr viele die User Experience betreffende Punkte durchgesprochen.
Nach der Mittagspause ging es dann weiter mit der Session KISS-Prinzip angewendet bei Doodle von Reto Lämmler. Interessant fand ich hier die Methodik, wie man bei überfrachteten Benutzeroberflächen ggf. überflüssige Features herausfinden kann: “Kill a feature! Welches wäre deins?”.
In der Session “Agile Methoden” von Elizabeth Whitworth, die diesbezüglich auf das agile Vorgehensmodell Scrum setzt, wurde ziemlich viel diskutiert. Dabei vor allem über die Fragestellung, wie man mit Änderungen bei besprochenen konzeptionellen Anforderungen im schon laufenden Entwicklungsprozess (Grafik/Code/…) reagiert bzw. damit umgeht. Ein Teilnehmer berichtete zudem, dass sie bei allen Projekten 30% der Zeit für Change Requests und 20% zur Fehlerbehebung (Bugfixing) einplanen. D.h. die Hälfte der Projekt-Kapazität fließt in nicht geplante Tätigkeiten. Im Bezug auf Qualität, Budget und Einhaltung von Terminen hätten sie mit der Vorgehensweise sehr gute Erfahrungen gemacht.
Meine letzte Session des Samstags drehte sich ums Thema “Prototyping Tools und Methoden – Was nutze ich wann?” und wurde von Volker Gersabeck angeboten. Zu Beginn wurden grundlegende Methoden gesammelt und dann die einzelnen Tools daraufhin abgeklopft, ob und wie gut man diese Methoden mit dem jeweiligen Tool anwenden kann.
Besuchte Sessions am Sonntag
Nach einer netten kleinen Party am Samstag Abend ging es dann am Sonntag nicht weniger motiviert weiter. Zumindest bei denen, die da waren, denn die hohen Teilnehmerzahlen vom Samstag waren auch auf dieses Barcamp nicht zu halten. Während Samstag geschätzte 250 Leute da waren, glaube ich, dass Sonntag maximal 200 Teilnehmer den Weg ins schon ein wenig abgelegenen Erwin-Schrödinger-Zentrum der HU Berlin gefunden habe.
Gleich meine erste Session nach der Session-Planung am Sonntag hat mich sehr beeindruckt. Stefan Freimark hat darin über die Methoden in der Website-Konzeption referiert und mir sehr häufig aus der Seele gesprochen, wenn er die kleinen Problemchen im Konzepter-Alltag beschrieben hat. Auch konnte Stefan mir ein paar für mich sehr interessante Lösungsansätze mit auf den Weg geben.
Die Session von Tobias Glawe drehte sich um “Key Visuals und Visual Hotspots in Werbung und Design” und zeigte sehr praxisnah, wie mit dem bewussten Setzen von Aufmerksamkeitsfängern gearbeitet werden kann. Tobias zeigte vor allem anhand einer Passionata-Kampagne von vor 2 Jahren, wie die von dem Unternehmen anvisierten Zielgruppen mit der Kampagne umgegangen sind.
In der gemeinsam von Lisa Wenzel und Daniel Herding gehaltene Session “Prototypen mit Visio & Acrobat (Lisa Wenzel) / Protoreto: Digitalisierte Papierprotoypen mit Capture & Replay“, zeigten die beiden an Beispielen aus der Praxis, wie in ihren Teams mit den unterschiedlich Tools gearbeitet wird. Die beiden bestärken mich in der Erkenntnis, dass es im Endeffekt mehr auf Methoden als auf Tools ankommt. Leider bildete diese Session auch schon meinen persönlichen UXcamp-Abschluss. Denn leider wurde wohl irgendwann im Laufe des Tages die Session Axure angucken nach vorne verlegt, ohne dass ich es mitbekommen habe.
Fazit
Einer meinen beiden einzigen Kritikpunkte am UXcamp ist, dass mir eine mir wichtige Session durch ihre Vorverlegung durch die Lappen gegangen ist. Aber das ist dem Barcamp-Prinzip der sich selbst organisierenden Konferenzen geschuldet. Aber ich bin gerne bereit diese Tatsache zu akzeptieren, denn die Veranstaltung von Konfernzen nach im Barcamp-Prinzip ist ansonsten sehr vorteilhaft. Leider haben wieder einige Leute sich angemeldet und sind dann einfach nicht gekommen. Was auf der einen Seite legitim ist, aber unfair jenen gegenüber, die nicht mehr auf die auf 300 Personen beschränkte Teilnehmerliste gekommen sind und auf der Warteliste standen.
Was mir neben der hohen fachlichen Qualität wirklich positiv aufgefallen ist, dass die die Anzahl derer, die auf Barcamps gerne auch mal als Touristen (“Ich schau mir mal die Stadt an …”) bezeichnet werden, mir als relativ gering erschien. Wobei es ja auch durchaus okay ist, sich mal zwischendurch ein wenig zurück zu ziehen, da die meisten dort ja ihr Wochenende opfert. Auch ein voller Erfolg war das UXcamp unter dem Networking-Gedanken. Ich habe sehr viele gute Gespräche mit sehr kompetenten Menschen führen dürfen.
Alles in allem bin ich sehr zufrieden vom UXcamp abgereist und werde gerne wiederkommen, sollte es in 2010 wieder ein UXcamp geben. Vielen Dank auch noch mal an das Orga-Team. Ihr habt wirklich tolle Arbeit geleistet!
von Matthias Zellmer
Grimme Online Award 2009 – Nominierung für “Von Zeit zu Zeit”
Ach! Wie schön! Von Zeit zu Zeit, die Geschichtswerkstatt der Stuttgarter Zeitung ist für den Grimme Online Award 2009 in der Kategorie “Wissen und Bildung” nominiert. Das freut uns nicht nur für die Stuttgarter Zeitung … die die tolle Idee hatte, Stuttgarter Stadt-Geschichte anhand von Fotos, Dokumenten, Erzählungen und Videoaufnahmen im Web zusammenzutragen, dort auch darzustellen und mit Hilfe des Stadtarchivs Stuttgart auch nachhaltig zu bewahren … sondern auch für uns. Wir haben nämlich konzeptionell helfen dürfen, die Idee webfähig zu machen und dann auch grafisch zu gestalten.
Auf der Nominierungsseite heißt es:
“Von Zeit zu Zeit” wurde als Geschichtsportal zum Mitmachen von der Stuttgarter Zeitung initiiert. Kooperationspartner sind das Stadtarchiv und die Volkshochschule Stuttgart. Neben Beiträgen, die von der Redaktion zur Verfügung gestellt werden, sind alle interessierten Nutzer – ob Privatpersonen, Vereine oder Schulklassen – eingeladen, die “Geschichtswerkstatt Stuttgart” mit eigenen Fotos, Filmen und Texten zu bereichern. Nach Themen, Orten oder Zeiten strukturiert soll sich so ein umfassendes und lebendiges lokalhistorisches Portrait entwickeln – vom Beginn des 20. Jahrhunderts bis heute.
Das ist mal wirklich eine schöne Anerkennung für die eigene Arbeit. Ich freu mich :-)
von Matthias Zellmer
Qipit – Keep it. Share it.
Sie sind mal wieder auf einer Tagung oder in einem Business-Meeting und möchten gerne die Skizzen und Aufschriebe auf den Whiteboards oder Flipcharts als handliche Ausdrucke haben? Kein Problem! Nehmen Sie einfach Ihr Mobiltelefon zur Hand, fotografieren Sie das gewünschte Motiv und senden Sie eine MMS oder E-Mail an Qipit. Im Handumdrehen generiert Ihnen dieser Dienst ein tonersparendes, druckbares PDF-Dokument.
So oder zumindestens so ähnlich würde sicherlich die Marketing-Abteilung von Qipit ihren Dienst bewerben…
Einen Erfahrungsbericht eines Qipit-Testers gibt es hier.
Die “Computerwoche” erwähnt Qipit bereits im Zusammenhang mit den “besten Web 2.0 Tools für die tägliche Arbeit”.
von Simon Schmid
Was zum Teufel ist User Experience?
Mein Telefon braucht nicht schön zu sein oder so. Man muss damit Telefonieren können … Punkt aus! –– Okay, dann können wir ihr jetziges Gerät ja gegen ein baugleiches mit einem rosa Plüsch-Bezug austauschen. –– Sind sie verrückt! Sowas kommt mir nicht ins Haus!
Dieses fiktive Gespräch habe ich so ähnlich mal auf einer Veranstaltung zum Thema Usability in einem Vortrag über User Experience (UX) gehört. Es ist etwas überspitzt formuliert, da es als Anekdote eine Art “Hallo-Wach!”-Effekt bei den Zuhörern haben sollte. Aber es zeigt schon mal, dass UX nicht mit einem hübschen Design gleichzusetzen ist.
Hinter UX steht ein breiter interdisziplinärer Ansatz. Wenn eine Website als Beispiel optisch gefällt, dann ist das der UX erst einmal nicht abträglich. Aber das Bemühen um eine optisch ansprechende Website kann wiederum der Usability abträglich sein. Wenn etwa durch ein in der CI festgeschriebenes Gestaltungsraster inhaltlich zusammenhängenden Elementen nicht zusammen dargestellt werden können, dann kann dies die Gebrauchstauglichkeit, aber auch die Gebrauchsfreude einschränken, weil man dadurch einfach nicht zu Potte kommt. Und wenn auf der anderen Seite eine gut bedienbare Website die Augen quält, dann macht deren Nutzung auch kein Spaß.
UX steht also sowohl mit der Usability wie auch mit der Gestaltung in einem direkten Zusammenhang. Aber auch solche Aspekte, wie die Reaktionszeit beim Seitenaufbau, der angemessene Einsatz von multimedialen Elementen und natürlich auch von Werbeelementen stehen in einem Kontext mit der UX.
Im Kern geht es bei der UX im Web-Bereich um eine gute … ein besseres bzw. wertfreieres Wort fällt mir dazu nicht ein … also um eine gute Gestaltung von User Interfaces. Denn nichts anderes sind moderne Webseiten in der Regel. Aber “gut” ist hier auch im Sinne von zielführend und dem Nutzer einen Mehrwert bietend gemeint. Denn der oft im der UX in Verbindung gebrachte “Joy of Use” sollte nicht unbedingt als Spaß an der Nutzung missverstanden werden. Es kann auch sehr befriedigend sein, wenn man einfach nur schnell an eine gesuchte Information kommt.
Wie schlecht sich die UX in ein Bewertungsraster pressen lässt, zeigt auch ein schöner Spruch, der im Bezug darauf die Runde macht:
Listen to your users, but ignore what they say.
Heißt: Deine Nutzer werden dir nicht sagen können, was sie im Bezug auf deine Website von dir erwarten, aber wenn du aufmerksam bist, wirst du es schnell herausfinden können.
von Matthias Zellmer
PIM?
PIM ist wichtig, PIM ist gut. Aber was ist PIM? Und was haben Kartoffeln mit PIM zu tun?
Soviel schon mal vorneweg: Das P in PIM steht nicht für Potato. Alles Weitere kann nun in einem kurzweiligen 27-seitigen eBook zum Thema PIM von Alexa Wackernagel alias Webstyler nachgelesen werden.
PS: PIM steht für Produkt-Informations-Management
von Matthias Zellmer
Von Zeit zu Zeit
Mit Von Zeit zu Zeit hat die Stuttgarter Zeitung zusammen mit dem Stadtarchiv Stuttgart und … uns *smile* … ein neues Webprojekt gestartet.
Von Zeit zu Zeit soll die Geschichte der Stadt Stuttgart aus Sicht seiner Bewohner und Bewohnerinnen zeigen. Dabei sind alle Stuttgarter und Stuttgarterinnen aufgefordert mit ihren Bildern und Geschichten aktiv daran teilzunehmen. Richtig echter User Generated Content also …
Derzeit kommen
Unser Part war die konzeptionelle und technische Unterstützung des Projekts und vor allem die Entwicklung des Screendesigns.
Eigenwerbung … Ende
von Matthias Zellmer
