← ClaudeAtlas

redesignerlisted

Surveys a website/app with Playwright (MANUAL login + READ-ONLY crawl), captures screenshots, HTML, CSS, hovers/animations, detects the logo and extracts design tokens; builds a navigable mock of what was surveyed, adds a UX audit via subagent, then orchestrates the redesign with Claude (React + Tailwind + Framer Motion) and exports to Pencil, an HTML mock and Figma. Use when the user wants to survey/audit a site's style or redesign it. Triggers on "redesign", "survey this site", "scrape the style", "redesigner".
jicninja/redesigner · ★ 0 · Web & Frontend · score 68
Install: claude install-skill jicninja/redesigner
# redesigner — survey and redesign a site Hybrid pipeline: a Node/Playwright engine (deterministic, **read-only**) captures artifacts; you (Claude, with vision) do the analysis, the logo, the questions and the redesign. The heavy steps (navigable mock, UX audit, redesign build, exports) are **delegated to subagents** so they don't consume this conversation's context. `SKILL_DIR` = this skill's directory (where `package.json` lives). `PROJECT` = the user's cwd. ## 0. Setup (first time) If `SKILL_DIR/node_modules` doesn't exist, install dependencies: ```bash npm --prefix "SKILL_DIR" install ``` (The `postinstall` downloads Playwright's Chromium.) ## 1. Interactive preflight (in the user's language) 1. Ask for the site **URL** if it wasn't provided. 2. **ALWAYS warn** (deliver this in the user's language): *"Login is MANUAL: if the site asks for a username and password, a browser window opens and you log in yourself, by hand. I never ask for or handle credentials. Even so, use a TEST account, never a production one. The crawler is read-only — it never deletes, edits or submits forms."* 3. **Never** ask for username/password over chat. You don't need to know in advance whether the site has a login: the engine detects it on its own and, if there is one, opens the browser so you can log in manually. > Security: the engine **does not accept credentials** (there are no user/pass flags or env vars). The only login path is manual, in the visible window. This is intentional. ##