Billboard / sprite

A flat picture placed in 3D that keeps turning to face the camera, used to fake trees, smoke, labels, and other cheap scene detail.

flat image that always faces the camera2D picture in a 3D scenethe trees that turn as you walk past themfake a tree with a flat cardDoom-style enemy spritewhy does my tree look flat from the sideimpostor cardbilboard

See it

Live demo coming soon

What it is

A billboard is a flat rectangle in a 3D scene whose orientation updates to face the camera. Put a transparent texture on it and the card reads as a tree, flame, cloud puff, lens flare, label, or Doom-era enemy. A sprite is the common ready-made version of the same idea.

Use billboards when the subject does not need real depth from normal viewing angles. They replace many vertices with four, and an atlas can give thousands of instances different images. Some billboards face the camera fully; cylindrical billboards rotate only around the vertical axis so trees remain upright.

Gotcha: the flatness shows when the camera moves around the subject, lighting rarely matches real geometry, and transparent edges create sorting and overdraw problems. Texture atlases also need padding around each tile or mipmaps bleed neighboring images into the sprite.

Ask AI for it

Render 5,000 camera-facing tree billboards in three.js with one InstancedBufferGeometry and one ShaderMaterial. Store each tree center, width, height, and atlas tile as instanced attributes; in the vertex shader expand the four corners along the camera right vector while keeping the vertical axis locked to world up. Sample a padded texture atlas in the fragment shader, use alphaTest = 0.5 instead of transparent blending for the leaves, keep depthWrite enabled, and add distance fog. Randomize scale and atlas tile without creating separate materials.

You might have meant

camera projection matrixtextureinstancingtransparency sortingoverdraw