2020 CS559 Framework Tests

These are demos designed to test the framework, and to be shown in class.

The code may or may not be instructive: it was not written to be an example.

These examples are from **spring 2020** - they use an older version of THREE and the Framework

Meshes and Mesh Colors

• Two Triangles
• Vertex Color (Barycenter)

Lighting

• Diffuse Lighting
• Specular Lighting

Texture Mapping

• Textbook (simple textured object)
• Texture Gadget (x,y and u,v with sliders)
• Material Property Maps
• Fake Sphere Skybox
• SkyBox Using THREE's scene.background
• EnvMap
• Dynamic Environment Map - world centered map
• Dynamic Environment Map2 - object centered maps

Normals, Bump Mapping

• Cylinder Normals Demo
• Wavy Flat Surface Demo
• Bump Test
• Normal Map Test
• Bump Map and Environment Map

Loaders

• OBJ Test
• FBX Test (OBJ2)

Shaders

• Shader Test 0 - solid yellow
• Shader Test 1 - diffuse light naive
• Shader Test 2 - solid color, uniforms
• Shader Test 3 - Checkerboard (w/anti-aliasing)
• Shader Test 4 - Dots (w/anti-aliasing) - see A10 below
• Shader Test 4s - stripes (simple)
• Shader Test 4s - stripes (anti-aliased)
• Shader Test 4c - Simple Sin vertical lines (Aliasing)
• Shader Test 4b - Simple Sin Noise (Aliasing)
• Shader Test 4p - Perlin Noise
• Shader Test 5 - Luke's Demo (simple lighting)
• Shader Test 6 - Image Texture Lookup
• Shader Test 6b - Image Texture Lookup - with bias control
• Shader Test 7 - Displacement map using Vertex and Fragment Shader
• Shader Test 8 - Lighting Test 1 (diffuse)
• Shader Test 9 - Lighting Test 2 (using THREE.js lights)
• Shader Test 10 - Compare with built-in Phong (Lighting with better comments)

Practice for 2019 Assignment 10

• Assignment 10 - Diffuse Shading (camera space) 4-1
• Assignment 10 - Anti-Aliased Dots 6-1

Fancy Shaders (Conversion Examples)

• Ocean Waves (ported from ShaderFrog)

External Demos

• Eric Haines' Phong Shading Demo

Historical Demos

• Eftychios Sifakis' "Simple" WebGL Texture Example