「1 单变 0 单,别标红色 −100%」:一个卖 Mac 小工具的人,把仪表盘规矩写成 Claude Code 技能,17 天 384 星
它是什么 一个给 Claude Code、Codex、Cursor 用的开源技能包,教 AI 代理把数据仪表盘做得好看又不误导人,做完还要按三种屏宽截图自检。
为什么火了 它占住了「仪表盘」这个具体场景名,把规则写成一眼能懂的反例(1 单变 0 单别标红色 −100%),先在 Reddit 和 Medium 起头,11-05 被中文号 GitHubDaily 推荐后单日 +115 星。
B你可以怎么跟 别再做仪表盘,换一个还没有专门技能的界面场景(设置页、新手引导、定价页、某个原生生态),照它的结构写对照表、出处和截图自检,发 Reddit 加长文,再把对照表翻成中文找中文推荐号。
- 数据(每天更新) · 建库 2026-10-20 · 405 星 · 7 天 +210
GitHub · 星数 数据 2026-10-21 → 2026-11-08(19 天,18 次观测)。10-28 以前的点来自 deeply / 存档补录,不是每天都有
dashboard-design-skill 是乌兹别克斯坦的独立开发者 Otabek Abdiraimov 一个人写的 Claude Code 技能包,教 AI 编码代理把数据仪表盘做得「好看又不撒谎」。它没有代码,只有十一份 Markdown。它起量靠的是一个具体的场景名、几条一看就懂的反例、做完截图自检,再加上中文 GitHub 推荐号的一条转发。总量还小,但这套做法几乎零成本,换个场景就能再来一次。
他本来只是想看哪条帖子能卖出 App
Otabek 做两款付费 Mac 小工具:Halo,把 MacBook 的刘海变成灵动岛,一次买断 $9.99;Shedi,给开发者用的磁盘清理工具。他在 Medium 那篇文章里开头就交代:「我做小 Mac 应用,想要一个屏幕告诉我,哪些帖子真的带来了销量。」为了做这个屏幕,他翻了 127 个已上线的仪表盘,发现大多数「在悄悄撒谎」。
2026 年 10 月 20 日,他建了库,同一天在 Reddit 的 r/claudeskills 发帖:「I built a free Claude Code skill for clean dashboard UI, made with Claude Code from 127 real dashboard screens」。帖子下有人提了建议,他当天就改,1.3.0 的提交说明里写着「suggested on r/claudeskills」。第二天,Medium 长文《I studied 127 dashboards. Most of them quietly lie to you.》发出,当天 41 星,再过一天 94 星(GitHub 每日记录)。
它到底教代理做什么
README 里有一张「别这样做 / 改成这样」的对照表,传播最广的就是这几条:
| 别这样 | 改成这样 |
|---|---|
| 1 单变 0 单,显示红色 −100% | 灰色小字「was 1」 |
| 坐标刻度 2,103、1,402 | 取整:0、1k、2k |
| 每个 KPI 数字下面一句解释 | 一个涨跌值加一个词的基准,解释放进悬停提示 |
| 宽屏上一条窄列浮在中间 | 屏幕越宽,列越多 |
| 半圆仪表盘 | 子弹图:一根条、一条目标线、几段灰底 |
另外两点让它和一堆「让 AI 做出好看 UI」的技能拉开了距离。第一,每一单活都以截图自检收尾:按 3440、1440、375 三种宽度截图,数页面上有几句完整的话,目标是 0 句。这正对着代理写界面最大的毛病,只看代码,不看画面。第二,规则都有出处:Stephen Few、Tufte、Cole Nussbaumer Knaflic、Cleveland & McGill、NN/g、WCAG,还有 Apple 六场 WWDC 图表讲座。「127 个仪表盘」这个数好记,直接当了标题。
装法也多:Claude Code 插件市场两行命令,或者拷进 skills 目录;Codex、Cursor 在 AGENTS.md 里指过去就行,还单独写了 SwiftUI 的部分。
星是从哪来的
| 时间 | 发生了什么 | 星数 |
|---|---|---|
| 10-20 | 建库,Reddit 首帖,十来个技能目录站自动收录 | — |
| 10-21 | Medium 长文 | 41(10-21)→ 94(10-22) |
| 10-22 ~ 10-28 | 没有新动作,每天 +5 左右 | 132 |
| 10-28 / 10-29 | 发 2.0,Reddit 第二帖:「我自己的技能做出了一个我讨厌的仪表盘,于是照着 Few、Tufte 和 Apple WWDC 重做了」 | 165(当天 +33) |
| 10-30 ~ 11-02 | 中文 X 号 @GitTrend0x 在技能合集帖里点名「看板设计师」(33 赞),Geek Lite 跟进 | 每天 +7 ~ 10 |
| 11-05 | @GitHub_Daily 单独推荐,335 赞、34 转发、约 1.8 万次浏览 | 230 → 345(11-06 单日 +115) |
| 11-06 | GitHub 现查 | 384 星、21 fork |
星数来自 GitHub 每日记录和 GitHub API(11-06)。
两件事值得看。一是英文这边只在 r/claudeskills 一个版块和目录站里有动静,没上 Hacker News,没上 Product Hunt,也没有英文大号转发。二是最大的一波来自中文推荐号:GitHubDaily 一条帖,单日星数就是之前日均的十几倍,11-04 到 11-06 冒出来的 7 个 fork 里有好几个中文名账号,时间对得上。中文转发几乎都在引用那几条「反例到正例」,说明这种写法最好转述。
它其实是个广告位
README 最后一节叫「From the maker」,挂着 Halo 和 Shedi,链接都带 ?ref=dashboard-design-skill。更狠的一招写在 SKILL.md 里:代理每做完一单仪表盘活,就在回复末尾加一行「Dashboard design by the dashboard-design skill, made by Otabek, who also makes Halo… and Shedi…」。规则写明每场对话只出现一次、只在活干完之后、不进代码和提交;README 里也说了,不想要就删掉这一节。
也就是说,每个装了它的人,都会在自己的终端里反复看到他的 App。这对开源的人有参考价值:开源本身不赚钱,但它可以是你其他东西的入口。只是这一招也可能招人反感,目前评论里看不到反馈(推断:量太小,还没人在意)。ref 链接带了多少销量,外面看不出来。
谁在抢同一个位置
「让 AI 代理把界面做好」这个位置早就挤满了,只是大的都是通用款:
| 名字 | 规模(GitHub,11-06) | 和它的不同 |
|---|---|---|
| nextlevelbuilder/ui-ux-pro-max-skill | 145,640 星,7 天 +3,170 | 通用 UI/UX 知识库,仪表盘只是其中一类 |
| anthropics/skills(frontend-design 等) | 187,695 星 | 官方通用前端技能;Claude Code 还内置了 dataviz 技能,专管图表、KPI 卡和配色,和它正面重叠 |
| Nutlope/hallmark | 48,631 星,7 天 +6,737 | 通用「去 AI 味」设计,大号作者自带流量 |
| feimacode/open-design-agent-kit | 1,000 星,7 天 +589 | 通用专业 UI 套件 |
| larashero3-dotcom/lieflat-charts | 6,724 星 | 把数据转成交互图表,只管出图,不管整页 |
| aref-vc/tufte-claude-skill 等 | 两三百星 | 只把 Tufte 落到单张图 |
通用款比它大两三个数量级,但「仪表盘」这个具体名字下面没有大号,合集里那几个同名技能都很短,也没有截图自检和前后对比图。它是靠占住一个具体场景名、把内容做扎实起来的,不是因为没有竞品。目前也没看到有人照着它复刻。
如果是你
一句判断: 打法值得抄,别再做一个仪表盘技能。「挑一个具体界面场景 + 有出处的反例清单 + 截图自检 + 前后对比图 + 找中文推荐号」这套几乎不花钱,换个场景能再来一次;但天花板是几百到一两千星,而且官方内置技能随时可能把你的场景吃掉。
适合谁: 在某类界面上真踩过坑、有自己作品可以截图的开发者或设计师;手上有付费产品、想给它找个长期入口的独立开发者。
不适合谁: 想靠这个直接冲上万星的人,通用设计技能的头部已经被大号占了;没有真实项目、只能把网上的设计规范重新排一遍的人,内容不扎实,中文号也不会转。
怎么做:
- 挑一个还没有专门技能的具体场景:设置页、注册和新手引导、定价页、表单与报错、空状态、邮件模板、App Store 截图,或者某个生态(SwiftUI、Flutter、Jetpack Compose)的整页规范。
- 内容照它的结构写:一张「别这样 / 改成这样」对照表放 README 首屏,每条都能一眼看懂;规则写出处;最后一步强制截图自检,写清楚截几种尺寸、查什么。
- README 放前后对比图,标题用一个好记的数(「我看了 N 个样本」)。
- 有自己的产品就在 README 和技能输出里挂上,但写明怎么关掉。
怎么获客: 英文先发 r/claudeskills、r/ClaudeCode,再写一篇「我研究了 N 个 X,大多数都错在同一件事」的长文;过一周发 v2,用「我自己的技能做出了我讨厌的东西」再发一轮。然后把那张对照表翻成中文,直接去找 GitHubDaily、GitTrend0x 这一档的中文推荐号,这次一条帖就带来了单日 +115。
什么时候之前: Claude Code 技能这波热度还在,目录站和推荐号都在找新库。估计窗口按月算(推断),年底前发出去比较稳。
什么情况说明看错了: 你的技能发出去两周,Reddit 帖没人互动、中文号没人转,星数停在两位数,说明场景选得不够痛或者反例不够直观;或者 Claude Code 官方又内置了覆盖你这个场景的技能,那就该换题目了。
研究底稿:竞品表、获客证据、完整研究报告
- 竞品
名字 在哪 上线 规模 它和这家不同在哪 nextlevelbuilder/ui-ux-pro-max-skill 开源 2025-11-30 145,640★,7 天 +3170 通用 UI/UX 知识库,仪表盘只是其中一类,没有数据诚实性规则和截图 QA Nutlope/hallmark 开源 2026-04(约) 48,631★,7 天 +6737 通用「反 AI 味」设计技能,大号作者带的流量,不专做数据页 Anthropic 官方 skills(frontend-design)与 Claude Code 内置 dataviz 技能 大厂功能 2025-09-22 起 anthropics/skills 187,695★;dataviz 内置在 Claude Code 官方的通用前端和图表规范,开箱就有;它更聚焦整页仪表盘,也更有主见(不放句子、不用小基数百分比、要截图验收) sickn33/agentic-awesome-skills · dashboard-design 开源 2026-01-14 合集 49,212★ 合集里一个泛泛的布局技能,短,没有前后对比和 QA larashero3-dotcom/lieflat-charts 开源 2026-07-16 6,724★ 把数据转成交互 HTML 图表,偏出图,不管整页仪表盘的设计判断 aref-vc/tufte-claude-skill / caylent/tufte-data-viz 开源 2026-05-23 / 2026-02-18 316★ / 232★ 只把 Tufte 原则落到单张图表;它整合了 Few、Tufte、NN/g、Apple WWDC,覆盖整页和组件 feimacode/open-design-agent-kit 开源 2026-09-19 1,000★,7 天 +589 通用专业 UI 设计套件,面向多种代理,不专做数据诚实性 ahpxex/open-dashboard 开源 2025-09-28 146★ 36 个可直接拷贝的后台页面代码模板,给的是代码,不是设计规则和点评 - 用户从哪来
- 查实 Reddit r/claudeskills 首发帖:10-20 发「I built a free Claude Code skill for clean dashboard UI…127 real dashboard screens」(Brave);1.3.0 提交说明写「suggested on r/claudeskills」;Upstar 显示首日约 80★
- 查实 Medium 观点长文:10-21「I studied 127 dashboards. Most of them quietly lie to you.」,README 挂了链接,别人的 Medium 文章在相关推荐里带出它
- 查实 Reddit v2 第二帖加 2.0 发版:10-28 发 2.0.0,r/claudeskills「My free Claude Code dashboard skill built a dashboard I hated… (v2)」;10-29 单日 +33(我们的 github 库)
- 查实 中文 X 推荐号:GitHubDaily 11-05 10:30 单独推荐(❤335 🔁34 👁17,875),紧接着 11-06 单日 +115,同期出现中文名 fork;GitTrend0x 10-30 合集帖 ❤33;QingQ77 11-02
- 查实 技能目录站自动收录:skillsdirectory(10-20 扫描,Grade A)、skillsllm、agensi、claudius、aiagentslisting、prompthackers、gitbap、duink、upstar、star-history
- 推断 Reddit 旧帖回复里挂链接:Brave 摘要里 r/ClaudeCode「Skill for Dashboard Style Guide」和 r/homeassistant 的帖子带出它的标题,可能是作者回复,也可能是相关推荐
abdiraimov-otabek/dashboard-design-skill 为什么能跑出来
一句话:乌兹别克斯坦的独立 Mac 开发者 Otabek Abdiraimov 给 Claude Code 写的「仪表盘设计」技能包。它本质上是作者给自己两款付费 Mac 应用(Halo、Shedi)做的引流素材。起量靠三件事:Reddit r/claudeskills 发了两帖、一篇 Medium 长文,再加中文 GitHub 推荐号转发,其中 11-05 GitHubDaily 一条帖就带来单日 +115 star。卖点是把「诚实的数据呈现」规则写得非常具体,做完还要截图自检,这在一堆「好看 UI」类技能里少见。不过总量只有 384★,仍属小圈子级别。
1. 基本数据
- 2026-10-20 建库,单作者,7 次提交,最后一次是 10-28 发的 2.0.0。MIT 协议,纯 Markdown(1 个 SKILL.md 加 10 个参考文档),带 Claude Code 插件市场清单(GitHub API,2026-11-06)。
- 星数:GitHub API 现查 384★、21 fork。我们的 github 库记到 11-06 是 345★,gain_1d +115,gain_7d +167,prev_7d +84,status「加速」,suspect 为空。没上过 trending,但建库不满 60 天本来就不收,这点说明不了什么。
- 逐日曲线(我们的 github 库 repo_day):10-21 41 → 10-22 94 → 10-28 132(这几天每天 +5 左右)→ 10-29 165(+33)→ 10-30 178 → 11-05 230(每天 +7~10)→ 11-06 345(+115)。
- Upstar 页面显示建库约 22 小时时有 80★,24 小时 +66(upstar.dev,抓取时间未核实)。
- fork 时间分两段:10-20~21 有 6 个,11-04~06 又冒出 7 个,其中 chinabjhzc、Janxxxx 等在 11-05~06,和中文大号转发的时间对得上(GitHub API forks)。
- stargazer 明细接口这次返回 404,所以没能逐个看给星的账号。
2. 竞品
做同一件事的产品很多,竞争的是同一个位置:「让 AI 编码代理把 UI 做好看」。
| 名字 | 在哪 | 上线 | 规模 | 和它的不同 |
|---|---|---|---|---|
| nextlevelbuilder/ui-ux-pro-max-skill | 开源 | 2025-11-30 | 145,640★,7 天 +3170 | 通用 UI/UX 设计知识库,面向所有页面;仪表盘只是其中一类,没有数据诚实性规则 |
| Nutlope/hallmark | 开源 | 约 2026-04 | 48,631★,7 天 +6737 | 「反 AI 味」通用设计技能,大号作者带的流量 |
| anthropics/skills(frontend-design 等) | 大厂功能 / 开源 | 2025-09-22 | 187,695★ | 官方通用前端设计技能;Claude Code 另有内置的 dataviz 技能,专管图表、KPI 卡和仪表盘配色,和它正面重叠 |
| sickn33/agentic-awesome-skills 里的 dashboard-design | 开源合集 | 2026-01-14 | 合集 49,212★ | 合集里一个泛泛的仪表盘布局技能,短,没有截图 QA |
| larashero3-dotcom/lieflat-charts | 开源 | 2026-07-16 | 6,724★ | 把数据转成交互 HTML 图表的数据可视化技能,偏出图,不管整页仪表盘 |
| aref-vc/tufte-claude-skill、caylent/tufte-data-viz | 开源 | 2026-05 / 2026-02 | 316★ / 232★ | 只把 Tufte 原则落到单张图表;它把 Tufte、Few、Apple WWDC 都整合到了整页 |
| feimacode/open-design-agent-kit | 开源 | 2026-09-19 | 1,000★,7 天 +589 | 通用专业 UI 设计套件,带 dashboard 话题 |
| ahpxex/open-dashboard | 开源 | 2025-09-28 | 146★ | 36 个可直接拷贝的后台页面形态(TanStack/shadcn),给的是代码模板,不是设计判断 |
| claudeskills.page dashboard-ui、mcpmarket 上的 KPI Dashboard Designer、dastoyan design-dashboards(Medium 2026-07) | 网页目录 / 开源 | 2026-07~11 | 小 | 都是单文件规则,没有截图验收,也没有前后对比图 |
(星数来自我们的 github 库,2026-11-06;目录站来自 Exa / Brave 搜索结果。)
结论:「仪表盘设计技能」这个细分里没有大号。头部通用设计技能比它大两三个数量级,Claude Code 自带的 dataviz 技能也在吃这块需求。它能起来,是因为占住了「仪表盘」这个具体场景名,而且内容做得扎实,不是因为没有竞品。
3. 增长手段(按时间)
- Reddit r/claudeskills 首发(10-20,已确认):帖子标题「I built a free Claude Code skill for clean dashboard UI, made with Claude Code from 127 real dashboard screens」(Brave 显示「2 weeks ago」)。1.3.0 的提交说明写着「suggested on r/claudeskills」,说明帖子下有人互动,作者当天就照建议改了。帖子分数和评论数没能读到(Reddit 拦了抓取)。首日约 80★(Upstar)。
- Medium 长文(10-21,已确认):「I studied 127 dashboards. Most of them quietly lie to you.」(medium.com/@otabekabdiraimovv,2026-10-21),把技能里的十条规则写成可传播的观点文,README 里也挂了链接。Medium 上至少两篇别人的文章在相关推荐里出现了它(Jina 搜索结果)。
- 技能目录站自动收录(10-20 起,已确认):skillsdirectory(Grade A,10-20 扫描)、skillsllm、agensi、claudius、aiagentslisting(10-20 收录)、prompthackers、gitbap(韩文)、duink(DSH Universe)、star-history、upstar。这些都是爬 GitHub 的长尾入口。
- 2.0 发版加第二帖(10-28~29,已确认):r/claudeskills 发「My free Claude Code dashboard skill built a dashboard I hated. So I rebuilt it from Stephen Few, Tufte and Apple's WWDC chart talks (v2)」(Brave 显示「1 week ago」)。用「自己打脸再重做」的叙事,10-29 单日 +33。
- 中文 X 推荐号(10-30 起,已确认):
- @GitTrend0x 10-30 发 Skills 合集帖,点名「abdiraimov-otabek 的看板设计师」,❤33。
- @QingQ77(Geek Lite)11-02,❤7。
- @GitHub_Daily(GitHubDaily)11-05 10:30(北京时间)单独推荐,❤335、🔁34、👁17,875,紧接着 11-06 单日 +115,中文名 fork 同期出现。这是目前最大的一波(X 实时搜索,2026-11-06)。
- Reddit 旧帖回复里挂链接(未确认):Brave 的摘要里,r/ClaudeCode「Skill for Dashboard Style Guide」(2026-03)和 r/homeassistant 的仪表盘帖下出现了它的帖名,可能是作者去旧帖回复,也可能只是 Reddit 的相关推荐。
- 没找到:HN(hackernews 库搜不到)、Product Hunt、TikTok、英文大号。
4. 为什么用户愿意装(产品本身)
- 规则具体到可以直接照做:「1 单变 0 单不显示红色 −100%,改成灰色 was 1」「坐标刻度取 0/1k/2k」「今天到 9 点只和昨天到 9 点比」。中文转发几乎都在引用这几条(GitHubDaily 原文),说明这种「反例到正例」的写法最能传播。
- 截图 QA 收尾:按 3440、1440、375 三种宽度截图自检,还要数页面上有几句话(目标是 0 句)。这正对着 agent 写 UI 的最大痛点,也就是「只看代码不看画面」。
- 有权威背书:Few、Tufte、Knaflic、Cleveland & McGill、NN/g、WCAG、Apple WWDC 图表讲座。「127 个已上线仪表盘」这个数字好记,适合当标题。
- README 前后对比图:超宽屏改前改后、组件截图。在目录站和 X 上,一眼就能看懂它改了什么。
- 装法多:Claude Code 插件市场、拷到 skills 目录、Codex/Cursor 在 AGENTS.md 里指向它,另外还支持 SwiftUI。
5. 钱和动机:它是个引流漏斗
- README 有「From the maker」一节,挂着 Halo(Mac 刘海灵动岛,一次买断 $9.99)和 Shedi(给开发者用的 Mac 清理工具),都带
?ref=dashboard-design-skill。 - SKILL.md 里写了 Sign-off 规则:agent 每完成一单仪表盘工作,就在回复末尾加一行「made by Otabek, who also makes Halo… and Shedi…」,每次对话一次,README 里有说明,用户可以删。等于把广告写进了 agent 的输出里,每个装了技能的用户都会反复看到。这是能借鉴的打法,但也有招人反感的风险。
- 作者本来就在做内容营销:halo-mac.com 有 press kit 和 SEO 指南(「How to know when Cursor's agent is done」等),dev.to 有「CleanMyMac alternative for developers」,Halo 上过 Product Hunt,也在 r/ProductivityApps 发过帖。技能本身就是他在写的那个「看哪条帖子带来销量」的仪表盘的副产品(Medium 原文)。
6. 被看见的程度
小圈子里在传。英文侧只在 r/claudeskills 和技能目录站里有动静。中文侧被 GitHubDaily、GitTrend0x、Geek Lite 推荐过,GitHubDaily 那条约 1.8 万次曝光。没有媒体报道,没上 HN/PH。开源免费,不涉及收入公开。
7. 跟风者
目前没看到复刻它的库。我们的库里 10-20 之后新建的仪表盘类技能都不是在仿它。claudeskills.page 的 dashboard-ui(11-04 更新)是同类单文件技能,但没有证据表明是跟它学的。
8. 能借鉴的
- 独立开发者用免费开源技能给自己的付费 App 引流,两个入口:README 里的 ref 链接,和写进 SKILL.md、由 agent 在输出末尾自动带出的署名。
- 选一个具体场景名(dashboard),别做通用「好看 UI」,这样能在长尾搜索和目录站分类里冒头。
- 发帖叙事可以照搬:「我研究了 N 个样本」加反常识清单,配前后对比图;v2 用「我自己的技能做出了我讨厌的东西」再发一轮。
- 中文 GitHub 推荐号(GitHubDaily 这一档)一条帖,就够给小库带来单日翻几倍的 star。
9. 不确定
- Reddit 两帖的分数和评论数没读到。
- stargazer 明细接口 404,没法排查有没有刷星;fork/星约 5.5%,没有异常信号。
- GitHubDaily 的粉丝数没核实。
- ref 链接到底给 Halo/Shedi 带来多少销量,不知道。
- 11-06 之后的热度能不能维持,也不知道。