| name | instagram-story-skill |
| description | Produce and prepare publishing packets for African Data Layer Instagram stories / vertical assets at 1080×1920 (9:16), plus LinkedIn vertical/image post adaptations from docs/marketing — frame plan, bilingual copy (EN/FR), interactive sticker plan, LinkedIn copy, link CTA, upload order, URLs/status, claim audit against CLAUDE.md content guidelines. |
Instagram Story Skill (ADL)
When to use
User asks to create, draft, plan, schedule, post, publish, or cross-post an Instagram story (24h ephemeral) or vertical 9:16 post for African Data Layer at 1080×1920. Applies to:
- Story sequences (1–10 frames, ephemeral)
- Story highlights (pinned, evergreen)
- Reels covers (single 9:16 frame)
- Vertical single-image posts to feed (9:16 ratio)
- LinkedIn vertical/image post adaptations from story frames
Not for: 1080×1350 carousels (use instagram-carousel-skill), Reels video edits (use Short-Video Editing Coach), non-ADL brands.
Required reads before producing a frame set
docs/marketing/social-media-launch-plan.md — content calendar, claim rules, hashtag strategy, posting schedule.docs/marketing/social-publishing-workflow.md — cross-platform publish packet, status, and URL capture rules.CLAUDE.md — brand palette (navy/terra/forest/gold), anti-references, voice..claude/skills/instagram-story-skill/reference/safe-zones.md — IG story safe areas (avatar overlap top, action bar bottom)..claude/skills/instagram-story-skill/reference/story-anatomy.md — frame archetypes (hook / proof / CTA / poll / question)..claude/skills/instagram-story-skill/reference/base-template.md — reusable HTML scaffold..claude/skills/instagram-carousel-skill/reference/color-systems.md — shared brand color tokens..claude/skills/instagram-carousel-skill/reference/typography-pairings.md — shared Inter pairings..claude/skills/instagram-story-skill/examples/sample-frames.md — completed example brief.
Output contract
Write one markdown brief to docs/marketing/instagram-story-week{N}-{slug}.md containing:
- Header: date, slot (day + time WAT), format (story / reels-cover / vertical-feed), series, parent post reference (if amplifying a feed/carousel post).
- Concept paragraph — why story format fits the message.
- Frame plan table: frame number, archetype (hook / proof / poll / question / link / CTA), background color, headline, sticker plan, safe-zone notes.
- Typography + dimensions (1080×1920, Inter weights, top safe-zone 250px, bottom safe-zone 250px).
- Copy EN per frame.
- Copy FR mirror per frame (plain ASCII for any tag/handle text).
- Sticker stack — polls, quizzes, questions, link, location, music, mention, hashtag (max 10 stickers per frame to stay under IG limit).
- Hashtag overlay (1–3 max for stories, hidden via shrink/color trick if needed).
- Link CTA: which frame carries the link sticker, where it points, UTM tag.
- DM keyword reply armed (e.g. "MAP", "CARTE").
- LinkedIn adaptation — professional post copy, selected frame(s), first-comment link copy, 3–5 hashtags, and upload notes.
- Publish packet — Instagram story fields, LinkedIn fields, asset paths, upload order, account/status fields, and post URL placeholders.
- Posting plan: order, hold time per frame (5s default, 7s for high-density text), pin to highlight (yes/no + which highlight).
- Success signals table — frame-by-frame tap-forward / tap-back / exit / sticker tap / link tap.
- Claim audit — each claim mapped to accuracy per CLAUDE.md rules.
- Asset checklist + render command.
Also emit a publishing manifest: write docs/marketing/assets/story-week<N>-<slug>/publish.json conforming to .claude/skills/social-publisher-skill/reference/manifest-schema.md. The manifest must include:
- An
instagram / story target with account: "adl_main", assets[] matching the rendered frame PNG filenames in order, optional linkSticker (frame index + URL + display text — translated to a manual step by the publisher), and altText[].
- If the story is amplifying a feed post AND the operator wants a LinkedIn cross-post, also include a
linkedin / image or multi-image target with account: "adl_org", a title, and a commentary.
claimAudit: "passed" ONLY after the claim audit step succeeds.createdBy: "instagram-story-skill@<today>".- Schedule defaults to
mode: "now".
Build + render workflow
Same pattern as carousel skill — diverge only on dimensions and renderer:
- Create asset dir:
docs/marketing/assets/story-week{N}-{slug}/
- Write
build-frames.mjs (EN) and build-frames-fr.mjs (FR) producing frames.json / frames-fr.json.
- Each entry:
{ id: "01", html: "<full html doc>" }. HTML body sized 1080×1920.
- Render:
node .claude/skills/instagram-story-skill/scripts/render-story.mjs <frames-json> <out-dir>
- Output PNGs land at
<out-dir>/frame-NN.png (EN) and frame-NN-fr.png (FR).
Renderer hard-coded to 1080×1920 viewport, deviceScaleFactor 2.
Rules
- Dimensions locked: 1080×1920 only. Do not adapt for 1080×1350 — use carousel skill instead.
- Safe zones: top 250px overlapped by IG handle/avatar/timer; bottom 250px overlapped by reply bar + send arrow + close-friends ring. Hero text stays in middle 1420px band.
- Sticker collision: poll/quiz stickers expand vertically — leave 320px clear band in lower-mid where stickers will land. Mark expected sticker zone in frame plan.
- Hook in first 1.5s: viewer taps forward on second 2 if frame 1 hasn't earned attention. Headline + visual anchor must read at glance.
- Claim discipline: only "verified", "ground truth", "fraud-resistant" — never "fraud-proof", never exact numbers, never accuracy %. Same as carousel skill.
- Anti-references hard stop: no stock African imagery, no pin-drop heroes, no gradient fades, no NGO aesthetics, no SaaS dashboard cliches.
- Bilingual parity: every frame EN must have FR mirror. Plain ASCII for any text rendered onto the image (avoid accents that break IG OCR search).
- Accessibility: alt text per frame. Min 60px text height for body copy on 1080×1920 (story viewing distance is closer than feed).
- Slot conflict check: read existing week's plan before assigning slot — stories typically run alongside a feed/carousel post, not as standalone.
- LinkedIn adaptation: stories do not map 1:1 to LinkedIn. Convert the frame sequence into either a single image post using the strongest proof/CTA frame or a short image carousel with professional copy. No interactive IG sticker language unless rewritten as text.
- Posting truth: if no authenticated publishing tool, browser session, or user-provided platform access is available, create a ready-to-post packet and say it is not posted yet. Only mark
Posted when a platform/API returns a live URL.
- Save, don't dump: write brief to
docs/marketing/, don't paste full brief in chat — summarize path + slot + hook frame headline.
Workflow
- Identify week (from current date vs plan start) and which story slot is free or amplifying which feed post.
- Pick story archetype: launch echo / poll harvest / quiz / link drive / countdown / behind-the-scenes / community share.
- Draft frame plan — 5 frames default, 3 min, 10 max. Each frame names archetype + sticker.
- Write EN copy per frame, mirror to FR.
- Map sticker stack + link CTA + DM keyword.
- Add LinkedIn adaptation + publish packet.
- Write
build-frames.mjs + build-frames-fr.mjs.
- Render PNGs via
scripts/render-story.mjs.
- Save brief to
docs/marketing/instagram-story-week{N}-{slug}.md.
- Write
docs/marketing/assets/story-week<N>-<slug>/publish.json with the IG story target (and optional LinkedIn target if requested).
- Tell the user the manifest path and remind them to publish via the
social-publisher-skill (do NOT publish from this skill). Note any link-sticker frames as a manual post-publish step.
- Report path + slot + first-frame hook in chat (≤80 words).
Publishing workflow
When user asks to post or publish an existing generated story:
- Locate the source brief in
docs/marketing/ and the asset directory in docs/marketing/assets/story-week{N}-{slug}/.
- Confirm required assets exist:
frame-01.png through final frame, optional FR variants, sticker copy, link targets, and alt text.
- Update or create the brief's
Publish Packet section with:
- Instagram story: account, date/time WAT, frame upload order, sticker positions, link sticker URL, highlight target, status, story URL or highlight URL.
- LinkedIn: account/page, selected frame(s), post text, first-comment link copy, hashtags, upload asset path, status, post URL.
- If a publishing tool/session is available and user requested posting, publish Instagram first, then LinkedIn. Capture live URLs immediately.
- If publishing cannot be done from the current environment, leave status as
Ready to post, keep all upload fields complete, and report the missing access/tool.
Reference
- Carousel sibling skill:
.claude/skills/instagram-carousel-skill/SKILL.md (use for 1080×1350 feed carousels).
- Renderer reuse: identical pattern to
scripts/render-ig-carousel.mjs, with viewport swapped to 1080×1920.
