Agency Socials

HTML/Playwright event-covers og YouTube-thumbnails i et fast mørkt designsystem

Virker med opsætning ★ 7.6/10

Hvad det gør

Genererer sociale medie-covers, YouTube-thumbnails og Telegram-postbilleder til AGENCY Community-events ved at producere HTML-filer mod et fast designsystem (mørk #0f0f0f-palette, Geist/EB Garamond/JetBrains Mono-type, orange accent, indrammet gitterlayout) og derefter gengive dem til 2x PNG med Playwright. Udløses, når en bruger beder om at oprette et event-cover, meetup-thumbnail eller et socialt opslag for AGENCY Community. Design-tokens og layoutstruktur er specificeret præcist nok til at reproducere udseendet uden en live forhåndsvisning.

Testrapport

Hentede SKILL.md via rå GitHub; færdighedsmappen er enkeltfil (kun SKILL.md), frontmatter har name+description. Ingen medfølgende scripts refereret — kun inline Playwright JS, en inline osascript clipboard-save one-liner og to offentlige CDN-font-URL'er, som jeg verificerede returnerede HTTP 200. Ingen sikkerhedsbrister (ingen curl|sh, base64 eller exfiltration); skriver til ~/Desktop med ~ stier, ingen hardkodede maskinstier. For output byggede jeg et 800x800 lu.ma cover to gange: en baseline (blå gradient, Arial, centreret) og en, der strengt fulgte designsystemet (mørk #0f0f0f, Geist Bold titel med orange highlight span, EB Garamond talernavn, JetBrains Mono indrammede bjælker, 40px gitter, gråtonet off-grid foto, 3px accentlinje) — færdighedens HTML inkorporerer konkret hvert angivet token og opfylder de minimale skriftstørrelser, en klar forbedring i forhold til baseline. Kunne ikke rasterisere til PNG, da Playwright/Chromium ikke er installeret her, men designsystemets overholdelse er fuldt verificerbar i HTML'en. Trigger-fraseringer testet — SKULLE: "Opret et lu.ma cover til næste AGENCY Community meetup", "Lav en YouTube thumbnail til aftenens AGENCY meetup-optagelse", "Generer et Telegram annonceringsbillede til AGENCY community event"; SKULDE IKKE: "Design et logo til mit kaffemærke", "Opret en YouTube thumbnail til min madlavningskanal" (korrekt — det er brand-scoped til AGENCY Community). Alle 5 bedømt korrekt. Docs mister et point: refererer til en lab-meeting.html skabelon i en separat "youtube-uploader", der ikke er til stede i dette repo, og antager Playwright uden at angive afhængigheden.

Testet: 2026-07-31 · Claude Code 2.x (agent harness)

Installation

git clone --depth 1 https://github.com/glebis/claude-skills.git /tmp/agency-socials-src
mkdir -p ~/.claude/skills
cp -R /tmp/agency-socials-src/agency-socials ~/.claude/skills/agency-socials
# Rendering HTML->PNG needs Playwright + Chromium (not bundled):
#   npm i -g playwright && npx playwright install chromium
# Fonts load from public CDNs (fonts.googleapis.com, cdn.jsdelivr.net) at render time — both verified HTTP 200.
# Skill is single-file (only SKILL.md); no scripts/ or template files to copy.
# Design is hardcoded to the "AGENCY Community" brand; retheme the tokens to reuse elsewhere.

Kommandoer og eksempelprompter

/agency-socialsHTML/Playwright event-covers og YouTube-thumbnails i et fast mørkt designsystem

Skills udløses af almindelige forespørgsler — ingen kommandoer at huske. Efter installationen aktiverer prompter som disse skillen (på engelsk):

Create a cover image for this meetup event
Design a YouTube thumbnail for this recording
Make a social post graphic for this event

Læs hele rapporten →