🔒Открыть пост
и посмотреть медиа
и посмотреть медиа
Пару дней назад был эфир для дизайнеров от Head of Design Cursor
Мне кажется, получилось поверхностно, больше похоже на контент-маркетинг. Но если хотели попробовать наконец Cursor, но не знакомы с интерфейсом — то пойдет
Смотреть запись на youtube
Ниже AI-саммари текстом, но лучше все-таки видос глянуть
Cursor для дизайнеров: главное из вебинара
Вебинар провели Ryo Lu (Head of Design в Cursor) и Audrey. Основная идея: дизайнеры теперь могут создавать рабочие прототипы и код с помощью AI, не изучая программирование.
Историческая перспектива
Раньше дизайн и код были единым ремеслом — люди вроде Bill Atkinson (создатель MacPaint) и Alan Kay (Smalltalk) сами придумывали и реализовывали софт. Со временем роли разделились на специализации (дизайнеры, инженеры, PM), что привело к линейным handoff'ам, замедлению итераций и фрагментации процесса.
Проблема специализации
Дизайнеры работают в Figma (создают моки, не реальный продукт), инженеры пишут код (источник истины), а PM координируют в Jira/Notion. Результат — медленные процессы и разрыв между дизайном и имплементацией.
Решение Cursor
Cursor делает код доступным без необходимости его писать. Дизайнеры могут взаимодействовать с настоящим рабочим софтом, планировать, прототипировать и учиться, просто задавая вопросы AI.
Практический workflow
Интеграция Figma → Cursor
Подключаешь Figma через MCP (Model Context Protocol) одним кликом, вставляешь ссылку на дизайн, и AI генерирует рабочий прототип из твоих моков. Workflow: быстро исследуешь варианты в Figma → копируешь ссылку в Cursor → получаешь working prototype с настоящей интерактивностью.
Старт с нуля
- Открываешь новый проект в Cursor
- Включаешь Plan Mode — AI помогает структурировать проект и задаёт уточняющие вопросы
- Выбираешь модель: Claude Opus для планирования, Gemini для визуала, Composer для скорости
- Просто описываешь что хочешь — например "blog с современным стилем, 3 цвета для контраста"
- AI создаёт план, генерирует все файлы, запускает в браузере
Visual Editor
Позволяет делать прямые визуальные правки без кодинга — менять spacing, шрифты, цвета, alignment. Изменения автоматически применяются к коду в реальном времени.
Практические советы:
- Начни с простого — открой новый проект, используй plan mode, собери что-то маленькое
- Подключи Figma MCP для существующих дизайнов и цветовых схем
- Создай правила дизайн-системы (цвета, spacing, типографика) через Cursor Rules
- Экспериментируй с visual editor для быстрых правок
Выбор моделей
Claude Opus — лучше для планирования и старта проектов, Gemini — силён в визуале, Composer — быстрый для итеративных правок. Все модели пока борются с pixel-perfect точностью, поэтому дизайнеры всё ещё нужны для финальной полировки.
Когда AI застревает
Два подхода: (1) дай ему сгенерировать rough версию, потом итеративно улучшай, (2) больше планируй заранее, используй plan mode, давай подробные промпты и моки. Чем яснее твой интент, тем лучше результат.
Git и version control
Не пугайся — это как version history в Notion или Google Docs, только для кода. Создаёшь ветки (дубликаты версий), мержишь изменения, откатываешься к предыдущим состояниям. Когда что-то непонятно — просто спроси у агента.
Будущее
Cursor планирует упростить onboarding для дизайнеров, незнакомых с Node, Git, setup. В отличие от no-code инструментов, где ты застреваешь на простом уровне, в Cursor можешь начать с простого, но дорасти до про-уровня. Скоро добавят интеграцию с iOS Simulator.
Главный совет от Ryo
Не бойся кода больше. Открой Cursor, создай новую папку и засунь туда свою безумную идею. Может, с первого раза не будет идеально, но ещё пара промптов сделают её довольно крутой. Лучший способ научиться — просто начать строить