flying sparks ein Weblog von Tobias Jordans zu den Themen software designstudium web2.0 webdesign informationsdesign oekologie werbung usability tj video interfacedesign marketing // alle Themen...

Alle Funken für Juli, 2007:

gutes und schlechtes vom iPhone-Interface

Gut: Jason von 37signals beschreibt ein nettes Feature vom iPhone: „iPhone tells you where someone is calling from".
In der Call-History kann man irgend etwas machen um die Vorwahl in den eigentlichen Namen der Stadt/Region übersetzen zu lassen. Klingt praktisch!

iphone vorwahl übersetzen

Schlecht: shofr stößt die alte Diskussion an, bis zu welchem Grad ein Interface konsistent sein muss. Oder gilt eher, dass man den konkreten Screen optimiert?
Im Gegensatz zu den ersten beiden bashing-like Kommentaren kann ich shofrs Position nachvollziehen. Ob jedoch die Schwelle zwischen Konsistenz und „Optimierung im Detail" wirklich schlecht gewählt wurde, kann ich ohne iPhone-Test nicht sagen.

iphone button-inkonsistenz

Gibt es weitere iPhone-Interface/-UserExperience-Artikel, die man kennen sollte?

[tags]iphone, apple, interfacedesign, userexperience, 37signals, mobile, mobil[/tags]

Spürt man den Traffic von digg und del.icio.us?

Ein schon etwas älterer (2 Monate) Artikel von Dr. Web „Social Media Traffic – Was bringt er?" sagt „jaein".

Interessant ist zu lesen, von welchen der Social-Media-Sites wirklich spürbar Traffic kommt und von welchen überraschend wenig.

Gedankliche Notiz für mich: Suchmaschinenoptimierung bleibt das wichtigste. In die Social-Media-Dienste muss man nicht wirklich selbst Energie reinstecken (man könnte seine Artikel ja auch selbst deliciousen und diggen — schon allein zur Qualitätssicherung).

[tags]delicious, digg, drweb, suchmaschinenoptimierung, traffic, statistik[/tags]

5 interessante Interfaceschnipsel aus dem neuen Backpack

37signals hat eine neue Version von Backpack veröffentlicht (Preview-Artikel 1, 2, 3) und es gibt fünf Dinge, die man aus Interface- und Konzept-Sicht einmal bewusst wahrgenommen haben sollte:

Der (neue) „Blank Slate"

Blank Slate nennt 37signals in ihrem Buch den Zustand einer Seite, in dem noch keine Informationen eingetragen wurden. In der Vergangenheit, haben sie häufig mit Demo-Content als Screenshot gearbeitet, jetzt wird — grafisch schön oder zumindest auffällig umgesetzt — auf die Neues-Element-Links hingewiesen.

backpack drop page
(aus dem Video MOV)

In dem älteren Hilfe-Video über Tags (MOV) sieht man, wie diese Funktion vorher gelöst war:

backpack new-links

Das verbesserte und erweiterte Drag & Drop

Man kann Seitenelemente jetzt per Drag & Drop auf der Seite aber auch zwischen Seiten und in neue Seiten verschieben. Das Interaktionsverhalten ist dabei sehr gut im Detail umgesetzt: Die Bewegung des markierten Elements, das Highlighting der Zielseite, der Hilfetext OnMouseOver, der Ladebalken beim Verschieben, …

Besser als der Screenshot, ist das Video (MOV):

backpack drag and drop

Die optimierte „Give this page a name"-Funktion (neue Seite)

Typisch für 37signals und ihr Bestreben, die Arbeit so einfach wie möglich zu machen, ist das Verhalten beim Erstellen einer neuen Seite: Der Title ist direkt im Edit-Modus, es gibt kein eigenes Label sonder der Inhalt dient als Beschreibung, ist aber direkt markiert, so dass man direkt seinen Titel eintippen kann und mit Enter die Erstellung abschließt.
Genau das meint Raskin, wenn er in seinem Buch von der Minimierung von Interaktionsschritten spricht (Stichwort KLM).

backpack page title
(auch aus dem Video)

Die richtig versteckten Funktionen Edit, Move, Delete und Rename

Nicht wirklich neu aber gut gemacht: Basecamp versteckt die Bearbeiten-Funktionen für seine Seiten-Elemente so lange, bis der Benutzer mit der Maus über ein Element fährt.

Sehr gut sieht man das in dem Demo-Video (MOV) über das Verschieben.

backpack move

