# Redesign

> Audit an existing web UI and produce a modernization plan plus a fresh design system. Use when a site or app already works but looks dated or generic and needs a proper visual audit and a redesign pass, not a rebuild from scratch. Preserves content, routes, and SEO.

- **Type:** Skill
- **Install:** `agentstack add skill-darcos-loft-fluid-redesign`
- **Verified:** Yes — security-reviewed for prompt injection and unsafe behavior
- **Seller:** [Darcos-Loft](https://agentstack.voostack.com/s/darcos-loft)
- **Installs:** 0
- **Category:** [Agent Skills](https://agentstack.voostack.com/c/agent-skills)
- **Latest version:** 0.1.0
- **License:** MIT
- **Upstream author:** [Darcos-Loft](https://github.com/Darcos-Loft)
- **Source:** https://github.com/Darcos-Loft/fluid/tree/main/redesign
- **Website:** https://fluid.plrstudio.fr

## Install

```sh
agentstack add skill-darcos-loft-fluid-redesign
```

Requires the [AgentStack CLI](https://agentstack.voostack.com/docs/cli). Works with Claude Code, Cursor, and any MCP-compatible agent.

## About

# Redesign

Audit-first. For a site that already works but looks templated or dated, this finds what is wrong, decides what to keep, and ships a committed new identity, without throwing away working structure.

## When to use
- An existing site (Webflow, WordPress, an old React app) needs to look current.
- A client hands you a live URL and wants it modernized.
- A redesign that must preserve content, SEO, and routes.

## The workflow
1. **Audit.** Run the `fluid` detector on the codebase (or read the live DOM and CSS). Catalogue the generic-look tells: fonts, palette, spacing, shadows, the slop list. Note what is genuinely good and worth keeping.
2. **Draw the keep/change line.** Preserve: content, information architecture, routes, anything that converts. Change: the identity (palette, type, surface, motion), the layout repetition, the bans.
3. **Generate the new identity** with the `design-system` skill. Brief it from the brand, pick from `data/`, commit. Two redesigns in the same sector get different palettes.
4. **Map old to new.** A token migration: old hardcoded values become new CSS variables, component by component. Keep a small table so nothing is missed.
5. **Re-skin, do not rebuild.** Keep the markup and structure, swap the look: tokens, type, motion. Add `fluid` motion where it earns its place.
6. **Pre-flight.** Run the detector again, check `design-system/reference/rules.md` (locks, hero discipline, bans). Produce a before/after so the value is visible.

## Rules
- Preserve what converts. A redesign that drops content or breaks routes is a rewrite, not a redesign.
- One identity, committed. Never half-redesign (new colors on old fonts).
- Show the before and after.

Pairs with: `design-system` (the new identity), `fluid` (the motion and the detector audit).

## Source & license

This open-source skill is cataloged on AgentStack and links to its original source — we do not rehost the code.

- **Author:** [Darcos-Loft](https://github.com/Darcos-Loft)
- **Source:** [Darcos-Loft/fluid](https://github.com/Darcos-Loft/fluid)
- **License:** MIT
- **Homepage:** https://fluid.plrstudio.fr

Install and usage instructions live in the source repository linked above.

## Pricing

- **Free** — Free

## Security capabilities

Automated source analysis of v0.1.0 — what this tool can access:

- **Network access:** no
- **Filesystem access:** no
- **Shell / process execution:** no
- **Environment & secrets:** no
- **Dynamic code execution:** no

*"Yes" means the capability is present in the source — more access means more to trust, not that it is unsafe.*


## Versions

- **0.1.0** — security scan: passed — Imported from the upstream source.

## Links

- Listing page: https://agentstack.voostack.com/l/skill-darcos-loft-fluid-redesign
- Seller: https://agentstack.voostack.com/s/darcos-loft
- Browse the marketplace: https://agentstack.voostack.com/browse

---
Listed on AgentStack — the marketplace for AI agent skills and MCP servers. Every listing is security-reviewed. Creators keep 70%.
