glitterball

Add interactive video walkthroughs to your Codex prototypes

Codex builds it. You walk people through it and Codex fixes what they say

How to add Glitterball to Codex

  1. Add Glitterball

    In the prototype's folder, paste Add Glitterball to this prototype by following https://www.glitterball.dev/install.md into Codex. It makes the prototype's own token, installs the glitterball package with your package manager and adds the <Glitterball token="…" /> component where every page renders.

  2. Record a walkthrough

    Deploy as you normally would, or keep it on localhost. Open the prototype and press Record on the Glitterball bar, then talk and click through it. The first time, that signs you in. Each screen becomes a chapter.

  3. Share the link

    The link is the prototype's own address. Viewers follow your cursor through the real build, stop to click around and comment on the exact screen.

  4. Send the feedback to Codex

    Connect Codex to Glitterball once with the two commands below. The login opens Glitterball: sign in and press Allow. Then ask Codex to Pull the Glitterball feedback on this prototype and fix it. It reads the open comments by screen, changes the code and marks each one resolved.

Questions

What is Glitterball?
Glitterball allows you to overlay interactive video walkthroughs over your real prototype and allows you to request feedback from your team.
How do I add Glitterball to a Codex prototype?
Ask Codex to add Glitterball by following https://www.glitterball.dev/install.md. At a terminal, npx glitterball init does the same. Both put the prototype's own token in the code. It works with React, Next.js, Remix, Vue, Nuxt, Svelte, Astro and plain HTML, on any host and on localhost.
Can Codex read the feedback?
Yes. Connect Codex to the Glitterball MCP server at https://www.glitterball.dev/mcp. It can then list your prototypes, pull the open comments by screen, fix them and mark them resolved.
Does it work in the Codex app and IDE extension?
Yes. The Codex CLI, desktop app and IDE extension share one MCP config, so connecting once works in all three.
Do viewers need an account?
No. Anyone with the link can watch, comment and answer. They add their name or sign in.
How is it different from a screen recording?
A screen recording is a flat video. Glitterball plays over the live build, so viewers can stop, click around themselves and comment on the exact screen.

Other integrations

Glitterball

Walk people through your prototype