Skillget

vibecoding-humanizer

agent
Security Audit
Warn
Health Warn
  • License — License: MIT
  • Description — Repository has a description
  • Active repo — Last push 0 days ago
  • Low visibility — Only 5 GitHub stars
Code Pass
  • Code scan — Scanned 1 files during light audit, no dangerous patterns found
Permissions Pass
  • Permissions — No dangerous permissions requested

No AI report is available for this listing yet.

SUMMARY

给 vibe coding 产物去 AI 味的 Agent Skill：3d / svg / html / ui 四种模式，一行 npx skills add 安装。

README.md

vibecoding-humanizer：给 vibe coding 产物去 AI 味，3d / svg / html / ui 四种模式 / Remove the AI look from vibe-coded output

vibecoding-humanizer

给 vibe coding 产物去 AI 味的一个 Skill：3D 场景、SVG、HTML 动态海报与代码动画、UI 界面，按类型加载不同规则，也支持混合场景。

A skill that removes the "AI look" from vibe-coded output — 3D scenes, SVG, HTML posters & code animations, and UI — loading a different rule set per mode, with mixed-mode support.

npx skills add LearnPrompt/vibecoding-humanizer

30 秒宣传片：代码动画、UI、3D 的真实前后对照，SVG 与动态海报成果，最后是安装命令 / 30-second promo with real before-and-after frames

▶ 完整宣传片 30 秒 1080p，带配乐 / Full promo video (MP4)

一个 Skill，四种模式：3d 几何与光影、svg 路径与图标、html 代码动画与动态海报、ui 信息层级与交互 / One skill, four modes

前身是 carl-ui-humanizer，0.3.0 起改名并扩展到四类产物，见迁移说明。Formerly carl-ui-humanizer; renamed and expanded in 0.3.0.

安装 / Install

用现成的 Skills CLI（npx skills），本仓库没有自己的 npm 包。Uses the existing Skills CLI; this repo ships no npm package of its own.

# 交互式选择 Agent（默认装到当前项目）/ interactive, project-level
npx skills add LearnPrompt/vibecoding-humanizer

# 只装给 Claude Code，跳过确认 / Claude Code only, non-interactive
npx skills add LearnPrompt/vibecoding-humanizer --skill vibecoding-humanizer -a claude-code -y

# 装到用户级（所有项目可用）/ user-level
npx skills add LearnPrompt/vibecoding-humanizer --skill vibecoding-humanizer -a claude-code -g -y

想关掉 Skills CLI 的匿名统计，在命令前加 DISABLE_TELEMETRY=1。To opt out of the CLI's telemetry, prefix with DISABLE_TELEMETRY=1.

不用 npx 也可以 Git 克隆到宿主的 Skill 目录（目标目录必须不存在）/ Or clone manually:

git clone https://github.com/LearnPrompt/vibecoding-humanizer.git ~/.claude/skills/vibecoding-humanizer
# Codex: "${CODEX_HOME:-$HOME/.codex}/skills/vibecoding-humanizer"

装好后重开会话，宿主才会发现新 Skill。Restart the agent session after installing.

怎么用 / Usage

在提示语里写 类型：3d / svg / html / ui，或直接用自然语言。这是提示语约定，不是命令行参数。Name the mode in your prompt (mode: 3d / svg / html / ui) or just describe the task.

模式 复制即用 / Copy-paste prompt
3d 用 vibecoding-humanizer 按 3d 模式检查这个 Three.js 场景，优先修正悬浮、接触关系和光影，保留低多边形风格。
svg 用 vibecoding-humanizer 按 svg 模式清理这组图标：统一 viewBox 和描边，合并重叠路径，单色图标改 currentColor，在 24px 下检查可读性。
html 用 vibecoding-humanizer 按 html 模式改这支代码动画：去掉没信息量的英文小字，拉开字号字重对比，转场别每幕都一样，改完实际播放检查。
ui 用 vibecoding-humanizer 按 ui 模式检查这个落地页，先定 hero 风格，不堆功能区，保留必要的表单标签和价格。
混合 / mixed 类型：html，内嵌 svg；整理这张动态海报的文本层、SVG 路径和动画节奏，保留品牌与内容。
混合 / mixed 类型：ui，HTML 实现；先检查表单状态与阅读顺序，动效只保留与操作反馈有关的。

English: "Use vibecoding-humanizer in 3d mode: fix floating objects, contact and lighting first; keep the low-poly style."

