Here is a video of the Codex Menu in Mass Effect:
This menu uses Scaleform GFx, which was a game development middleware package, a vector graphics rendering engine used to display Adobe Flash-based user interfaces and HUDs for video games. You can find menus like this in most games (Crysis, Borderlands, Mass Effect, etc). I love the interactivity of these menu elements.
I want to create a menu in a fixed layout EPUB3 that mimics some of the elements seen in the video. There will be two buttons at the bottom of each page, one for the document index, and the other will be an XP calculator. I would like these two buttons to mimic the rollover effect on the "Primary" and "Secondary" buttons in the video. You can see how the buttons change colour from blue to orange on rollover, and the edge "cap" geometry expands inwards. I also want to mimic the on-click effect where the outside element expands in size and the whole button changes colour to teal.
Is it possible to have a button like this in a fixed layout EPUB3? Would the animations work on a mobile device (what will happen to the rollover state)? I have created the geometries in Illustrator already, and I have watched some tutorials on how to create animated rollover / click states for buttons in Animate (so I already have some idea of how to make elements appear to move and expand with masks and keyframes, etc), but none of the tutorials show how to make a button gradually change colour while its elements are moving around at the same time.
Also, once I animate the buttons in Animate, how do I output them from Animate into the InDesign file? All of the tutorials I've seen show everything but that part.
