FLASH CATALYST & FLASH BUILDER

Verslag

3 june 2009

Eindelijk was de dag daar, dat de beta-versies van zowel Flash Catalyst en Flash Builder (voorheen: Flex Builder) verkrijgbaar zijn. Mijn verwachtingen waren hoog, zeker na de pre-release van beide op Adobe MAX. Hoewel de mogelijkheden en bugs toentertijd aanwezig waren, was het een veelbelovend product. Die mening is onveranderd gebleken in de zeer interessante sessies op de meeting van de Adobe User Group, op woensdag 3 juni in Pakhis de Zwijger.
Hoewel Adobe vaak doet lijken dat het deze producten betoverd heeft, moet men zich zeker realiseren dat deze programma’s geen magie bevatten. Er worden geen kant-en-klare interactieve rich internet applications gegenereerd met één druk op de knop. Desondanks zal er met deze geweldige producten veel veranderen in de nabije toekomst.

Hoe kan ik aan de slag?
Adobe richt zich met Flex 4, Flash Builder en Catalyst op het veranderen (lees: verbeteren) van de workflow om op deze manier een betere productiviteit te realiseren. Dit zal leiden tot expressievere rich internet applications die continu de grenzen op zullen zoeken. Nu is er over de komst van Flash Catalyst en Flash Builder al enorm veel informatie te vinden. Laten we dus zaken bespreken die belangrijk zijn voor iedereen die met deze programma’s wil gaan werken. Wat zijn de do’s and dont’s? Waar moet je op letten als je deze producten wil gaan gebruiken? En waar vind je interessante blogposts die je ook daadwerkelijk aan de slag helpen?

Flash Catalyst & Photoshop
Het importeren van een vormgeving vanuit Photoshop is op dit moment nog niet aan te raden: de code die gegenereerd wordt vanuit Flash Catalyst bestaat namelijk uit een enorme lijst (embedded) beelden. Flash Catalyst kan de inhoud van een Photoshop bestand niet goed analyseren en maakt overal een plaatje van; dit heeft als gevolg dat de swf afhankelijk van de vormgeving enorm groot zal worden. Mijn eerste test compileerde een swf van bijna 3 megabyte. De beste oplossing hiervoor is om Illustrator als ontwerptool te gebruiken. Doordat Illustrator gebruik maakt van vectoren, is de analyse vele malen simpeler. Hier zorgt Flash Catalyst er wel voor dat code gegenereerd wordt in plaats van beelden.

Note: deze analyse zal continu verbeterd worden, tussen de alpha pre-release en beta-release schijnt al een enorme clean-up in code-generation te zitten.

Roundtripping: Catalyst, Builder en Creative Suite
Nu er nieuwe applicaties komen die het proces van idee tot realisatie enorm vergemakkelijken, en ook voor overlap in dit proces zorgen, is roundtripping belangrijk. Hoe gaat men met assets om? En wat gebeurt er als je terug naar de tekentafel moet? Het heen-en-weer schakelen tussen de verschillende programma’s moet vlekkeloos gaan en de wijzigingen niet in gevaar brengen. Mijn vraag aan Mihai Corlan (www.corlan.org) en Christoph Rooms (www.christophrooms.com) was dus ook hoe dit geïntegreerd was in Flash Builder, Flash Catalyst en de rest van de Creative Suite. Deze round-tripping is gewenst en staat ook hoog op de lijst bij Adobe. Dus dat is goed nieuws. Het antwoord:

Op dit moment is het nog niet mogelijk om round-tripping tussen Flash Catalyst & Flash Builder voor elkaar te krijgen. Volgens de theorie moet het wel mogelijk zijn om een goede round-tripping te bewerkstelligen tussen Flash Catalyst en Illustrator of Photoshop. Persoonlijk heb ik hier nog mijn bedenkingen bij. De round-tripping tussen de producten zal naar mijn verwachting nog niet optimaal zijn. Binnenkort hoop ik jullie hier meer over te kunnen vertellen.

Het zou in ieder geval niet handig zijn dat elk onderdeel van een component los vervangen zou worden. In een ideale situatie zou Adobe goed kijken naar asset management binnen InDesign en ook binnen Encore. In inDesign is het gemakkelijk om bepaalde onderdelen te vervangen door de externe assets aan te passen. Ook zou een soort illustrator-stylesheet zeer gemakkelijk werken. Door te werken met bepaalde naamgeving van lagen (Encore) zou er een link gelegd kunnen worden tussen component en vormgeving. Deze vormgeving zou dan vanuit illustrator gemakkelijk vervangen kunnen worden.

Flash Catalyst en relatieve rich internet applications
Het allereerste probleem waar ikzelf tegenaan liep waren relatieve rich internet applications. Dus een applicatie die zich aanpast naar gelang de grootte en ruimte die hij kan gebruiken in het scherm van de gebruiker. In Flash Catalyst wordt de gebruiker gedwongen om de grootte van zijn artboard in te stellen, wat het ontwikkelen van relatieve onderdelen onmogelijk maakt. Deze kwestie heb ik in de pauze besproken met Mihai Corlan (www.corlan.org) en hier ging hij meer onderzoek naar plegen. Het is namelijk een belangrijke featur, en dat was Mihai snel met mij eens.