规则怎么分 / How modes split

  • 3d：几何与拓扑、落地与穿插、材质、明确光源与阴影、相机、多视角；先结构后材质灯光。PBR 贴图不烘焙阴影高光 ≠ 场景禁用光影；low-poly 可以是主动风格。
  • svg：viewBox、节点与重叠形状、图标系统、小尺寸可读性。小数精度 ≠ 节点数；多色插画不一律 currentColor。
  • html：代码动画与动态海报的分层、可编辑文本、时间线与节奏。CSS 不是性能魔法；不把 UI 减动效规则套到叙事作品。
  • ui：信息层级、排版、颜色角色、交互、响应式、可访问性；沿用 0.2.0 的八维流程和 13 条诊断。去 AI 味 ≠ 永远禁紫色/圆角/渐变。

html 是实现载体，ui 是设计目标，可以叠加。详见 SKILL.md。

前后效果 / Before & After

用商汤 SenseNova-6.8-Flash 实测的真实截帧，只裁切压缩、未重绘。完整说明、来源时间点和局限见 examples/。Real frames, cropped and compressed only.

代码动画 / Code animation（html；首版 15s vs 装 Skill 后 35s，长度不同，非严格对照）

代码动画：首版 vs 装 Skill 后 / Code animation before and after

UI（跨模型对照：DeepSeek 首版 vs SenseNova + Skill，模型不同，差异不能全归因于 Skill / cross-model, not a controlled test）

UI：DeepSeek 首版 vs SenseNova-6.8-Flash + Skill / UI cross-model comparison

3D（3d；首版仅 Three.js → 素模 → 优化版）

3D：首版、素模、优化版 / 3D first pass, clay, optimized

SVG / 动态海报：只有成果、没有前版，所以不做对比。Results only, no "before" exists, so none is shown. 鹈鹕骑单车见 examples/。

包含什么 / What's inside

vibecoding-humanizer/
├── SKILL.md                  # 路由：选模式、混合规则、共用规则
├── references/
│   ├── mode-3d.md            # 3d 规则
│   ├── mode-svg.md           # svg 规则
│   ├── mode-html.md          # html：动态海报 + 代码动画
│   ├── code-animation.md     # 代码动画细则（html 模式引用）
│   ├── mode-ui.md            # ui：八维流程 + 13 条诊断
│   ├── prompt-library.md     # 14 条 UI 提示语
│   └── aesthetic-reference.md 等来源与对照材料
├── examples/                 # 前后效果与来源索引
├── agents/openai.yaml
├── VALIDATION.md
└── assets/
    ├── readme/               # 宣传片与 README 宣传图
    └── source-luinlee.png

每次只按模式读取需要的文件，不会把四套规则一起塞进上下文。Only the files for the chosen mode are read.

从 carl-ui-humanizer 迁移 / Migrating

  • 仓库由 LearnPrompt/carl-ui-humanizer 改名为 LearnPrompt/vibecoding-humanizer，提交历史保留，GitHub 会把旧地址跳转到新地址。
  • Skill 名从 carl-ui-humanizer 改为 vibecoding-humanizer。装过旧版的，先删旧目录（或 npx skills remove carl-ui-humanizer），再按上面的命令装新版。
  • 原 13 条 UI 规则和八维流程没有删改，移到了 references/mode-ui.md。

边界 / Limits

  • 规则来自作者实测和原帖整理，是经验规则，不是对所有模型的普遍结论；示例评价是作者主观观感。
  • 不把所有卡片、渐变、英文小标题、阴影、low-poly 当错误；用户明确的风格优先。
  • 不包含检测服务、自动评分、联网 SDK 或自有 CLI。验证范围见 VALIDATION.md。

致谢 / Credits

  • 条目结构参照 blader/humanizer（快照修订 8c307f3，读取于 2026-10-28）。
  • 去冗余核心原则来自 Zihua（@luinlee）：Avoid unnecessary secondary labels and descriptions. Let the layout do the explaining.
  • UI 来源、中英原句与翻译边界见 原始素材 与 来源覆盖；Anthropic 前端审美提示按 MIT 许可完整保留。
  • 安装依赖 vercel-labs/skills。可选的生成后审计：Hallmark、Impeccable、Taste Skill。

许可 / License

本仓库自己写的规则、文档和示例按 MIT 许可。引用的第三方内容保留各自的条款：Anthropic 前端审美提示按其 MIT 许可转载，协议全文在 references/anthropic-prompts-en-zh.md 末尾；其余引用的原帖句子归原作者所有，出处见原始素材。

Rules, docs and examples written for this repo are released under the MIT License. Quoted third-party material keeps its own terms: the Anthropic frontend aesthetics prompts are reproduced under their MIT license (full text at the end of references/anthropic-prompts-en-zh.md); other quoted sentences belong to their original authors, with sources listed in references/original-materials.md.

Reviews (0)

No results found