Thematische Schwerpunkte
* Information Architecture
* Interaction Design
* Usability Engineering
* Visual Design
* Prototype Engineering
Darüber hinaus sollen auch Product Design und Marketing im Kontext User Experience ihren Platz finden.

Was ist überhaupt User Experience?
Ich versuchs mal mit meinen Worten zu beschreiben, oder zumindest so, wie ich die Begrifflichkeiten und Thematiken einordne:
Bei der User Experience geht es um das Nutzungserlebnis, welches ein User bei der Interaktion mit einer Website (oder Software, Produkt etc. – ich reduziere mal aud Website) erfährt. Dieses Erlebnis kann gut oder schlecht sein.

User Experience Design ist der Prozess der Gestaltung (nicht nur das Layout) von Websites, welche ein möglichst positives Nutzungserlebnis hervorrufen sollen. Dieser Gestaltungsprozess beinhaltet verschiedene Disziplinen, wie sie u.a. oben schon genannt wurden: Information Architecture, Interaction Design, Information Design, Visual Design, Usability Engineering, Prototype Engineering etc. – je nach Ziel des Produktes.

Für diesen Prozess bedient man sich einer Reihe von Methoden und Deliverables wie Site Audits, Content Inventories, Personas, User Scenarios, Mental Models, Sitemaps, Wireframes, Prototypes etc. (Ein schöner Link dazu: User Experience Deliverables.)

Diverse Software gibts für all diese Dinge natürlich auch: IAApps.

User Experience ist nicht Usability!
Beide Begriffe werden leider oft verwechselt oder synonym verwendet. Genau genommen kann man Usability aber als einen Teilaspekt der User Experience sehen. Bei der Usability geht es darum, eine möglichst einfache und intuitive Bedienung. Eine Website mit guter UX muss aber nicht zwangsläufig einfach zu bedienen sein.
Oder wie Wikipedia sagt: Eine positive UX hängt also nicht alleine von einer guten Usability ab, sondern auch vom Joy of Use, von einem ansprechenden Design, von innovativen Features oder auch von der Vermittlung von Vertrauen und Glaubwürdigkeit.
Das ist der Grund, weshalb Websites trotz schlechter Usability sehr erfolgreich sein können. (MySpace, Zappos)

Siehe auch auf Wikipedia: User Experience (de), User Experience Design (en), Experience Design (en).

Das nur als kleiner Versuch einer Erläutung, dass keine Missverständnisse entstehen! Es gab z.B. beim Barcamp in München eine Session zum Thema “Was ist User Experience”, bei der die ausbleibende Diskussion über gute Usability anscheinend bei einigen Teilnehmern für ein wenig Verwirrung gesorgt hat.

Zurück zum UXcamp, denn über all diese Dinge und wahrscheinlich noch einiges mehr, wollen wir in Berlin diskutieren und uns austauschen:
Programm und Anmeldung (Was ist ein Barcamp)
Typisch für ein Barcamp ist, dass vorher noch kein Programm feststeht. Da jeder einen Beitrag zum Programm leisten kann, trägt man alle Themenvorschläge ins Wiki ein. Die finale Abstimmung über alle Beiträge / Sessions findet dann beim Camp jeweils Samstag und Sonntag morgens statt.
Die Teilnahme ist kostenlos … wobei es aber tatsächlich nur Teilnehmer und keine Zuschauer geben sollte. Teilnehmen bedeutet: Eine Session halten oder in einer mitdiskutieren, drüber bloggen (vorher/nachher), bei der Orga oder vor Ort helfen etc. Wer teilnehmen möchte, kann sich über das Mixxt-Network uxcamp.mixxt.de registrieren. Diese Registrierung ist jedoch noch keine Anmeldung. Auf der Mixxt-Plattform wird demnächst ein Event angelegt, über welches man sich dann tatsächlich anmelden kann. Bisher sind schon knapp 300 Interessierte im Mixxt-Network registriert! Wahnsinn! :)

