Nette und gut gemachte Animation.

(via engadget.com)

(via der Englisch-Blog)

Nett!

Mehr Gedanken zu der Entwicklung und die Links zu den Quellen findet man auf uxzentrisch.de im Artikel von Tobias Jordans.

Um das Bild in der vollen Auflösung zu erhalten muss man über den Download Link gehen, im Screenshot rot umrandet:

Diese Infografik sowie ein paar weitere Daten wie z.B. die Daten über “Das Internet 2009 in Zahlen” oder die “Social Network Weltkarte” hat JESS3 verwendet um ein anschauliches Video zu erstellen.

Wer sich somit sparen möchte sich diese verschiedenen Infografiken einzeln anzuschauen sollte sich einfach dieses kurzweilige knapp vier-minütige Video ansehen:

(via der English Blog)

Zoomt man aus der Karte ein wenig raus kann man die komplette Fahrt im Überblick sehen:

Im Großformat ist die Karte samt Strecke auch direkt auf Google Maps zu sehen. Dort kann man dann auch direkt in die Städte springen und viele zusätzliche Videos zu den Positionen anschauen.

Und weils so schön ist hier der Start der Route in Moskau:

Aber wesentlich schöner, vor allem mit russischem Gesang im Hintergrund, ist es auf dem Google Mashup.

(via basicthinking.de)

Paris:

Von Paris gibt es noch drei weitere Teile.

Toronto:

Dubai:

New York:

Hamburg:

Mehr Videos wie die von New York oder Hamburg findet man auf der Vimeo Seite von Max Moos.

(via whudat.de)

So kann man z.B. recht exklusiv einen Blick von 7th Heaven chair in über 2200 Meter Höhe sehen oder allgemein im Whistler Blackcomb, einem Skigebiet nördlich von Vancouver, herumfahren.

Schon sehr faszinierend soweit oben “herumzufahren”:

Google hat auch extra für die Olympischen Spiele ein Mashup mit den wichtigsten Informationen, Spielstätten auf Google Maps und Links zu den Streetview Einstiegspunkten erstellt:

Dort findet man auch die Links zu sen Sportstätten, die mit Street View abgefahren worden. Einmal im StreetView Modus kann man die verschiedenen Punkte auch direkt durch das Menü links anspringen:

Insgesamt schon ziemlich faszinierende Bilder, die einem da geboten werden. Wer noch ein wenig mehr über das Schneemobil erfahren möchte kann auch nochmal im offiziellen Google Lat Long Blog schauen.

(via offizieller Google Blog)

Diese Google Maps Animation ist ein Ausschnitt aus dem etwas längerem (4m) Film Omar Hot Pursuit S.E.A.R.C.H.

(via digitalschweinshaxe.net)

Um den Labs Dialog aufzurufen einfach oben rechts im Menü auf den rot hinterlegten “Neu” Link klicken und im Dialog die gewünschten Funktionen auswählen. So habe ich z.B. das Zoomen durch einen Bereich auswählen, das Spiel “Where in the World” ausprobiert:

Ziehen und Zoom

Nach dem Aktivieren erscheint direkt eine Hilfe für das Zoom Feature und man sieht auch den neuen Link für das Spiel oben über der Karte:

Das Zoomen funktioniert auch wunderbar und ist ein, wie ich finde, wirklich nützliches Feature:

Geo Spiel “Where in the World”

Wer sich in Sachen Geographie ein wenig verbessern möchte sollte das Spiel “Where in the World” ausprobieren. Startet man das Spiel durchläuft man 10 Positionsbestimmungen. Es fängt dabei sehr einfach an und wird immer schwerer. Dabei wird eine Position per Marker gezeigt und links mögliche Namen zu der Position angeboten:

Anschließend hat man ein paar Sekunden Zeit und beantwortet die Frage. Ob man richtig liegt sieht man wenn das Ergebnis eingeblendet wird:

Man erhält Punkte und Google merkt sich die Höchstzahl, die erreicht wurde. Ein wirklich ganz netter Zeitvertreib =).

Längen und Breitengrad anzeigen lassen

Und auch das letzte Feature ist brauchbar: durch eine Markierung den Längen- und Breitengrad (Longitude & Latitude) herausbekommen. Dazu mit der Maus an die gewünschte Position fahren und aus dem Kontextmenü (rechte Maustaste) den Punkt “LatLng-Markierung setzen” auswählen:

