Share a Chromatic build
Chromatic ran on the PR, diffed 140 stories, and flagged six. The engineering review is straightforward.
The part that is not straightforward: the design system lead works in a different org, the PM reviews on a phone, and the client — who is paying for the redesign — has never heard of Chromatic.
A published Storybook is not a review
The reflex is "just publish the Storybook". It is the wrong artifact, for a precise reason: a Storybook shows what the components are, and a review needs what changed.
Hand someone a 200-component Storybook and ask whether the new button padding is right, and they will browse for two minutes and say it looks fine. The six changed stories were never found. See sharing a Storybook static build for when the full Storybook is the right artifact — a component library reference, not a diff.
Publish the delta
After the Chromatic build, take the changed stories and assemble a page:
<h1>UI review — PR #331 · Checkout redesign</h1>
<p>6 of 140 stories changed. Chromatic build 1284.</p>
<section>
<h2>Button / Primary</h2>
<p>Padding 12px → 16px, per the new spacing scale.</p>
<div class="pair">
<figure><img src="…before.png" /><figcaption>Before</figcaption></figure>
<figure><img src="…after.png" /><figcaption>After</figcaption></figure>
</div>
</section>
The sentence of intent under each heading is what turns a diff into a review. "Padding 12px → 16px, per the new spacing scale" invites agreement or disagreement. An unlabelled image pair invites silence.
Clients are the reason to bother
For an agency this stops being a convenience. You cannot provision a client's marketing director into your Chromatic project, and you should not want to — they would see every other project's builds in the sidebar.
A published page with restricted access shows one client one review. It also gives you a record of what they approved, with their comments attached to the component they were looking at, which is the artifact that matters when scope gets litigated later. See Comma for agencies.
Comments where the change is
The value over a Slack thread is anchoring. "The hover state is too dark" next to the hover state story is actionable; the same sentence in a channel, referring to one of six changes, generates a round-trip asking which one — see commenting on HTML.
Worth knowing
- Chromatic keeps the baselines. Accept and deny stay there; the published page is for the conversation.
- Publish from the CI job after the Chromatic step, so the link is ready when the PR opens — see publishing from CI.
- Update the same report per PR. A force-push should refresh the page, not produce a second link.
- 5 MB per report body.
Try it
Free — unlimited reports, commenters and revisions.