超级个体IP(星空导航站)
把「自己关注的标杆 / 资源 / 收藏」做成一个可部署的星空导航网站——每一颗星,都是一个你想追随的人、公司或资源;点进星星,直达他们的世界。
一句话定性:这是「建站模板」类技能,不是方法论技能。 输入一份 config(站点名 + 星星数组),跑一条命令,输出一套纯静态、可直接上线的星空页。
何时使用
用户出现以下意图即触发:
- 「星空导航」「我的星空」「个人导航站」「收藏星空」「点亮星星」
- 「超级个体IP星空」「做个自己的导航网站」「把我的收藏做成导航站」
- 「一键部署一个导航页」「给自己的资源/标杆做一个入口页」
- 想把「自己关注的标杆/资源/收藏链接」沉淀成一个有仪式感的、可分享的网址
一句话判断:主语是「一个可部署的网站模板」还是「一套方法论」? 用户要「一个能直接上线、往里填星星的站点」,套本技能;用户要「怎么打造个人 IP 的方法论诊断」,不适用(那是 super-individual-ip 技能的事)。
一、这个模板长什么样(核心结构)
| 元素 | 说明 |
|---|---|
| 深空星空背景 | 纯 CSS 绘制:深色渐变底 + 多层 radial-gradient 星云光晕 + 撒一层静态小星点,零图片 |
| 左上角标 | 站点名角标(站点名 · 口号) |
| 右上角计数 | 「点进任意一颗星,直达他们的世界 · N 颗星」 |
| 星星节点 | 每颗星 = 一个标杆/资源;大中小三级;hover 显示名称 tooltip |
| 右下角 ⚙ | 在线维护星星:增/删/改(名称、链接、大小),改动存本地 localStorage,恢复默认一键还原 |
| 页脚 | 一行可配置的版权/说明文案 |
二、保留的星空精髓(别阉割)
- 三层动画:star-drift(漂移)/ star-orbit(公转)/ star-breathe(呼吸),参数按星星顺序用 sin 伪随机确定性派生,位置稳定、每次渲染一致。
- 真实星色温:蓝白热星 / 纯白 / 暖黄老年星,约 2:5:3 比例,确定性分配。
- 三级星:l3=20px(大)/ l2=11px(中)/ l1=7px(小),对应 config 的 level 3/2/1。
- hover 名称 tooltip:顶部翻转到下方、边缘向内收、长名省略号。
- 左上角板块名角标 + 右上角「N 颗星」计数。
- 静态星星兜底:模板内置静态星星,
window.STARS为空/异常时页面也不空白;无 link 的星星渲染成span(不可点)。
三、config 结构(assets/config_template.json)
{
"site_name": "我的星空",
"slogan": "点亮属于自己的那颗星星",
"footer": "© 2026 尘AI · 保留所有权利",
"accent": "#FFFFFF",
"stars": [
{"name": "示例标杆1", "link": "https://example.com", "level": 3},
{"name": "示例标杆2", "link": "https://example2.com", "level": 2,
"pos": {"x": 12, "y": 18}, "color": "warm"}
]
}
site_name/slogan/footer/accent:站点名、口号、页脚文案、强调色(theme-color)。stars:支持任意数量。
每条星星的字段
| 字段 | 必填 | 说明 |
|---|---|---|
name |
必填 | 名称,缺失则该星跳过 |
link |
可空 | 空则渲染成不可点的 span 小星 |
level |
可选 | 1/2/3 对应小(7px)/中(11px)/大(20px),非法值回退 2 |
pos |
可选 | 手动指定位置,百分比坐标。两种写法:{"x":12,"y":18} 或 "12,18"。填了就跳过确定性公式;非法值忽略,越界自动夹到安全边界 (x 2–98, y 4–94) |
color |
可选 | 手动指定色温:blue 蓝白热星 / white 纯白 / warm 暖黄老年星。大小写不敏感,非法值忽略 |
不填 pos / color 时的默认行为:位置走 6 列网格 + sin 抖动确定性公式,色温按 (order×7)%10 推导(蓝白/纯白/暖黄 ≈ 2:5:3,每 10 颗循环一轮)。因为按序号派生,调换 stars 数组顺序就能间接控制位置和颜色 —— 想要精确控制请显式填 pos / color。
四、一键出成品(config → out/)
- 填 config —— 打开
assets/config_template.json,把示例值换成真实站点名与自己的星星(可先用默认 30 个 AI 标杆示例兜底)。 - 跑脚本:
bash
python scripts/generate_site.py assets/config_template.json --out out
脚本把 assets/template/index.html 里全部 {{占位符}} 与 __STARS__/__STARS_STATIC__ 替换成 config 里的真实值,输出 out/index.html + out/style.css,末尾打印「已生成 out/(N 颗星)」与「残留占位符 0 处」。
3. 得站点 —— 浏览器直接打开 out/index.html 预览;深空星云 + 会呼吸的星星全部就位。
4. 上线 —— 用「发布为应用」(见 references/deploy.md)把 out/ 部署成在线链接。
> 生成器是纯标准库 Python(零第三方依赖),幂等、可重复运行;config 缺字段用默认值兜底、绝不崩。适合「批量出自己的导航站」与「给买家交付可直接部署的成品」两类场景。
五、固定工作流(建站 5 步,顺序固定)
- 问需求 —— 问用户:站点叫什么、星星有哪些(名称 + 链接 + 大小);用户没想法就给默认 30 个 AI 标杆示例兜底。
- 填 config —— 打开
assets/config_template.json(或直接生成一份用户专属 config),填入站点名/口号/页脚 + 星星数组。 - 跑脚本 ——
python scripts/generate_site.py <config> --out <输出目录>,确认打印「N 颗星、残留 0 处」。 - 部署 —— 用「发布为应用」上线(复用 app id 保持 URL;静态站点无需 Node 后端;部署红灯需用户点头确认)。
- 回传 —— 回传部署链接 + 截图验证(打开 out/index.html 无 console error、星空正常渲染)。
> 部署后无需改代码重部署也能维护星星:页面右下角点「⚙」,即可在面板里增 / 删 / 改星星(名称 / 链接 / 大小),改动即时存到本机浏览器(localStorage),刷新仍在;点「恢复默认」可一键回到 config 注入的默认星星。
六、硬纪律(不可妥协)
- 包内零二进制:技能包只能有 py/json/md/css/html,禁止任何 .png/.jpg/.webp/.woff 等图片/字体/媒体,星空背景必须纯 CSS。
- 部署前征得用户确认:不替用户拍板上线,部署红灯必须用户点头。
- 改星星 = 改 config 重跑脚本重部署:不直接改 out/ 产物,以 config 为唯一数据源。
- 模板与产物分离:
assets/template/是模板(含占位符),out/是产物(可部署);改模板动的是模板,改内容动的是 config。
Resources
assets/config_template.json—— 站点配置模板:站点名/口号/页脚/强调色 + 30 个 AI 标杆示例星星,改完即用。assets/template/index.html—— 星空页模板:星星从window.STARS数组读,含站点名/口号/页脚/强调色占位,纯前端零后端。assets/template/style.css—— 星空样式:纯 CSS 星空背景(零图片)+ 三层星星动画 + 三级星 + 色温 + tooltip。scripts/generate_site.py—— 一键生成器:读 config → 注入星星 → 出 out/index.html + out/style.css(纯标准库,零依赖)。references/deploy.md—— 一键部署指引:用「发布为应用」上线、复用 app id、改内容后重生成重发布。