Adobe Flash Catalyst: Anwendungen schöner machen

Zwischen den Designern und Programmierern wird die Kluft immer größer. Adobe versucht mit einem neuen Werkzeug, die Brücke zu schlagen. Flash Catalyst ist eine einfach zu nutzende Anwendung, die mit wenigen Mausklicks interaktive Prototypen von RIAs oder Websites erzeugt. Und im Prototyping ist das Tool besser aufgehängt, als im erhofften Einsatzbereich.

Vor etwas mehr als einem Jahr startete Adobe unter dem Codenamen „Thermo“ ein ehrgeiziges Projekt. Das Ziel: Designer sollten die Entwicklung von reichhaltigen Internetanwendungen in Zukunft nicht mehr nur zu Beginn begleiten. Sie sollten bis zum Schluss ein Auge auf die schlüssige Informationsarchitektur behalten und die Einhaltung des aufwändig gestalteten Designs überwachen. Schnell war klar, dass es nicht darum ging ein neues Werkzeug zu entwickeln. Vielmehr war ein ganz neuer Workflow gefragt: “echtes Roundtripping”.

Am ersten Dezember zeigte Adobe in Mailand die erste Beta-Version des neuen Werkzeugs Flash Catalyst, das Photoshop- und Illustrator-Dateien in interaktive Flash-Anwendungen konvertiert. Bevor sich echtes Roundtripping auf Flash-Basis durchsetzen wird, ist damit bereits eines Realität, es gibt ein neues Flash-Tool für Dummies – Entschuldigung: “Designer”.

Grafische Haube, Coding Engine

Kein Adobe-Mitarbeiter würde diese Einordnung zulassen. Catalyst ist ein SWF-Erzeuger mit einfachem grafischen Frontend. Das Spannende am neuen Adobe-Werkzeug ist die Tatsache, dass alle Interaktionen und Bewegungsbefehle in MXML umgewandelt werden. Grafische Inhalte werden in einem Kombinationsformat aus XML und angehängten Assets, namens FXG, verarbeitet. Das gibt dem Coder die Möglichkeit, direkt in die erzeugte Anwendung hinein zu arbeiten und die vom Designer angedachten Funktionsabläufe zu verfeinern, an Datenbanken und an Server anzukoppeln.

FXG ist das neue Austauschformat für grafischen Content: XML-Datei mit angehängten Assets

Und so geht’s. Der geneigte Designer, dem es an Scripting-Kenntnissen mangelt, legt, wie bisher, sein pixelgenaues Layout in “Photoshop” oder “Illustrator” an. Er benutzt Ebenen für die unterschiedlichen Zustände, die die Anwendung bilden sollen, etwa die MouseOver-Reaktion eines Buttons oder auch die Variation zwischen Seite 1 und Seite 2.

Das fertige PSD-File oder die AI-Datei wird mitsamt aller Ebenen in “Catalyst” importiert. Dort öffnet sich eine Art Mini-Flash. Offiziell gibt es erstmal keine Timeline. Tatsächlich ist sie aber doch in einem Panel einsehbar. Sie funktioniert ohne Keyframes, also ähnlich wie der neue Tweening-Ansatz in “Flash CS4″.

Die Animationen werden ähnlich wie in “PowerPoint” als Übergang von einem Zustand (oder sollten wir es “Slide” nennen) zu einem anderen. Um die Ansicht der Zustände zu definieren, werden einfach die unterschiedlichen Ebenen sichtbar und unsichtbar gemacht. Wer sich dazu entscheiden kann, seine Website in Flash zu realisieren, ist damit in wenigen Minuten durch.

Interaktionselemente

Nicht ganz. Es fehlt natürlich der Auslöser, der den Nutzer von einem Slide zum anderen bewegt. Das könnte ein Button sein. Und wie in “Flash” klickt der User mit der rechten Maustaste auf ein Element, wandelt es in eine Schaltfläche um. Hier kann er erneut über Ebenen-Sichtbarkeiten Glows, Schlagschatten oder andere RollOver-Effekte erzeugen. In einem komfortablen Interaktionspanel wird das Verhalten der Anwendung definiert. Die Auswahlmöglichkeiten sind eng begrenzt, um den script-aversen Nutzer nicht zu überfordern.

Ähnlich einfach funktioniert auch das Umsetzen von Formular-Elementen. Rechtsklick, definieren, welcher Objekttyp es sein darf – fertig. Schneller kann man kein grafisch, spannendes Formular erzeugen. Die Verarbeitung der Formularwerte übernimmt natürlich der Programmierer, aber wer den nötigen Code kennt oder sich zutraut ihn aus einer früheren Anwendung zu kopieren, dem gelingt auch das im Script-Fenster von Catalyst.

Fazit

“Flash Catalyst” ist eine einfach zu nutzende Anwendung, die mit wenigen Mausklicks interaktive Prototypen von RIAs oder Websites erzeugt. Und im Prototyping ist das Tool besser aufgehängt, als im erhofften Einsatzbereich. Echtes Roundtripping ist für eingespielte Design/Programmierteams nur bei sehr großen oder fragmentierten Projekten wichtig. Die zügige Veröffentlichung eines Prototyps für Usability-Tests oder Besprechungen mit dem Kunden scheint naheliegender. Probieren Sie es selbst. Die Pre-Release erscheint in den nächsten Tagen in den Adobe Labs. Bis dahin gibt’s ein kleines Demo-Video. ™

Weitere Beiträge:

• 5 Ideen wie Sie wiederkehrende Arbeitsschritte & Marketingprozesse gewinnbringend im Internet automatisieren! Ein Gastbeitrag von Robert Nabenhauer.
• Wachstum durch Facebook-Gewinnspiele: Wie Sie über Facebook virale Gewinnspiele & eine schnell wachsende Fangemeinde aufbauen
• Wie Sie aufmerksamkeitsstarke Prelaunch-, Launch- und Relaunch-Szenarien aufbauen und dabei Viralität, Spannung & Kaufkraft erzeugen
• Wie Sie waschechte Iphone-Apps mit PhoneGAP entwickeln, um am lukrativen App-Markt mitzumischen
• Wie Sie Ihr Shop-Sortiment so präsentieren, dass der Kunde in Zukunft mehr findet und eher kauft! Ein Gastbeitrag von Nicolas Schmidt-Voigt.
• 11 faszinierende BuddyPress-Plugins, um kostenlos aus WordPress ein soziales Netzwerk zu zaubern
• Die Vorboten einer neuen Internet-Industrie! Ein exklusiver Rückblick & Blick hinter die Kulissen der Clickbank-Exchange 2011 in New York.