It has been almost 5 months when I started looking into Haxe and OpenFL and I have been meaning to transition my website from Flash into HTML5 friendly.
Link
you can view the website at:
It is both desktop and mobile friendly. I am still adding project pages this week and fixing issues but it is pretty much ready.
Concepts
In the beginning I had the idea of creating a 3D website that feels more like an app rather than just a website, where each page has some interaction content and my portfolio page resembles an app store.
Below is the image component with 3 images spinning around as you browse through them.
3D Engines
And so early on I tried various 3D engines for Haxe, starting with BabylonHX but I did not manage to compile anything as the library was outdated and hardly documented. Next was Away3D and initially this was also tricky as it was not compatible with the latest version of OpenFL (which is fixed these days 
). But with enough persistence I was able to eventually create something in Away3D and OpenFL.
Early issues I was facing were how to render text in Away3D, there was a bitmap font library but it was so slow it took at times 6 minutes on a mobile device to parse a page of text. Eventually I came up with the idea of using OpenFL’s textfields and render the text portions into power of 2 textures.
Geometry
For the 3D models I ported a library I wrote in the past to manipulate 2D paths and extrude, fill, inset etc. them. Most of the buttons, panels and backgrounds are created this way, from 2D paths.
3D Icons
One of the features I like a lot are the 3D icons which use transparency but because their mesh is generated I can determine the draw order of the layers (which usually is an issue for transparent textures in 3D). This is similar to Apple’s TVos and iOS 3D icons.
The textures are png images with with a specific height which indicates how many layers it contains
Documents
For the pages themselves I use a custom document format which supports certain tags to indicate UI elements and their parameters. Many of the existing formats such as BBS or html are simply to powerful and xml is to bloated.
I have a debug mode where i can check the layout parsing but for most of the time my pages do not require any complex layout trees and alike.
Things that surprised me with Haxe
- The compiler is really fast.
- I love the hxmath library, without it I would not have continued with this project as it makes Vector3 and Vector2 math so much easier and reduces the code bloat.
- OpenFL is familiar to me and there are plenty of example snippets.
Things that I wish were easier with Haxe
- Compiling libraries such as BabylonHX and Away3D or finding easier instructions for specific library dependencies.
- A better or uniform approach for handling high res screens such as mobile phones or modern laptop screens.
- A more modern API for Away3D, many of it’s core methods and storage are in x,y,z triplets stored but having used API’s like Unity where there are Vector3 objects makes development so much easier and require far less boilerplate code.
- At times a build gets stuck in either debug or release mode and I have to delete folders to free the localhost cache.
Libraries that I used
- OpenFL for the events, fonts and framework
- Away3D for the 3D viewport, materials
- hxmath for the 2D and 3D math, mostly involving Vector3, Vector2 and rect operations.
- mloader to bulk loading dynamically assets, not all in advance.
- thx.color for color interpolations
- actuate tween animations for buttons and panels
