Skip to content

sandrinio/riffcast

Repository files navigation

RiffCast — AI design skill for Claude Code, Cursor, MCP and any AI agent

One sentence in. Finished design out. RiffCast turns a one-line prompt into a finished, on-brand animation, deck, infographic, or prototype — generated by the AI agent you already use, with zero GUI. Ships as a markdown skill, an MCP server, a CLI, and a pydantic-AI tool. MIT-licensed.

License: MIT Status: v0.1 alpha Built with Bun Animations: Remotion MCP compatible Site

Hero: a 10-second meta-demo explaining the RiffCast pipeline — generated by RiffCast itself in the modern-clean vocabulary. (watch the MP4)

What is RiffCast?

RiffCast is an open-source AI design tool that plugs into any agentic runtime — Claude Code, Claude Desktop, Cursor, OpenCode, Trae, pydantic AI, LangChain, or a plain shell — and turns a one-sentence prompt into a finished design artifact.

The host AI agent stays in the creative loop the entire time. RiffCast provides the deterministic pipeline (brief → templates → render → review → export) and a curated set of design vocabularies that prevent generic "AI slop" output. This is the thin-tools philosophy: the agent is the designer, RiffCast is the runway.

  • Code-driven, not GUI-driven. Animations are React/JSX (Remotion), decks are markdown (Slidev), infographics are React-SVG. The surfaces AI agents are best at — no Figma plugin to wrestle with.
  • Five connectors, one core. Markdown skill, MCP server, pydantic-AI tool, CLI, npm/pip library. Same engine underneath.
  • Opinionated design vocabularies. modern-clean / editorial / playful — defensible style choices, not safe defaults.
  • Agent self-install. Paste one URL into your agent; it identifies its runtime and wires the right connector itself.
  • Built from first principles. No competitor analysis, no template-store ingestion, no closed APIs.

Use cases

  • Generate a 20-second product launch animation from a one-line brief inside Claude Code or Cursor.
  • Spin up an investor pitch deck via Claude Desktop as an MCP tool — markdown source, multi-format export (HTML / PDF / PPTX).
  • Render a how-to infographic from a structured prompt in a pydantic AI or LangChain agent.
  • Drop the markdown skill into any OpenCode, Trae, or Codex workflow and let the agent author Remotion JSX directly.
  • Use the riffcast CLI from any shell-capable agent — riffcast generate, riffcast render, riffcast review.

Install

The recommended path is agent self-install. Paste this into Claude Code, Cursor, OpenCode, Trae, Claude Desktop, or any AI agent that can read URLs:

Install RiffCast from https://riffcast.soula.ge/INSTALL.md

The agent identifies its runtime, picks the right connector (markdown skill / MCP server / pydantic / CLI), and runs the install for you. Full protocol in INSTALL.md.

Manual install:

# Markdown skill — Claude Code, Cursor, OpenCode, Trae
npx skills add @riffcast/skill

# MCP server — Claude Desktop, Cursor MCP, Continue, any MCP client
# Add to your mcp.json — see INSTALL.md §2B for the config block

# CLI — any shell
npm i -g @riffcast/cli
riffcast --version

# Library — npm or pip
bun add @riffcast/core
pip install riffcast   # v0.3+ (pydantic-AI tool)

How it works

                        ┌─ Markdown skill (SKILL.md)   → Claude Code, Cursor, OpenCode, Trae
                        │
   ┌──────────┐         ├─ MCP server (riffcast mcp)   → Claude Desktop, Cursor MCP, Continue
   │  Core    │ ────────┤
   │ engine   │         ├─ pydantic-AI tool            → pydantic AI, LangChain
   │ (Bun +   │         │
   │ Remotion)│         ├─ CLI (`riffcast`)            → any shell-capable agent
   │          │         │
   └──────────┘         └─ Library (@riffcast/core)    → direct programmatic use

Each connector is a thin adapter — none re-implement design logic. Pick the one that matches your runtime; the underlying behavior is identical.

The flow inside the agent:

  1. Triage — classify intent (new / iterate / ask), format (animation / deck / infographic / prototype), and kind. Hard cap: 2 disambiguation questions.
  2. Brief — fill the Creative Brief from the prompt; halt for confirmation when ambiguity is non-zero.
  3. Generate — agent authors Remotion JSX / Slidev markdown / SVG, guided by RiffCast's references.
  4. Render — RiffCast renders the artifact (MP4, GIF, SVG, PNG, PDF, HTML, PPTX).
  5. Review — 5-dimension rubric (composition, color, typography, motion, substance) flags issues; agent decides whether to iterate.
  6. Deliver — paths printed, brief saved alongside output for reproducible re-renders.

Roadmap

Release Surface Render pipeline Status
v0.1 Animations Remotion → MP4 / GIF In flight
v0.2 Static infographics React-SVG / HTML+Tailwind → SVG / PNG / PDF Planned
v0.3 Decks + native pydantic-AI tool Slidev → HTML / PDF / PPTX Planned
v0.4+ Clickable prototypes, brand-asset auto-extraction, plugin vocabularies HTML+JS, varied Planned

FAQ

Is RiffCast a hosted SaaS? No. It's a tool, not a service. Runs locally in your agent's process or as a CLI on your machine. No API keys, no subscription.

Does RiffCast call its own LLM? No. The host AI agent is the design brain. RiffCast handles the deterministic parts: templates, render, review, export. This is the "thin tools" choice — the agent stays in the creative loop, RiffCast doesn't hide the design behind another model.

How is this different from a Figma plugin or Canva integration? RiffCast is GUI-less. The artifact source is React/JSX or markdown — exactly the surface AI agents already excel at. No GUI to drive, no plugin sandbox, no closed format. You stay inside your agent.

Why Remotion for animations and Slidev for decks? Remotion is React-based — agents author JSX confidently, parallel render is fast, the MIT license is unambiguous. Slidev is markdown-native — minimal authoring friction, modern default aesthetic, multi-format export. Rejected alternatives (Motion Canvas, Reveal.js, GSAP) are documented in the vision.

Does it work with Claude Desktop / MCP? Yes. riffcast mcp is a stdio Model Context Protocol server exposing propose_directions, render, review, and export as tools. Compatible with any MCP-capable client (Claude Desktop, Cursor MCP, Continue).

Can I bring my own brand? Yes. Drop a brand/ directory with logo and color tokens; vocabularies adapt to your brand rather than overriding it. The brand contract solidifies in v0.2.

Is there a Python version? Yes — pip install riffcast (lands in v0.3) ships a pydantic-AI–compatible tool wrapper. Until then, the CLI is callable from any Python agent via subprocess.

Packages

Package Description
@riffcast/core Brief parsing, vocabulary loading, render orchestration
@riffcast/cli riffcast command-line entry point
@riffcast/mcp MCP server (riffcast mcp) — stdio Model Context Protocol
@riffcast/skill Markdown skill bundle (SKILL.md + references)
riffcast (PyPI) pydantic-AI tool wrapper (v0.3)

Contributing

RiffCast is open-source and pre-v0.1. Issues and PRs welcome at https://github.com/sandrinio/riffcast/issues. A formal contribution guide ships with v0.1.0.

License

MIT. Built from first principles — no third-party attribution.


Topics: ai-design · ai-agent · claude-code · cursor · claude-desktop · mcp · mcp-server · model-context-protocol · pydantic-ai · langchain · remotion · slidev · animation-generator · deck-generator · infographic-generator · code-driven-design · agentic-design · design-automation · open-source-design · bun · typescript