Google-tool zet Flash-bestand om in json-object

Google heeft een tool uitgebracht waarmee Flash-content in een json-object kan worden omgezet. Daarmee kan Flash-content geschikt worden gemaakt voor apparaten zonder Flash-plug-in. De output werkt het best met Webkit-browsers.

De online-tool Swiffy van Google biedt developers de mogelijkheid om hun Flash-content om te zetten in een json-object. Met json kan in javascript makkelijker met gegevens worden gewerkt. Het json-object wordt met een javascript-runtime uitgevoerd, waarbij html, css en svg worden gebruikt om het geheel te renderen. Google heeft vier voorbeelden van Swiffy-output online gezet.

De output werkt het best in Webkit-browsers; volgens Google gebruikt Swiffy svg-features die alleen in Webkit aanwezig zijn. Onder andere Chrome en Safari, zowel op de desktop als op iOS, hebben Webkit als render-engine aan boord. De tool kan handig zijn om Flash-content geschikt te maken voor apparaten met een Webkit-browser zonder Flash-plug-in, oftewel: de iPhone en iPad.

De tool heeft nog de nodige beperkingen. Zo wordt ActionScript maar gedeeltelijk ondersteund en mogen geüploade swf-files maximaal 512KB groot zijn. Ook neemt de output circa 10 procent meer opslagruimte in beslag dan het origineel.

Adobe heeft eerder dit jaar ook software uitgebracht waarmee Flash-bestanden kunnen worden omgezet naar een combinatie van javascript, html en css. In tegenstelling tot bij de Google-tool ging het daarbij om clientsoftware. Bovendien zet de software van Adobe de oorspronkelijke Flash-bestanden om, terwijl Swiffy werkt met swf-files. Ook is het bij de Adobe-software mogelijk om de output te bewerken; de tool geeft leesbare code als output. Swiffy-output kan in principe ook worden aangepast, maar de broncode is een stuk minder leesbaar.

Reacties (60)

[mddd]

Interessant concept, maar ik denk dat de toekomst eerder ligt in het creëren van een goede authoring tool die op een logische, begrijpelijke manier html kan produceren dan in het ombouwen van een legacy formaat zoals SWF. Zowel de tool van Adobe als die van Google pakken het probleem aan vanaf de achterkant.

De strategie van Adobe om zich te focussen op het pushen van het Flash platform, en niet op innovatie in authoring tools, zet hen nu op een achterstand. Waar blijft die killer html-productie tool? Daarmee zou Adobe zich weer relevant kunnen maken op een gebied waar de toekomst ligt, namelijk het produceren van goede html.

[Tsjilp]

Adobe werkt wel degelijk aan een html5 authoring tool. Met Adobe Edge kan je html tijdlijn animaties maken op eenzelfde manier als je animaties in flash bouwt. Nu is het nog een los product, maar waarschijnlijk gaat het geïntegreerd worden in één van de bestaande adobe pakketten (zal jammer genoeg wel dreamweavert worden)

Zie http://www.gizmag.com/adobe-edge-html5-animation-tool/16741/

[mddd]

Nu is het nog een los product

Volgens mij is het nog helemaal geen product, maar een intern probeersel van Adobe. Het doet niet heel veel meer dan sommige online html5-transform-demo's.

waarschijnlijk gaat het geïntegreerd worden in én van de bestaande adobe pakketten (zal jammer genoeg wel dreamweavert worden)

Je geeft het zelf al aan: de staat van Dreamweaver is erbarmelijk.. en toch is dat nog steeds het "beste" wat we hebben aan html authoring pakketten. Er zijn wel kleine spelers die op bepaalde vlakken heel mooi werk doen, maar zolang er geen groot bedrijf achter staat is het moeilijk om genoeg te investeren om echt een compleet en bruikbaar programma te worden.

