Separation of concerns: layout and code

[Eric Mulvihill]

Hi all,

 

This is my first post here.. please be kind.  I work at a software company and we are looking to rewrite our existing Flash content in HTML.  Flash gave us a very nice separation of concerns between art and code.. the artist could place sprites on the timeline, make different frames, give things IDs, etc. The coder could then take this specification and "make stuff happen" in code.

 

What tools do people use to give a similar separation on concerns in HTML game development? I'm thinking of some sort of drag 'n drop editor that lets an artist make "scenes", add backgrounds/sprites/animations, give them properties like scale, ID, visibility, etc. Then there would be JSON or some other exported representation that the coder could use to recreate the layout in the game's runtime.

 

Commercial or open source tools are both fine for me, I don't want to reinvent the wheel if someone already wrote such a framework.  But having artists specifying layout in Javascript is just a blocker for us.

[none-9999]

maybe you will see the adobe animate edge, it is good.

[brejep]

Your designers could still use Flash if that is a tool they are comfortable with.

 

There are several options to export from Flash for use with HTML5 projects:

• You could use Flash CC's in-built publish to HTML5 canvas option. It outputs for createjs.
• You could use  Photonstorm's Flash to Phaser jsfl script - http://www.photonstorm.com/phaser/flash-to-phaser-jsfl-script.
• If you need something more customised, your developers could always write a custom jsfl command to export scene information as json. There are already lots of examples on github.