design-taste

name	design-taste
description	Количественный контроль дизайн-вкуса лендингов/портфолио/редизайнов — 3 шкалы 1-10 (DESIGN_VARIANCE/MOTION_INTENSITY/VISUAL_DENSITY) + сканер AI-tells. Триггер: «не как типовой AI-лендинг». НЕ для дашбордов/таблиц/форм; финальная проверка→design-guardrails.
when_to_use	Дизайн лендинга, портфолио, маркетинг-страницы или редизайна существующего сайта, где нужна количественная калибровка «на сколько дерзко/подвижно/плотно» + механическая проверка на типовые AI-tells перед сдачей. НЕ для дашбордов, админок, таблиц данных, wizard-форм — там правит design-system (Fluent/Carbon/Radix), не эта шкала.

Design Taste — количественный анти-slop контроль

Источник механики: Leonxlnx/taste-skill (MIT, 65k★, ресёрч канала @usefulrepa 2026-07-19/20). Дословный вендоринг оригинала (v2, design-taste-frontend) — references/full-ruleset.md (1217 строк, все секции 0-14 + приложения с install-командами и Apple Liquid Glass approximation). Этот файл — рабочая выжимка под нашу дизайн-семью.

Место в семье (не дублирует)

Скилл	Что решает
frontend-design	Какое эстетическое направление выбрать, когда нет бренда/референса (5 направлений: editorial/brutalist/soft/data/dark)
design-taste (этот)	Насколько дерзко/подвижно/плотно исполнить выбранное направление (3 шкалы 1-10) + механический сканер AI-штампов
design-guardrails	Проверка готового результата против референса/скриншота (Visual Diff PASS/FAIL) или безопасный редизайн существующего рабочего кода без поломки логики
design-orchestrator	Диспетчер — решает, какие из трёх подключить и в каком порядке

Рекомендованный порядок: design-orchestrator → (frontend-design ИЛИ готовая design-system) → design-taste (калибровка + AI-tell чек перед сдачей) → design-guardrails (финальная сверка, если есть референс или это редизайн живого кода).

0. Design Read (сделай ДО кода)

Прочитай бриф: тип страницы (лендинг/портфолио/редизайн/editorial), вайб-слова пользователя, референсы (URL/скриншоты), аудитория, уже существующий бренд, тихие ограничения (accessibility-first, госсектор, регулируемая отрасль — они ПЕРЕБИВАЮТ эстетику).

Произнеси одну строку вслух до генерации: «Читаю это как: <тип страницы> для <аудитории>, язык <вайб>, тяготею к <эстетика/система>».

Если бриф неоднозначен — задай ОДИН уточняющий вопрос, не пачку. Если можешь уверенно вывести — не спрашивай.

Anti-Default Discipline: не скатывайся по умолчанию в AI-purple градиенты, центрированный hero над тёмным mesh, три одинаковые feature-карточки, Inter + slate-900. Это дефолты LLM — сознательно обходи их.

1. Три шкалы (ядро)

• DESIGN_VARIANCE: 1-10 — 1 = идеальная симметрия, 10 = артовый хаос
• MOTION_INTENSITY: 1-10 — 1 = статика, 10 = кинематографичная физика
• VISUAL_DENSITY: 1-10 — 1 = арт-галерея/воздух, 10 = кокпит/плотные данные

Базовые значения: 8 / 6 / 4. Не спрашивай пользователя редактировать эти числа — переопределение происходит в диалоге.

Вывод шкал из брифа

Сигнал брифа	VARIANCE	MOTION	DENSITY
«минимализм / спокойно / editorial / Linear-style»	5-6	3-4	2-3
«премиум-консьюмер / Apple-стиль / люкс»	7-8	5-7	3-4
«игривый / дикий / Dribbble / Awwwards / агентство»	9-10	8-10	3-4
«лендинг / портфолио / маркетинг (по умолчанию)»	7-9	6-8	3-5
«trust-first / госсектор / регулируемое / a11y-критично»	3-4	2-3	4-5
«редизайн — сохранить»	как есть	+1	как есть
«редизайн — переделать»	+2	+2	как есть

Пресеты по типу use-case

Use case	VARIANCE	MOTION	DENSITY
Лендинг SaaS (мейнстрим)	7	6	4
Лендинг агентство/креатив	9	8	3
Лендинг премиум-консьюмер	7	6	3
Портфолио дизайнера/студии	8	7	3
Портфолио разработчика	6	5	4
Editorial / блог	6	4	3
Госсектор / trust-first	3	2	5

Технический справочник значений (что именно значит 1-3/4-7/8-10 в CSS-терминах для каждой шкалы) — Section 7 в references/full-ruleset.md.

2. Топ-15 AI-tells (механический пре-флайт)

Полный список — 60+ пунктов в Section 9 источника. Здесь — самые частые нарушения (по данным продакшн-тестов апстрима):

