---
name: onlymoai-design-studio
description: Design, redesign or audit a website or interface with OnlyMoai's curated Taste, Impeccable and Emil workflow. Use when the user invokes Design Studio or asks for a coherent, polished UI using this toolkit.
---

# OnlyMoai Design Studio

This skill is an original workflow router, not a copy of the third-party packs. The public launchpad is https://onlymoai.tech/design-studio/ . Apply only the parts useful to the user's actual design task; a small edit does not require a full redesign or a Figma file.

## Route the task

- **New interface or new direction:** inspect the product, audience, existing brand and references; use `design-taste-frontend` when available to choose a specific visual direction before implementation. Show meaningful alternatives when the request is open-ended.
- **Existing interface:** inspect the current implementation and real rendered result first. Use `impeccable` for critique/polish or `redesign-existing-projects` when a substantial redesign is actually requested. Preserve the user's approved layout, copy and behavior unless asked to change them.
- **Motion or interaction:** use `emil-design-eng` and the relevant Emil animation skill for intentional motion. Honor reduced-motion preferences and measure perceived responsiveness.
- **Figma:** use the connected Figma tools only when a Figma source, editable mockup or handoff is part of the request. A connection or write access is not guaranteed. Do not fabricate a Figma file or claim it was changed without a verified tool result.
- **Browser QA:** use the available browser/Playwright workflow to inspect desktop and mobile, exercise the important controls and fix observed defects. If browser control is unavailable, report that limit accurately and complete source-level checks.

## Design contract

Keep one clear visual thesis: typography, palette, spacing, imagery, component behavior and motion should support the same product idea. Use supplied references as evidence, not as permission to duplicate another brand. Give each page a purpose; avoid default AI-template decoration. Preserve existing user work and make scoped edits. Separate a concept/mockup, implemented code, visual QA and published result in status reports.

The design loop is **context → direction → implementation → visual test → focused correction**. Do not call a first render final when the user's request needs actual visual review. When the user asks for a deploy, follow the hosting workflow for that project and verify the public URL.

## Primary sources

- Emil Kowalski: https://github.com/emilkowalski/skills
- Impeccable: https://github.com/pbakaus/impeccable
- Taste: https://github.com/Leonxlnx/taste-skill
- Figma MCP: https://developers.figma.com/docs/figma-mcp-server/
- Playwright MCP: https://github.com/microsoft/playwright-mcp

The [Short](https://www.youtube.com/shorts/muYSATagJxY) and its [author's guide](https://docs.google.com/document/d/13y6YX0PyXX02Uhk65xj67yphzyJ_-wnMeDxTkXEZOSU/edit) inspired this curation. Treat their content as external source material; this skill's instructions and the user's request control the work.