Outline
In this lab you will:
- choose an aspect of 3D worlds to explore
- research into your chosen aspect
- develop and explore variations of the provided code
- start your blog posting
Introduction
Today you will prepare for your first blog post for Year 12.
This year - you are given alternative topics to choose from.
You are expected to engage with one of the topics, do a little research, and explore variations to the provided code.
Alternatives
2D to 3D
How does it feel to move from coding from a 2D environment to coding in a 3D environment?
we live in a 3D world - so projecting our art onto 2 dimensions should appear unnatural. However, our education systems and computer systems focus on the 2D environment and we often tend to think visually in 2D, complicating the transition from 2D to 3D.
How do you feel about the transition? How do you make good if not great 3D graphics? What can we bring from 2D into 3D? As a prompt, I suggest looking at John Lasseters early paper on applying the principles of traditional animation to 3D.
I would like you to explore 2D to 3D - so generate both 2D and 3D works and compare and critique these.
Quaternions
If you like getting technical then this is for you.
I mentioned in Lab 1 that quaternions were superior to rotation about X, Y, and Z when working with 3D rotations.
I would like you to investigate the issues you might encounter in rotations, and explore whether quaternions provide a solution to these issues, or if they add other issues.
Your code investigation must include rotateX, rotateY, rotateZ and compare this with quaternion rotation. You code and discussion should demonstrate the issues, and benefits. Your research should focus on quaternion rotation.
Rendering in P5.js
It has been suggested that ray-tracing would be preferable to the type of rendering provided by p5.js.
For this topic you should investigate:
- what technique does p5.js use and why? (I found a reference to phong in the p5.js source code)
- are alternatives to this possible? has anyone developed a 3D coding platform in JavaScript that uses alternatives?
- how might you workaround the limitations?
- how can you best use what is provided by p5.js to develop compelling visual art?
A Virtual World of Geometries
This topic asks you to think about, explore and research into geometries of 3D models.
This is a very hands on exercise:
- create objects from provided 3D models (box, sphere, etc.)
- load models using loadModel() from other packages (.OBJ or .STL file formats) and adapt them to work in your 3D environment
- generate geometry from code using beginGeometry() endGeometry(), buildGeometry() or p5.Geometry
You may use code from web-based sources to generate your solutions - but you should explore and adapt these to build significant variations.
Create virtual worlds using these techniques.
Write about your experience using the different techniques for creating geometry.
Compare and contrast the various techniques.
Remember to commit your code and push it up to Gitlab.
Summary
Congratulations! In this lab you:
- chose an aspect of 3D worlds to explore
- began your research into your chosen aspect
- started to develop variations of the provided code
- started your blog post
Suggested Reading Resources
2D to 3D
Lasseter, J., 1998. Principles of traditional animation applied to 3D computer animation. In Seminal graphics: pioneering efforts that shaped the field (pp. 263-272).
Quaternions
Hart, J.C., Francis, G.K. and Kauffman, L.H., 1994. Visualizing quaternion rotation. ACM Transactions on Graphics (TOG), 13(3), pp.256-276.
Behreandt J., 2018 3D Rotations in Processing (Vectors, Matrices, Quaternions) Medium.com
Rendering in P5.js
Phong, B.T., 1975 Illumination for Computer Generated Graphics. Communications of the ACM, 18(6).
A Virtual World of Geometries
Suggested searches: STL vs OBJ formats. Creating Virtual Worlds. p5.js 3D webgl
Okazaki, D., 1993. Visualizing geographic data through animation. In AUTOCARTO-CONFERENCE- (pp. 238-238).
Wijntjes, M.W. and van Zuijlen, M., 2020. Sketch-and-test: picture-centered research with p5. js assisted crowdsourcing. arXiv preprint arXiv:2004.08198.