Der große Vorteil: Die Backpack-Seiten sind im Standard-Zustand sehr übersichtlich, es kann auf eine eigene Admin-Umgebung verzichtet werden (getreu dem Motto „one interface") und der Benutzer muss nur eine Interaktionsmetapher lernen: Die bearbeiten-Funktionen im Content-Bereich stehen onmouseover links neben der Überschrift.

Einziger Schönheitsfehler: Die Funktionen sollten meine Meinung nach auch dann erscheinen, wenn man mit der Maus links von der Überschrift ist. Im Video sieht man, dass bei vielen Verschiebe-Aktionen, ständig die ungewohnte Umweg-Bewegung über die Überschrift gemacht werden musste.

Das Thema OpenID und Open Bar

Dem Thema sollte man eigentlich einen ganzen Post widmen, weil 37signals mit ihrer OpenBar eine gute und sehr schön anschaulich-praktische Integration von openID umgesetzt haben. Kurz gesagt: Sie nutzen openID als (externe) single-sign-on-Lösung für ihre Produkte und beginnen ihre bis dahin mäßig vernetzen Einzelprodukte über die OpenBar zu verknüpfen.

[tags]37signals, raskin, openid, interaktion, drag-and-drop, webapplikation, interfacedesign, continuity,klm, blank-slate [/tags]

2D-Barcodes und die Wireless Posting Control

2D-Barcodes sind diese quadratischen Fleckenbilder, die zukünftig den gestreiften Barcode ablösen werden. Roger Fischer erklärt im Elektrischen Reporter etwas besser und unterhaltsamer, was es damit auf sich hat.

Das coole an den 2D-Barcodes: Man kann sie mit dem Handy abfotografieren und „übersetzen" lassen. Dafür gibt es auch immer wieder neue Anwendungsbeispiele. Zuerst ein besonders schönes:

Wireless Posting Control

Auf den Werbeflächen von STRÖER findet man am Rand ebenfalls einen 2D-Barcode.

Dieser wird — wie man nach einiger Suche im ströer-Newsletter erfährt — von den Plakatierern genutzt: Nach dem Plakatieren wird das Motiv fotografiert und mit Hilfe des Barcodes und einer (wie ich vermute eigenen) Software an das interne STRÖER-System gesendet. So können sowohl Planer als auch Kunden zu jeder Zeit visuell nachvollziehen, welche Plakatwand zur Zeit welches Motiv führt…

2d-barcode
(Quelle: eigenes Foto)

wireless posting controll
(Quelle: inside out of home, ströer-Newsletter (PDF))

Aber ströer sind bekanntlich nicht die einzigen, die sich mit diesem Thema befassen…

Ein paar weitere Anwendungsbeispiele:

Wer kennt weitere gute Anwendungsgebiete und Beispiele?

Update:

Update: Die erste Briefmarke mit 2D-Barcode
„Die weltweit erste interaktive Briefmarke ist da – herausgebracht von der Schweizer Post. Kamerahandys können den Link einlesen und die entsprechende Webseite öffnen." Verwendet wird die BeeTag-Technik.

Führung durch den Otto-Vista-Store

Schon vor einer Weile hat Otto zusammen mit SinnerSchrader und auf Basis der neuen Vista-3D-Engine den Otto-Vista-Store veröffentlicht (ein gutes Post dazu).

Letztes Wochenende bin ich dort einmal shoppen gegangen und habe zur Dokumentation die Bildschirmkamera eingeschaltet :-)


Link: sevenload.com

Eine Führung durch den Otto-3D-Store für Vista. Leider hat Camtasia versehentlich den Hintergrundton aufgenommen. Wer gut zuhört erkennt die n24-Übertragung des LiveEarth-Konzertes am 7.7.2007 ;-).

Leider dauert es zu Beginn etwas, bis der Store lädt. Ich wollte aber auch diesen Teil der UserExperience festhalten ;-)

Ihr solltet euch auch das Otto-Eigene Werbevideo anschauen das ich am Ende kurz einblende http://www.otto.de/vista/

[tags]video, continuity, vista, wpf, otto, userexperience, web3d, screencast[/tags]

Peak Oil-Hörbuch: Ausgebrannt

Eine Hörbuch-Empfehlung:

Andreas Eschbachs foto autor aktueller Roman Ausgebrannt buchcover (2007) beschreibt die Geschichte von Marc (Markus), dem deutschen Sohn eines Erfinders, der davon träumt mit OPI und OPM (other peoples ideas und other peoples money) Milliadär in den USA zu werden.

Diesem Ziel kommt Marc erstaunlich nah … bis in Saudi Arabien das Öl ausgeht und die technische Welt kollabiert (um eine der dramtischen Formulierungen von Andreas Eschbach aufzugreifen :-)).

Ein wirklich gutes Hörbuch, das nicht nur eine spannende Geschichte erzählt, sondern gleichzeitig einen angenehmen Fakten-Riesel verbreitet, durch den man viel über die Zusammenhänge und Abhängigkeiten rund um das Öl lernt. Wichtig dabei natürlich, dass nur die Rahmengeschichte erfunden ist: „Die Fakten, die ich in diesem Buch zitiere, sind leider zu 99% keine Fiktion" wird Eschbachs im Wikipedia-Artikel zum Buch zitiert.

Mehr über Adreas Eschbach und auch über den Peak Oil gibt es bei Wikipedia. Mehr über das Hörbuch gibts in dem oben verlinkten Wikipedia-Artikel, bei den Kasettenkindern und den sf-fans.

Das Hörbuch findet ihr in eurem Favorisierten Musikgeschäft.

Und jetzt hoffe ich auf Empfehlungen: Welches Hörbuch sollte ich als nächstes Hören?

[tags]buch, rezension, hoerbuch, oekologie, autor, roman[/tags]