宝玉：信息图规划与制作

将文章和知识资料整理为信息图，结合布局、风格、信息层级和参考资料组织生成流程。

开源精选内容生产54 个文件26,681 Stars浏览次数 0JimLiu/baoyu-skills MIT版本 1567581

获取完整包获取 SKILL.md

开始使用

下载前阅读 SKILL.md 中的使用条件，并确认所用工具支持对应能力。

输入资料: 来源内容与重点信息受众、布局和风格要求阅读本节完整说明
交付内容: 信息图方案图像与提示词资料阅读本节完整说明

获取完整包，保留配套文件的目录结构。
按照原文准备所需工具、依赖与输入资料。
阅读对应使用步骤与输入输出说明，在自己的环境中验证结果。

使用提示摘自原文，配套文件保留来源版本；实际运行条件以各包说明为准。

正文

获取原文件

references/layouts/binary-comparison.md

Side-by-side comparison of two items, states, or concepts.

Structure

Vertical divider splitting image in half
Left side: Item A / Before / Pro
Right side: Item B / After / Con
Mirrored layout for easy comparison
Clear visual distinction between sides

Variants

Variant	Focus	Visual Emphasis
Before-After	Transformation over time	Temporal change, improvement
A vs B	Feature comparison	Direct contrast, differences
Pro-Con	Advantages/disadvantages	Balanced evaluation

Best For

Before/after transformations
Product or option comparisons
Pros and cons analysis
Old vs new comparisons
Two perspectives on a topic

Visual Elements

Strong vertical dividing line or gradient
Contrasting colors per side
Matching element positions for comparison
VS symbol or divider decoration
Transformation arrow for before-after

Text Placement

Main title centered at top
Side labels (A/B, Before/After)
Corresponding points aligned horizontally
Summary at bottom if needed

Recommended Pairings

corporate-memphis: Business comparisons
bold-graphic: High-contrast dramatic comparisons
craft-handmade: Friendly explainers