Workflow van designer en developer
Flash Catalyst kan mogelijk een groot succes worden en een enorme boost in productiviteit geven. Dit alles is op dit moment nog slechts een mogelijkheid, want het succes van een product wordt bepaald door zijn gebruikers. Bij Flash Catalyst is dat anders, omdat zijn succes ook bepaald wordt door de gebruikers om hem heen: developers & met name designers. Zij zullen hun workflow aan moeten passen om alle onderdelen in deze nieuwe methode samen te laten werken. Het betekent voor de designer een enorm geordend bestand bestaande uit vele verschillende lagen. Zoals Gerdt Brouwer ook aangaf, is de naamgeving van objecten zeer belangrijk, aangezien dit in Flash Catalyst lastig te ontdekken is. Het betekent voor iedereen: rekening houden met de workflow die er op dit moment beschikbaar gesteld wordt door Adobe.

Flex 4 framework
Omdat er bij Adobe enorm veel nieuwe en interessante ideeen ontstonden zoals Flash Catalyst, moest er hard gewerkt worden aan de opvolger van Flex 3. Met codenaam Gumbo werden de eerste stappen richting Flex 4 gezet - de beta-versie (http://labs.adobe.com) hiervan is inmiddels een feit. In Flex 4 is enorm veel veranderd. Om onder andere Flash Catalyst mogelijk te maken was er een grondige aanpassing in het framework nodig. Qua architectuur is het framework op verschillende plaatsen drastisch herschreven. De doelen van de nieuwe SDK zijn: Design in mind, Developer productivity en Framework evolution.

In Flex 4 zal je dus merken dat het skinnen van componenten vele malen gemakkelijker zal worden door de combinatie van MXML en FXG. FXG is de grafische variant van MXML, zodat business logic en design beter te scheiden zijn. Verder wordt er two-way binding geïntroduceerd en is de benadering van de layout compleet gewijzigd. HBox en Canvas behoren tot het verleden en zijn vervangen door Groups. Verder zal het leven voor vele programmeurs ook stukken gemakkelijker worden met de komst van de nieuwe text-engine in Flash, en dus ook Flex. Het vet, onderstreept of cursief maken van een tekst zal stukken gemakkelijker worden; en uiteraard is dat slechts de top van deze ijsberg.

Voor een goede overview over de nieuwe Flex 4 SDK bkan je naar deze site: http://bit.ly/8cAVe. Verder kan je hier een aantal interessante tutorials vinden: http://bit.ly/lDmwc

Migreren van Flex 3 applicaties naar Flex 4
Volgens Adobe is het mogelijk om een directe migratie te doen van Flex 3 naar Flex 4. Dit zou meteen naadloos moeten werken. Met de nadruk op “zou moeten”, want dit is helaas niet het geval. Om deze beschikbaarheid te garanderen heeft Adobe verschillende oplossingen moeten bedenken en Aral Balkan heeft hier een leuke blog over geschreven: http://aralbalkan.com/2209. Verder zijn veel migratie problemen beschreven op het internet, bij deze ook een tutorial waar je de meeste problemen kan vinden (en oplossen uiteraard): http://bit.ly/124E97

Flash Builder en server/service integratie
Database koppeling maken of Flickr foto’s ophalen? Geen probleem: in ongeveer 10 klikken en het is voor elkaar. Binnen Flash Builder kan men namelijk met een aantal simpele klikken de server of nog interessanter de service op een gemakkelijke manier integreren. Data-centric development maakt het communiceren met externe diensten of andere server-side programmeertalen zeer gemakkelijk. Door grote delen van je benodigde code en koppeling automatisch te genereren, kan je als webdeveloper lekker achterover leunen. Voor meer informatie hierover kijk ook: http://bit.ly/3z3Xjs. Verder uiteraard ook een interessante tutorial: http://bit.ly/1bV5e

Flash Builder productiviteit
De nieuwe versie van Flash Builder richt zich ook op productiviteit. Er zijn vele verbeteringen doorgevoerd en de software is flink gegroeid sinds zijn voorganger. In de Flash Builder kunnen we de volgende nieuwe functionaliteiten verwelkomen:

- Uitgebreide package explorer
- Automatische genereren getter/setter functies
- Code indentation
- ASdoc hints gegenereerd door Flash Builder
- Unit testing
- Een library met templates
- Commandline compiling
- Een zeer significante versnelling in het compileren

De Flash Builder word steeds krachtiger en volwassener. Het is duidelijk te zien dat Adobe niet alleen een degelijke programmeer-omgeving wil neerzetten maar ook hier kiest voor de click-and-run methode. Het programma bevat namelijk vele features waar men met een wizard functionaliteit toevoegt aan zijn project. Een goed voorbeeld hiervan is Flash Builder en server/service integratie. Voor een compleet overzicht van de nieuwe onderdelen in Flash Builder kijk hier: http://www.adobe.com/devn ... ex4builder_whatsnew.html. Zelf testen? Download de beta’s hier: http://labs.adobe.com.

Voorlopige conclusie
Graag wil ik afsluiten met het volgende: “Keulen en Aken zijn niet in één dag gebouwd” wat we zeer zeker niet moeten vergeten. De producten voldoen nu nog niet aan de normale standaard die men van Adobe gewend is en om die reden zijn het ook nog beta-producten. Ik ben ervan overtuigd dat deze producten in de toekomst zich krachtig zullen gaan ontwikkelen en de kwaliteit van rich internet applications hierdoor enorm zal toenemen.

Wil je meer weten over de verschillende presentatie is dat uiteraard mogelijk. Op de website van de Adobe User Group zijn foto’s en video’s te vinden van de presentaties. Neem hier zeker eens een kijkje, en vergeet jezelf natuurlijk niet (kostenloos) te registreren als lid van onze vereniging!

Auteur: Kevin Rommen

Flash Catalyst & Flash Builder
Op 3 Juni presenteert de Adobe User Group Nederland in samenwerking met Adobe de nieuwste software van Adobe
Pakhuis de Zwijger, Amsterdam
Piet Heinkade 179
1019 HC Amsterdam

Programma