Codex product marketing
Build product demos with Codex
Use Codex to turn a finished feature into a checked HTML demo you can preview locally, publish with ShowKit, or host anywhere.
Product marketing outcome
Move from product change to interactive proof
Codex turns a finished feature and its product context into a focused demo story. ShowKit checks the flow and builds portable HTML files for launch pages, developer marketing, and sales follow-up.
Use it to
Turn a verified product flow into a focused launch-page demo.
Reuse captured evidence for short, product-accurate tooltip copy.
Compare and rebuild the demo when a later change makes it out of date.
Workflow
From agent prompt to local interactive demo
Add the ShowKit skill
Install the agent instructions first. This step does not install or update the ShowKit CLI.
Name the product flow
Share the product URL or currently open flow. The agent can draft a first story from your request and visible product evidence.
Capture and shape the story
The agent chooses a supported source, captures supported product states, and writes the demo story from visible evidence.
Check and build the demo
ShowKit checks hotspots, local assets, sensitive-data rules, and the player before creating the HTML files.
Publish when you approve
After you review the local preview, the agent can publish the exact checked version and return a hosted URL.
Example request
A Codex product marketing prompt
Name the product flow, audience, takeaway, and endpoint. Let the agent open the local preview, then decide whether to publish.
Use ShowKit for the approval flow currently open in Chrome. Build a guided interactive HTML demo for operations leaders. Show how a request moves from submission to approval without losing context. Check the local demo, open its preview, then ask whether I want to publish the checked version to ShowKit hosting.
Source boundary
Codex checks the source before capture
Adding the skill does not make a demo capture-ready. ShowKit checks the CLI and source first, then uses an approved browser session, product files, or a separate Playwright browser.
How to use ShowKit
Start with the product flow you want to show
Paste this into Claude Code or Codex. It adds the ShowKit skill, then asks for the product URL or open flow.
Add the ShowKit skill for Codex and Claude Code, not the CLI. Run `npx skills add hyunghwan/showkit --skill showkit --agent codex --agent claude-code --global --yes --copy`. Read the installed `SKILL.md` and verify the skill. Then ask me exactly: "What product URL or currently open product flow should I use?" After I answer, set up a compatible CLI in a new folder, then create, check, and preview the demo. Ask before changing an existing project or adding Playwright. When the preview is ready, ask whether I want to publish the checked version to ShowKit hosting.
The skill asks before changing an existing project, adding Playwright, or publishing a checked demo.
Ready to share?
Publish the checked version
showkit publish --version <hash> --json
Your coding agent fills in the version hash. The command connects your account when needed and returns a hosted URL. Up to 3 active demos are free.
Frequently asked questions
No. Start with a supported product URL or existing product files. A codebase helps when you want repeatable updates through Playwright or CI, but it is optional.
Yes. ShowKit exports a static HTML demo with CSS, player code, demo content, and local assets. You can publish that folder on any static host. Opening a local preview does not publish it.
No. The skill only adds instructions for your coding agent. After you request a demo, the skill can set up a compatible CLI in a new output folder. It asks before changing an existing project or adding optional Playwright.
No. The agent opens a local preview first, then asks whether you want to publish the checked version. Publishing changes external state and requires your explicit approval.
Yes. Describe the flow and goal in Claude Code or Codex. The coding agent runs the ShowKit workflow and opens a local preview. ShowKit still asks before changing an existing project or adding Playwright.
ShowKit stops before saving blocked content. When a supported private page can use text-only redaction, it asks for explicit consent and leaves the previous demo unchanged if consent is not given.