HeiGe UI — AI skill for Claude Code

HeiGe-UI

---

这是什么 What is this

让 AI 做出**有气场、有记忆点、一眼不像 AI 做的**前端界面。

你肯定见过那种界面：居中卡片、紫蓝渐变、圆角阴影，工工整整，挑不出错，但你**三秒就忘**。因为 AI 只是把组件从货架上扯下来，平铺在画布上，能用，仅此而已。

HeiGe-UI 不这么干。它把一个界面当成一段**有节奏的叙事**来导演：有开场，有张弛，有主角，有一个让你记住的瞬间。做完一眼能认出，这是**人锻造的**，不是机器生成的。

它不是又一个组件模板库，而是一套从真实商业项目里磨出来的方法论：

• ✅ 五道锻造工序，每件作品都要过一遍
• ✅ 八种极端气质，每种都给到能直接上手的打法
• ✅ 反 AI 体检清单，把那股 AI 味摁死在交付前
• ✅ 动手前先定调，出货前过体检
• ✅ 十二个跨气质样例，同一套方法论，做出完全不同的东西
• ✅ 零依赖单文件，到处都能用

**适用场景**：产品官网、落地页、Dashboard、组件库、营销页、App 界面、Web 应用、作品集、活动页。

**支持平台**：Claude Code、Cursor、Windsurf、Cline、Aider、OpenClaw、Hermes、ChatGPT、Claude.ai 等。

别人做的是网页，你做的是带签名的作品。一眼能认出，这是锻造的，不是生成的。

---

为什么需要它 Why this matters

普通 AI 给你的界面	HeiGe-UI 锻造的界面
紫蓝渐变 + 居中卡片 + 圆角阴影，老三样，能用，但你三秒就忘	首屏 3 秒立住气质，看一眼就记住
组件一字排开，一个调子干到底	像电影一样有起伏：开场、铺垫、高潮、收尾
什么都想突出，结果一个都没突出	一屏只捧一个主角，其余全往后退
换个模板就能把你平替，毫无辨识度	每页都有一个别人做不出来的签名瞬间
一眼被看穿是 AI 糊弄的	出货前过一遍反 AI 体检，糊弄不过关

---

核心方法论 五道锻造工序

写代码之前先想清楚：用户从打开页面到离开，你想让他经历一段什么样的体验？平铺思维问的是「这页放哪些模块」，导演思维问的是「节奏是什么、高潮在哪、走的时候记住了什么」。

⚒️ 01 开场定调 Cold Open

首屏 3 秒决定一切。它不是用来摆标题和按钮的，是用来立人设、定气质的。

🌊 02 节奏曲线 Pacing Curve

页面像电影一样有张弛：冲击 → 呼吸 → 推进 → 高潮 → 收束。不要均匀平铺、一个调子到底。

🎯 03 一屏一主角 One Protagonist

每一屏只能有一个视觉主角，其余全是配角。什么都想突出 = 什么都不突出。

✦ 04 签名时刻 Signature Moment

每个作品至少要有一个别人不会做、也不太敢做的记忆点。这是作者签名，一个就够，但必须有。

🔍 05 反 AI 体检 Anti-Slop Check

出货前强制过一遍体检：紫蓝渐变？居中卡片三件套？默认字体裸奔？命中任何一条都要回去重做。这一步不是可选的，是交付门槛。

完整方法论与使用