A Visual Study of Open Source Cinema

For the last assignment of Open Source Cinema, Chian and I decided to continue working on the ideas we had from the Story Elements. We built a moire pattern and a zoetrope inside the 3D scene to visualize and explore our concept of space and time. After doing research to solve technical problems for three.js, we shifted to A-Frame because it’s very easy to set up and already has all the components we need to put a geometry, apply texture and make an animation without writing any Javascript codes.

The diagram above shows how we construct the 3D scene in A-Frame. A texture or an image can be easily applied to the sky, ground and cylinder. To make the moire pattern, we first create an image of an opaque ruled pattern with transparent gaps, and apply it to the inside of the cylinder. Next, we apply another pattern to the sky. Finally, we animate and make the cylinder spin. The overall process of zoetrope is similar to the moire pattern, but instead of making the cylinder spin, we make the sky spin.

Here are the links to the results. Try them with a WebVR head mount like Google Cardboard if you have one!

The Moire Pattern
http://sayhellotoalan.co/others/osc/moire/moire-pattern.htm

The Zoetrope
http://sayhellotoalan.co/others/osc/moire/sneezing.htm