Nochmal alle Daten
Datum: 23. – 24. Mai 2009
Ort: Berlin, Erwin Schrödinger Zentrum der HU Berlin
Anmeldung ab demnächst über: uxcamp.mixxt.de
Auf Twitter: UXCampBerlin09
Offizieller tag: #uxcb09

Sponsoring
Da ein Barcamp keinen Eintritt kostet, werden Sponsoren benötigt. Es gibt eine ganze Reihe von Möglichkeiten das Camp zu unterstützen. Wer also daran Interesse hat, kann sich gerne bei mir oder beim Orgateam melden!

Falls nun Fragen aufgetaucht sind … einfach fragen! ;) Falls jemand bezüglich meiner Ausführungen zu UX anderer Meinung ist … einfach melden. Denn erfahrungsgemäß ist diese Thematik nicht final definiert! ;)

Tweet This Post

Was die Berliner nun schon eine ganze Weile machen kommt jetzt auch nach Frankfurt! Wolf und Norbert haben sich überlegt, dass man auch in Frankfurt unbedingt so ein nettes kleines After-Work-IA-Event starten müsste und haben auch prompt schon 20 Zusagen!

Stattfinden wird das Ganze am 6.6. um 19 Uhr in Frankfurt … die genaue Location wird noch bekannt gegeben. Mehr Infos auch in der IA-Gruppe auf Xing:

Wer die Zeit bis zur IA Konferenz 09 (die wir ja gerade planen) noch etwas überbrücken und in der Zwischenzeit sich mit netten Informationsarchitekten im Großraum Frankfurt und Umgebung austauschen möchte, sollte sich diese Gelegenheit nicht durch die Lappen gehen lassen :).

Eine Frage hab ich noch … gibt’s irgend eine Event-Seite, bei der man sich anmelden kann und auch sehen kann, wer alles kommt? Xing … Venteria … oder noch besser: Mixxt … dann könnten wir direkt mal ein kleines IA-Network anlegen. :)

via Mail und Jan und Henrik

Nachtrag: Damit das Event in meinem Event-Widget hier rechts auftaucht, hab ich es mal auf Venteria angelegt. Eine Anmeldung dort ist allerdings nicht offiziell! ;) Bitte immer noch Wolf bescheid geben, wenn ihr kommen wollt.

Tweet This Post

Noch mal langsam:
- Ich klicke auf “Löschen”
- Das Ding verschwindet und ein Feedback erscheint in der Seite “Wurde gelöscht. Rückgängig machen?”

Und das war’s. Damit haben wir uns einen Schritt und ein paar Nerven gespart.

Nach dieser Erklärung hat’s bei mir “pling” gemacht und seit dem fallen mir ständig und überall solche nachgelagerten Funktionen auf. Oder Prozesse, die in letzter Zeit dahingehend optimiert wurden. hier mal ein paar Beispiele:

Friendfeed
Bei FF kann man diverse Feeds zu einem Lifestream aggregieren, man fügt also alle Aktivitäten aus dem Netz wie Fotos auf Flickr veröffentlichen oder Links bei del.icio.us posten auf einer Seite zusammen. Nun packen alle meine FF-Freunde alle möglichen Feeds da rein, die ich aber nicht unbedingt alle sehen will. Tolle Lösung von FF: Man kann einzelne Elemente oder ganze Feeds löschen. Sieht so aus:
Ein typischer Post auf FF:

Unten drunter gibts den Link “Hide”. Klickt man da darauf, verschindet der Eintrag wie folgt:

Die Frage, ob ich den Eintrag wirklich rauskicken will, wurde also nachgelagert. Zudem bekomme ich die Möglichkeit, mir noch mehr Optionen anzeigen zu lassen. Die Optionen sehen so aus:

