The page this skill built from examples/wrenmoor, working in your browser. Opens in a new tab. Also: .
17.4-second example rendered by this skill from examples/wrenmoor · 1280×720
What you get
- A self-contained page and a paste-in embed of the section
- A rating block with the real 5 to 1 star distribution
- A lead letter that turns over between 2 and 6 signed quotes with measured results
- A drifting wall of reviews that pauses on hover, focus or a Pause motion button
- A case slider and a press strip
- Two themes, letters and ledger, and two layouts
- A check at 390, 768, 1024 and 1440 px and a 1080p preview recorder
- Open-source licenses for every part it builds on
Good fit
- A brand with a few hundred reviews that wants the rating and its real star breakdown shown honestly.
- A service business with customer results in numbers that should sit next to the people who got them.
- A team replacing a generic auto-sliding carousel with something readable, pausable and accessible.
Not for
- Pages with no real reviews or customers to quote
- A fast logo marquee or an auto-advancing carousel
- Video testimonials
- Pulling reviews live from a review platform
About this skill
A social-proof section built from one config file and set like a newspaper's letters page rather than a template carousel. The head shows the rating with its real star distribution, and the build refuses a score the stars do not average to. A lead letter turns over between 2 and 6 signed quotes, each with the measured result that customer got. A wall of reviews drifts in columns at a speed worked out from reading time, never faster than 24 px a second, and no review is ever cut while visible. Case cards carry before and after figures, and a press strip shows the line each publication printed. Hover, focus and a Pause motion button stop the motion; reduced motion shows everything still.
Example request
Build a testimonial section for my landing page from my real reviews: the rating with its star breakdown, a featured quote with the result that customer got, a slow wall of reviews, case cards and press quotes, set like an editorial letters page.
How it works
Your agent
- 1
Collect the content
From the person, their review platform export or their current site.
- 2
Write wall.json
In text,
_underscores_turn a phrase (italic in the accent forletters; full ink against a muted sentence forledger) and*stars*make it bold. - 3
Build
It lists every problem at once (a missing field, a line too long, a distribution that doesn't add up, a score that doesn't match it, too few reviews for the columns, an all-5-star wall under a rating that shows lower ones, a link that isn't one, a file that isn't there, an accent that fails contrast) and writes nothing until they are fixed.
- 4
Check
It opens the page at 390, 768, 1024 and 1440 px wide, and with reduced motion at 390 and 1440, and fails on: script errors; sideways scrolling; text under 16 px on a phone or 14 px elsewhere (12 px for small-caps labels); text under WCAG AA contrast; text cut off, off the screen or inside the 16 px phone gutter; a review on the wall twice at once or a visible review cut by the wall's edge (sampled over three seconds); a wall that doesn't move, or keeps moving after Pause motion or under the pointer; a letter tab that doesn't switch; the page below shifting when the letter changes; a case arrow that doesn't move the cards; an invisible keyboard focus; and anything moving under reduced motion.
- 5
Look at it
Open the address it prints.
- 6
Record the video (optional)
Writes
out/preview.mp4(1920×1080, 30 fps, about 17 seconds: the rating, the letter turning over beside the wall, the cases sliding one card, the press strip) andout/poster.png. - 7
Hand it over
Paste
out/embed.htmlwhere the section goes (or useout/index.htmlas a page), uploadout/assets/beside it, and tell the person how the rating, the letter timing and the pause work.
- 1
You get
- out/index.html
- out/embed.html
- out/preview.mp4
- out/poster.png


