---
title: "Camera modes top-down isometric side-scroller and switching"
description: "The game is overhead, isometric, side-on, or swaps camera angles between scenes. Every camera mode is a `CameraComponent` on its own camera entity, tuned by projection, angle, and follow. Switching is a priority change, not a `setCamera` call (that is Spawn vocabulary)."
engineVersion: v1.0.234
date: 2026-09-28
license: "(c) Gessa, proprietary. Cite with attribution to https://gessa.ai/docs/. Terms: https://gessa.ai/terms/."
canonical: https://gessa.ai/docs/knowledge/playbooks/camera-modes-and-switching/
---

# Camera modes top-down isometric side-scroller and switching

## When to use

The game is overhead, isometric, side-on, or swaps camera angles between scenes.
Every camera mode is a `CameraComponent` on its own camera entity, tuned by
projection, angle, and follow. Switching is a priority change, not a `setCamera`
call (that is Spawn vocabulary).

## The recipe

The camera lives on a separate entity from the avatar (see
third-person-and-platformer-movement); tune fields with `project_add_component`
carrying the full `{ "type":"CameraComponent", ... }` value.

1. Top-down (3d overhead): place the camera entity above the play area, rotate
   its `TransformComponent` to look straight down, set `followEntityId` to the
   avatar and a high `followOffset` `{ "x":0, "y":20, "z":0 }`. Keep
   `projection:"perspective"` for depth.
2. Orthographic top-down or isometric: set `projection:"orthographic"` and
   `orthoSize` for the zoom; for isometric, rotate the camera entity to the fixed
   iso angle (for example yaw 45, pitch 30) and keep it there.
3. Side-scroller (2d): put the camera to the side with `projection:"orthographic"`
   (or a narrow `fov` perspective), set `followEntityId` to the avatar, and zero
   the follow on the locked axis via `followOffset` so it tracks only horizontal
   and vertical.
4. Runtime switching: give each camera a `CameraComponent` with `active:true` and
   a distinct `priority`. The highest-priority active camera is used in Play. To
   cut to another camera from a script, `ctx.entity.patchComponent` the target
   camera to a higher `priority` (or flip `active`) in a GessaScript body.
5. Follow feel per mode: tune `followSmoothing` (0 to 1) so an overhead camera
   glides and a side-scroller stays tight; add `lookAtEntityId` to keep the
   avatar centered.

## Pitfalls

- Two `active` cameras at the SAME `priority` are ambiguous; give the intended
  camera a strictly higher priority.
- `orthoSize` only applies when `projection:"orthographic"`; setting it on a
  perspective camera does nothing.
- A top-down or isometric camera still needs the entity rotated to the view
  angle; projection alone does not tilt the view.
- Switching by priority is instant. For a smooth move between viewpoints, animate
  one camera's transform rather than snapping priorities.

## Verify

- `qa_capture_renderer_viewport` (`qa.renderer.viewport.capture`) to confirm the
  framing and angle read for each mode.
- `project_get_graph_snapshot` to confirm which camera is highest-priority active.
