LcpMarvel

Feishu Whiteboard Pro

Name: Feishu Whiteboard Pro
Author: LcpMarvel

Data community

SOURCE https://github.com/LcpMarvel/feishu-whiteboard-pro

Description

A Claude Code / agent skill for building genuinely designed, editable Feishu / Lark (飞书) whiteboards — deliberate composition, real hierarchy, a gated pipeline with pre-render fit-check and independent design critique.

Installation

This entry records only its repository, not the path inside it, so there is no exact command to give. Open the source below and copy the folder into ~/.claude/skills/, or the file into ~/.claude/agents/.

README

feishu-whiteboard-pro

一个用于打造真正"经过设计"的飞书 / Lark（飞书）白板的 Claude Code / agent **skill**——不只是配色好看，而是讲究构图：清晰的视觉焦点、真实的层次、刻意的留白。它产出的是飞书文档里一块**可编辑**的真实白板，而不是一张截图。

它构建于 [beautiful-feishu-whiteboard](https://github.com/zarazhangrui/beautiful-feishu-whiteboard) （沿用其配色板与 SVG 白板介质的硬性规则）之上，补上了原项目缺失的那一层：**如何构图，以及如何判断结果到底好不好。**

相比一个"配色板库"它多了什么

介质本身被刻意限制——单一字体、只有原生矩形 / 圆 / 连接线，没有渐变、滤镜、透明度、动效。所以这里的"好看" 指的是构图、层次、节奏、配色克制与留白。这个 skill 把两个原本靠临场发挥的软步骤变成了**关卡（gate）**：

理解内容
   │
   ├─▶ 关卡 1 · 设计简报      原型 + 焦点 + 配色策略 + 字号角色 + 反套路检查
   ▼
对照骨架构图               原型坐标 + 固定字号阶梯 + 8px 间距网格
   │
   ▼
渲染前预测缺陷（fit-check）  确定性：标签过宽 / 挤占间距 / 出血，在渲染前就抓出来
   │
   ▼
渲染 → 修正确性             溢出 / 重叠 / 裁切 / 手画箭头
   │
   ▼
关卡 2 · 设计评审           按层次 / 平衡 / 密度 / 对比 / 对齐五轴打分；要交付的板子上独立评审；修最弱项；重复
   ▼
写入飞书 → 看实时效果 → 交付

fit-check（scripts/fit-check.mjs）—— 估算每个标签的宽度（中文 ≈ 1em，拉丁字符 ≈ 0.6em），在渲染之前就标出溢出 / 挤占间距 / 出血。确定性，不耗模型。
独立评审 —— 对要交付的板子，由一个独立评审者对渲染结果做对抗式打分，把"只靠颜色撑起来"的假焦点和失衡的构图揪出来，而不是自我合理化。

示例

七张标杆样板，每张都过了双关卡（fit-check 干净、设计评审过关）并在真实飞书白板上渲染过。它们覆盖不同原型与配色板——其中一张还用的是**现场生成**的配色——但都出自同一条流水线，所以构图与配色是解耦的。把对应的 `.svg`（在 [`examples/`](examples/) 里）当作起手骨架打开，坐标都已经是评审过关的。

**四张复杂板子，四种不同配色：**