5

Prototyping with animation with HTML5 export?

3 years ago from , Trainer

Would like to know what options are there to achieve this… need to publish a standalone web —so, tools that create a visible link with extra things around, or need an App to test, are not an option.

Hype and Adobe Animate export animation/interaction to HTML5 (well Animate does a Canvas export really).

Also I've noticed FramerX exports to a standalone Web.

What else would you recommend? It would be for designers with SOME (not a lot) of code knowledge to use…

7 comments

  • Benjamin ArnedoBenjamin Arnedo, 3 years ago

    If you have a mac, you could try Tumult's Hype. It's sorta like flash but it exports html5. It even has a plugin for wordpress You should give it a try.

    1 point
  • faz kamisanfaz kamisan, 3 years ago

    I am a user of Framer X myself. I really like the tool as it allow animation on action events as well on scroll. I use for both mobile and web prototypes.

    I have a working knowledge of react so if you know a bit about react syntaxes you'd feel at home. Another good thing about framer X is that you can also install packages from other users (kind of like sketch plugins) which is super handy.

    1 point
  • Billy MitchellBilly Mitchell, 3 years ago

    You could try one of these!

    https://www.haikuforteams.com/animator/ or https://aescripts.com/bodymovin/

    0 points
  • Paul Bunyar, 3 years ago

    I haven't done this but I understand you can build and prototype in Webflow. Then you can export to HTML5, CSS, JS.

    0 points
  • Martin Mark, 3 years ago

    It's a bit of an older tool but Axure would work for this - it exports raw HTML of prototypes which you can self-host.

    0 points
    • Igor StumbergerIgor Stumberger, 3 years ago

      I've been using Axure for the past 6 months now since I joined a new company. It's kind of buggy and slow when you have bigger prototypes, but when it works it's ok.

      The HTML export works great though, and we've been using it for client demos, and if they need to show/pitch it to other people.

      There is limited support for animation though, so it depends on the needs, but in most cases you can show at least some interaction that requires basic animation

      0 points
  • Ashraf AliAshraf Ali, 3 years ago

    Proto.io allows HTML5 export though you need to dissect the code to place it where you want. It’s similarly a Canvas export.

    Another option is light animations in Webflow. You can do more complex stuff with Lottie integration and AE.

    0 points