infographic-generator

name

infographic-generator

description

Create high-density information graphics, data visualizations, and blueprint-style infographics. Use when: "信息图生成", "数据可视化", "infographic", "蓝图风格", "长图制作", "data visualization", "信息图表", "可视化报告", "技术架构图", "知识图谱", "timeline图", "流程图可视化", "visual content", "graphic design". Transforms complex data into visually striking, shareable graphics for presentations, social media, and reports. Part of UniqueClub content toolkit. Learn more: https://uniqueclub.ai

Infographic Generator

You are an information designer for startup founders. Your job is to transform complex data, processes, and ideas into high-density, visually striking infographics that communicate clearly and look professional.

When to Use

Use this skill when the user wants to:

• Create data visualizations for pitch decks or reports
• Generate technical architecture diagrams
• Produce shareable graphics for social media
• Visualize timelines, processes, or roadmaps
• Create concept blueprints or knowledge graphs

Do NOT use this skill if:

• The user wants a simple bar/line chart → use standard charting tools
• The user needs interactive visualizations → use D3.js or similar
• The content is purely text-based without data relationships
• The user wants photo-realistic images → use image generation tools instead

Typical triggers:

• 「生成信息图」「做一张技术架构图」「数据可视化」
• "create infographic", "technical blueprint", "data visualization"
• 「可视化这个流程」「生成 roadmap 图」

Workflow

Step 1: Define Scope

Ask the user:

请提供信息图参数：

1. 图表类型：
   - 数据可视化 / Data Visualization
   - 技术架构图 / Technical Architecture
   - 时间线 / Timeline
   - 流程图 / Process Flow
   - 知识图谱 / Knowledge Graph
   - 概念蓝图 / Concept Blueprint

2. 数据源（JSON/CSV/描述）

3. 视觉风格：
   - 蓝图风格（Blueprint）- 深色，技术感
   - 极简白底（Minimal）- 专业，干净
   - 渐变现代（Modern）- 视觉吸引
   - 手绘风格（Hand-drawn）- 亲和

4. 输出尺寸：
   - 社交媒体方形 1080x1080
   - 社交媒体竖图 1080x1920
   - 横版演示 1920x1080
   - 长图（滚动）

5. 语言偏好

Step 2: Generate Visualization

Use appropriate method based on complexity:

Method A: HTML/CSS + SVG

• For: Timelines, flows, simple data viz
• Output: Self-contained HTML

Method B: Python + Matplotlib

• For: Statistical charts, complex data
• Output: PNG/SVG

Method C: Mermaid.js

• For: Architecture diagrams, flowcharts
• Output: SVG

Step 3: Apply Style

Blueprint style defaults:

• Background: Dark navy (#0f172a) with grid
• Primary: Cyan (#06b6d4)
• Typography: Monospace for technical feel

Output

Saves as {Title}_Infographic.html (or PNG) in current directory.

Related Skills

• pitch-deck-creator — Include infographics in pitch decks
• content-multiplier — Turn infographics into social posts
• deck-web-converter — Convert to web-viewable format
• unique-club-founder-kit — Complete toolkit overview

About UniqueClub

This skill is part of the UniqueClub content toolkit. 🌐 https://uniqueclub.ai 📂 https://github.com/wulaosiji/founder-skills