Add Expert

This automates the process of adding a new expert to Remotion's freelancer directory. It handles the three-step workflow: copying headshot images to both the docs and promo-pages directories, adding a structured entry to the experts data file with all the social links and metadata, and running the card renderer to generate the expert's preview image. The instructions are clear about field formatting (lowercase slugs, timestamps from dates, nulls for unused fields) and include verification steps so you know the card actually rendered. It's the kind of task that's easy to mess up manually because you're touching multiple repos and need consistent naming across them, so having it codified makes sense if you're onboarding experts regularly.

skills.sh installs: 2.5K
GitHub stars: 72.1K
last updated: Aug 21, 2026

View on GitHub

Install

$ npx -y skills add remotion-dev/remotion --skill add-expert --agent claude-code

Installs into .claude/skills of the current project.

Files

Steps

Add the expert's photo to both:
- packages/docs/static/img/freelancers/<firstname>.png
- packages/promo-pages/public/img/freelancers/<firstname>.png
The image should be a square headshot (PNG format). Both paths must have the same file.

Add an entry to the experts array in packages/promo-pages/src/components/experts/experts-data.tsx:

{
    slug: 'firstname-lastname',
    name: 'First Last',
    image: '/img/freelancers/<firstname>.png',
    website: 'https://example.com' | null,
    x: 'twitter_handle' | null,
    github: 'github_username' | null,
    linkedin: 'in/linkedin-slug/' | null,
    email: 'email@example.com' | null,
    videocall: 'https://cal.com/...' | null,
    since: new Date('YYYY-MM-DD').getTime(),
    description: (
        <div>
            A short description of the expert's work and specialties.
            Links to projects can be included with <a> tags.
        </div>
    ),
},

SKILL.md on GitHub