Claude Info
Дизайн

Дизайн-агент без подписок

vb-tyagi/fuck-you-and-stop-charging-for-sloppy-design-agents

Claude Code skill для создания production-качественного UI. Анализирует ваши дизайн-референсы, формирует 12-секционный taste-spec с hex-кодами, шрифтами и отступами, затем генерирует неограниченное количество экранов в вашем стиле.

Установка

terminal
bash
git clone https://github.com/vb-tyagi/fuck-you-and-stop-charging-for-sloppy-design-agents.git

README

🖕 fuck-you-and-stop-charging-for-sloppy-design-agents

Claude Code skill, который действительно проектирует красивый UI.

Никаких подписок. Никаких очередей. Никаких «AI-powered» лендингов, выглядящих как Bootstrap 2019.

Добавьте дизайн-референсы → ответьте на несколько вопросов о вкусе → получите полную дизайн-спецификацию → стройте неограниченное количество production-качественного UI. Всё внутри Claude.

MIT License Claude Code Stars


Проблема

Большинство «AI-инструментов для дизайна» сегодня — это ежемесячный налог в $20–50 за посредственность. У них нет настоящего «вкуса» — они просто перерабатывают самые безопасные и банальные UI-тренды 2021 года и называют это современным дизайном. Эти инструменты не чувствуют разницы между хирургической точностью Linear и тёплой атмосферой Notion, поэтому по умолчанию лепят градиенты на всё подряд. В итоге получаются «бездушные» интерфейсы, будто спроектированные комитетом, который не видел новых идей уже несколько лет. Сплошные пиксели и ноль индивидуальности.

Решение

Один Claude Code skill, который делает две вещи:

  1. 🔬 Извлекает ваш дизайн-вкус — анализирует дизайны, которые вам нравятся, задаёт умные вопросы, генерирует визуальные пробы и компилирует 12-секционную спецификацию с hex-кодами, названиями шрифтов, значениями в px и готовыми к копированию промптами.

  2. 🏗️ Строит любой UI по этой спецификации — лендинги, SaaS-дашборды, мобильные приложения, промо-страницы, библиотеки компонентов — всё закодировано под ВАШУ эстетику. Не шаблон. Именно ВАШ вкус.

Стоимость: только то, что вы уже платите за Claude. Всё.


Что вы получаете

Акт I — Извлечение вкуса (~10–15 мин)

Добавьте референсы → Ответьте на 15 вопросов «что бы вы выбрали» → Оцените 4 дизайн-пробы → Уточните с ещё 4 → Получите taste-spec.md из 12 секций

Спецификация включает:

  • 🎨 Полную hex-палитру — не «тёмная тема», а #0a0a0b, #141416, #1e1e21, #28282c
  • 🔤 Конкретные шрифты — не «выразительный гротеск», а «Space Grotesk (или Plus Jakarta Sans, Outfit)»
  • 📐 Точные отступы — не «щедрые», а 16px base, 24px related, 48px section, 96px major
  • 🚫 Анти-цели — жёсткие правила «Никогда:», предотвращающие скатывание в банальность
  • 📋 Два готовых AI-промпта — один для лендингов, один для продуктового UI

Акт II — Неограниченное создание UI

«Собери лендинг» → production-код «Теперь дашборд» → production-код «Мобильный онбординг» → production-код «Страница настроек» → production-код «Тёмный вариант» → production-код

Каждый экран опирается на вашу taste-спецификацию. Консистентность на 50 экранах. Одна команда на экран.


Установка

1. Скопируйте файл skill

bash
mkdir -p ~/.claude/skills/fuck-you-and-stop-charging-for-sloppy-design-agents
curl -o ~/.claude/skills/fuck-you-and-stop-charging-for-sloppy-design-agents/SKILL.md \
  https://raw.githubusercontent.com/vb-tyagi/fuck-you-and-stop-charging-for-sloppy-design-agents/main/SKILL.md

2. Всё

Откройте Claude Code и напишите:

«Extract my design taste»

Или:

«I have a taste spec, build me a landing page»

Или просто:

/fuck-you-and-stop-charging-for-sloppy-design-agents


Как это работает

Акт I — Процесс извлечения вкуса

ФазаЧто происходитВремя
1. ОнбордингРасскажите, что строите + ваши вкусовые ориентиры (Apple? Linear? Notion?)1 мин
2. РеференсыДобавьте скриншоты или URL — skill анализирует дизайн-ДНК2–3 мин
3. Опросник10–15 вопросов «что бы вы выбрали». Без жаргона. Ответит даже школьник.3–5 мин
4. Пробы, раунд 14 полноценные HTML/CSS страницы — откройте в браузере, оцените2–3 мин
5. Пробы, раунд 24 уточнённых варианта на основе обратной связи — точечные отличия2–3 мин
6. КомпиляцияВсё синтезируется в taste-spec.md — 12 секций, только конкретные значенияАвто

Акт II — Цикл создания UI

ФазаЧто происходит
7. Фиксация спецификацииИнтернализирует вашу taste-спецификацию (или принимает готовую)
8. СкоупВы указываете, что строить — платформа, стек, конкретный экран
9. ОграниченияПрименяет платформенные правила (iOS safe areas, Web Vitals, a11y, touch targets)
10. СборкаГенерирует production-качественный код. Точные токены из вашей спецификации. Без приближений.
11. Итерации«Измени отступы в hero» → точечная правка. «Собери страницу с ценами» → новый экран, та же спецификация.

25 осей вкуса

Ваш вкус измеряется по 5 категориям, 25 измерениям:

КатегорияЧто измеряет
СтруктураКак организовано пространство — поведение сетки, плотность, иерархия, симметрия, ритм
ТипографикаКак ощущается текст — драматизм, редакционность vs функциональность, выразительность, масштаб, поведение
ПоверхностьКак выглядят элементы — тактильность, отделка, границы, глубина, теплота
ЦветКак работает цвет — хроматика vs нейтральность, стратегия акцентов, температура, контраст
ЛичностьОбщее ощущение — энергия, видимость системы, утилитарность vs идентичность, тон, эпоха, действие

Как выглядят пробы

Skill генерирует полноценные самодостаточные HTML/CSS страницы — не вайрфреймы, не мокапы. Реальные страницы, которые открываются в браузере.

Раунд 1 исследует 4 кардинально разных направления:

  • Проба A: Тёмная, просторная, редакционно-премиальная (в духе Linear)
  • Проба B: Светлая, тёплая, органичная (в духе Notion)
  • Проба C: Плотная, насыщенная данными, для опытных пользователей (Bloomberg terminal meets modern UI)
  • Проба D: Красочная, современная, энергичная (хорошо спроектированный стартап)

Раунд 2 берёт ваше любимое направление и делает 4 точечных варианта — одно семейство, разные нюансы.

Похожие скиллы