MDX 文章视觉模式 Gallery
用影刀、电商看板、库存周转、退款率和 AI 工作流场景，展示 10 种适合个人博客文章的 MDX 视觉模式。
这篇 Gallery 给后续 Agent 做参考：同样是写 MDX 文章，不必每次都退回表格和普通流程图。先判断内容关系，再选择视觉模式。
1. Bento 信息宫格
适合文章开头或章节概览。它表达的是并列模块，不是步骤。
采集
把订单、售后、库存和推广数据拉到同一张明细表。
清洗
统一店铺、链接、型号、日期和售后原因，避免同名不同义。
看板
先看总览，再下钻到退款率、库存周转和推广消耗。
复核
价格异常、缺货和高退款链接保留人工确认，不让自动化静默决策。
2. 指标看板
适合让读者先建立量感。数字少、状态明确时，用指标卡比表格更容易扫描。
比上周高 1.4 个百分点，先拆链接和型号。
超过目标区间，优先处理滞销库存。
集中在两个店铺和一个新批次。
价格和缺货仍需人工确认。
3. 左右对比面板
适合两个方案的取舍。这里重点是边界，不是字段逐行对齐。
继续手工日报
适合数据量小、异常少、只需要记录结果的阶段。
- 上手快，不需要改现有习惯。
- 异常发现慢，容易只看到总数。
- 跨店铺、跨型号分析成本高。
升级经营看板
适合多店铺、多链接、需要持续追踪异常的阶段。
- 退款、库存和推广可以放在同一页判断。
- 需要先统一字段和统计口径。
- 自动化只负责整理，不替代业务判断。
4. 问题链路图
适合展示异常如何一步步缩小范围。有分支和因果关系时，再用 Mermaid。
flowchart LR
A[总退款率升高] --> B[拆店铺]
B --> C[拆链接]
C --> D[拆型号]
D --> E{异常集中吗}
E -->|集中| F[查批次和详情页]
E -->|分散| G[查流量和客服备注]
F --> H[暂停推广并复核库存]
G --> I[调整投放和话术] 先缩小异常范围，再判断是商品、流量还是服务问题。
5. 时间线
适合复盘一套方案如何演进。没有分支时，用 DecisionFlow 比流程图更轻。
从日报到经营看板
店铺、链接、型号、日期、售后原因必须稳定，否则后面的自动化只会放大混乱。
下载、复制、合并这些重复动作交给流程；异常确认继续留给人。
退款率、库存周转和推广消耗一起看，避免单一指标误导判断。
把每次异常处理后的判断写回规则，减少下次排查时间。
6. 案例拆解卡
适合把一个案例拆成背景、动作、结果、复盘。它不是表格，因为每一块都需要一句业务解释。
背景
某保护套链接退款率连续三天升高，但店铺总退款率只轻微波动。
动作
按型号、颜色和客服备注拆开后，发现问题集中在一个新批次。
结果
暂停该链接推广，优先处理库存批次，并补充详情页说明。
复盘
看板不能只保留总览，还要能快速下钻到链接、型号和批次。
7. 决策树
适合帮助读者选路径。条件明确、有分支时才画树；只有线性动作时用时间线。
flowchart TD
A{异常来自哪里}
A -->|退款率升高| B{是否集中在少数链接}
A -->|库存周转变慢| C{是否集中在少数 SKU}
A -->|推广消耗升高| D{转化是否同步下降}
B -->|是| E[查商品批次和详情页]
B -->|否| F[查流量来源和客服备注]
C -->|是| G[清理滞销并调整补货]
C -->|否| H[复核整体备货策略]
D -->|是| I[调整投放和落地页]
D -->|否| J[观察退款和客单价] 让读者沿条件走，而不是在一张大表里找答案。
8. AI 工作流问题链路
适合写 Agent 或自动化协作文章。它强调失败在哪里发生，不是为了画完整系统架构。
AI 工作流失败排查
缺少字段口径、样例数据或目标读者时，模型容易给出泛化方案。
写 MDX、改文章、做可视化前，要先读项目规则和相关示例。
页面渲染、构建命令和测试结果要落到真实命令，不只看文本是否合理。
事实不确定、口径不确定、风格要改变时，先标注或询问。
9. 检查清单块
适合发布前确认。它不是流程，因为这些项可以并行检查。
10. 文章总结横幅
适合收束全文，给读者带走一个可复用判断。