Claude Code sessions to asciinema recordings

CLI tool that converts Claude Code session logs into playable, shareable terminal recordings. Not just text dumps—full aesthetic replication of the Claude Code experience.

The Problem

Claude Code sessions are stored as .jsonl files. Rich with detail, but:

• Not easily shareable
• Not visually compelling
• Can’t show the experience of AI-assisted development

cc-prism transforms logs into high-fidelity asciicast recordings that capture the exact look and feel.

Value Proposition

One command from session log to shareable URL:

npx cc-prism cast --latest --upload

Recreates the terminal experience: animated spinners, color-coded tool calls, diff views, fixed input area—everything.

Architecture

Clean linear pipeline:

JSONL → Parser → Clip Extractor → ANSI Renderer → asciicast Generator → .cast file

Module	Responsibility
parser/	Load JSONL, parse entries, interleave tool calls
renderer/	Convert structured data to ANSI strings (stateless)
generator/	Add timing, animations, build asciicast document
cli/	User interface, orchestration

Key design decision: Renderer is pure functions—takes data + config, returns strings. Highly testable.

Technical Highlights

Timing System

TimingCalculator uses real timestamps from logs but caps at maxWait (3s default). Realistic pacing without forcing viewers through long pauses.

Animation Generation

Animations aren’t pre-rendered—they’re generated frame-by-frame during timing gaps:

2-second pause detected
→ continueSpinner(2) called
→ Generate 60 spinner frames
→ Insert into that 2-second window

The shimmering verb effect: regenerate text with different character-level highlighting each frame.

Theme System

Semantic color roles (theme.toolName, theme.userPrompt) instead of hardcoded colors. Themes implement a RenderTheme interface, converted to asciicast palette strings.

Five built-in: Tokyo Night, Dracula, Nord, Catppuccin, plus custom support.

High-Fidelity Rendering

• Markdown in assistant text
• Diff views for Edit tool with character-level highlighting
• TodoWrite list visualization with status icons
• Bash/slash commands with faithful formatting
• Fixed input UI with burst-typing animation

Features

• Interactive picker (pick): TUI with fuzzy search, dual-pane preview, multiple selection modes
• Clip extraction: --last N, --start-uuid, time ranges
• Chapter markers: Navigation points for asciinema playback
• Direct upload: Push to asciinema.org in one step
• Profile system: Save/load configuration presets

Code Quality

• 185 tests across 9 suites
• Visual tests check ANSI structure without brittle snapshots
• stripAnsi helper separates content from styling
• Lazy-loaded interactive UI (ink/react) for fast non-interactive use

Novel Aspects

1. Aesthetic fidelity as core goal — not just conversion, but replication
2. Interactive picker TUI — rare sophistication for a CLI tool
3. Dynamic animation injection — fill timing gaps with generated frames
4. Semantic message understanding — distinguishes prompts from tool results from slash commands

Insights for Similar Tools

“Define your data contracts first. The well-defined types in src/types/ are the foundation of the project’s stability.”

• Isolate renderer as pure functions
• Test content and structure separately from exact ANSI codes
• Treat timing as a separate concern with dedicated calculator
• For complex CLI UIs, ink + lazy imports = powerful + fast

Showcase

Live demos at onceuponaclaude.com