Skip to content

Five-Minute Tour

A hands-on lap around Awaken - add an object, move it, tweak it, light it, press Play, and export a shareable game.html - with a link into the deep-dive page behind each step.

This tour assumes the editor is open on its default scene. If it isn't, see Launching the Editor. Everything below happens in one browser tab; nothing is uploaded.

1. Add an object (or import one)

Open the (Create) menu in the Hierarchy header and add a primitive - a Cube is a good start. It appears at the origin, already selected, and shows up as a new row in the Hierarchy tree. The same menu also has a 2D group (a Sprite quad and an orthographic 2D Camera) and a UI group (Text, Panel, Button, Image) when you want a HUD or a 2D scene instead.

Prefer to start from real content? Use File ▸ Import Model… and pick a .glb, .gltf, or .obj file - it loads into the scene and the Hierarchy tree. For a whole project, drop in a Unity .unitypackage, Godot .zip, or Unreal .zip - see the Import overview.

📸 Screenshot - save as img/guide-tour-create.png

The (Create) menu open in the Hierarchy header, with a freshly-added Cube selected at the origin and its row highlighted in the Hierarchy.

→ Deep dive: GameObjects & Components, Import overview

2. Select and move it with gizmos

Click the cube in the Viewport to select it (Awaken uses GPU click-picking, so selection is pixel-accurate). A transform gizmo appears. Switch tools with the keyboard:

  • W - Move (translate) - drag an axis arrow.
  • E - Rotate - drag a ring.
  • R - Scale - drag a handle.

Press F to frame the selection, Del to delete, Ctrl/⌘+D to duplicate, and Ctrl/⌘+Z to undo - every gizmo drag and edit is undoable.

📸 Screenshot - save as img/guide-tour-gizmo.png

The cube selected with the translate gizmo (W) visible, mid-drag along one axis.

→ Deep dive: Viewport, Editing Operations, Keyboard Shortcuts

3. Tweak it in the Inspector

With the cube selected, the Inspector lists its components - at minimum a Transform and a MeshRenderer. Type exact numbers into the Transform's position/rotation/scale fields, or change the MeshRenderer's color with the color swatch.

Need more? Click Add Component to attach a RigidBody, a Collider, a Script, and more. The Inspector is generated from each component's reflection schema, so every component you add gets editable fields for free.

📸 Screenshot - save as img/guide-tour-inspector.png

The Inspector for the selected cube: Transform foldout with numeric fields, MeshRenderer with a color swatch, and the Add Component button.

→ Deep dive: Inspector, GameObjects & Components

4. Add a light

The default scene already has a Sun (directional light), but let's add another. Use the (Create) menu to add a Point Light, then move it near your cube with the W gizmo and watch the shading update live. In the Inspector, adjust the Light component's color and intensity.

Lighting is real-time PBR with directional shadows, so what you see in the Viewport is what the shipped game renders.

📸 Screenshot - save as img/guide-tour-light.png

A point light added beside the cube, its Inspector showing color and intensity, with the cube visibly lit from the new light.

→ Deep dive: PBR & Lighting, Render Pipeline Overview

5. Press Play

Hit ▶ Play on the toolbar. Awaken snapshots the current scene, switches focus to the Game view (your Main Camera's view), and starts ticking the runtime - physics simulates, any scripts run, and keyboard input reaches your game.

  • ⏸ Pause freezes the sim; ▶ Resume continues.
  • ■ Stop restores the scene to exactly its pre-Play state - play-time motion is undone, so you never accidentally bake physics into your saved scene. (If you made edits during Play, Awaken offers to keep them.)

This is edit == play == ship in action: the same runtime you're watching now is what your exported game runs.

📸 Screenshot - save as img/guide-tour-play.png

The editor in Play mode: the Game view focused, the playback bar showing ⏸ Pause / ■ Stop, and a physics object mid-fall.

→ Deep dive: Preview & Play, The Player Runtime

6. Export your game.html

Press ■ Stop, then open File ▸ Export Game (game.html)…. Awaken compiles your scripts ahead-of-time, inlines everything (scene, meshes, textures, the runtime), and writes a single self-contained game.html.

Double-click it to play locally, or upload it anywhere static - the whole game is in that one file. To preview first without saving, use File ▸ Preview Game (new tab).

📸 Screenshot - save as img/guide-tour-export.png

The File ▾ menu open with Export Game (game.html)… highlighted.

→ Deep dive: Export game.html, Building & Shipping

Where to go next

You've done the whole loop - import/create, edit, play, ship. To build something real end-to-end, follow Make Your First Game. To understand the vocabulary you just used, read Core Concepts.

See also

Awaken — browser-native WebGPU game engine.