Ich kann also festlegen, dass ich die auf Flickr gepostete Fotos von XY (oder von all meinen Freunden) überhaupt nie in FF sehen will.
Wenn ich mich richtig erinnere, lief diese Aktion bis vor kurzem noch wie folgt ab:
- Man klickt auf “hide”
- Die Messagebox mit den Optionen erschien und man konnte wählen.
Jetzt ist die Messagebox ebenfalls nachgelagert für die paar Leute die nicht nur den einen, sondern alle Flickr-Einträge dieses Nutzers, oder gar alle Flickr-Einträge aller Freunde raushaben wollen.

Damit wären wir dann bei der nächsten Frage: Was will der User bzw. die Mehrzahl der User? Beim Löschen ist das noch recht klar. Die meisten wollen den Eintrag wirklich löschen und den zusätzliche Klick gibts nur für die paar Leute, die sich verklickt haben. Was ist aber mit den zusätzlichen Optionen? Wollen die meisten Leute bei jedem “Hide” die Optionen sehen oder wollen das nur wenige? Ich persönlich möchte die Optionen immer sehen, denn wenn ich einen Eintrag rauskicke, will ich in der Regel alle Einträge dieser Art raushaben.

Anderes Beispiel: Facebook
Fügt man hier eine Person als Freund hinzu, hat man die Möglichkeit, Freundschaftsdetails genauer zu spezifizieren.

Bis vor kurzem wurde die Messagebox mit diesen Optionen automatisch nach dem Klick auf “Als Freund hinzufügen” angezeigt. Seit neuestem muss man sie extra aufklicken.

Was ist nun besser? Ich persönlich füge jedem Freund Freundschafsdetails hinzu. Für mich ist es also umständlicher geworden. Alle, die dies nicht tun, werden sich freuen, dass sie diese Abfrage nun nicht mehr skippen müssen.

Was tun um alle glücklich zu machen? Man könnte eine statistische Auswertung machen, ob die Mehrheit der User diese Angabemöglichkeit nutzt oder nicht. Ich vermute mal, dass Facebook das gemacht hat. Andererseits kommen wir hier aber auch wieder in die Schere zwischen “Was will die Plattform” und “Was will der User”. Die Plattform will sicherlich, dass die Leute diese Angabe machen. Für den User bedeuten diese Angaben aber Aufwand, den er vielleicht nicht haben will.

Vielleicht hat Facebook die Abfrage aber auch nachgelagert, weil sie dem User nach dem Hinzufügen eines Freundes auch noch weitere Todos anbieten wie “Schlage Freunde vor…”.

Auf alle Fälle ist das eine Überlegung, die man sich beim Nachlagern stellen sollte. :)

Tweet This Post

Shoppping 2.0 – Was sagen die Nutzer zum neuen Einkaufserlebnis?

Es gibt eine neue Studie, die sehr interessant klingt! Ich hab sie selbst noch nicht gelesen, aber sobald ich sie in die Finger krieg, werd ich mehr dazu schreiben! Schließlich besteht ja bereits der Titel aus Reizwörtern erster Güte für eine Shopping-affine Informationsarchitektin! ;)

Shopping 2.0 – usability.de hat das neue Einkaufserlebnis im Internet genauer unter die Lupe genommen. Nachdem Websites wie Etsy, Kaboodle und Woot! in den USA bereits Kult-Status erreicht haben, hält dieser Trend nun auch Einzug in Europa. Grund genug, sich einmal genauer anzusehen, was es mit diesen neuen Shopping-Konzepten auf sich hat: Wie kommen sie bei den deutschen Nutzern an? Wie benutzerfreundlich sind deutsche Social Shopping Sites wie dealjaeger.de oder dawanda.com?

Man kann die Studie bei usability.de für 230,- Euro bestellen.

Nachtrag: Jetzt weiß ich auch wieder, wo ich den Link her hab ;) Exciting Commerce hatte darüber berichtet. Aber hatte mir nicht auch irgend jemand auf der re:publica davon erzählt? Oh je, ich weiß echt gar nix mehr, diese Veranstaltung war die totale Überdosis. ;)

