Skip to content

◌ Folio MMXXVII

Loading folio

000

§04 — How I work

TheProcess.

Four phases, calibrated for ambitious creative briefs. Each one earns the right to the next — no production code until the design system is settled.

  • Phases

    04

  • Default duration

    6 — 9 weeks

  • Owners

    Solo + cherry-picked partners

  • Output

    Production code + handover

  1. 01

    LISTEN

  2. 02

    SKETCH

  3. 03

    BUILD

  4. 04

    SHIP

01

Phase I · LISTEN

Discovery

Understand narrative constraints. Map the audience, the systems, and the technical envelope before a single pixel.

  • InputsBrief · references · constraints
  • OutputConcept doc · moodboard · plan
  • ToolsFigma · Are.na · iA Writer
  • Days5 — 8 working days
02

Phase II · SKETCH

Design

Establish the visual grid, typography rules, and static art direction. Prototype the silence between elements.

  • InputsTokens · grid · type system
  • OutputHigh-fidelity Figma · motion spec
  • ToolsFigma · Lottie · After Effects
  • Days10 — 14 working days
03

Phase III · BUILD

Prototype

Draft core WebGL scenes, motion curves, and the choreography between page transitions and content systems.

  • InputsVisual system · interaction map
  • OutputCoded prototype · WebGL scenes
  • ToolsNext.js · Three.js · GSAP
  • Days10 — 12 working days
04

Phase IV · SHIP

Production

Write custom GLSL shaders, build the engineering layer, ship with measurable performance and accessibility.

  • InputsApproved prototype · CMS plan
  • OutputShipped site · Loom handover
  • ToolsVercel · Cloudflare · Sanity
  • Days8 — 10 working days

Like the process? Let's start the conversation.