The goal of this homework is to practice texture mapping in 3D.
Octahedron
Building on Lab 10, first create a regular octahedron (from scratch -- you may not use the built-in octahedron geometry for this homework) and then texture map it using the texture below:
Requirements:
- It should be texture mapped exactly as shown in the video below. Note carefully the orientation of the faces relative to each other.
- Make your octahedron rotate and choose a camera viewpoint so that the full texture mapping is visible. I need to be able to see it all in order to give you credit.
Textured Scene
In the next part we will create a fixed "room" or "scene" using textures. You may include the octahedron in the scene, or do this portion in a separate file. First make a "floor" similar to the one shown below (octahedron not shown). You may need some transformations to move the floor to the correct spot. Then make the "walls" or "background". Finally, you could create a "ceiling" or "sky" (not shown). Alternately, you can add a "skybox" around the whole scene.
Feel free to use your imagination here to create a scene that is visually interesting, perhaps including objects or a more complicated structure than a simple box. Work that goes beyond the basic requirements listed here may be considered for extra credit.
Requirements:
- You must use at least 3 textures and create at least 3 planes (one floor and two walls OR one floor, one wall, one ceiling, etc).
- You may use the textures from Lab 10, but at least one texture must be your own that you have found. There are stock photo sites that also have free textures. (You can cite where you found your texture as a comment at the top of your code.) Include all your textures with your submitted files.
- One texture must be "tiled" or repeated across its surface (details below; wall texture in image shows tiling example). For this texture, it should either have a natural boundary for repetition, like a floor tile, or if it is composed of irregular shapes they should "line up" seamlessly on the top/bottom and left/right so that it looks uninterrupted. The wallpaper texture from the lab doesn't quite tile seamlessly, but it could be cropped so that it does.
- At least one texture must have a normal map or bump map applied to give it a 3D effect. You can find free textures with associated maps at various sites.
- Make sure your camera viewpoint demonstrates the parts of your scene so that I can verify all the required elements.
An example image is shown below, omitting the octahedron.
Repeating Textures
For a large region, usually we want to "tile" the texture instead of using one scaled image. To do this, we can set the repeat number of the texture in each direction (u and v). Example code is shown below:
var loader = new THREE.TextureLoader(); // don't repeat this if you've already done it var texture = loader.load( 'mytexture.jpg' ); texture.wrapS = THREE.RepeatWrapping; texture.wrapT = THREE.RepeatWrapping; texture.repeat.set( 2, 3 ); // twice in u and three times in v
Completion
Include a checklist in a comment at the top of your file telling me where to look for each requirement you have met.
Submit your html file, a representative screenshot of your scene, and all of your texture files.