Wil het serieus opgepakt worden, dan moet het toch van een bedrijf als Adobe of Apple komen. Vernieuwing vanuit Adobe bestaat voornamelijk uit het toevoegen van nóg meer functies aan bestaande pakketten waardoor de workflow alleen maar complexer wordt. Ik hoop nog steeds stiekem dat er achter de schermen een complete overhaul gedaan wordt en dat ze met een totaal nieuw ding komen. Maar ik vrees dat dat een droom blijft. Misschien dan toch vanuit Apple?

[edit: typos]

[Reactie gewijzigd door mddd op 9 augustus 2024 13:25]

[Verwijderd]

Er is ook deze.. en nog veel goedkoper dan Adobe Flash.. Het vertelt je ook welke acties, effecten etc. wel of niet werken in welke browser. Zeker de banner makers moeten hiermee uit de voeten kunnen... Games is misschien wat lastig

Anyway.. Waar content maker eerder alleen Flash ondersteunden kunnen ze nu in ieder geval een HTML5 alternatief bieden. Zonder er al te veel voor te hoeven doen. Wat mij betreft is dat vooruitgang..

Ik heb overigens de perfomance even bekeken, mij CPU verbruik is 'ietsje' hoger bij de Flash voorbeelden dan bij de Swiffy voorbeelden. D.w.z. marginaal, niet superieur dus maar doet er zeker niet voor onder..

[mddd]

Ik weet dat er tools zijn voor dat soort werk. Maar dat bedoel ik dus niet. Ik bedoel een tool die overneemt waar Dreamweaver voor bedoeld was: het maken van websites. Dus niet alleen banners of leuke animaties.

[Menesis]

het eerste het beste flash bestand wat ik heb uitgeprobeerd blijft in de swiffy conversion op frame 1 staan
edit: plus een rits errors terwijl ik geen speciale librarys heb gebruikt oid.
een paar opvallende:

Input text is not supported.
Video is not supported.
Sending ActionScript variables to a URL is not supported.
The ActionScript class MovieClipLoader is not supported.
The ActionScript method MovieClip.loadMovie() is not supported.
Shape tweens are not supported.
Loading a URL into a MovieClip is not supported.

[Reactie gewijzigd door Menesis op 9 augustus 2024 13:25]

[XangadiX]

Volgens mij probeer je ook AS2 code in dat ding te stoppen, wellicht kan hij alleen maar (een beetje) met AS3 overweg ?

[Wolfos]

Andersom. Hij kan alleen AS2 aan met Flash 8 of lager.

[XangadiX]

