HTML prototype: Clickable PROT artefacts before engineering

By Sculptor team

Ship PROT-001 sandbox HTML prototypes from wireframes—validate flows for startups and enterprise buyers before `/tech` commits architecture.

  • startup strategy
  • strategy pack
  • prototype
  • PROT-001
  • HTML prototype
  • clickable demo

If you are building a company and feel lost about HTML strategy prototype, you are not alone. This phase exists so your Strategy Pack stays honest—not pretty.

What this phase is really about

The HTML prototype phase produces clickable surfaces stakeholders can feel. It validates flows, copy, and hierarchy before expensive engineering. Startups use it in investor and pilot demos; enterprises socialise SKUs with buyers early.

In Sculptor, PrototypeHTMLAgent keeps the conversation anchored to HTML prototype so you do not mix this work with other phases. That separation is how consultants run engagements: one room, one decision set, one artefact pack.

Why teams skip this (and regret it later)

Teams either over-build in production or show static Figma decks that hide interaction gaps. Skipping PROT-001 means /tech guesses state management and edge cases that CX already mapped.

Questions this phase must answer

  • Which three flows must be clickable for a credible demo?
  • What data is mocked vs live-readonly?
  • How do we label prototype-only limitations honestly?
  • Which devices must the sandbox support?
  • What feedback will we collect from pilot users?
  • How does prototype map to WF and DSYS tokens?
  • When does prototype code get thrown away vs reused?
  • Who approves demo scripts for sales use?

Deliverables you should leave with

Prototype artefacts are fenced HTML blocks (PROT ids) runnable in Sculptor’s sandbox—clickable enough to test narrative, layout, and key flows without production code.

  • PROT-001 primary flow HTML in sandbox
  • PROT-002 alternate path or admin view if needed
  • Demo script with success criteria
  • Feedback capture plan linked to custval

What to prepare before you start

  • WF-001, DSYS-001, and CXART moments
  • Sample content and realistic edge cases
  • List of demo audiences and their objections

Who should own the answers

Product defines flows; design polishes; engineering advises on feasibility markers. Sales may demo only after product marks PROT approved for external use.

How this connects to the rest of your pack

This phase sits in the Brand and experience group on the Strategy Pack journey.

Previous: Earlier phase

Next: Next phase

See the complete phase guide for all specialists.

Examples from the real world (names changed)

A fintech app prototype exposed fee disclosure steps investors asked about—fixed in copy before backend build.

A B2B SaaS vendor ran enterprise buyer walkthroughs on PROT-001, uncovering SSO placement issues cheaper than post-launch patches.

Use this in Sculptor tomorrow

  1. Open Sculptor and create or open a workspace project.
  2. In Chat, type /prototype or pick HTML prototype from the command palette—the same rules apply as the slash.
  3. For breadth, start an Agentic Strategy Pack run; the phase executes in journey order and saves library assets.
  4. Read From specialist chat to a library-ready Strategy Pack for how chat and Agentic runs fit together.

Keyword focus: HTML strategy prototype, Strategy Pack coach, startup strategy planning, AI strategy specialist.