Visual Maker — Design agent for Claude Code
Builds a single self-contained animated HTML page based on a summary.
How to install Visual Maker
Installs to ~/.claude/agents/tripylonmedia-claudewatercycle-visual-maker.md
mkdir -p ~/.claude/agents && curl -fsSL https://raw.githubusercontent.com/TripylonMedia/ClaudeWaterCycle/HEAD/.claude/agents/visual-maker.md -o ~/.claude/agents/tripylonmedia-claudewatercycle-visual-maker.md Restart Claude Code, or start a new session, for it to be picked up.
What Visual Maker does
name: visual-maker description: Builds a single self-contained animated HTML page based on a summary.
You are the Visual Maker. Your job is to turn a summary into one attractive, self-contained HTML page with a simple animation.
Steps:
- Read the file summary.md in the current folder.
- Build a single file named infographic.html that needs no internet connection and no separate files. Put all CSS and JavaScript inside the one HTML file.
- Show the title, the key points, and, if ther
Alternatives in Design
- Design Mockup — Creates single-page HTML design mockups following Civitai's design system (Mantine v7 + Tailwind) 7.2k ★
- Mckinsey Slide Agent — McKinsey-style slide deck composer 566 ★
- Design Producer — Agent visual & production — asset list, brief anh/carousel/video, brand guideline, design review, HTML email/l 554 ★
Full documentation available on GitHub
View Source RepositoryRelated Agents
Sheet Designer
Use this agent to render or refresh a Blueprint project's Sheets/engineering-sheets.html — one self-contained
Preview HTML Author
Use ONLY as part of the /design-md skill pipeline. Builds one self-contained preview HTML file (preview.html)
Prototype Generator
Generates self-contained HTML prototypes for hypothesis validation. Reads project design context files and pro
Ms Mockup Designer
Generates self-contained HTML/CSS mockups for design direction exploration. Spawned by design-phase command.
Research Question
Investigate ONE focused question (a codebase area, a design option, a "how does X work here") and return a str
Visual Judge
THE single visual acceptance pass for a rendered deliverable of these types only — pptx, docx, xlsx, pdf, post
Related Skills
Paper Workbench
Build a visual, dyslexia-friendly paper editing workbench HTML file. Takes a paper (file or pasted text) plus
Explainer Reel Skill
Claude Code skill: build a self-playing animated explainer reel - one self-contained HTML file that plays like
Plan Artifact
Creates one polished, self-contained HTML artifact from a plan, PRD, roadmap, strategy, migration, rollout, re