Tweet This Post

Als kleines Goodie hat er auch noch einen Uralt-Screenshot, der dem jetzigen Amazon in keinster Weise ähnlich sieht. ;) Der scheint noch älter zu sein, das den, den ich mal vor einiger Zeit in einem anderen Blog gefunden hatte.

(via Get Elastic)

So, eigentlich wollte ich nur auf diesen Blogbeitrag verweisen, aber dann ist mir beim Surfen auf Amazon.com aufgefallen, wie viele Variationen es von der blauen Box mit dem Warenkrob-Button gibt – je nach Produkt – dass ich die einfach mal gesammelt habe:

	Die Standard-Box: Einfach nur der Button plus die Möglichkeit, die Menge auszuwählen. Laut Brian Eisenberg gibt’s dieses Dropdown übrigens erst seit kurzem. Vorher konnte man lediglich anschließend im Warenkorb die Menge anpassen. Gesehen bei: The First Years True Fit Convertible Car Seats Cappuccino
	Zusätzlich werden hier noch weitere, ähnliche Artikel aufgelistet. Wann und bei welchen Produkten genau das noch mit angezeigt wird, habe ich nicht rausfinden können. Gesehen bei: Black & Decker VEC010BD Start It 300 Amp Jump Starter
	Klamotten und Schuhe haben den Zusatz, dass man doch Farbe und Größe auswählen soll. Gesehen bei: crocs Beach Clog
	Ist der Artikel noch nicht verfügbar, kann man ihn vorbestellen. Man beachte hierbei die Farbe des Buttons. Garrett Dimon hat zur Visual Language einen schönen Beitrag geschrieben mit den Amazon-Buttons als Beispiel. Gesehen bei: Sense & Sensibility (with Miss Austen Regrets)
	Bei Lebensmitteln kann man neuerdings einstellen, ob man das Produkt regelmäßig automatisch bestellen möchte. Vor kurzem habe ich gerade darüber einen Blogbeitrage gelesen, kann ihn aber nicht mehr finden. Vielleicht war es der hier von Downloadsquad … Gesehen bei: Jell-O Cook & Serve Pudding & Pie Filling, Chocolate, 3.4-Ounce Boxes (Pack of 24)
	Bei Handys muss man in den USA immer erst den Zip-Code eingeben, weil die Mobilfunkanbieter überall verfügbar sind. Der nächste Schritt, die Tarifauswahl, findet dann auch in dieser Box statt. Eigentlich ist das hier auch kein Warenkorb-Button, weil der Prozess noch weiter geht. Gesehen bei: Sony Ericsson W580i Gray Phone (AT&T)
	Schritt zwei der Handy- und Tarif-Auswahl. Auch hier noch kein Warenkorb-Button, denn dann kommen noch die Optionen und noch Zubehör. Und dann werden in der blauen Box alle ausgewählten Einzelheiten aufgelistet.
	Erfolgt der Verkauf nicht über Amazon sondern über einen Partner, wird der Partner über dem Warenkorb-Button genannt. Gesehen bei: TKO Exercise Stretch Cords (Light)
	Bei Musik gibts natürlich noch den Zusatz, das Album als MP3 downzuloaden. Lustigerweise kann man diese CD auch gegen Pepsi-Points eintauschen. Dafür muss man sich bei PepsiStuff auf Amazon registrieren. Das habe ich mir jetzt nicht genauer angeschaut. Gesehen bei: As I Am [ENHANCED]
	Bei MP3-Downloads bricht Amazon mal aus der blauen Farbe aus: Die Box wird grün! Gesehen bei: Discipline
	Bei “Amazon Shorts” (Kurzgeschichten?) bin ich auf eine noch alte Variante der Warenkorb-Box gestoßen. Hier gibt es nur einen Download-Button. Gesehen bei: The First Deadly Sin, an Amazon Short

