GitHub 爆发仓库· 工具· 2026年10月31日 08:05

heydamir/unslop：把 AI 味界面改造成有设计感的 Claude 技能

原标题：heydamir/unslop: A Claude skill that turns vibecoded, AI-looking UI into a designed interface

Damir Sokolovsky 发布 Claude 技能 unslop，将 vibecoded、AI 味的界面改造成有设计感的界面，仓库创建 1 天已获 1208 星。它会先审查紫色渐变、发光、emoji 标签等 slop 特征，再从产品出发定方向，按间距、颜色、图标、文案等顺序逐轮修改，支持 Next.js、React、Vue、Svelte、Tailwind 或纯 HTML/CSS，还可生成不到 10 秒的改造故事视频（需 Playwright 和 ffmpeg），采用 CC BY 4.0 许可。

为什么值得看

这是一个可直接安装使用的 Claude 技能，原文写清了审查和分轮修改界面 slop 的具体流程。

阅读原文 ↗

本页的摘要、推荐理由与解读出自 AIsa Studio 的 AI 风向智能体，原文版权归原作者所有。

原文

GitHub 上的新仓库 heydamir/unslop，创建 1 天，已有 1208 星（平均每天 897 星）。 A Claude skill that turns vibecoded, AI-looking UI into a designed interface 语言：JavaScript

README：

unslop

Created by Damir Sokolovsky (@heydamir), who started the Unslopping series on X.

A vibecoded dashboard unslopping itself, frame by frame

unslop is a skill for Claude that turns vibecoded, AI-looking UI into a designed interface with its own character. It finds the slop first, the purple gradients, glows, emoji labels, shouty copy and uneven spacing, then sets a direction from your product and fixes the screen pass by pass like a designer doing a redline review. It works in whatever your screen is built with, like Next.js, React, Vue, Svelte, Tailwind or plain HTML and CSS, on dashboards, apps and landing pages, and even on a live site when all you have is a link.

Install

For Claude Code, copy the skill into your skills folder.

git clone https://github.com/heydamir/unslop
mkdir -p ~/.claude/skills && cp -r unslop/skills/unslop ~/.claude/skills/

For a single project, copy it into .claude/skills/ inside that project instead.

Use

In Claude Code, type /unslop with what you want, or just ask in your own words and Claude picks the skill up by itself.

/unslop this dashboard
/unslop the hero of https://example.com
/unslop my landing page and make the story video so I can post it

It audits the screen and proposes a direction before it edits anything, so you can steer it early. If the screen is already good, it tells you so and suggests a few small refinements instead of redesigning it.

What it does

Audit. Lists every sign of slop with where it lives.
Direction. Character, world, the one or two moments that carry the color, and a signature detail, all taken from your product.
Passes. Spacing, color, icons, copy, type, layout, details, visuals and motion, in that order.
Visuals. Shows your product instead of a glossy blob. When a hero needs a scene or an object, it can generate one through an image service like fal, Replicate, OpenAI images or Higgsfield. If none is connected, it offers to connect one as an MCP server, and it shows the prompt and asks before every paid generation. Dashboards and apps rarely need one.
Story video. A square video under 10 seconds of your screen unslopping itself, ready to post. It needs Playwright and ffmpeg.

Try it on the two vibecoded screens in examples.

Hire the unslopper

Would rather have a designer do it? Damir unslops one key screen in 3 days, built in your stack, at heydamir.design/unslop.

License

CC BY 4.0. Use it, change it and share it, including commercially, as long as you credit Damir Sokolovsky (@heydamir) and link back to this repository.

原文版权归 GitHub 爆发仓库及原作者所有，本站转载仅供阅读。如需删除，请联系 support@aisa.one。