074 Hide D75eb113

---
hide:
  - toc
---

# Diagram and MicroSim Table

**Total Visual Elements:** 76
**Diagrams:** 0
**MicroSims:** 76

## Summary by Difficulty

- **Easy:** 11
- **Medium:** 47
- **Hard:** 15
- **Very Hard:** 3

## All Visual Elements

| Chapter | Element Title | Status | Type | Bloom Levels | UI Elements | Difficulty | Recommended MicroSims |
|---------|---------------|--------|------|--------------|-------------|------------|-----------------------|
| 1 | [Claude Code Workflow Diagram](../chapters/01-intro-ai-intelligent-textbooks/index.md#diagram-claude-code-workflow-diagram) |  | Microsim | Not specified | 0 | Medium |  |
| 1 | [Evolution of AI Approaches Timeline](../chapters/01-intro-ai-intelligent-textbooks/index.md#diagram-evolution-of-ai-approaches-timeline) |  | Microsim | Not specified | 2 | Medium |  |
| 1 | [Five Levels of Textbook Intelligence Visual Model](../chapters/01-intro-ai-intelligent-textbooks/index.md#diagram-five-levels-of-textbook-intelligence-visual-model) |  | Microsim | Not specified | 0 | Easy |  |
| 1 | [Interactive Learning Element Types Comparison](../chapters/01-intro-ai-intelligent-textbooks/index.md#diagram-interactive-learning-element-types-comparison) |  | Microsim | Not specified | 1 | Medium |  |
| 1 | [Prompt Engineering Iterative Refinement Workflow](../chapters/01-intro-ai-intelligent-textbooks/index.md#diagram-prompt-engineering-iterative-refinement-workflow) |  | Microsim | Not specified | 0 | Easy |  |
| 1 | [Transformer Architecture Diagram](../chapters/01-intro-ai-intelligent-textbooks/index.md#diagram-transformer-architecture-diagram) |  | Microsim | Not specified | 2 | Medium |  |
| 2 | [4-Hour Token Window Visualization](../chapters/02-getting-started-claude-skills/index.md#diagram-4-hour-token-window-visualization) |  | Microsim | Not specified | 0 | Easy |  |
| 2 | [Iterative Prompt Refinement Metrics](../chapters/02-getting-started-claude-skills/index.md#diagram-iterative-prompt-refinement-metrics) |  | Microsim | Not specified | 0 | Medium |  |
| 2 | [Skill File Anatomy Diagram](../chapters/02-getting-started-claude-skills/index.md#diagram-skill-file-anatomy-diagram) |  | Microsim | Not specified | 1 | Medium |  |
| 2 | [Skill Installation Locations and Priority](../chapters/02-getting-started-claude-skills/index.md#diagram-skill-installation-locations-and-priority) |  | Microsim | Not specified | 0 | Medium |  |
| 2 | [Skill Invocation and Execution Lifecycle](../chapters/02-getting-started-claude-skills/index.md#diagram-skill-invocation-and-execution-lifecycle) |  | Microsim | Not specified | 1 | Medium |  |
| 2 | [Skill Permission Matrix](../chapters/02-getting-started-claude-skills/index.md#diagram-skill-permission-matrix) |  | Microsim | Not specified | 0 | Easy |  |
| 2 | [Skills vs Commands Decision Tree](../chapters/02-getting-started-claude-skills/index.md#diagram-skills-vs-commands-decision-tree) |  | Microsim | Not specified | 0 | Easy |  |
| 3 | [Bloom's Taxonomy 1956 vs 2001 Comparison](../chapters/03-course-design-educational-theory/index.md#diagram-blooms-taxonomy-1956-vs-2001-comparison) |  | Microsim | Not specified | 0 | Medium |  |
| 3 | [Bloom's Taxonomy Application Distribution in Quality Courses](../chapters/03-course-design-educational-theory/index.md#diagram-blooms-taxonomy-application-distribution-in-quality-courses) |  | Microsim | Not specified | 0 | Easy |  |
| 3 | [Course Description Quality Impact on Workflow](../chapters/03-course-design-educational-theory/index.md#diagram-course-description-quality-impact-on-workflow) |  | Microsim | Not specified | 0 | Medium |  |
| 3 | [Course Description Quality Rubric Visualization](../chapters/03-course-design-educational-theory/index.md#diagram-course-description-quality-rubric-visualization) |  | Microsim | Not specified | 1 | Medium |  |
| 3 | [Lower-Order vs Higher-Order Thinking Skills](../chapters/03-course-design-educational-theory/index.md#diagram-lower-order-vs-higher-order-thinking-skills) |  | Microsim | Not specified | 0 | Easy |  |
| 3 | [Topic-to-Concept Expansion Example](../chapters/03-course-design-educational-theory/index.md#diagram-topic-to-concept-expansion-example) |  | Microsim | Not specified | 0 | Medium |  |
| 4 | [DAG vs Cyclic Graph Comparison](../chapters/04-intro-learning-graphs/index.md#diagram-dag-vs-cyclic-graph-comparison) |  | Microsim | Not specified | 0 | Medium |  |
| 4 | [Dependency Mapping Decision Tree](../chapters/04-intro-learning-graphs/index.md#diagram-dependency-mapping-decision-tree) |  | Microsim | Not specified | 0 | Easy |  |
| 4 | [Dependency Pattern Examples](../chapters/04-intro-learning-graphs/index.md#diagram-dependency-pattern-examples) |  | Microsim | Not specified | 0 | Medium |  |
| 4 | [Learning Graph Structure Visualization](../chapters/04-intro-learning-graphs/index.md#diagram-learning-graph-structure-visualization) |  | Microsim | Not specified | 1 | Medium |  |
| 4 | [Token Consumption Timeline for Complete Textbook Project](../chapters/04-intro-learning-graphs/index.md#diagram-token-consumption-timeline-for-complete-textbook-project) |  | Microsim | Not specified | 0 | Medium |  |
| 5 | [CSV File Format Example with Validation](../chapters/05-concept-enumeration-dependencies/index.md#diagram-csv-file-format-example-with-validation) |  | Microsim | Not specified | 0 | Medium |  |
| 5 | [Concept Count by Course Duration](../chapters/05-concept-enumeration-dependencies/index.md#diagram-concept-count-by-course-duration) |  | Microsim | Not specified | 0 | Medium |  |
| 5 | [Concept Depth Distribution Analysis](../chapters/05-concept-enumeration-dependencies/index.md#diagram-concept-depth-distribution-analysis) |  | Microsim | Not specified | 0 | Medium |  |
| 5 | [Concept Granularity Spectrum Visualization](../chapters/05-concept-enumeration-dependencies/index.md#diagram-concept-granularity-spectrum-visualization) |  | Microsim | Not specified | 0 | Medium |  |
| 5 | [Concept Label Length Optimization](../chapters/05-concept-enumeration-dependencies/index.md#diagram-concept-label-length-optimization) |  | Microsim | Not specified | 0 | Medium |  |
| 5 | [Concept Label Quality Checklist](../chapters/05-concept-enumeration-dependencies/index.md#diagram-concept-label-quality-checklist) |  | Microsim | Not specified | 0 | Medium |  |
| 5 | [ConceptID vs ConceptLabel Comparison](../chapters/05-concept-enumeration-dependencies/index.md#diagram-conceptid-vs-conceptlabel-comparison) |  | Microsim | Not specified | 0 | Medium |  |
| 5 | [Dependency Mapping Workflow](../chapters/05-concept-enumeration-dependencies/index.md#diagram-dependency-mapping-workflow) |  | Microsim | Not specified | 0 | Easy |  |
| 5 | [Topic-to-Concept Expansion Process](../chapters/05-concept-enumeration-dependencies/index.md#diagram-topic-to-concept-expansion-process) |  | Microsim | Not specified | 0 | Medium |  |
| 6 | [Average Dependencies Distribution Bar Chart](../chapters/06-learning-graph-quality-validation/index.md#diagram-average-dependencies-distribution-bar-chart) |  | Microsim | Not specified | 0 | Medium | chartjs-generator<br>(98)<br>microsim-p5<br>(70)<br>mermaid-generator<br>(25) |
| 6 | [DAG Validation Algorithm Visualization](../chapters/06-learning-graph-quality-validation/index.md#diagram-dag-validation-algorithm-visualization) |  | Microsim | Not specified | 0 | Medium | vis-network<br>(98)<br>mermaid-generator<br>(85)<br>microsim-p5<br>(75) |
| 6 | [Learning Graph Quality Score Calculator MicroSim](../chapters/06-learning-graph-quality-validation/index.md#diagram-learning-graph-quality-score-calculator-microsim) |  | Microsim | Not specified | 21 | Very Hard | microsim-p5<br>(92)<br>chartjs-generator<br>(65)<br>vis-network<br>(20) |
| 6 | [Linear Chain vs Network Structure Comparison](../chapters/06-learning-graph-quality-validation/index.md#diagram-linear-chain-vs-network-structure-comparison) |  | Microsim | Not specified | 0 | Medium | vis-network<br>(95)<br>mermaid-generator<br>(82)<br>microsim-p5<br>(78) |
| 6 | [Orphaned Nodes Identification Chart](../chapters/06-learning-graph-quality-validation/index.md#diagram-orphaned-nodes-identification-chart) |  | Microsim | Not specified | 0 | Medium | chartjs-generator<br>(97)<br>bubble-chart-generator<br>(80)<br>microsim-p5<br>(72) |
| 6 | [Taxonomy Distribution Pie Chart](../chapters/06-learning-graph-quality-validation/index.md#diagram-taxonomy-distribution-pie-chart) |  | Microsim | Not specified | 0 | Medium | chartjs-generator<br>(98)<br>microsim-p5<br>(68)<br>venn-diagram-generator<br>(15) |
| 7 | [Adding Taxonomy to CSV Workflow Diagram](../chapters/07-taxonomy-data-formats/index.md#diagram-adding-taxonomy-to-csv-workflow-diagram) |  | Microsim | Not specified | 0 | Medium | mermaid-generator<br>(94)<br>microsim-p5<br>(75)<br>vis-network<br>(45) |
| 7 | [CSV to JSON Conversion Mapping Diagram](../chapters/07-taxonomy-data-formats/index.md#diagram-csv-to-json-conversion-mapping-diagram) |  | Microsim | Not specified | 0 | Medium | mermaid-generator<br>(90)<br>microsim-p5<br>(78)<br>chartjs-generator<br>(20) |
| 7 | [Color Accessibility Checker MicroSim](../chapters/07-taxonomy-data-formats/index.md#diagram-color-accessibility-checker-microsim) |  | Microsim | Not specified | 12 | Hard | microsim-p5<br>(95)<br>chartjs-generator<br>(25)<br>vis-network<br>(10) |
| 7 | [Dublin Core Metadata Field Reference Card](../chapters/07-taxonomy-data-formats/index.md#diagram-dublin-core-metadata-field-reference-card) |  | Microsim | Not specified | 1 | Medium | microsim-p5<br>(85)<br>chartjs-generator<br>(15) |
| 7 | [Learning Graph JSON Schema Diagram](../chapters/07-taxonomy-data-formats/index.md#diagram-learning-graph-json-schema-diagram) |  | Microsim | Not specified | 1 | Medium | mermaid-generator<br>(92)<br>microsim-p5<br>(70)<br>vis-network<br>(65) |
| 7 | [Python Learning Graph Processing Pipeline](../chapters/07-taxonomy-data-formats/index.md#diagram-python-learning-graph-processing-pipeline) |  | Microsim | Not specified | 4 | Hard | mermaid-generator<br>(93)<br>vis-network<br>(70)<br>microsim-p5<br>(72) |
| 8 | [Admonition Types Interactive Reference](../chapters/08-mkdocs-platform-documentation/index.md#diagram-admonition-types-interactive-reference) |  | Microsim | Not specified | 5 | Hard | microsim-p5<br>(90)<br>chartjs-generator<br>(15) |
| 8 | [Git Branching and Merging Visualization MicroSim](../chapters/08-mkdocs-platform-documentation/index.md#diagram-git-branching-and-merging-visualization-microsim) |  | Microsim | Not specified | 13 | Hard | microsim-p5<br>(94)<br>vis-network<br>(82)<br>mermaid-generator<br>(75) |
| 8 | [Material Theme Features Interactive Comparison](../chapters/08-mkdocs-platform-documentation/index.md#diagram-material-theme-features-interactive-comparison) |  | Microsim | Not specified | 5 | Hard | microsim-p5<br>(88)<br>chartjs-generator<br>(30) |
| 8 | [MkDocs Build Process Workflow Diagram](../chapters/08-mkdocs-platform-documentation/index.md#diagram-mkdocs-build-process-workflow-diagram) |  | Microsim | Not specified | 1 | Medium | mermaid-generator<br>(95)<br>microsim-p5<br>(70)<br>vis-network<br>(65) |
| 8 | [MkDocs GitHub Pages Deployment Workflow](../chapters/08-mkdocs-platform-documentation/index.md#diagram-mkdocs-github-pages-deployment-workflow) |  | Microsim | Not specified | 1 | Medium | microsim-p5<br>(94)<br>vis-network<br>(82)<br>mermaid-generator<br>(75) |
| 9 | [Git Workflow for Skill Development](../chapters/09-claude-skills-architecture-development/index.md#diagram-git-workflow-for-skill-development) |  | Microsim | Not specified | 0 | Medium | mermaid-generator<br>(95)<br>microsim-p5<br>(72)<br>vis-network<br>(60) |
| 9 | [Security Zones Diagram](../chapters/09-claude-skills-architecture-development/index.md#diagram-security-zones-diagram) |  | Microsim | Not specified | 0 | Medium | mermaid-generator<br>(94)<br>microsim-p5<br>(75)<br>vis-network<br>(55) |
| 9 | [Skill Directory Structure Diagram](../chapters/09-claude-skills-architecture-development/index.md#diagram-skill-directory-structure-diagram) |  | Microsim | Not specified | 1 | Medium | mermaid-generator<br>(93)<br>vis-network<br>(70)<br>microsim-p5<br>(68) |
| 9 | [Skill Package Contents Checklist](../chapters/09-claude-skills-architecture-development/index.md#diagram-skill-package-contents-checklist) |  | Microsim | Not specified | 1 | Medium | microsim-p5<br>(88)<br>mermaid-generator<br>(70)<br>venn-diagram-generator<br>(65)<br>microsim-p5<br>(88)<br>mermaid-generator<br>(70)<br>venn-diagram-generator<br>(65) |
| 9 | [Skill Testing Workflow Diagram](../chapters/09-claude-skills-architecture-development/index.md#diagram-skill-testing-workflow-diagram) |  | Microsim | Not specified | 2 | Medium | microsim-p5<br>(85)<br>chartjs-generator<br>(15) |
| 10 | [Chapter Index File Structure Diagram](../chapters/10-content-creation-workflows/index.md#diagram-chapter-index-file-structure-diagram) |  | Microsim | Not specified | 1 | Medium | mermaid-generator<br>(92)<br>microsim-p5<br>(75)<br>vis-network<br>(50) |
| 10 | [Chapter Organization Workflow Diagram](../chapters/10-content-creation-workflows/index.md#diagram-chapter-organization-workflow-diagram) |  | Microsim | Not specified | 0 | Medium | mermaid-generator<br>(94)<br>microsim-p5<br>(73)<br>vis-network<br>(55) |
| 10 | [Content Generation Process Timeline](../chapters/10-content-creation-workflows/index.md#diagram-content-generation-process-timeline) |  | Microsim | Not specified | 0 | Easy | timeline-generator<br>(98)<br>chartjs-generator<br>(70)<br>microsim-p5<br>(75) |
| 10 | [ISO 11179 Principles Comparison Table Infographic](../chapters/10-content-creation-workflows/index.md#diagram-iso-11179-principles-comparison-table-infographic) |  | Microsim | Not specified | 5 | Hard | microsim-p5<br>(94)<br>chartjs-generator<br>(30)<br>vis-network<br>(15) |
| 10 | [Interactive Exercise Generator MicroSim](../chapters/10-content-creation-workflows/index.md#diagram-interactive-exercise-generator-microsim) |  | Microsim | Not specified | 21 | Hard | microsim-p5<br>(96)<br>chartjs-generator<br>(25)<br>vis-network<br>(15) |
| 10 | [Worked Example: Determining Reading Level from Course Description](../chapters/10-content-creation-workflows/index.md#diagram-worked-example-determining-reading-level-from-course-description) |  | Microsim | Not specified | 4 | Hard | microsim-p5<br>(90)<br>chartjs-generator<br>(20) |
| 11 | [Bloom's Taxonomy Distribution Analyzer Chart](../chapters/11-educational-resources-assessment/index.md#diagram-blooms-taxonomy-distribution-analyzer-chart) |  | Microsim | Not specified | 9 | Very Hard | chartjs-generator<br>(96)<br>microsim-p5<br>(75)<br>venn-diagram-generator<br>(25) |
| 11 | [Command-Line Interface Basics Interactive Infographic](../chapters/11-educational-resources-assessment/index.md#diagram-command-line-interface-basics-interactive-infographic) |  | Microsim | Not specified | 9 | Hard | chartjs-generator<br>(94)<br>microsim-p5<br>(88)<br>vis-network<br>(30) |
| 11 | [FAQ Question Pattern Analysis Workflow](../chapters/11-educational-resources-assessment/index.md#diagram-faq-question-pattern-analysis-workflow) |  | Microsim | Not specified | 0 | Medium | mermaid-generator<br>(95)<br>vis-network<br>(65)<br>microsim-p5<br>(70) |
| 11 | [Interactive Quiz Question Constructor MicroSim](../chapters/11-educational-resources-assessment/index.md#diagram-interactive-quiz-question-constructor-microsim) |  | Microsim | Not specified | 23 | Very Hard | microsim-p5<br>(97)<br>chartjs-generator<br>(20)<br>vis-network<br>(15) |
| 12 | [Algorithm Visualization with Step Controls MicroSim](../chapters/12-interactive-elements-microsims/index.md#diagram-algorithm-visualization-with-step-controls-microsim) |  | Microsim | Not specified | 24 | Hard | microsim-p5<br>(95)<br>chartjs-generator<br>(25)<br>vis-network<br>(15) |
| 12 | [Basic MicroSim Template Structure](../chapters/12-interactive-elements-microsims/index.md#diagram-basic-microsim-template-structure) |  | Microsim | Not specified | 8 | Hard | mermaid-generator<br>(95)<br>vis-network<br>(65)<br>microsim-p5<br>(68) |
| 12 | [MicroSim Design Quality Checklist](../chapters/12-interactive-elements-microsims/index.md#diagram-microsim-design-quality-checklist) |  | Microsim | Not specified | 10 | Hard | microsim-p5<br>(96)<br>chartjs-generator<br>(15)<br>vis-network<br>(15) |
| 12 | [MicroSim File Relationship Diagram](../chapters/12-interactive-elements-microsims/index.md#diagram-microsim-file-relationship-diagram) |  | Microsim | Not specified | 0 | Easy | mermaid-generator<br>(93)<br>vis-network<br>(75)<br>microsim-p5<br>(72) |
| 12 | [Responsive Iframe Embedding MicroSim](../chapters/12-interactive-elements-microsims/index.md#diagram-responsive-iframe-embedding-microsim) |  | Microsim | Not specified | 16 | Hard | microsim-p5<br>(96)<br>chartjs-generator<br>(15)<br>vis-network<br>(15) |
| 12 | [p5.js Architecture and Execution Model](../chapters/12-interactive-elements-microsims/index.md#diagram-p5js-architecture-and-execution-model) |  | Microsim | Not specified | 5 | Medium | mermaid-generator<br>(94)<br>microsim-p5<br>(85)<br>vis-network<br>(70) |
| 13 | [Interactive Directory Navigation Practice MicroSim](../chapters/13-dev-tools-version-control-deployment/index.md#diagram-interactive-directory-navigation-practice-microsim) |  | Microsim | Not specified | 14 | Hard | microsim-p5<br>(94)<br>vis-network<br>(85)<br>mermaid-generator<br>(78) |
| 13 | [Permission Bits Visual Infographic](../chapters/13-dev-tools-version-control-deployment/index.md#diagram-permission-bits-visual-infographic) |  | Microsim | Not specified | 4 | Hard | microsim-p5<br>(85)<br>chartjs-generator<br>(15) |
| 13 | [Skill Installation Workflow Diagram](../chapters/13-dev-tools-version-control-deployment/index.md#diagram-skill-installation-workflow-diagram) |  | Microsim | Not specified | 0 | Medium | timeline-generator<br>(97)<br>mermaid-generator<br>(85)<br>chartjs-generator<br>(75) |
| 13 | [Terminal Workflow for Textbook Development](../chapters/13-dev-tools-version-control-deployment/index.md#diagram-terminal-workflow-for-textbook-development) |  | Microsim | Not specified | 0 | Medium | mermaid-generator<br>(95)<br>microsim-p5<br>(73)<br>vis-network<br>(55) |
| 13 | [VS Code Interface Layout for Textbook Development](../chapters/13-dev-tools-version-control-deployment/index.md#diagram-vs-code-interface-layout-for-textbook-development) |  | Microsim | Not specified | 4 | Medium | microsim-p5<br>(80)<br>mermaid-generator<br>(50) |