Weiter hab ich dann nicht mehr gesucht … hatte dann irgendwann keine Lust mehr. ;)

Wie man sieht, tut’s ein Standard-Shop nicht, wenn die Produktpalette nur unterschiedlich genug ist.

Hach je … Amazon … habe gerade mal im Google-Reader nach Amazon gesucht und festgestellt, dass man mit Features auf Amazon einen ganzen Blog füllen kann …

A propos Testing: Thorsten hat grad entdeckt, dass Amazon im Moment hier in Deutschland das neue Design testet. Internet Expolore-Nutzer sehen es schon, während im Firefox noch das alte erscheint.

Und weil er so interessant ist, hier nochmal den Link zum Beitrag Creating a Visual Language von Garrett Dimon.

Tweet This Post

Also … letztens sagte ich zu meinem Kollegen, dass ich mal einen groben Wireframe für eine der Seiten erstellen würde, damit wir uns über den generellen Aufbau abstimmen können.

Kleiner Exkurs: Ein Wireframe ist eine Skizze von einer einzelnen Seite einer Website, wie wir (Informationsarchitekten oder auch Konzepter) sie in Programmen wie Visio, Axure oder webbasierten Wireframe-Tools wie Pidoco erstellen. Diese Skizzen dienen uns in der Konzept-Phase für die Abstimmung mit dem Kunden und letztendlich wird auf Basis von Wireframes das Design und die Programmierung erstellt. So ein Wireframe enthält alle Elemente wie Navigation, Inhalte und Funktionalitäten einer Seite, allerdings nur sehr rudimentär dargestellt. Hübsch werden die Dinger erst, wenn ein Designer dran war. ;)

So, nun hatte ich also angekündigt, einen groben Wireframe zu erstellen. Was dabei rauskam, sah so ähnlich aus wie das hier:

Was man da sieht, hat zwar jetzt keinerlei inhaltlichen Sinn, da ich zur Demonstration schnell mal einen Wireframe aus alten Modulen zusammen geklickt und entfremdet habe. Kann ja nix Echtes aus einem Projekt zeigen. ;) Was man aber dennoch deutlich erkennen kann … das Ding war alles andere als grob … es war bis ins Detail ausdefiniert. Zwar nicht funktional beschrieben, aber dennoch sehr feinteilig.

Mein Kollege war daraufhin so nett, mich auszulachen. ;-) “Grob ist das aber nicht, du hast ja noch nicht mal einen Platzhalter für die Produkte verwendet, sondern sogar echte Daten von der Website kopiert und eingefügt!” meinte er. ;-)

Bin ich nicht in der Lage, mit Visio einen groben Wireframe zu erstellen? Das hab ich mich einmal mehr gefragt … anscheinend wirklich nicht. ;) Ich verfalle wohl viel zu schnell in die Ausarbeitung von Details, die für nen schnellen Überblick erstmal gar nicht wichtig sind.

Allerdings habe ich vor kurzem angefangen, Wireframes mit der Hand anzuscribbeln. Hab ich früher nie gemacht, aber nach ein paar Vorträgen über Paper-Prototyping beim Barcamp in Berlin und bei der Web2.0Expo hab ichs dann doch mal ausprobiert.

Also, Visio verleitet zum spielen (mich zumindest). Will ich mal einen schnellen Überblick über mehrere Seiten haben, vor allem wenn sie stark voneinander abhängen, bzw. man sich überlegen muss, welches Modul auf welcher Seite am meisten Sinn macht, dann ist das Skizzieren auf Papier echt von Vorteil.

Für nen komplexen Wireframe kann man im ersten Entwurf schon mal nen ganzen Tag brauchen. Und wenn man dann weitere Wireframes erstellt, und neue Ideen für weitere Module bekommt, kann man das Ding grad nochmal neu zusammen puzzeln.