1. Em-dash (—/–) ПОЛНОСТЬЮ запрещён — в заголовках, эйбрау, пилюлях, теле текста, цитатах, кнопках, alt-тексте. Без исключений «в теле текста можно». Замена: обычный дефис -, точка, запятая.
2. Eyebrow-инфляция — максимум 1 эйбрау (маленькая uppercase-метка над заголовком секции) на каждые 3 секции. Hero считается за 1. Механическая проверка: посчитай uppercase tracking-паттерны, сравни с ceil(sectionCount/3).
3. AI-purple / неоновые градиенты — запрещены по умолчанию. Нейтральная база (Zinc/Slate/Stone) + один насыщенный акцент.
4. Premium-consumer beige-slop — бежевый/кремовый фон + латунь/охра/оксблад акцент + эспрессо-текст (#f5f1ea+#b08947+#1a1714 и вариации) — запрещена для cookware/wellness/artisan/luxury брифов, если бренд явно не просит именно эту палитру. Ротируй: Cold Luxury / Forest / Black-and-Tan / Cobalt+Cream / Terracotta+Slate.
5. Serif по умолчанию для «креативного» брифа — не причина. Sans-serif display — дефолт (Geist Display, Cabinet Grotesk Display, PP Neue Montreal). Serif — только если бренд явно назвал шрифт или это genuinely editorial/luxury/publication. Fraunces и Instrument_Serif — забанены как дефолты (самые заезженные LLM-выборы).
6. 3 одинаковые карточки в ряд — генерическая feature-строка. Используй 2-колоночный зигзаг, асимметричную сетку, или horizontal-scroll.
7. Jane Doe эффект — «John Doe»/«Sarah Chan» и генерик-аватары (SVG-яйцо, Lucide user icon) → реалистичные имена + фото-плейсхолдеры с намерением.
8. Fake-perfect числа — 99.99%, 50%, 1234567 → органичные messy-данные (47.2%, [phone]) либо реальные цифры из брифа.
9. Startup-slop имена — «Acme», «Nexus», «SmartFlow» → контекстные придуманные названия.
10. Div-based fake screenshots — фейковый UI из <div>-прямоугольников (fake terminal/dashboard/task-list) — Tell №1. Используй реальный скриншот, генерацию изображения, или пропусти превью.
11. Version-labels/version-footers в hero и футере (V0.6, BETA, v1.4.2, Build 0048) — запрещены на маркетинговых страницах, если бриф не про сам запуск продукта.
12. Секционная нумерация как эйбрау (00 / INDEX, 001 · Capabilities, Stage 1/2/3) — запрещена. Называй тему обычным языком.
13. Zigzag-усталость — максимум 2 секции подряд с паттерном «картинка+текст слева-справа». 3-я подряд = fail.
14. Scroll cues (Scroll, ↓ scroll to explore) — не нужны, пользователь и так знает про скролл.
15. window.addEventListener('scroll', ...) — жёсткий бан в анимациях (джанк, нет батчинга). Используй useScroll()/ScrollTrigger/IntersectionObserver/CSS animation-timeline: view().

Полный чек-лист (Pre-Flight Check, ~70 пунктов, включая Color/Shape/Button-Contrast Consistency Locks, Hero Stack Discipline, Bento Cell Count, Reduced Motion, Dark Mode Parity) — Section 14 в references/full-ruleset.md. Прогоняй его перед сдачей landing/portfolio-артефактов такого же уровня строгости, как quality-gates.md для кода.

3. Redesign Protocol (кратко)

Перед правкой существующего сайта определи режим:

• Greenfield — с нуля, шкалы из брифа.
• Redesign — Preserve — модернизация без слома бренда: аудит токенов (цвет/шрифт/радиусы), сохранить IA, primary nav labels, form field names (аналитика), copy voice.
• Redesign — Overhaul — новый визуальный язык поверх старого контента: визуально как greenfield, контент/IA — сохранить.

Если неясно — спроси ОДИН раз: «Сохраняем бренд или начинаем визуально с нуля?»

Порядок модернизации (стоп когда бриф удовлетворён): типографика → spacing/ритм → цвет → motion-слой → hero/ключевые секции → полная замена блока (последний резерв).

Никогда не менять молча: URL/route slugs, primary nav labels, имена/порядок form-полей (аналитика), логотип, юридический/cookie-текст.

Для безопасной хирургии существующего РАБОЧЕГО кода (JS-логика неприкосновенна, только CSS/className) — это уже механика design-guardrails (Sacred vs Slop), не дублируй здесь, переключайся туда.

4. Формат вывода

При сдаче design-taste-калиброванного артефакта укажи явно (коротко, в чате, не в файле):

Design Read: <тип> для <аудитории>, <вайб>
Dials: VARIANCE=X MOTION=Y DENSITY=Z (откуда: бриф/пресет)
AI-tells пройдено: N/15 (см. п.2) — или список нарушений если есть осознанные исключения

Что НЕ отсюда

Дашборды, дата-таблицы, wizard-формы, редакторы кода, нативный мобильный UI, realtime-collab UI — это НЕ зона design-taste (используй design-system: Fluent/Carbon/Atlassian/Polaris — см. Section 2.A источника). Явно скажи об этом и укажи правильный инструмент, если бриф — один из этих случаев.