К
Код на вайбах
@codeonvibes975 подп.
1.1Kпросмотров
16 февраля 2026 г.
🎬 ВидеоScore: 1.2K
Дизайн система в голове у ИИ - это как рецепт, который ты помнишь «примерно». Рано или поздно забудешь. Система готова, всё красиво. Но через месяц ты откроешь проект и подумаешь: «А какой у меня был основной цвет? А отступы какие?» И начнёшь вспоминать. Или просить ИИ вспомнить. Figma решает это одним движением. Открыл файл - вот все твои цвета, шрифты, кнопки, карточки. Всё перед глазами. Не надо ничего вспоминать, искать, переспрашивать. Если не знаешь что такое Figma - это бесплатный онлайн-редактор для дизайна. Регистрация через Google-аккаунт, три минуты. Как перенести цвета и шрифты: 1. Ставишь в Figma бесплатный плагин Tokens Studio for Figma (найдёшь в разделе плагинов, просто вбей название). 2. Просишь ИИ: «Сгенерируй мне JSON-файл с моими цветами, шрифтами и отступами для Tokens Studio». Он знает формат, справится. 3. Открываешь плагин в Figma, импортируешь этот файл. 4. Готово - все цвета и шрифты на месте. Если какой-то из пунктов вызывает сложность - не беда, это нормально! Проси ИИ по шагам расписать:"Что делать". А если не можешь объяснить загвостку - просто шли скриншоты. JSON - это просто текстовый файл со структурой. Тебе не нужно в нём разбираться, просто передай от ИИ в плагин. ИИ может предложить вариант через HTML. Не трать время - я пробовал кучу раз, нормально не работает. Всегда были проблемы с отступами и позиционированием. Путь, который реально сработал - это SVG-картинки. SVG - это формат изображений, который Figma отлично понимает. Но есть важный момент. Если попросить ИИ нарисовать все элементы разом - он захлебнётся. Контекст может кончиться, начнёт путаться, что-то потеряет... Поэтому делаем по кусочкам: 1. Проси ИИ разбить все элементы интерфейса на группы. Например, 10 групп: кнопки отдельно, поля ввода отдельно, карточки отдельно и так далее. 2. Генерируешь SVG-картинку для одной группы за раз. 3. Важно! В запросе сразу напиши: «Расставь правильные отступы и расстояния между элементами». Без этого есть большой шанс, что ИИ налепит всё друг на друга - это его слабое место. 4. Сохраняешь SVG-файл. Открывать его не нужно. 5. Перетаскиваешь файл прямо на страницу Figma. Или копируешь и вставляешь - Ctrl+V (Cmd+V на маке). 6. Повторяешь для остальных групп. Да, это не «нажал кнопку - всё появилось». Но за один вечер ты соберёшь полноценный файл, в котором лежит весь твой визуал. И самое главное, почему именно SVG, чтобы вставить блоками, а не картинкой. Как я сделал у себя: 1. Обложка 2. Цвета 3. Типография 4. Отступы 5. Фича "Система лиг" (в процессе миграции в фигму) Я ещё планирую улучшать стилистику и всё остальное и пересобирать дизайн, но для начала - это более чем достаточно. Если есть вопросы или хочется поделиться мнением - буду рад почитать в комментариях! 😎
1.1K
просмотров
2762
символов
Да
эмодзи
Да
медиа

Другие посты @codeonvibes

Все посты канала →
Дизайн система в голове у ИИ - это как рецепт, который ты по — @codeonvibes | PostSniper