Nou, dan is het een betrekkelijk nutteloze tool; en daarbij bestond er al zoiets (niet helemaal hetzelfde, maar zelfde idee: http://www.wired.com/gadg...-enables-flash-on-iphone/ )

[Chris7]

Ondanks de beperkingen is dit een goed begin. Flash wordt langzaam maar zeker steeds meer verdrongen door HTML5 en JavaScript. Iets wat ik als webdeveloper alleen maar toejuich.

De output werkt het best in Webkit-browsers; volgens Google gebruikt Swiffy svg-features die alleen in Webkit aanwezig zijn.

Dat is wel jammer, maar ik hoop dat in de toekomst er een betere cross-browser compatibility komt, waardoor je geen Flash-fallback nodig hebt.

Swiffy-output kan in principe ook worden aangepast, maar de broncode is een stuk minder leesbaar.

Ik vraag me af of je dat sowieso wel nodig hebt, het lijkt me vooral een tool die handig is om bijvoorbeeld je Flash-content geschikt te maken voor iOS. Ik hoop dat de meeste mensen in de toekomst overstappen op HTML5, CSS en JavaScript om hun interactieve content te maken, want daardoor werkt het op meerdere platformen, en de broncode is eenvoudig te bewerken.

[Reactie gewijzigd door Chris7 op 9 augustus 2024 13:25]

[XangadiX]

Aan de ene kant is het natuurlijk een top idee, maar het is grote onzin dat het op deze manier moet. Ondanks dat een heleboel mensen de laatste tijd nogal anti-flash zijn, is dit natuurlijk geen oplossing voor de problemen die mensen met flash hebben. Vaak wordt dan batterijduur en onnodig gebruik van processor-kracht genoemd. Dit heeft (tegenwoordig) weinig met flash te maken en veel met het grote aantal prutsende flash developers. Op een reclame bureau een design-stagiair een flash boek geven en dan banners laten maken is natuurlijk niet bevorderlijk voor de code.
Dat zelfde probleem heb je nu ook; ik geloof er niks van dat geconverteerde code sneller of efficiënter is dan de originele code. Daarnaast, en dat vergeten veel mensen, werken veel ad-blockers op basis van het herkennen van een flash-object (en het dan uit zetten), het lijkt er op dat Google mensen de mogelijkheid geeft om simpele flash objecten (lees: Banners) om te zetten naar iets HTML5-achtigs, wat dus betekend dat iedereen juist meer banners door zijn strot geduwd krijgt die moeilijker te blocken zijn, omdat ze moeilijker te herkennen zijn.
Kort gezegd hebben we nu een tool om nog meer slecht presterend ruk geschreven banners op websites te pushen die de batterijduur van mobiele apparaten halveren en komen we van de regen in de drup.
Ik stel voor dat Adobe komt met een nieuwe versie AS (4 dus) wat itt. AS3 niet erg makkelijk te leren is (zodat prutsers er af blijven) en wat niet backwards compatible is. AS4 is een flexibele en uitgebreide library waar grafische intensieve applicaties in kunnen worden opgezet zoals web-based tekenprogramma's, games, 3d-werelden en audio programma's. In plaats van de bloat-ware die adobe tegenwoordig een 'update' noemt.
[edit] en natuurlijk kun je een dergelijk as4 project dan cross-platform distribueren

[Reactie gewijzigd door XangadiX op 9 augustus 2024 13:25]

[Verwijderd]

eindelijk flash spelletjes op je iphone (sommige dan)

[DaSt1986]

Flashgames gebruiken veel ActionScript, en dat wordt maar beperkt ondersteund, ben dus bang dat veel spelletjes nog niet gaan werken op je iPhone.

[RM-rf]

actionscript _is_ gewoon ECMA-compliant scripting (ECMA-262, 4th edition), vergelijkbaar met Javascript..
hooguit zal de Flash IDE een hoop functioncalls kennen die niet standaard zijn, maar juist de 'coversie-tools' (als dat Swiffy of die van adobe) kan toevoegen..

échter, de kans is groot dat er weinig sprake van 'optimalisatie' is en zulke toepassingen kunnen nodeloos traag en zwaar worden en qua perfomance zwaar achterblijven bij native toepassingen

[Inny]

Als ik me niet vergis zijn SWF gecompileerde bestanden. In dat geval is er geen sprake van omzetting vanuit de bron, maar van reverse engineering en/of vertaling van herkende routines naar een combinatie van html/css&svg. Dit heeft dus met name bij zaken als ActionScript met veel "eigen," complexe routines het resultaat dat er verlies van functie en/of content ontstaat.

Dat een flash game na omzetting nog werkt lijkt me dan erg onwaarschijnlijk.

[-=bas=-]

SWF is inderdaad ingepakt maar dat kan je het beste zien als een soort van ZIP bestand.
Flash heeft net als de meeste talen een bytecode met interfaces naar functies in de player. Als je in principe alle functies uit de player ondersteund dan is het enkel een kwestie van de bytecodes afspelen. Maar in de praktijk is het een stuk lastiger dan Google denkt.

Wel eigenaardig dat Google hier nog een budget voor vrijmaakt want dit idee bestond al veel langer. (http://smokescreen.us/)

[Verwijderd]

Canvas (wat gebruik maakt van Javascript) heeft grotendeels dezelfde functies als ActionScript (vaak zelfs dezelfde naamgeving). Lees maar eens dit artikel.

Het grootste probleem is dat Canvas nog niet alles ondersteund (heeft nog WIP status) en dat er geen grafische interface bestaat om het zonder programeerkennis te kunnen gebruiken.

[johnbetonschaar]

Erg veel noemenswaardige Flash spelletjes die niet ook een iOS versie hebben zijn er niet, en over het algemeen zijn native versies ook nog vele malen beter. Dus of we nou zo blij moeten zijn met Flash games op iOS. Overigens zijn er al tools om Flash applicaties om te zetten naar iOS, dus wat dat betreft voegt dit ook weinig toe.

[Reactie gewijzigd door johnbetonschaar op 9 augustus 2024 13:25]

[Verwijderd]

Als ik zo lees is het een handige tool maar als het bestand alleen maar groter wordt, de ondersteuning van actionscript maar gedeeltelijk is dat het niet echt een verbetering is flash.
Denk ook niet dat het iets is wat gebruikt moet worden om bestanden om te zetten voor niet flash compatibele apparaten omdat waarschijnlijk veel niet goed functioneert en het slecht leesbare code is, is dit ook moeilijk op te lossen.

Edit:
Heb nu ook een paar voorbeeldjes gekeken maar het ziet er allemaal niet zo soepel en shiny uit als het orgineel, de Google Chrome add sloeg op hol en mis af en toe wat elementen (cq. Graphics)

[Reactie gewijzigd door Verwijderd op 9 augustus 2024 13:25]

[watercoolertje]

Het wordt iets groter, zie voorbeeldbestanden, van 37KB naar 37.5KB nou nou poeh poeh

Zal in de toekomst vast nog beter kunnen, dit is de eerste release

[Reactie gewijzigd door watercoolertje op 9 augustus 2024 13:25]

[himlims_]

kwalitatief is 't redelijk vergelijkbaar, maar zeker geen 1:1 conversie.

Bekijk 't voorbeeld eens: http://swiffy.googlelabs.com/gallery/example1.html

duidelijk verschil in font, dikte, en enkele effecten worden niet overgenomen.
maar goed, 't is een begin

[tobiasvs]

Wel jammer dat 't uiteindelijk niet werkt als je op die banner klikt (bij "Get Chrome")

Als ze dit nou standaard inbouwen bij videosites als Dumpert, dan worden heel veel iOS-gebruikers blij!

[Timo002]

Dumpert heeft wel een applicatie dus daarvoor is geen flash of wat dan ook nodig: http://itunes.apple.com/nl/app/dumpert/id434815056?mt=8

[Flowmo]

Een flash video player heeft niet veel baat bij dit soort conversies, daar kan gewoon een fatsoenlijke html5 player voor gebruikt worden. Dat zouden ze bij Dumpert wel kunnen doen.

[Flowmo]

Try again sir, in Chrome or Safari.

[Verwijderd]

Opzich leuk initiatief, maar als je die voorbeeldjes bekijkt, dan ziet flash er wel correct uit. Vooral bij de 'symphony orchestra ad' is het duidelijk te zien als de koppeling naar YouTube in beeld komt... Dat ziet er *kuch* niet uit. En ik zie net dat het bij de Chrome ad nog veel erger is.

[Verwijderd]

Als ik de voorbeelden bekijk met FF 3.6.16 op Linux (op het werk) zie ik alleen een placeholder, helemaal geen output.
Palemoon 5 op XP laat het wel zien, en het draait goed, maar de Flash versie ziet er veel gelikter uit.

[Mavamaarten]

Leuk maar er is geen enkele swiffy demo die het doet op mijn android phone. Ze geven allemaal een grote 0 in beeld, ik denk dat het de score is ? Fullscreen versie werkt ook niet.
Het enige wat ik vind dat ze moeten maken is een YouTube plugin voor de android browser.
Flash zelf is niet zo belangrijk maar flash video's (vnl YouTube vids) wel.

[ZpAz]

Ik had ze op mijn iPad geprobeerd, daar werkten ze allemaal op.

[Verwijderd]

Niet alleen iPhone en iPad maar alle oudere Android toestellen...

[_Thanatos_]

En alle featurephones

[asx245]

Begrijp ik het goed dat dit programma gebruikt maakt van RCE aangezien het werkt met SWF bestanden?