Anschließend erscheint die Info mit den dem Längen- und Breitengrad direkt als Google Maps Info Element:

Es gibt noch ein paar weitere Features, aber die dürft ihr selbst ausprobieren.

(Danke für den Hinweis an Tobs)

Die Idee dahinter ist, dass man sich anhand von Tags und Stichwörtern Playlists für Musik zusammenstellen und anschließend anhören kann. Dabei reicht schon ein einziges Stichwort um eine ganze Menge von Musiktracks zu erhalten. Ich habe das mit dem Stichwort “Moby” mal ausprobiert:

Insgesamt eine nette Funktion mit der man einfach mit Hilfe von YouTube sein eigenes MTV machen kann.

Sieht eigentlich auch ziemlich cool aus und vor allem hat man wahnsinnig viele Möglichkeiten Sport zu treiben.

Schönes Wochenende!

The overreaching goal of the video page redesign is simplification and ease of use. Videos are the main focus of YouTube, but over time the “stuff” surrounding each video (actions, comments, stats, more videos, etc.) cluttered the essencial experience. This redesign is about going “back to basics”, re-focusing attention on what you came to YouTube for — the video! — and bringing order and clarity to the actions around it.

Das neue Layout sieht wie folgt aus:

So ist die Darstellung im neuen Look wesentlich aufgeräumter und alle zum Video verfügbaren Informationen sowie Aktionen die man ausführen kann befinden sich direkt unterhalb des Videos in einer initial minimierten Form und erst nach drücken des “Aufklappen” Icons wird die Beschreibung in der vollen Größe dargestellt.

Auch die Suche hat sich ein wenig verändert. Schaut man gerade ein Video an und betätigt dann die Suche so bleibt das aktuelle Video immer noch sichtbar und man kann dahin zurückkehren:

Wer noch nicht das Vergnügen hat das neue Layout auszuprobieren kann sich die Änderungen auch schön mit Grafiken auf der eigens eingerichteten Hilfeseite ansehen. Insgesamt gefällt mir das neue Layout besser als das alte.

Eine weitere Neuigkeit ist die Möglichkeit YouTube Videos nur mit HTML 5 Mitteln und somit ohne Flash direkt im Browser ansehen zu können. Natürlich geht das nur in Browsern die das auch unterstützen, welche aktuell nur Google Chrome und Apple Safari (Version 4+) ist. Zwar unterstützt auch der neue Firefox 3.6 HTML 5 allerdings implementiert es ein anderes Video Format, so dass es mit YouTube nicht funktioniert. Das Ganze ist natürlich noch Beta und aktivieren kann man das unter folgender URL: http://www.youtube.com/html5.

Wer noch mehr bei YouTube ausprobieren möchte kann sich auch YouTube’s TestTube mal ansehen.

Den Artikel von damals kann man sich auch als PDF, welches viele Details enthält, herunterladen.

Jetzt hat sie diesen Artikel überarbeitet und als neuen Artikel auf uxmag.com mit der Überschrift “Rich Internet Application Screen Design” online gestellt. Neben der Aufteilung der verschiedenen Arten von Screen Designs wurden sechs Prinzipien herausgearbeitet:

• Make It Direct
• Keep It Lightweight
• Stay in the Page
• Provide Invitations
• Use Transitions
• React Immediately

Die über 80 Beispiele für die verschiedenen Screen Design, wie z.B. Master/Detail, Tabbed oder Search Results, sind diesmal in einer Präsentation zusammengestellt worden. Neben dem eigentlichen Artikel mit vielen Erläuterungen lohnt es sich diese mal durchzusehen:

Ich denke, dass sich die meisten immer noch viel zu wenig Gedanken rund um das User Interface, vor allem bei Web Anwendungen, machen. Von daher ist dieser Artikel doch schon mal ein sehr guter Anfang ;).

Innerhalb von wenigen Momenten einen eigenen Button ganz ohne Grafikprogramm wie Photoshop erstellen. Dabei hat man verschiedenste Konfigurationsmöglichkeiten. So kann man einfarbige aber auch mit farbverläufen gestaltete Buttons erstellen. Die Farben sind frei definierbar. Genauso wie natürlich der Text auf den Button aber auch die Schriftart und Schriftgröße. Auch die Größe des Buttons selbst und ob der Button einen Schatten haben soll ist anpassbar:

