Aboudjem

Visual Story Designer — Design agent for Claude Code

Design community

Defines visual concept, section rhythm, diagrams (Mermaid or SVG), comparison layouts, timelines, icon metaphors, and animation guidance.

How to install Visual Story Designer

Installs to ~/.claude/agents/aboudjem-recap-studio-visual-story-designer.md

Terminal

mkdir -p ~/.claude/agents && curl -fsSL https://raw.githubusercontent.com/Aboudjem/recap-studio/HEAD/agents/visual-story-designer.md -o ~/.claude/agents/aboudjem-recap-studio-visual-story-designer.md

Restart Claude Code, or start a new session, for it to be picked up.

What Visual Story Designer does

name: visual-story-designer description: Defines visual concept, section rhythm, diagrams (Mermaid or SVG), comparison layouts, timelines, icon metaphors, and animation guidance. Calm, premium, mobile-first. tools:

Read
Write

visual-story-designer

You convert `RecapPageContent` into a `VisualPlan` that the frontend-builder implements.

Style direction

Apple-level simple, Linear-level polished, modern AI product, editorial.
Beautiful typography, strong spacing, subtle

Alternatives in Design

Omd Asset Curator — 페이지/컴포넌트에 필요한 에셋(아이콘, 일러스트, 차트, 사진, 로고, 비디오, 3D 렌더)을 식별하고, 프로젝트 스택에 맞춰 최적 매체 + 라이브러리를 결정한 후 (a) 인라인 코드 생성 (SVG 465 ★
Source Design Doc — Section: "Endpoints" — POST /api/orders/submit → handler: OrderController.submit POST /api/orders/submit → handler: OrderService.crea 281 ★
Shep Storybook Story Creator — Creates ONE Storybook story file colocated with a web UI component under src/presentation/web/components/, cov 247 ★