3D concepts

An outline of 3D graphics concepts.

  • Renderer (backend)
    • WebGL
    • OpenGL
    • Scanline rendering
    • Raytracer
  • 3D Scene: a scene combines light, camera, and geometries in a viewable 3D space.
    • Scene graph: a model of the geometries, lights, cameras in a scene. Typically a tree (though not always).
    • 3D Coordinates
    • Skybox
    • Quaternion: math for rotations in 3D space
  • 3D Camera
    • Field of view
    • Near and far clipping plane: objects outside these bounds won't be rendered.
    • Viewing frustum: the field-of-view of the camera. Objects outside may not be rendered.
  • 3D Light
    • Ambient light (directionless)
    • Directional light (sun)
    • Point light: lightbulb
    • Spotlight
    • Area light (light shape, like a box of light)
    • Hemisphere light: glowing dome over the scene
    • Raytracer
  • Aspect Ratio
  • 3D Mesh / Geometry
    • In Three.js, a Mesh is made up of a Geometry + Material.
    • vertices (points)
    • edges
    • faces (fill)
    • Surface normal: line that is perpendicular to a face
    • NURBS: splines like Bezier
    • Backface culling
  • Models: serialized mesh
    • 3D file formats / serializing models
  • 3D material: Typically an instance of a shader. Defines how a mesh surface looks and interacts with a light.
    • Shader / shading
    • GLSL: shader language.
    • PBR, or physically-based rendering
    • Metalness (shiny)
    • Roughness
    • Specular highlights, reflectivity
    • Diffuse
    • Raytracer: trace the rays of a raycaster for reflections, shadows.
  • 3D Texture skins the mesh
    • Texel: texture pixel
    • Voxel
    • Texture mapping
    • UV mapping: mapping how texture wraps mesh
    • Bump mapping: simulate bumps and wrinkles
  • Objects (Mesh + material w/ texture (optional))
    • 3D Group can be used to group many objects in the scene graph and move or scale as a group.
    • Child objects (like groups, child objects have a position and rotation relative to the parent)
  • Animation
  • Interactivity
    • Raycaster
    • Collision
  • Point cloud: a literal cloud of points

Modeling

  • Subdivision Surface

Etc:

  • WebGL vs OpenGL
  • HDR Lightprobes with Mirrorball

Pathways

Important paths between toolchains:

  • Creating models, importing models into game engines.
  • Creating shaders, bringing into game engine.
  • Creating normal maps and texture maps, bringing into modeling software or game engine.