Was ist enthalten

Eine SKILL.md (die Anleitung) + eine Startvorlage. Eine Vorschau:

Profile Card Testimonial Reel

When to use

• Your testimonials read best as people first — photo, name, role — with the quote as the payoff
• You want a social-proof section that feels like a feed: swipeable, skimmable, alive
• Most of your traffic is mobile, where horizontal swipe is the most natural gesture available
• You have 8–20 testimonials and want them all reachable without a long vertical scroll
• You want the section to show motion and abundance without hiding any testimonial behind a click

Workflow

1. Build the cards (input: your testimonial pool → output: 8–20 profile cards)
   Each card is a mini-profile, not just a quote: portrait photo (at least 400px square), full name, role and company, one short quote (1–2 sentences), and one verifiable detail — a result, a time frame, a before-and-after. Cards are uniform: same width, same height, same internal layout. If a quote runs long, trim it to the sentence that only this customer could have written; the reel's rhythm depends on cards being interchangeable in size. Order the reel so the first three visible cards cover three different objections.
2. Lay out the reel (input: cards → output: horizontal scroll reel)
   The reel is a horizontal scroll container with scroll-snap: each swipe lands cleanly on a card, never halfway between two. Show a peek of the next card at the right edge — that half-visible card is the affordance that says "there's more, keep swiping." On desktop, add previous/next arrow buttons and a visible scrollbar or progress indicator; on touch, native swipe does the work. Cards never wrap to a second row — one row, horizontal only. The reel must be usable with JavaScript disabled: native scroll still works, arrows are enhancement.
3. Handle autoplay (input: reel → output: autoplay that knows when to stop)
   Autoplay, if used, advances one card every 5–7 seconds and stops permanently on the first sign of human intent: a swipe, a scroll, an arrow click, a hover, a focus. It never restarts on its own — a reel that keeps moving after the visitor grabbed it feels broken. Autoplay pauses when the section is off-screen and when the tab is hidden, so it doesn't burn through testimonials nobody is watching. Reduced-motion users get no autoplay at all. When in doubt, ship without autoplay: a reel that waits for the visitor beats one that races them.
4. Make it keyboard- and reader-friendly (input: reel → output: accessible reel)
   The scroll container is keyboard-operable: arrow keys move between cards when the reel has focus, Tab reaches each card's interactive elements in order, and focus is always visible. Screen readers get each card as a self-contained unit — name, role, quote announced together — not a jumble of fragments. Every card's interactive elements (links, expand controls) are real controls, not click handlers on divs. Test the whole reel with a keyboard alone: if you can't reach a card, neither can a keyboard user.
5. Check the reel (input: finished reel → output: verified reel)
   Verify every card against its source: quote wording, name spelling, title, company, permission to publish. Test on a real phone: swipe with a thumb, confirm snap lands cleanly, confirm the peek of the next card is visible. Check that no card's text overflows its fixed height at any breakpoint. Read the first three cards as a skeptic: do they answer real doubts, or just cheer? A reel full of generic praise is a slot machine of nothing.

Vorschau der Startvorlage

Profile Card Testimonial Reel — Build Template

One row, horizontal only, swipeable like a feed. Fill in the cards, then build.

The cards (8–20, uniform size)

Total cards: {8–20} — First three cards cover: {objection 1} / {objection 2} / {objection 3}

Card checklist (per speaker)

• [ ] Portrait ≥400px square, consistent treatment with the set
• [ ] Full name spelled correctly, role and company verified
• [ ] Written permission for quote + name + title + photo on file

Reel layout

• Container: horizontal scroll, one row, cards never wrap
• Snap: scroll-snap lands cleanly on one card, never halfway between two

Das Skill-Paket selbst (SKILL.md + Vorlage) ist auf Englisch verfasst.

Das komplette Skill-Paket kaufen — $4.99 Pro — alle 511 Skills