Den Button selbst kann man entweder als Grafik herunterladen oder mit CSS Beschreiben lassen. Bei der CSS Variante verwendet das CSS als Hintergrundgrafik die Online URL des Buttons. So kommen wir auch schon zum nächsten Feature: die API. Die Konfiguration des Buttons kann via Request Parameter in der URL einfach weitergegeben werden. So kann mein persönlicher Favorit der Konfiguration mit Farbverlauf und “Bubble Effect” einfach als Link weitergegeben oder direkt eingebunden werden:

Button z.B. einfach live direkt in meine Seite eingebunden werden:

Aber man hat durch die API auch die Möglichkeit den Button direkt über die URL zu beschreiben. Dafür ist eigens eine API Dokumentation eingerichtet. Meine Empfehlung ist aber, dass man doch lieber mit der Workbench arbeiten und erst anschließend den Link mit den Request Parametern kopieren sollte.
Möchte man auf den vorkonfigurierte Workspace verweisen wird auch eine URL bereitgestellt.

Man muss natürlich nicht von null anfangen um einen Button zu erstellen. Auf der Beispielseite mit verschiedensten Variationen von Buttons kann man jeden dieser Buttons als Vorlage nehmen und ihn nach eigenen Wünschen anpassen:

Insgesamt ist die Button Factory eine wirkliche Vereinfachung was die schnelle Button Erstellung angeht.

Aktuell würde ich sagen, dass das mein Fundstück des Monats ist =).

Natürlich wurde auch für Personas ein Werbevideo erstellt welches zeigt welche Themes verwendet werden können:

Das wirklich schöne an Firefox Personas ist, dass man direkt eine Vorschau des Themes im Browser erhält. Einfach mit der Maus über das Vorschau-Thumbnail fahren und das Layout wird direkt im Browser dargestellt. Die Personas sind kategorisiert und können auch nach Popularität sortiert werden. Im folgenden drei Beispiele aus den Kategorien Firefox, Causes, Fashion und Nature.

Ich habe aktuell das Theme Clean Fox aus der Kategorie Firefox:

Unter anderem finden z.B. Christen etwas passendes in der Kategorie Causes:

Die eher auf ein pinkes Leopardenfell stehen sollten in der Kategorie Fashion nachschauen:

Als letztes Beispiel das Theme Electric Chaos aus der Kategorie Nature, welches animiert ist und die Blitze nur ab und an erscheinen:

Alle bereits installierten Themes kann man im Add-ons Dialog (Hauptmenü->Extras->Add-ons->Tab Themes) sehen und dort auch das Theme wechseln.

Aktuell besteht ein Bug, dass man nicht mehr als acht Themes installieren kann. Installiert man ein neuntes wird ein zuvor installiertes Theme überschrieben. Das soll in einer nächsten Firefox Version gefixt sein.

Wer mehrere Themes installiert hat kann mit dem Add-on Personas Rotator diese Themes automatisch rotieren lassen.

Der letzte Hinweis gilt noch dem vor Firefox 3.6 zwingend benötigten Personas Plus Add-on, welches auch direkt auf der personas Webseite angeboten wird. Auch jetzt noch kann es von Vorteil sein sich dieses Add-on zu installieren. Damit kann man direkt auf die Themes zugreifen, Favoriten bestimmen und noch einiges mehr. Es ist somit eine ideale Ergänzung für die Themes Junkies unter uns:

Wer also “Pimp my Firefox” spielen möchte kommt mit dem neuen Firefox 3.6 auf seine Kosten. =)

Wen solche Stop-Motion Videos interessieren der sollte sich evtl. auch noch das Lego Matrix Trinity Help Stop-Motion Video ansehen.
Ansonsten wünsche ich ein schönes Wochenende!

Und genau hier setzt der YUI! (Yahoo User Interface9 CSS Grid Builder an. Einfach per Konfiguration und simplen Menü inklusive Vorschau das gewünschte Layout innerhalb von Sekunden erstellen:

Hat man das gewünscht Layout fertig kann man sich den notwendigen HTML Code einfach kopieren und lokal im eigenen Projekt verwenden:

Der einzige Nachteil an diesem Code ist, dass der Link auf die CSS Datei online auf Yahoo geht:
http://yui.yahooapis.com/2.7.0/build/reset-fonts-grids/reset-fonts-grids.css

Aber natürlich kann man sich diese Datei auch herunterladen und einfach lokal mit einbinden.

Ein wirklich sehr brauchbares Tool.