Geht man aber hin und malt das Ding auf Papier, dann lässt man all die Feinheiten weg, die so viel Zeit kosten. Und man kann ein Modul auch nicht stundenlang von links nach rechts schieben, von hochkant auf quer umarbeiten, von hellgrau nach dunkelgrau einfärben oder was einem sonst noch so einfällt. Man wird auch nicht von Seitenrastern oder vom Bildschirmformat eingeengt. ;) Wichtig ist erstmal, dass alle notwendigen Module vorhanden sind. Alles weitere kann man dann später am Rechner machen. Und selbst wenn sich beispielsweise ein Modul doch für eine andere Seite besser eignet, kann man es auch immer noch ausschneiden und woanders aufkleben. Und diese Skizzen reichen völlig aus, um mit Anderen das Prinzip durchzusprechen, das man sich augedacht hat.

So sehen sie aus, meine handsigniertengemalten Wireframes:

Warum hab ich das nicht schon früher so gemacht?

Tweet This Post

Zuerst das Barcamp Berlin 2 am ersten Nov. Wochenende. 300 Teilnehmer aus D + aktuell ca. 50 internationale …Himmel, das wird ja riesig! Bin gespannt!

Direkt im Anschluss gibt’s dann die Web2.0Expo, auch in Berlin:

Dafür habe ich einen Code für einen 100 EURO Discount oder einen kostenlosen “Full Expo Pass” zur unlimitierten Nutzung: MLVLBE36 (ja ja, ich weiß, der geistert im ganzen Web rum, aber vielleicht freut sich ja doch noch jemand darüber!)
Während der Web2.0Expo veranstaltet Nicole am 7. Nov. ein Girl Geek Dinner, wohl das erste in D. … klingt cool, da geh ich doch auch mal hin und Oli wird mein Geek sein. ;)

Am 8. Nov. findet dann in diversen Städten der World Usability Day statt … dummerweise tagsüber, also kann ich da leider nicht hingehen. :(

Leider nicht besuchen kann ich die sehr empfehlenswerte IA Konferenz … 3 Konferenzen hintereinander wären mit dann doch ein bissl zu viel. :(

Aber an dieser Stelle mal ein Hallo an Wolf und Jan! Wünsche euch viel Erfolg und Spaß!

Und ich freue mich auf ne coole Woche in Berlin! :)

Nachtrag: Diverse Terminfalschangaben habe ich jetzt beseitigt, danke an Stefan! Jetzt bin ich terminlich wieder richtig sortiert! ;)

Noch zwei nachtragende Events:

- Am 4.11. findet ein Geek Dinner statt, das Event hab ich bisher nur auf Facebook gefunden.

- Am 5.11. findet ein Lunch 2.0 statt, dazu gibts ein Wiki.

Tweet This Post

Meist bieten die Networks so gut wie keine Hilfestellung. Eine Suchfunktion gibt’s fast immer. Doch für den User, der einfach nur entdecken will, wer noch alles da ist, ist die Suche ziemlich unnütz.

Was kann ein Social Network, oder ein Dienst mit Networking-Funktion nun tun, damit es einfacher wird, die Freunde zu finden?

Facebook bietet mehrere Varianten: Abgleich mit dem eMail-Adressbuch, mit der Buddyliste im AIM-Messenger oder die Anzeige von Leuten, die vergleichbare Angaben wie Hochschule oder Arbeitgeber gemacht haben.

Klickt man dann allerdings auf “Find coworkers …” muss man dooferweise wieder den Namen der Firma neu eingeben.

Wevent.org macht sich andere Networks zunutze (mit Microformats) und bietet seinen Usern die Option, ihre Kontakte von anderen Networks mit den Wevent-Usern abzugleichen. So kann man beispielweise die URL von Last.fm eingeben und erhält eine Liste der eigenen Last.fm-Freunde, die auch bei Wevent registriert sind. Diejenigen, deren Freund man bereits ist, werden andersfarbig angezeigt:

