What types of diagrams can I create with this skill?

You can generate five primary types: Hierarchy Trees for taxonomies, Flow Diagrams for sequences, Network Graphs for relationships, Timelines for events, and Matrices for comparisons.

How do I trigger the visualization process?

Simply use the trigger keywords 'visualize:', 'diagram:', 'map:', or 'chart:' followed by the topic or data you want to transform.

Do I need external software to view the diagrams?

No, the skill generates standalone HTML files containing all necessary CSS and JavaScript, which can be opened in any modern web browser.

Is the output suitable for professional documentation?

Absolutely. The diagrams are professional, interactive, and can be easily embedded into project documentation or shared as portable HTML files.

Can I customize the visual style of the diagrams?

Yes, you can explicitly request themes like 'scifi', 'wabisabi', 'classic', or 'modern', or let the AI automatically select a theme based on your content.

Learning Visualizer

Name: Learning Visualizer
Author: yoshiwatanabe

byyoshiwatanabe

学習とドキュメンテーション

Transforms complex information into interactive diagrams and visual knowledge maps automatically.

概要

Learning Visualizer is a powerful Claude Code skill designed to bridge the gap between text-based documentation and visual understanding. It intelligently analyzes structured data and conceptual relationships to generate one of five specialized diagram types—including flowcharts, hierarchies, and timelines—styled with distinct visual themes like Sci-Fi or Wabi-sabi. By producing standalone, interactive HTML files using industry-standard libraries like D3.js and Mermaid.js, this tool allows developers and learners to explore technical architectures, historical sequences, and complex taxonomies with ease.

主な機能

Generates 5 core visualization types: Hierarchy, Flow, Network, Timeline, and Matrix
Context-aware theme selection including Sci-Fi, Wabi-sabi, Classic, and Modern aesthetics
Produces standalone, interactive HTML files with no external dependencies
Supports interactive features like hovering, clicking, and filtering for data exploration
Automated logic mapping that matches content structure to the ideal diagram type
0 GitHub stars

ユースケース

Mapping out educational curricula and historical timelines for structured learning
Visualizing complex system architectures or API data flows during development
Comparing technical specifications or feature sets using interactive comparison matrices

概要

主な機能

Generates 5 core visualization types: Hierarchy, Flow, Network, Timeline, and Matrix
Context-aware theme selection including Sci-Fi, Wabi-sabi, Classic, and Modern aesthetics
Produces standalone, interactive HTML files with no external dependencies
Supports interactive features like hovering, clicking, and filtering for data exploration
Automated logic mapping that matches content structure to the ideal diagram type
0 GitHub stars

ユースケース

Mapping out educational curricula and historical timelines for structured learning
Visualizing complex system architectures or API data flows during development
Comparing technical specifications or feature sets using interactive comparison matrices