Делаю курируемую библиотеку дизайн-компонентов для нейронки
Гипотеза в том, что это кратно повысит скорость и качество генерации сайтов, лэндингов и интерфейсов
Сейчас самая сложная и трудозатратная часть — перебрать десятки элементов, оставить из них лучшее и привести к единой дизайн-системе. Что-то удалось автоматизировать, но финальный проход всё равно вручную
Чтобы изначально всё это собрать, гонял агентов по интернету в поисках open-source библиотек и разложил всё на несколько мета-уровней, чтобы всё было согласовано между собой
01 — Стили
Tailwind CSS
Базовая библиотека, которая задаёт стили всех компонентов
02 — Механика работы компонентов
Radix UI
Базовая библиотека, которая задаёт поведение всех компонентов. Как они открываются, закрываются, реагируют на нажатие и так далее
03 — Базовые компоненты
shadcn/ui
Кирпичики, собранные из двух предыдущих уровней. Кнопки, диалоги, табы, поля ввода
04 — Расширенные компоненты
Tremor, Origin UI, DiceUI, Kibo UI
То, чего нет в базе: чарты, прогресс-бары, дрэг-эн-дроп зоны, таймлайны, календари, дополнительные варианты базовых элементов
05 — Анимации и эффекты
Magic UI, Animate UI, Cult UI, Aceternity, Kokonut UI, Fancy Components, Smooth UI, UI Layouts
Бегущие строки, анимированные фоны, ховер-эффекты, анимация переключения вкладок. Всё то, что добавляет приятной интерактивности интерфейсу
06 — Готовые блоки
Это уже комбинации всего вышеперечисленного. В готовых библиотеках что-то было, но основную часть буду генерировать «вручную»
Первые три уровня — фундамент, остальные — стены и крыша
Чтобы выбрать фундамент, сначала смотрел какие библиотеки расширенных компонентов есть. Их выбор определил фундамент
Дальше под этот фундамент нейронка собрала всё, что можно и я отобрал шорт-лист. Из него собрали https://storybook.js.org/ сервер, в котором всё разложено по полочкам с превью каждого элемента
Часть элементов дублируется между библиотеками, поэтому теперь вручную отбираю лучшие
Когда библиотека будет готова, подниму MCP-сервер из storybook и нейронка сразу будет знать какие элементы есть и собирать из них нормальные консистентные страницы