Das gleiche Vorgehen bietet auch Dopplr.com, in meinem Beitrag Fundstück: Schönes Feature zum Sammel-Befreunden bei Dopplr hatte ich es schon mal beschrieben.

Aber Dopplr.com hat auch noch ein anderes Prinzip vorrätig: Und zwar nutzt Dopplr die Vernetzung der User auf Dopplr selbst. Eigentlich die logischste Variante, oder? Und der Vorteil für den User: Er muss fast nichts tun! Im Account-Managment erhält er eine Liste von Leuten vorgeschlagen, die Kontakt mehrerer seiner Kontakte sind. Klingt logisch, dass dadurch die Wahrscheinlichkeit steigt, dass auch er diese Menschen kennt.

Test: Von den mir vorgeschlagenen 20 Personen kenne ich tatsächlich 15 Personen. 10 davon kenne ich so gut, dass ich sie dann mal als Fellow Traveller (Kontakt) nachgepflegt habe. :)

Xing.de bietet auch diverse Möglichkeiten. Zum einen erhält man direkt auf seiner Startseite ein paar Kontakte seiner Kontakte angezeigt. Dadurch, dass dieses Feature auf der Startseite eingebunden werden kann, sieht man unter Umständen direkt nach dem Einloggen sofort, wenn neue Leute dabei sind. Der User muss also nicht selbst aktiv werden, um eine solche Liste zu sehen. (Ich muss allerdings zugeben, dass ich unter diesen 4 Leuten selten ein mir bekanntes Gesicht sehe. Vielleicht sind 43.000 Kontakte meiner Kontakte auch einfach zu viel;)

Hilfreicher ist dann die Powersuche: Darüber kann man auch nochmal die Kontakte der Kontakte aufrufen. Eine weitere Variante ist hier aber auch der Weg über die gemachten Angaben wie Organisationen, Hochschule und Firma/Ex-Firma.

Sehr spannend wird’s dann beim Klick auf “Mitglieder, die mehrere meiner Kontakte kennen“. Die Wahrscheinlichkeit, dass ich die Leute kenne, die 50 meiner Kontakte kennen, muss einfach hoch sein! ;-)

Es gibt also diverse Möglichkeiten, die Vernetzung der Leute untereinander zu fördern, ohne dem User zu viel Arbeit aufzubrummen.

Dem User die Arbeit abnehmen

A propos Arbeit aufbrummen. Passende Kontakte aufzulisten ist leider erst die halbe Miete. Wirklich optimal wird die Sache erst, wenn man aus dieser Liste den Kontakt auch direkt zufügen kann. Wie es Wevent, Dopplr oder auch Facebook macht. Der Button “Kontakt hinzufügen” (oder wie auch immer er heißen mag) löst hier direkt via AJAX die Aktion aus und der User bleibt auf der Liste. Er kann dann selbst wählen, ob er weitere Leute kontaktiert oder das Profil des neuen Kontaktes aufruft.

Die besten Varianten

Für den User am bequemsten und für das Ziel, die Vernetzung zu fördern, am dienlichsten sind also folgende Varianten:

• Nutzung der Vernetzung auf der Seite selbst (Kontakte, die mehrere der Kontakte kennen)
• Nutzung von Microformats um Kontakte aus anderen Social Networks mit den Usern der eigenen Plattform bzugleichen.

Negativ-Beispiele

