Der von Apple geprägte Coverflow-Effekt ist mittlerweile sehr populär. Im Folgenden ein knappes Dutzend Beispiele für Coverflow in Flash oder Flex. Größtenteils können die Quelldateien heruntergeladen werden.
DisplayShelf Component
Eine ausgefeilte Komponente für Flex kommt von Ely Greenfield, Entwickler bei Adobe. Über Regler lassen sich der Winkel und die Entfernung der Bilder zum Betrachter einstellen. Die Sourcefiles können heruntergeladen werden.
„The DisplayShelf component demonstrates using a number of flex and flash concepts to provide a rich, templatable control to display a faux-3d view of a list of items. Its behavior is similar to the CoverFlow visualization added to iTunes in version 7.“
Link: Demo anschauen
Link: Tutorial: DisplayShelf Component
[ad]
Arno’s Toolbox
Sehr interessantes Material gibt es bei „Arno’s Toolbox.“ Der Coverflow-Effekt ist für Flash und greift auf eine externe XML-Datei zu. Die Anwendung kann über Themes gestaltet werden. Die Quellcodes können heruntergeladen werden.
Link: Demo anschauen
Link: Effet Coverflow d’iTunes V0.2
Die nachfolgende Version (0.3) ist bereits in Arbeit, hier eine Vorschau:
Link: Demo anschauen
Link: Preview Moteur Coverflow 0.3
Weber Design Labs
Ebenfalls mit XML-Support wartet das Flash-Coverflow von Weber Design Labs auf. Die Quelldateien für Flash CS3 und Flash 8 sind online.
Link: Demo anschauen
Link: Flash iTunes Cover Flow – Version 2
CoverFlow Flex Component
Eine CoverFlow-Komponente zum kostenlos Download von Doug McCune für Flex.
„Here’s a Flex component (with source) that does that sweet looking CoverFlow thing (you know, the iTunes/iPhone thing to show cover art). It’s a Flex component, so you can drop it into any Flex app.“
Link: CoverFlow Flex Component
Link: Performance improvement, Flex Carousel Component, Vertical Cover Flow
Yet Another Coverflow Clone
Ein weiterer Coverflow Clone heißt Yet Another Coverflow Clone“ (YACC). YACC ist in AS2 geschrieben, weshalb es bereits ab Flash Player 6 nutzbar ist. „It’s been built to be dimensions independent. That means you can use whatever size of pictures you want and embed the flash with whatever size you can think of.“ Die Assets werden über XML definiert.
Link: Yet Another Coverflow Clone
John Dyer
Ein Coverflow von John Dyer, erstellt mit Papervision 3D. Die Flashdateien für Flash CS3 können heruntergeladen werden.
„There are a million Apple Coverflow knockoffs and now there are a million and one. This one is made using Papervision3d and Tweener and includes keyboard and scrollwheel support.“
Link: Demo anschauen
Link: Yet Another Cover flow using Papervision
Flame – 3D music in ActionScript 3
Eine interessantse Experiment heißt Flame und verbindet den Coverflow-Effekt mit last.fm.
„So, what is it? When you start it, it asks for an artist. Type in something you like and flame will find similar artists, that you probably also will like. You can then browse the artists in a cool 3d interface using the arrow keys. „
Link: Demo anschauen
Link: Flame ActionScript 3 sources released
photoFlow
photoFlow ist eine kostenpflichtige Komponente für Flash. Die AS2-Version kostet $60, die AS2- und AS3-Version zusammen liegen bei 80$.
„The photoFlow Flash component displays multiple images with a stack effect, perspective and reflection. The images can be flipped by clicking on a specific image in the stack, using the supplied skinnable scrollbar, or scrolling the mousewheel. Images can be added or changed directly in the Component Inspector, through ActionScript or using an external XML file.“
Link: Demo anschauen
Link: photoFlow
Blitz Labs
Eine sehr schöne Coverflow-Animation kommt von Blitz Labs. Klickt man ein Bild an, dreht es sich auf die Rückseite und ein Video wird abspielt.
Link: Cover flow: iTunes User Interface in Papervision3D with Tweener
Werkvoll.de
Auf werkvoll.de ist eine hübsche Coverflow-Galerie mit XML-Support von Philip Klich zu sehen.
Link: Demo anschauen
Link: Blogeintrag
Coverflow mit JavaScript:
ImageFlow
Wirklich eine schöne Übersicht.
feine auswahl , danke
.. nun such ich noch dazu C Cpp C++ C# source , wer hat einen link ?
.. habe mal mit ImageFlow gespielt , find selber dass es einfach anmacht:
.. als popup ohne rand (bitte erlauben , auf ohost wird aber ausserdem noch werbung eingeblendet , die man leicht weg-klicken kann) : http://a6000000.a6.ohost.de/CoverFlow/index.html
.. und im Browser mit zoom und resize:
http://a6000000.a6.ohost.de/CoverFlow/index.htm
a6000000
.
http://www.n99creations.com/vieweg.php?id=5
sehr schöne Coverflow Galerie mit xml
cool!
als kleines update:
http://www.anttikupila.com/flash/flame-3d-music-in-actionscript-3/
Ich würde gern ein CoverFlow-Tool benützen um mir PDF-Seiten anzeigen zu lassen. Dazu hätte ich dann aber gern die Möglichkeit in die ausgewählte Seite hinein zu zoomen. Kennt jemand so ein Tool?
How can I add a video swf from youtube or dailymotion that automatically plays the video when image is in front?
ich habe folgendes iframe auf der foto seite:
(java script mit weißem hintergrund! – ImageFlow)
selig1.de/fotos.htm
selig1.de/flow.htm
hat leider relativ hohe ladezeiten (noch).
Kann man die einfach runterladen und evtl. in Typo3 einbauen? Ich werde es mal versuchen.
Ja, du kannst ja einfach ein „HTML“-Contentelement in Typo3 anlegen. Dort kannst den entsprechenden Code zur Einbindung von Flash einfügen.
Hallo,
wie kann ich es machen, dass ich noch eine Grafik darüber setze und diese dann auch im Vordergrund bleibt.
Mit Ebenen Verschieben, klappt das leider nicht.
HI,
wie kann man es machen, das links schon zwei CD`s da stehen?
Danke
Sehr coole Effekte. Danke für die tolle Liste.
das ist ein schon coverflow galerie
http://flash-gallery.com/photoflow-flash-gallery/
hallo,
ich habe eine Frage an all jene, die sich mit dem Cover Flow Effect schon länger auseinander setzen.
Ich persönlich verwende den ImageFlow von finnrudolph.de … funktioniert prächtigst. Was mir aber bei diesem (und auch bei anderen) Flow-Effekten abgeht ist irgendwie die Möglichkeit via „checkboxen“ zu definieren, welche Bilder angezeigt werden. Dass man z.B. via XML Bildern bestimmte Eigenschaften zuordnen kann (z.B. „Querformat“ und „Nachaufnahme“) und dann werden im Coverflow nur die Bilder angezeigt, die den gewählten Eigenschaften entsprechen.
Weiß jemand von so einer Lösung?
Vielen Dank und
liebe Grüße aus Wien
Andreas.
Hier der Link zu einem Coverflow mit Flash Player 10:
http://lab.andre-michelle.com/cover-flow
Hier ein schickes (kostenpflichtiges) Coverflow, das nicht nur Bilder, sondern Produktpackungen anzeigt.
http://www.digicrafts.com.hk/components/photo-flip3d-cs
Ist bei den hier gezeigten Beispielen eins dabei das die Möglichkeit bietet das Bilder nachgeladen werden, also das am Anfang beispielsweise 20 Bilder geladen werden und dann wenn die dargestellt sind nach und nach der Rest. Wenn man tatsächlich die iTunes Mediathek oder ein anderes umfangreiches Photoalbum veröffentlichen möchte kann man ja bei 1000 Bildern schon an die Grenzen geraten. Schön wäre auch wie bei einem Flashfilm in den Vollbildmodus wechseln zu können.
@Herr Himbeer
Wie sich die einzelnen Coverflows genau beim Laden verhalten, kann ich spontan nicht sagen.
Der Vollbildmodus müsste, wenn nicht vorhanden, mit Flash programmiert werden. Ist keine große Sache, wenn man weiß wie (oder man schaut hier im Blog an entsprechender Stelle).
Hier eine weitere Coverflow-Komponente:
http://www.sebastiaanholtrop.com/sebcoverflowprojectpage
Hallo zusammen,
weiss jemand wann diese Links wieder gehen
Link: Demo anschauen
Link: Effet Coverflow d’iTunes V0.2
oder finde ich diese tools auch woanders
Erstmal sehr schöne auswahl.
Ich bin auch der suche nach einen Imageflow script was sich permernent dreht und wenn man mit der maus drüber geht bleibt es stehen.
Kann mir da wer weiter helfen.
DAnke
Wow, diese Imageflows kannte ich noch nicht … Gefällt mir wirklich gut.
"The last version of the coverflow was made several years ago and its still quite popular (over 700,000 downloads on just version 2). So I decided to make a new version, this new version takes advantage of the new Flash 10 3D capabilities, which is perfect for this particular use. It allows for the Flash to load faster (because its not using Papervision3D) and most important preform much faster. Now users can add a lot more items to the coverflow and still have very snappy performance."
http://www.weberdesignlabs.com/blog/2009/12/flash-10-coverflow/
Hi,
gibt es eine Coverflow Variante für MYspace … Ohne Java ????
Super Coverflows. Kennst du ein WordPress Plugin, das soetwas kann?