I'm still a bit sad about Flash going away. Yes, I know lots of people hated it. But it was an amazing tool for quick prototypes. There are some projects that I keep revisiting, and over time I'm converting them to HTML5.

Last year I converted my Flash procedural tree generator (succeeded) and attempted to convert my Flash spaceship flyer (failed). This time I wanted to run my Tank Control prototype from 2012:

Screenshot of tank control prototype written in Flash

Tank Control was a series of 8 prototypes in which I tried out various control schemes for driving a tank, both for laptop (mouse/trackpad) and mobile (touch).

I can still run Flash code because I have an old copy of Flash Player. But I can't share these prototypes anymore. And it'd be annoying to modify them because I don't have the Flash compiler set up anymore. So if it's not too much work, I want to port them to HTML5.

I tried using Ruffle, a Flash emulator that reads existing web pages, converts the SWF files linked there into HTML5, and then inserts the HTML5 version into the page. Magic! This worked surprisingly well and was able to generate the output of the tank control experiments. But it didn't support the interactivity. And the interactivity is the main thing I want to play with.

So I decided to port it to HTML5.

But which one of the eight? Or all of them? I ran all eight and compared them. I also ran diff on the code to see what was similar and what was different. I decided that Tank Control #3, #6, and #7 were the ones I was most interested in.

Screenshot of tank control prototype written in HTML5

Flash's vector graphics and HTML5's SVG/Canvas vector graphics are not that different, and Flash's scripting language is EcmaScript4 whereas HTML5's scripting language is EcmaScript5, so the scripts were also not that different. Porting wasn't too bad. I wasn't using Flash's bitmap or shader graphics for this project; those are a bit harder to port. And I wasn't using Flash's MXML UI toolkit either.

It was fun to play with the controls. I also came up with lots of ideas for variations to try. But I reminded myself that the goal was to port some of the the existing prototypes, not to come up with new control schemes. I can play with new control schemes later, if I have some goal in mind.

You can play with the result here.

Labels:

2 comments:

John Doty wrote at March 07, 2023 1:33 PM

Do you have a feeling about Haxe? I'm an outsider, but from the outside it feels like a lot of flash vibes kinda went that way....

Amit wrote at March 07, 2023 1:53 PM

@John Doty: I like Haxe the language. I use it for some projects. I have a Haxe version of the tank control experiments. However my feeling is that Haxe's ecosystem is geared more towards full games and not the lightweight prototypes that I am making.