What you need
- Node.js 18 or newer. Nothing to install.
- Chrome, Chromium or Edge for the check and the video (found automatically; set
CHROME_PATHif not). - ffmpeg for the video only (
brew install ffmpeg,winget install ffmpeg,apt install ffmpeg, or setFFMPEG_PATH). - Internet access when the page is opened, for the theme's Google Fonts. Without it system fonts stand in.
- Real reviews. Every quote, name, rating, distribution and result must come from the person. If they have no case figures, leave
casesout; if they have no press, leavepressout. Never invent a reviewer or a number.
Last checked Nov 8, 2026: the package’s own build and render commands ran and passed.
If something goes wrong
"rating.score is 4.8 but the distribution averages 4.73"
One of them is wrong; copy both from the same source on the same day.
"are all 5 stars but the rating shows lower ones"
Add one of the real 4-star (or lower) reviews. It is what makes the wall credible.
The wall shows fewer columns than
wall.columnsThe reviews were too few or too short to fill that many columns without one showing twice; add reviews or accept the columns it chose.
What’s in the download
- SKILL.md15.5 KBthese instructions.
- examples/
- examples/tallyport/5.88 KB1 file
- examples/wrenmoor/5.21 KB1 file
- scripts/
- scripts/kit/
- scripts/kit/build.mjs14.1 KBrenders the section, derives the tile colours from the palette and writes
index.htmlandembed.html. - scripts/kit/cdp.mjs4.93 KBbrowser and server helpers.
- scripts/kit/check.mjs15.0 KBthe four-width check.
- scripts/kit/record.mjs6.15 KBthe frame-by-frame recorder.
- scripts/kit/schema.mjs10.0 KBevery field, its limits and the honesty rules (distribution, score, under-5 reviews, reviews per column).
- scripts/kit/serve.mjs2.48 KB
- scripts/build.mjs144 Bentry points; the work is in
scripts/kit/. - scripts/check.mjs144 B
- scripts/chrome.mjs3.63 KBbrowser and server helpers.
- scripts/record.mjs146 B
- scripts/serve.mjs144 B
- template/
- template/runtime.js16.1 KBthe reading-paced motion, the pause rules and the recorder's clock.
- template/wall.css17.7 KBthe layout, both themes and the phone and tablet layouts.
- NOTICE.md1.07 KB
- TESTED.json425 B
18 files · 119 KB · installs to ~/.claude/skills/testimonial-wall for Claude Code and ~/.agents/skills/testimonial-wall for other agents
Credits and licenses: NOTICE.md plus any LICENSE files inside the ZIP.
Similar Skills
View allDetails
- Output
- Social-proof section: rating with star distribution, rotating lead letter, reading-paced review wall, case slider, press strip
- Needs
- Node.js 18+, Chrome (or Chromium/Edge), and ffmpeg for the video
- Series
- Page Kits · 29 skills
- Updated
- Nov 8, 2026
- Checked
- Nov 8, 2026: its own commands ran and passed. That is a working check, not a security audit.
Written for
See all 31 agents that read skill folders.
Install guides
For your agent
Generates with
Installed it? Tell others how it went. Reviews come from people who installed this skill.
Write a reviewFAQ
How fast does the wall move?
Its speed is worked out from the text so every review stays on screen at least twice its reading time, and it never goes faster than 24 px a second. Hovering a column stops it, and the Pause motion button stops everything for the visit.
Can I use my customers' photos and my press logos?
Yes. Give each person or case a photo file and each publication a logo file next to wall.json, and the build copies them into assets. Without photos, monogram tiles are drawn from the names in colours taken from your palette.
Why does the build reject my rating?
The score has to match the star distribution, the distribution has to add up to 100, and if the rating shows reviews under 5 stars the wall must include at least one. These rules keep the section believable.
Which agents is Testimonial Wall written for?
Any agent that reads SKILL.md folders, including Claude Code, Codex, Cursor, GitHub Copilot, Gemini CLI and OpenCode.
Do I own what I make with it?
Yes. Everything your agent makes with this skill is yours, including for client and commercial work.
What if it doesn’t work for me?
Email support@lookbk.dev within 7 days of buying and we’ll fix it or refund you.
Credits and licensesWritten by Lookbk
Lookbk wrote this package, including its runtime with no third-party library; the Newsreader, Hanken Grotesk, Familjen Grotesk and Spline Sans Mono fonts load from Google Fonts under the SIL Open Font License 1.1. Written by Lookbk, no third-party code.
Credits and licenses for the open-source software and fonts it uses are in NOTICE.md inside the download.