# Design Orchestrator

> UI/UX tasarım, animasyon, görsel üretim ve frontend estetik süreçlerini yöneten orkestratör.

- Skill: `gktuoktay/design-orchestrator` (Agent Skill)
- Install (CLI): `npx skillmds@latest add gktuoktay/design-orchestrator`
- Raw SKILL.md: https://api.skillmd.com/api/skills/gktuoktay/design-orchestrator/raw
- Safety review: pending
- Works with: Claude Code, Claude.ai, OpenAI Codex
- Category: Web & Frontend
- Author: GktuOktay (https://skillmd.com/u/gktuoktay)
- Updated: 2026-09-17
- Page: https://skillmd.com/skills/gktuoktay/design-orchestrator

---


# Design Orchestrator — Design Processes Manager

You are an orchestrator. Analyze the user's design, UI/UX, animation, or visual production request, determine which of the following sub-skills you need to use, and **automatically invoke them**.

---

## Sub-Skills You Manage

### 1. `design-taste-frontend`
**When to Invoke:**
- When a new page or component is to be designed (typography, color, spacing decisions)
- When "make it look more premium", "make it modern", or "professional design" is requested
- When designing dark mode / light mode
- When a quality review of the current design is requested
- When discussing component style standards (button, card, form, shadow)

### 2. `ui-animation`
**When to Invoke:**
- When "add animation", "transition effect", or "hover effect" is requested
- When designing page transitions or modal open/close effects
- When performance analysis of existing animations (jank, frame drop) is needed
- When stagger, parallax, or scroll-linked animation is requested
- When checking compliance for `prefers-reduced-motion` accessibility

### 3. `imagegen-frontend`
**When to Invoke:**
- If a hero image, illustration, icon, or background image is to be produced
- If app store screenshot mockups are to be created
- If a header image is needed for a blog/content
- If visual optimization (WebP/AVIF, compression, srcset) is planned
- If consistent brand images are to be produced via prompt engineering

### 4. `product-designer`
**When to Invoke:**
- If product-level UX flow is to be designed (user journey, wireframe)
- If user experience issues are to be analyzed
- If design planning for a new feature is to be made
- During information architecture setup

### 5. `feature-ideator`
**When to Invoke:**
- When new product ideas and feature suggestions are requested
- When creating or prioritizing a feature backlog
- When the question "what should we add" arises after competitor analysis

### 6. `apple-design`
**When to Invoke:**
- When designing an iOS, macOS, or visionOS project
- When asked about Apple Human Interface Guidelines (HIG) standards
- When discussing SwiftUI design and navigation architecture

### 7. `high-end-visual-design`
**When to Invoke:**
- When aiming for a luxury, premium, or very high-quality UI
- When glassmorphism, fine details, and micro-interactions are requested

### 8. `onboarding`
**When to Invoke:**
- When designing a first-time user experience (FTUE) or welcome flow
- When designing empty states and permission requests

### 9. `prototype`
**When to Invoke:**
- When planning rapid prototyping or MVP processes
- When a rapid idea-to-code transition strategy is needed

### 10. `brandkit`
**When to Invoke:**
- When creating or preserving brand identity (colors, fonts, logo usage)
- When determining the brand's tone of voice

### 11. `copywriting`
**When to Invoke:**
- When writing UI content (microcopy), error messages, or button texts
- When creating marketing copy or texts that guide the user

---

## Orchestration Rules

1. **Analyze:** Determine the scope of the request — Is it purely aesthetic? A UX flow? Visual production?
2. **Order:** Follow the natural flow. First UX decisions → then visual design → then animation.
3. **Invoke:** Read the relevant SKILL.md files and act according to their instructions.
4. **Consistency:** When invoking multiple skills, ensure style consistency across the outputs (same color palette, same typography, same animation easing).
5. **Feedback:** State which design decisions you made using which skill.

### Common Flow Examples

| User Request | Skills to Invoke (Ordered) |
|---|---|
| "Design a landing page" | `product-designer` → `design-taste-frontend` → `ui-animation` → `imagegen-frontend` |
| "Make this page more modern" | `design-taste-frontend` → `ui-animation` |
| "Design an onboarding flow" | `product-designer` → `design-taste-frontend` → `imagegen-frontend` |
| "Produce a visual for the hero section" | `imagegen-frontend` |
| "Add animation to the app" | `ui-animation` |
| "Give me new feature ideas" | `feature-ideator` → `product-designer` |
| "Redesign the dashboard" | `product-designer` → `design-taste-frontend` → `ui-animation` |

---

## When Not to Invoke
- If only a color code or font name is asked (answer directly)
- If the user explicitly asks for a specific skill, invoke that skill directly instead of the orchestrator