Hierarchical Modeling: Modeling and Animating Insect Models Using WebGL
This assignment will be done in groups of two students. Because it is done in groups, my expectations about the quality of your user interface, generated models, and the realism of your animations are high. Grading will be based on the functionality of the user interface, the quality of your model, rendering quality, and the quality of the animations.
Please note that the source codes of the programs that you will write will be submitted to Measure Of Software Similarity (MOSS) system for checking the similarity between the source codes in the class and as well as any similarity to the source codes on the Internet. Any similarities of a significant percentage requires disciplinary action. Please note that MOSS is very successful in identifying similarities. You can only use the sample code of the humanoid program in the textbook as a starting code. You must modify it significantly according to the requirements of the assignment.
Demo will be at the class hour. Every student is required to be in the demo and responsible from all parts of the project.
Grade Value: 20 %
You will demonstrate your programs in class in the scheduled time. All the students must be physically available in the demonstrations. Demonstrations are a kind of exam. You will be asked questions to understand your contribution to the assignments in the demos.
You must also submit your source codes (including online documentation (comments and a README.txt file explaining how it is compiled and run) to the TA. You should email (with the Subject CS465 Assignment #2) to Aytek Aman (aytek.aman@bilkent.edu.tr) a single zip file named as LastName_Name_CS465_Asst2.zip, containing two directories: Source, Executable, and a README.txt file describing how to compile and run your assignment.
You are supposed to implement a 3-D hierarchical model for modeling and animating insect figures (could be a spider, fly, bee, ant, or your favourite) using WebGL. You will use the matrix stack and the tree traversal approaches that are used to manipulate the primitives and transformations using matrix stack that we have discussed in class.
Essentially, you will write a sequence of function calls with appropriate transformations and transformation parameters, and when you execute that segment, it should produce a hierarchical model of a 3D insect model. When we change the model parameters, it should behave accordingly. You will also animate your models by changing the model parameters gradually. You can implement the insect model using the following primitives:
Build a user interface to display and animate your model. To this end, define some buttons/sliders for specifying transformation parameters for joint angles, etc. In other words, I should easily be able to give a posture to your animal using your interface.
You should demonstrate a sample animation of some behavior, such as walking, running, flying, or a more complex behavior (like a spider crawling a web or jumping over a hurdle). You could save your animations in the form of frames so that when you play the frames back you could get a faster animation. You should implement save/load procedures for this purpose. You can save / load your animations in the form of joint transformations for keyframes and playback them when you load these).
Grading will be based on (i) the essential functionality (ease of giving posture to your model and saving these postures as keyframes of an animation), (ii) the rendering quality of the animated insect model (thus, shading is important; you can use solid shaded primitives or smooth shaded primitives), and (iii) the speed and quality of the produced animations (which will be assessed by the sample animation some behavior). So, please prepare an animation of reasonable size and scenario before coming to the demonstration. Please also add some environment (ground and background texture) so that the insect does not move in blank space.
Optional:
Applying texture mapping (you can use WebGL's facilities for this purpose) to increase realism.
You could use one of the standard projection transformations for 3D to 2D conversion (either orthographic projection or perspective projection transformation 3D to 2D transformation). See the figure.html and figure.js in directory 09 of the Samples Codes for hierarchical modeling of an articulated body.
DO NOT use the third party wrappers like three.js. Use WebGL from scratch.