195ad0b3d1
15s landscape (1920x1080) split-screen: left shows SquareMCP chat prompt + animated cURL command + 200 response with wamid; right shows a rendered WhatsApp phone UI with the message bubble appearing and blue double-checkmarks. Also adds transparent-background logo PNG for Meta Tech Provider icon upload. Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
SquareMCP Remotion Workflow
This directory is the canonical video-production workspace for SquareMCP marketing assets inside the hermes-mcp repo.
What lives here
SquareMCPLinkedIn: 90-second 1080x1080 explainerSquareMCPHeroLoop: 30-second 1920x1080 seamless site hero loopSquareMCPTikTokFull: 30-second 1080x1920 short-form vertical launch videoSquareMCPTikTokHook,SquareMCPTikTokProblem,SquareMCPTikTokDemo,SquareMCPTikTokProof,SquareMCPTikTokCTA: standalone cutdowns for platform testing
Install
cd videos/remotion-demo
npm install
Preview in Studio
cd videos/remotion-demo
npm run dev
Remotion Studio will open on http://localhost:3000.
Render Commands
Full LinkedIn video:
cd videos/remotion-demo
npx remotion render src/index.ts SquareMCPLinkedIn out/squaremcp-linkedin.mp4
Full site hero loop:
cd videos/remotion-demo
npx remotion render src/index.ts SquareMCPHeroLoop out/squaremcp-hero-loop.mp4
Full TikTok video:
cd videos/remotion-demo
npx remotion render src/index.ts SquareMCPTikTokFull out/squaremcp-tiktok-full.mp4
TikTok cutdowns:
cd videos/remotion-demo
npx remotion render src/index.ts SquareMCPTikTokHook out/squaremcp-tiktok-hook.mp4
npx remotion render src/index.ts SquareMCPTikTokProblem out/squaremcp-tiktok-problem.mp4
npx remotion render src/index.ts SquareMCPTikTokDemo out/squaremcp-tiktok-demo.mp4
npx remotion render src/index.ts SquareMCPTikTokProof out/squaremcp-tiktok-proof.mp4
npx remotion render src/index.ts SquareMCPTikTokCTA out/squaremcp-tiktok-cta.mp4
Project conventions
- Keep assets brand-aligned with
src/styles.ts - Put reusable animations in dedicated scene files under
src/scenes/ - Render outputs to
out/; the repo already ignores that directory - Do not mention Remotion in public-facing social copy
Notes
- Logo source for video work lives in
public/squaremcp-logo.svg - The May 11 notes in the synced vault describe the original LinkedIn and hero-loop workflow