Feishu Cards · Live Build Report

这两张卡片,我实际是怎么做出来的

这不是“画了两个 UI 概念”。我实际跑了 Channel SDK、踩到 bot 身份错误、修了模板,然后用当前 Hermes Feishu app 把两张交互卡发到这个 DM。

真实发送验证Channel SDK跨 app 身份修复卡片 UX 判断
H · Command Center Card

当前任务:Feishu 卡片能力演示

准备 → 设计 → 发送 → 排障 → 沉淀
最终:两张卡成功发出,模板已修。

继续推进
要求返工

执行过程

关键点:卡片不是静态 JSON;真正重要的是发送身份、目标 ID、生命周期、按钮动作和可复用模板。

01准备

先加载卡片 Skill,不凭记忆硬写

用户问「会调飞书卡片吗」后,我先读 feishu-channel-cards skill,确认目标 ID、Channel SDK、卡片生命周期和移动端 UX 规则。

02设计

做第一版:作品交付面板

第一版选择 indigo / green,重点是通透、克制、留白多:标题、状态、双栏信息芯片、进度条、两个按钮。它适合作为 report / 进度 / 交付卡。

03排障

遇到真实故障:bot 身份错了

第一次用模板发送失败:230002 Bot/User can NOT be out of the chat。原因不是卡片 JSON,而是模板默认读 OpenClaw 的 Feishu app,跟当前 Hermes DM 的 bot 身份不一致。

04修复

改成当前 Hermes Feishu app 发送

我检查环境变量 FEISHU_APP_ID / FEISHU_HOME_CHANNEL,用当前会话的 Feishu app 重新发送,第一张卡成功到达。

05沉淀

顺手修 Skill 模板

把 card-runner-template.cjs 改成优先使用当前 Hermes 的 FEISHU_APP_ID / FEISHU_APP_SECRET,再 fallback 到 OpenClaw config,避免后续继续踩跨 app 身份坑。

06迭代

做第二版:任务控制台

第二版 turquoise 风格,更偏 Agent 长任务控制台:当前任务、进度、判断、推荐用途、继续推进 / 要求返工按钮。它比第一版更适合我日常跟你协作。

两个版本的取舍

两张都好,但用途不同:第一张更像“漂亮交付物”,第二张更像“Agent 工作台”。

indigo

交付面板版

气质通透、克制、高级适用报告交付 / 进度汇报 / 产物展示判断视觉更安静,像 finished deliverable。适合给客户或看最终结果。
teal

任务控制台版

气质产品感、状态感、行动感适用长任务 / Agent 协作 / 确认返工判断信息结构更像工作台,下一步动作更清楚。更适合我和 Tianyi 的日常协作。

技术复盘

这次最大的真实问题不是视觉,而是「同一套 SDK 不能默认复用另一套 bot 身份」。

现场证据

发送目标当前 Feishu DM:oc_eb276b27ddc6f4167e0e80e4a1400403
正确凭据来源FEISHU_APP_ID / FEISHU_APP_SECRET / FEISHU_DOMAIN
失败码230002 Bot/User can NOT be out of the chat
根因模板 fallback 到 OpenClaw app,目标 chat 属于 Hermes app
修复模板优先使用当前进程 Feishu env,再 fallback 旧 config
遗留注意Node Channel SDK 一次性脚本可能发送成功但 WebSocket/timer 不退出,要强制 disconnect/exit

以后我会怎么用

  • 短聊天不用卡片;卡片是工作台,不是聊天气泡。
  • 长任务要发一张初始卡,并尽量更新同一张卡,而不是刷多条消息。
  • 卡片里只展示用户关心的阶段:准备、执行、验证、交付、完成。
  • 按钮只放真正能推进任务的动作:确认、返工、继续、打开产物。
  • 绝不把 raw tool log、token、本地隐私路径、stack trace 暴露在卡片里。
  • Channel SDK target 用裸 oc_* / ou_*,不能混用 message tool 的前缀。
  • 跨 profile / 跨 app 发送卡片时,SDK 可复用,但 bot 身份必须显式确认。

结论

我会在跟你实际协作时用卡片,但只在卡片能减少等待、减少歧义、承载按钮决策或交付链接时用。普通聊天继续用普通消息。

回到报告集合