unslop: Redesign AI-Looking Interfaces with Claude Code

Overview

unslop is a skill for Claude Code that addresses a familiar problem in AI-assisted web development: interfaces that look generic, with purple gradients, glows, emoji labels, loud copy, or uneven spacing. It audits the screen, proposes a design direction based on the product, and then guides Claude through a series of refinements.

It works with screens built in Next.js, React, Vue, Svelte, Tailwind, or plain HTML and CSS. It can also work from a live-site link, making it relevant to developers refining a prototype or an existing page, rather than only to teams starting a new design system.

Key Features

• Audits a screen and identifies visual issues with their locations.
• Proposes a product-specific design direction before making edits.
• Refines spacing, color, icons, copy, typography, layout, details, visuals, and motion in passes.
• Supports dashboards, apps, and landing pages across several common web stacks.
• Can generate visual assets through supported image services, with the prompt shown and confirmation requested before paid generation.
• Can produce a short square video of the screen being redesigned, when Playwright and ffmpeg are available.
• Suggests small refinements instead of redesigning a screen it judges to be in good shape.

Use Cases

• A developer can use it to give a quickly assembled dashboard a more deliberate visual identity.
• A startup founder can refine a landing page before sharing it with customers, even if the page is only available as a live URL.
• A frontend developer can get a structured visual review and apply changes within an existing React, Vue, Svelte, or other supported web project.
• A maker sharing a redesign can create a short transformation video, provided the local video tools are installed.

Getting Started

For Claude Code, clone the repository and copy the skill into your user skills directory:

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

Then run /unslop in Claude Code. See the README for project-local installation and usage details.

Alternatives

• skills: It offers broad interface-building and polish skills, while unslop focuses on auditing AI-looking pages and guiding a distinctive redesign.

Considerations

The project is only a few days old, with recent commits but no release history. Its contributor activity is concentrated in one person, so teams should account for limited maintenance capacity and validate the workflow before relying on it broadly. The base skill has no listed runtime, container, or test requirements; the optional story-video feature does require Playwright and ffmpeg. Image generation depends on an image service if you want generated assets, and paid generation requires approval. The repository uses CC BY 4.0, which requires credit and a link back to the repository when sharing or adapting it.