Einen Blogbeitrag über dieses Thema zu schreiben, schwirrt mir schon länger durch den Kopf. Auslöser, es dann heute endlich mal in Angriff zu nehmen, waren meine Besuche auf StudiVZ.de und Wer-kennt-wen.de. Ausgerechnet Wer-kennt-wen … *tsss* eine Seite, deren einziges Ziel ist, Menschen zu vernetzen, macht es dem User unglaublich schwer. Die einzige Möglichkeit, die man hat, ist es, die Profile der Kontakte abzusurfen und zu schauen, wen davon man auch kennt. Dazu kommt noch (auch bei fast allen anderen Social Networks), dass man in einer Liste von Usern nicht erkennen kann, ob die Leute schon auf der eigenen Kontaktliste stehen oder nicht. Wer-kennt-wen hat übrigens die am schlechtesten zu nutzende Gruppenfunktionalität, die ich bisher gesehen habe.

Und bei StudiVZ springt man aus der Liste raus, muss den Kontakt unter Eingabe eines der schlechtesten Captchas überhaupt hinzufügen und landet danach auf der eigenen Kontaktliste. Wozu das denn? Wäre es nicht sinnvoller der User zu fragen, was er als nächstes tun möchte? Zum Profil des Users, zur eigenen Kontaktliste zu wechseln oder zurück zu zuletzt aufgerufenen Liste zu gehen. Gleiches Problem habe ich bei Xing nach dem Hinzufügen eines Kontaktes übrigens auch immer. Es werden einfach keine Links für einen direkten Sprung angeboten.

Tweet This Post

So wird’s aussehen:

Ausführliche Infos in einer Quick Tour

Tatsächlich, Amazon hat die Reiter in die Tonne getreten! Warum? Weil sie nicht mehr wie 1995 nur Bücher verkaufen sondern mittlerweile 40 verschiedene Produktgruppen. Zuletzt sah das in der Reiternavigation der .com-Seite wie folgt aus: Da man keine 40 Reiter unterbringen kann, wurden alle 40 Produktgruppen in einen Layer gepackt. Auch nicht gerade die schickeste Variante.

Am besten gefällt mir in der Erläuterung folgender Part:

We consulted the foremost experts in the field: our customers.
We traveled around the world, inviting customers like you to come and try out the new features and design. We listened to their feedback and made changes based on their opinions. Then we asked more customers for their advice, and we made more changes from their feedback. The design you see today reflects the input of many real-life customers of our U.S. and international websites.

Die Entwicklung der Amazon-Reiternavigation über die Jahre hin hat LukeW mal zusammengefasst … liest sich sehr interessant! Ist allerdings auch schon wieder zwei Jahre alt.

Einen Screenshot vom allerersten Amazon-Design habe ich bei Sean Laundry gemopst:

Bin ja mal gespannt, wie lange es dauert, bis das neue Design auch bei Amazon.de ankommt. Bei uns gibts ja eh noch die alten Reiter, die alle nebeneinander in eine Reihe passen (mehr oder weniger).

via

[Kleine Notiz nebenbei: Dies ist bereits mein 3. Blogpost diesen Monat!] ;-)

Tweet This Post

Bitte nicht mit einem Design-Entwurf verwechseln, ganz so farblos soll das Blog nicht aussehen, es ist lediglich ein Scribble.

So in etwa stelle ich mir (derzeit) mein zukünftiges Blog vor. Jetzt muss ich nur noch ein hübsches Design dazu finden. Habe schon einiges durchwühlt, bin aber nie so richtig fündig geworden.

Entgegen früherer Meinungen favorisiere ich derzeit ein dreispaltiges Layout mit zwei schmalen Spalten rechts. Wobei sich die rechtere Spalte grafisch etwas abheben sollte, damit sich die beiden schmalen Spalten in ihrer Kleinteiligkeit nicht kanibalisieren. Die linke der beiden schmalen Spalten enthält alles Inhaltliche zum Blog, die rechte ist für allen zusätzlichen Schnickschnack gedacht.

Alles in allem nix besonders Außergewöhnliches, soll ja auch kein Experiment sein, soll aber auf alle Fälle aufgeräumter aussehen.

Soweit also die Informationsarchitektur, das Informationsdesign fehlt noch. *such*

Tweet This Post