nicobailon/visual-explainer

Agent skill that generates rich HTML pages or slide decks for diagrams, diff reviews, plan audits, data tables, and project recaps

何を解決するか

ターミナルベースのAIエージェントにおける読みにくいASCIIアートや等幅フォントのテーブルを、スタイリッシュで自己完結型のHTMLページに置き換えます。これにより、複雑な図やアーキテクチャフロー、大規模なデータ比較がコンソール上でプレーンテキストとして表示された際に読みにくくなる問題を解決します。

動作方法

テキスト出力ではなくHTML出力を生成するエージェントスキルとして機能します。インタラクティブなMermaid図をサポートし、ズームやパンが可能。ダーク/ライトテーマとプロフェッショナルなタイポグラフィも対応。このプロジェクトは、Claude Code、Cursor、PiなどのAIハーネス用プラグインとして統合可能。また、ローカルのstdio MCP（Model Context Protocol）サーバーとしても動作し、エージェントにレンダリングツールを提供します。

対象ユーザー

システムアーキテクチャの可視化、コード差分のレビュー、複雑な要件の比較を、作業フローを離さずに必要とする開発者。

特徴

  • マルチハーネス対応: Claude Code、Cursor、Pi、Antigravity CLI、Codex CLI、OpenCodeと互換性があります。
  • インタラクティブなビジュアル: ズーム・パンに対応するMermaidによる図表を活用。
  • MCP統合: HTMLレンダリングと迅速なJSON仕様を提供するローカルMCPサーバーを提供。
  • ビルドステップ不要: 基本的なスキル使用にはビルドプロセスが不要で、閲覧にはウェブブラウザのみが必要。

関連

  • プロジェクト
    lessweb/deepcode-cli

    Deep Code CLI is a Node‑based terminal assistant tuned for DeepSeek‑v4 models. Install via `npm i -g @vegamo/deepcode-cli`, configure it with `~/.deepcode/settings.json`, and use slash commands (e.g., `/new`, `/model`, `/skills`) to chat, run custom agent skills, handle images, connect to external services via MCP, and control permissions. It shares settings with a VS Code plugin and supports notifications, web‑search scripts, and any OpenAI‑compatible endpoint.

  • プロジェクト
    VigoZhao/AI-Visual-Prompt-Cookbook

    AI画像生成向けの116のJSONベースのビジュアルプロンプトテンプレートを収録したキュレートされたライブラリ。各スタイルは再利用可能なプロンプト、プレースホルダー、忠実度アンカー、ネガティブプロンプト、プレビュー画像を含みます。ユーザーは `style.json` をマルチモーダルLLM（ChatGPT‑4‑Vision、Gemini‑Pro‑Imageなど）にコピーし、変数を埋め込み、一貫性のあるポスター風画像を生成できます。検証スクリプト、多言語ドキュメント、オンラインギャラリーも提供されています。

  • プロジェクト
    NomaDamas/slides-grab

    slides‑grab は、AIエージェントがHTMLスライドデッキを生成・視覚的に選択・再編集し、PDF、実験的PPTX、Figma形式にエクスポートできるNodeベースのCLIおよびブラウザエディタです。95種類のデザインスタイルをバンドルし、Codex/OpenAI/Geminiプロバイダによる画像ネイティブスライドをサポート。検証、動画ダウンロード、tldrawからSVGへの変換ユーティリティも備えています。Node ≥ 20とPlaywrightが必要。MITライセンス。

  • プロジェクト
    ConardLi/easy-agent

    Easy Agent は、ターミナルベースでTypeScriptで書かれたコーディングアシスタントであり、Claude、OpenAI、Gemini、Ollama、その他のLLMとのチャットをストリーミングで行い、モデルがファイルの読み書き、シェルコマンドの実行、ウェブブラウズ、プラグインやマルチエージェントチームによる拡張を可能にします。リリース候補版で、npm公開を待っています。

  • プロジェクト
    JimLiu/baoyu-design

    baoyu-design は Claude Design をローカルエージェントスキルとしてパッケージ化し、Cursor、Claude Code、Codex などのエージェント内で、モックアップ、プロトタイプ、デッキ、デザインシステムのインポート、Figma .fig のデコード、PPTX エクスポートなど、フル機能の UI/UX デザインを直接実行可能にします。すべてのアーティファクトはリポジトリ内に自己完結型の HTML として保存されます。