Welcome to the third and last part of the article about the After Effect / CSS 3D Transform transitions workflow : After Effects to CSS 3D workflow – Part 3 – Finalisation.
Click here to see the main page of the article : http://www.turbodrive.tv/blog/css-3d-transitions-workflow-using-after-effects/
Part 3: JS finalisation and enhancements
Let’s start with the JSON file, generated by the JSX script in After Effects. The JSON object contains 2 arrays :
sprites3d. All of them store objects defining names, positions and rotations of the 3D elements in the scene.
Get back the main.js file seen in the first part and modify some code. It should have the scene creation, targets and controls only when the JSON file is completely loaded and parsed.