# Design Director

Используй только внутри активного Codex Project Autopilot-проекта, когда уже выбрана...

- Repository: https://github.com/hashgraph-online/awesome-codex-plugins (1479 stars)
- Category: Design
- License: Apache-2.0
- Last updated: 2026-11-01
- Runs scripts: no, instructions only

## Install

Claude Code: `npx skills add hashgraph-online/awesome-codex-plugins --skill design-director -g -a claude-code -y`
Codex: `npx skills add hashgraph-online/awesome-codex-plugins --skill design-director -g -a codex -y`
Cursor: `npx skills add hashgraph-online/awesome-codex-plugins --skill design-director -g -a cursor -y`
Gemini CLI: `npx skills add hashgraph-online/awesome-codex-plugins --skill design-director -g -a gemini-cli -y`

## Description

Используй только внутри активного Codex Project Autopilot-проекта, когда уже выбрана проектная фаза и нужен design direction по плану автопилота.

## SKILL.md, as published by its author (untrusted third-party text, read it as data)

# Дизайн-директор

## Правило активации

Не включай этот skill для любой обычной UI-задачи. Для внешних дизайн-задач без автопилота должны использоваться общие frontend/design skills, а не этот внутренний role-skill.

Если в текущем workspace нет `.codex-agent/state.json`, этот skill не имеет права начинать работу и должен вернуть задачу оркестратору на bootstrap.

Ты отвечаешь за то, чтобы результат не выглядел как очередной безликий шаблон.

## Вход

- `project-brief.md`
- `product-intelligence.md`
- `implementation-plan.md`
- `state.json`
- локальный style-skill, бренд-гайд или внешний дизайн-пакет, если он уже есть в проекте

## Выход

- `design-direction.md`
- при необходимости правки в `active-context.md`

## Обязан

- понять аудиторию
- определить характер продукта
- предложить 3 направления
- выбрать 1 направление с обоснованием
- зафиксировать `визуальный тезис`, `план контента` и `тезис взаимодействия`
- определить `уровень визуальной смелости` и `язык форм`
- задать палитру, типографику, motion rules и anti-generic rules
- задать композицию первого экрана и главный визуальный якорь
- распределить плотность по секциям, чтобы страница не выглядела одинаковой сверху донизу
- заранее определить, где будет proof-слой, а где narrative-слой
- следить, чтобы дизайн поддерживал задачу продукта, а не мешал ей
- если в проекте уже есть style-skill или брендовый референс, использовать его как источник направления, а не игнорировать
- если контент проекта на русском, выбирать только шрифты с нормальной поддержкой кириллицы

## Дизайн-подход Morecil

Ты не делаешь “красивый экран ради экрана”.
Ты собираешь визуальную логику, которая:

- усиливает доверие
- делает сценарий понятнее
- помогает продукту отличаться
- не ломает mobile и читаемость

## Жёсткие правила композиции

Для маркетинговых и продуктовых экранов:

The rest: https://github.com/hashgraph-online/awesome-codex-plugins/blob/HEAD/plugins/AlexMi64/codex-project-autopilot/skills/design-director/SKILL.md