# IStalk — Art Bible

## Document Status

- **Version:** 1.0 (Foundation — Sections 1-4)
- **Last Updated:** 2026-06-23
- **Stage:** Technical Setup (prototype-ready visual direction)

---

## Section 1: Visual Identity Foundation

### One-Line Visual Rule

**"Domestic horror through surveillance distortion — familiar spaces made alien by the Eye's cold, technical gaze."**

### Core Visual Pillars

1. **Asymmetric Perspective** — The Eye sees the world as a flat, clinical cross-section (2D side-view). Runners experience claustrophobic FPS interiors. The art must serve both views simultaneously.

2. **Mundane-to-Menacing** — Environments are recognizable domestic/industrial spaces (apartments, warehouses, offices) that become threatening through lighting, camera angle, and the knowledge that something is watching.

3. **Surveillance Aesthetic** — The Eye's view incorporates subtle visual language from security cameras, thermal imaging, and technical monitoring. Clean, informational, detached.

4. **Weight as Visual Language** — Items runners carry should telegraph their weight visually. Heavy items are bulky, awkward, visually encumbering. Light items are sleek and compact.

### Visual Identity Anchor

- **One-line rule:** Sterile observation meets lived-in domesticity
- **Supporting principles:**
  - Warm interior lighting contrasts with the Eye's cold UI overlays
  - Props and furniture are realistic and grounded — horror comes from context, not from grotesque design
  - Runner silhouettes are readable at the Eye's zoom distance (2D cross-section view)

---

## Section 2: Color Direction

### Palette Philosophy

Two distinct palettes that coexist in the same world:

#### Runner Palette (FPS View)

- Warm interior tones: amber lamplight, wood browns, carpet reds
- Desaturated slightly — not vibrant, but lived-in
- Danger signaled by: red laser glow, cold blue Eye-beam light intruding into warm spaces
- High contrast in shadows (runners hide in dark areas)

#### Eye Palette (2D Side-View)

- Cool, clinical tones: steel blue, slate grey, muted green
- UI overlays: cyan/teal for neutral info, red/orange for threats/alerts
- World appears slightly flattened — like a cross-section diagram
- Runner highlighting: warm silhouettes against cool backgrounds (visibility system)

#### Shared Palette Anchors

| Role | Color | Hex (approximate) | Usage |
|------|-------|-------------------|-------|
| Eye UI Primary | Teal | #00BCD4 | Eye HUD elements, charge ring |
| Eye Danger | Red-orange | #FF5722 | Laser beam, elimination alerts |
| Runner Warmth | Amber | #FFB300 | Interior lighting, safe areas |
| Runner Danger | Cold blue | #42A5F5 | Eye beam intruding, being watched |
| Neutral Info | Slate | #78909C | Weight display, timer, secondary UI |
| Extraction | Gold | #FFC107 | Extraction zone, success state |
| Dread | Deep purple | #7B1FA2 | Dread meter, Eye ability costs |

### Prototype Phase Colors

During prototype, use Unity's standard materials with flat colors matching the palette anchors above. No textures needed yet — shape language and color coding establish readability first.

---

## Section 3: Typography and UI Visual Language

### Font Direction

| Context | Style | Unity Implementation |
|---------|-------|---------------------|
| Runner HUD | Clean sans-serif, slightly condensed | TextMeshPro, weight Regular/Bold |
| Eye HUD | Monospace or technical sans-serif | TextMeshPro, weight Light/Regular |
| World UI (pickup prompts) | Same as Runner HUD, smaller | TextMeshPro WorldSpace Canvas |
| Menu/Lobby | Neutral sans-serif | TextMeshPro |

### UI Element Styling

- **Corners:** Slightly rounded (4-8px radius feel) — not sharp, not bubbly
- **Backgrounds:** Semi-transparent dark panels (CanvasGroup alpha 0.7-0.85)
- **Borders:** 1px subtle borders where needed for readability, not decorative
- **Animations:** Functional motion only — slide-in for new info, fade for transitions, pulse for urgency

### Readability Rules

- All HUD text must be readable at 1080p minimum
- Minimum body text: 16pt equivalent
- Critical info (timer, weight): 24pt+ equivalent
- High contrast: white/bright text on dark panels, never colored text on colored backgrounds

---

## Section 4: Spatial and Environment Direction

### Environment Philosophy

Levels are **real places** — apartments, offices, warehouses, hospitals, schools. Not fantasy dungeons. The horror is that something omniscient watches you steal from these familiar spaces.

### Architecture Rules

1. **Multi-floor structures** — The Eye's side-view needs vertical variety. Levels should have 2-4 floors with stairs, ladders, vents connecting them.
2. **Room variety** — Mix room sizes: tight corridors (runners must crouch/slide), open rooms (Eye has clear sight lines), and medium rooms (tactical cover).
3. **Cover density** — Every room needs props a runner can crouch behind. The Eye's LoS system makes cover placement the core level design tool.
4. **Readable silhouettes** — From the Eye's zoomed-out 2D view, rooms must read clearly. Distinct shapes for furniture categories: rectangular tables, round chairs, tall shelves.

### Prop Visual Hierarchy

| Category | Visual Weight | Silhouette | Example |
|----------|--------------|------------|---------|
| Heavy cover (blocks LoS) | Large, solid | Tall rectangle, wide block | Bookshelf, wardrobe, filing cabinet |
| Light cover (partial) | Medium, gaps | Varied outline | Desk with legs, open shelving |
| Slideable (dynamic) | Medium, visually "loose" | Standard furniture shapes | Chair, small table, crate |
| Fragile | Thin, delicate | Narrow/tall, breakable silhouette | Vase, lamp, picture frame |
| Incarnation-eligible | Ordinary, blend-in | Any common prop shape | Couch, TV, plant pot |

### Scale Reference

- Runner height: ~1.8m (standard human)
- Door height: 2.1m
- Standard room: 4m x 5m x 2.8m (ceiling)
- Corridor width: 1.5-2m
- Crouch clearance: 1.0m

### Lighting Direction

- **Runner view:** Practical light sources (lamps, windows, overhead fixtures). Dark patches create hiding spots.
- **Eye view:** More uniform visibility. The Eye can see through floors (cutaway) but LoS raycasts still block on walls/props.
- **Laser telegraph:** Brief cold-blue line telegraph before red damage beam. Visual reads from both perspectives.

---

## Sections 5-9: Deferred to Pre-Production

The following sections will be developed when the prototype validates the core loop:

- **Section 5:** Character Design (Runner customization, Eye visual representation)
- **Section 6:** VFX Direction (laser, elimination, extraction, smoke)
- **Section 7:** Animation Guidelines (Runner movement states, prop interactions)
- **Section 8:** Audio-Visual Sync (sound design direction that complements visuals)
- **Section 9:** Marketing Art Direction (store assets, trailer visual language)

These sections require playable gameplay to design against. Prototype first, polish later.
