TL;DR / Key Takeaways
Обновление, которое заставило фронтенд-разработчиков переосмыслить всё
Курсор только что превратил самый раздражающий цикл фронтенд-разработки во что-то, что кажется почти незаконным. Вместо того чтобы прыгать между Figma, вашим редактором кода и вкладкой Chrome, которую вы постоянно обновляете с помощью Cmd+R, новый визуальный редактор Cursor находится прямо внутри его встроенного браузера и редактирует настоящий код, стоящий за тем, что вы видите.
Несколько недель назад Cursor добавил полноценную панель браузера внутрь IDE, чтобы вы могли заходить на `localhost`, не покидая редактор. Теперь этот браузер получил боковую панель в стиле Figma: нажмите Выбрать элемент, наведите курсор на любой объект на странице, и вы получите инструменты для управления макетом, типографикой, отступами, фоном, границами, тенями и другим.
Это означает, что классический процесс—дизайнер отправляет макеты, разработчик переводит их в HTML/CSS, обновляет, вносит изменения, снова обновляет—начинает давать сбои. Вы перетаскиваете карточку, изменяете отступы или меняете сетку 3×2 на 2×3 визуально, нажимаете Применить, и ИИ Cursor переписывает основной код на React или Next.js для вас, а затем перезагружает предварительный просмотр.
Вместо того чтобы управлять тремя инструментами и двумя мыслительными моделями, вы работаете на одном холсте, который ведет себя как инструмент дизайна, но имеет возможности интегрированной среды разработки. Редактор предлагает: - Элементы управления макетом для сетки, флекса, строк, колонок и произвольного позиционирования - Элементы управления внешним видом для шрифта, размера, цвета, высоты строки, выравнивания, размытия и теней - Элементы управления отступами для внутренних отступов, внешних отступов, промежутка и размеров
Этот рабочий процесс делает заголовок «Убийственные функции Figma» технически неправильным, но направление верным. Cursor не пытается заменить сотрудничество, прототипирование или системы дизайна Figma; он нацелен на сам процесс передачи, медленный перевод между красивыми макетами и рабочими компонентами.
Дизайнеры теперь могут настраивать интерфейс, похожий на продукционный, не касаясь CSS, в то время как разработчики остаются в своем коде и позволяют ИИ заниматься рутинными правками. Этот инструмент стирает границы ролей: человек, который настраивает авто-разметку, и человек, редактирующий JSX, могут быть одним и тем же, работая в одном окне, на одной живой предварительном просмотре.
Назовите это сменой парадигмы или просто давно назревшим обновлением, но эффект очевиден. Визуальный редактор Cursor превращает работу с фронтендом из «редактировать, сохранять, обновлять» в «видеть, перетаскивать, применять», при этом ИИ тихо объединяет код за кулисами.
Познакомьтесь с Визуальным Редактором: Ваш Браузер Теперь – Холст
Теперь Cursor воспринимает вашу среду разработки как окно живого браузера, а не как редактор файлов с предварительным просмотром. Новый комбинация сочетает встроенный браузер Cursor с плавающей панелью Визуального Редактора, которая располагается прямо поверх вашего запущенного приложения. Больше нет необходимости переключаться на Chrome или Safari; ваш локальный хост фактически является еще одной панелью внутри Cursor.
Запустите сервер разработки, и ваше приложение мгновенно появится в этом встроенном браузере, включая адресную строку. Вы можете перейти на `localhost:3000`, щелкать по элементам, вызывать модальные окна и прокручивать длинные страницы точно так же, как на обычном сайте. Переключение контекста сводится к единому рабочему пространству, поэтому изменения дизайна, редактирование кода и визуальные проверки происходят в одном цикле.
Нажмите кнопку Выбрать элемент, и курсор переключится в режим, который напоминает сочетание Chrome DevTools и Figma. Наведите курсор на страницу, и каждый узел DOM подсветится на месте, от одного `<span>` до целого сектора сетки. Один клик закрепляет ваш выбор и подключает его к панели Визуального Редактора справа.
Эта панель отображает плотный набор элементов управления, соответствующих фактическому коду. Вы можете: - Перетаскивать элементы для изменения их порядка в макете - Менять типы макетов (сетка, ряд, колонка, свободная форма) - Настраивать отступы, поля, промежутки и высоту с помощью ползунков
Элементы управления внешним видом уходят так же глубоко. Семейство шрифтов, размер, цвет, выравнивание, высота строки, отступы, фон, граница, тень и размытие находятся всего в нескольких пикселях от живого элемента. Измените заголовок на другой шрифт, поменяйте его цвет на желтый, выровняйте по центру и добавьте границу, затем нажмите "Применить", чтобы упаковать эти изменения в структурированный запрос на изменение.
Критически важно, что вы манипулируете реальным продуктом, а не статической макетной моделью. Когда вы преобразуете сетку 3×2 в макет 2×3 или изменяете размеры карточки, Cursor обновляет запущенное приложение на React и синхронизирует изменения с кодовой базой через своего AI-агента. Обновите страницу, и изменения останутся, так как они теперь находятся в ваших компонентах, а не в каком-то временном прототипе.
Рабочий процесс "От настроения к реальности" в действии
Новый рабочий процесс Cursor начинается с единственного, смелого запроса. Astro K Joseph открывает пустой проект в Cursor, запускает Gemini 3 Pro и вводит что-то вроде: «Создайте мне целевую страницу для платформы автоматизации ИИ, аналогичной НАТО, с гладким пользовательским интерфейсом, анимациями и современным дизайном». Через один запрос он получает полностью структурированную целевую страницу на React, с разделом-заголовком, сеткой карточек с функциями, кнопками, градиентами и анимациями.
Этот начальный шаг генерации ИИ намеренно масштабный. Вместо ручного кодирования макета, типографики и компонентов, модель генерирует весь опыт: маршрутизация, компоненты, CSS и взаимодействия. Встроенный браузер Cursor направляется на сервер разработки на локальном хосте, так что только что сгенерированная страница появляется в реальном времени внутри IDE, без необходимости переключаться между контекстами.
Отсюда берет управление Визуальный Редактор. Джозеф нажимает «Выбрать элемент», наводит курсор на живую страницу и выбирает любой элемент DOM: заголовок-герой, кнопку CTA или сетку из шести карточек. Сбоку появляется панель в стиле Figma, раскрывающая инструменты для настройки макета и внешнего вида: позиция, отображение (сетка, ряд, колонка, произвольный), отступ,.margin, шрифт, размер шрифта, высота строки, цвет, фон, граница, тень и размытие.
Микрорегулировки, которые раньше означали охоту по CSS, теперь становятся прямым манипулированием. Он: - Меняет шрифт заголовка на другую семью - Меняет цвет текста на желтый - Перестраивает сетку функций с 3×2 на 2×3 - Корректирует отступы, высоту, внутренние отступы и поля с помощью ползунков
Эти изменения остаются только на визуальном уровне, пока он не нажмет Применить. В этот момент Cursor фиксирует изменения и отправляет их AI-агенту через кнопку «Отправить». Модель переводит каждую визуальную корректировку в точные кодовые изменения—обновляя JSX, классы Tailwind или CSS-модули—и записывает их обратно в репозиторий.
Быстрое обновление в браузере Cursor подтверждает цикл: сетка теперь отображается 2×3, типографика остается, а новые цвета сохраняются. В собственном описании Cursor, Визуальный редактор для браузера Cursor, это описывается как превращение "того, что вы видите", в "то, что на самом деле является кодом", не покидая IDE.
Душа Figma, возрожденная в вашем редакторе кода
Ветераны Figma почувствуют странное дежавю в момент открытия боковой панели визуального редактора Курсор. Выбранный элемент в браузере внутри IDE фокусируется, а правая панель заполняется знакомыми группами свойств: Макет, Внешний вид, эффекты, отступы. Это выглядит меньше как инструмент для написания кода и больше как упрощённый инспектор Figma, подключенный напрямую к вашему JSX и CSS.
Раздел Внешний вид отражает основные визуальные элементы управления, с которыми дизайнеры работают сотни раз в день. Вы получаете управляющие элементы типографии для выбора семейства шрифтов, размера и толщины, а также высоты строки и межбуквенного интервала, которые функционируют так же, как ползунки и числовые вводы в Figma. Курсор также предоставляет переключатели выравнивания текста — слева, справа, по центру — так что изменение композиции заголовка выглядит так же, как если бы вы просто подвинули его в дизайн-файле.
Цвет также получает первоклассное внимание. Встроенный редактор цветов позволяет мгновенно менять цвета текста или фона, поддерживая сплошные заливки и градиенты, соответствующие реальным значениям CSS. Границы, тени и размытости расположены в своих мини-стэках, каждый из которых имеет переключатели и числовые элементы управления, чтобы вы могли задать контур 1px, мягкую тень карты или легкое размытие фона, не искajući классы Tailwind или переменные SCSS.
Макет — это область, где ДНК Figma проявляется наиболее ярко. Раздел Макет предоставляет режимы отображения — сетка, флекс, строка, колонка, произвольный формат — которые напрямую соответствуют основным свойствам CSS, но представлены в виде простых выпадающих списков и переключателей. Вы можете преобразовать сетку из 3×2 карточек в макет 2×3, выбрав предустановку, а затем перемещая ползунок промежутка, чтобы задать расстояние между ними, аналогично редактированию расстояний в Auto Layout в Figma.
Для флекс-контейнеров и сеток элементы управления выравниванием и расположением мгновенно воспринимаются. У вас есть кнопки для выравнивания элементов по началу, центру или концу, а также для распределения пространства между ними без изменения свойств `justify-content` или `align-items`. Поля и отступы представлены в виде классических элементов управления модели коробки, где вы можете перетаскивать, чтобы настроить все стороны, или разблокировать и изменять каждую грань отдельно.
Дизайнерам больше не нужно преобразовывать «сделайте это более сбалансированным» в длинный тикет для разработчиков. Они могут нажать на раздел, увеличить размер шрифта с 32px до 40px, добавить 24px вертикального отступа и подвинуть сетку в одну строку — всё это внутри Cursor — в то время как ИИ управляет сложными различиями в CSS. Результат: инстинкты Figma применяются 1:1 к производственному коду, и психологическая преграда между дизайном и реализацией начинает рушиться.
Почему ваш дизайнер может начать настаивать на главной версии
Раньше передача подразумевала аккуратно упакованный файл Figma, спецификацию в формате PDF и молитву. Новый визуальный редактор Cursor превращает это в общую, живую поверхность, где дизайнеры и разработчики работают с одним и тем же работающим кодом в одной и той же среде разработки одновременно. Вместо того чтобы экспортировать красные линии, дизайнеры теперь корректируют сам продукт, который выпускается.
Встроенный браузер Cursor уже объединил цикл «дизайн → запуск → инспекция» в одно окно. Если добавить боковую панель в стиле Figma, то старый ритуал загрузки статичных макетов в тики Jira начинает выглядеть архаично. Дизайнеры больше не ждут спринта, чтобы проверить, действительно ли изменение отступа в 4 пикселя ощущается правильно на реальном компоненте.
Поскольку редактор предоставляет настройки компоновки, типографики и внешнего вида для любого выбранного элемента DOM, дизайнеры могут добиваться идеального выравнивания непосредственно в живом пользовательском интерфейсе. Они могут: - Изменять отступы и поля на 1px - Переключать сетку 3×2 на 2×3 с помощью выпадающего меню - Настраивать шрифты, высоту строки и цветовые токены из одной панели
Всё это происходит без изменения строки CSS, в то время как ИИ Cursor тихо переписывает базовые стили и компоненты.
Это меняет привычную динамику власти. Вместо того чтобы подавать заявки на «небольшие визуальные исправления», дизайнеры работают внутри Cursor как полноправные участники, затем нажимают Применить и отправляют изменения ИИ-агенту, который обновляет кодовую базу. История Git фиксирует их правки как конкретные изменения, а не как расплывчатые запросы на «сделать более ярким».
Совместная работа в реальном времени перестает быть привилегией только Figma. Разработчик может наблюдать за браузером Cursor на `localhost`, видеть, как дизайнер перемещает карточку, изменяет градиент или переворачивает флекс-расположение, а затем сразу же переработать API компонента или выделить общий стиль. Циклы обратной связи сокращаются с дней асинхронных комментариев до минут совместной итерации.
Вот как выглядит рабочий процесс инженерии, ориентированной на дизайн: визуальный источник правды и кодовая база сливаются в одно окружение. Дизайнеры работают с реальными компонентами, в условиях реальных ограничений, а инженеры получают готовые для производства изменения, а не интерпретационные спецификации. Cursor эффективно переносит «дизайн» из фазы предпроизводства в саму суть процесса сборки.
Изменение макетов без редактирования CSS
Переформатирование макета в Cursor теперь ощущается ближе к редактированию кадра в Figma, чем к борьбе с таблицей стилей. Визуальный редактор предлагает элементы управления сеткой и флексбоксом прямо в боковой панели, так что вы можете изменять структуру, пока ИИ тихо переписывает основной CSS. Вы остаетесь в предварительном просмотре браузера, но каждое изменение сохраняется в коде.
В демонстрации Astro K Joseph'а шестикарточный блок начинается как CSS-решетка 3x2. Он выбирает контейнер решетки, открывает управление макетом и меняет его на 2x3 макет всего за несколько кликов по элементам управления столбцами и строками. Ни `grid-template-columns`, ни `repeat()`, ни предположений о долях единиц.
Настройка зазора становится жестом перетаскивания вместо поиска по вложенным классам файлов. Наведя курсор на ползунок зазора, пользователь перетаскивает его, чтобы увеличить пространство между карточками, наблюдая за тем, как живая предпросмотр растягивается в реальном времени. Высота, отступы и поля находятся в одной панели, так что вертикальный ритм и пустое пространство становятся одним непрерывным регулированием вместо трех отдельных редактирований CSS.
Порядок элементов, который исторически был головной болью при работе с flexbox, также превращается в проблему прямого манипулирования. Вы можете взять карточку и перетащить её в новое положение в сетке, а Cursor соответственно обновляет порядок в DOM или правила макета. Это заменяет умственные усилия по управлению `order`, `flex-direction` и медиазапросами просто для переключения двух блоков.
Этот визуальный слой имеет наибольшее значение, когда макеты становятся плотными. Сложные маркетинговые страницы с вложенными флекс-контейнерами, адаптивными сетками и утилитарными классами часто требуют: - Отслеживания, какой контейнер на самом деле контролирует расстояние - Соотнесения имен классов с Tailwind или индивидуальными токенами - Тестирования брейкпоинтов в стороннем браузере
Курсор объединяет этот цикл в единую поверхность. Вы нажимаете, меняете режим компоновки (сетка, ряд, столбец, свободная форма), перетаскиваете ползунки и нажимаете Применить. Затем агент ИИ переписывает JSX или HTML вместе с соответствующим CSS, и результат сразу же отображается в встроенном браузере.
Старые рабочие процессы либо означали ручное редактирование глубоко вложенных правил компоновки, либо составление длинных, хрупких команд вроде «преврати эту сетку 3x2 в 2x3, сохрани те же промежутки, не меняй ширину карточек». Подход Cursor превращает это в визуальную операцию в первую очередь, а языковую инструкцию — во вторую. Для получения более подробной информации Cursor документирует эти элементы управления в разделе Cursor 2.2: Визуальный редактор для браузера Cursor.
AI Мост: От Визуального Намерения к Чистому Коду
Нажатие Применить превращает Cursor из дизайнерской игрушки в движок рефакторинга. Каждое изменение, которое вы вносите в визуальной панели — замена шрифта, увеличение отступа на 8 пикселей, изменение сетки с 3x2 на 2x3 — сериализуется в структурированный список изменений, который скорее похож на спецификацию различий, чем на руководство по стилю. Вместо “сделать лучше” Cursor фиксирует “color: #FFEB3B → #FF0000,” “padding-top: +8px,” “grid-template-columns: 3 → 2.”
Эти детализированные изменения становятся нагрузкой для AI-агента Cursor. Инструмент упаковывает путь DOM к элементу, его текущие вычисляемые стили и точные коррективы, которые вы внесли, а затем отправляет этот контекст вместе с выбранной моделью (Composer, Gemini 3.0 Pro и т.д.). Агент видит не только то, что вы хотите визуально, но и то, где этот элемент находится в древе компонентов.
Оттуда Cursor просматривает ваш код — JSX, CSS модули, утилиты Tailwind, даже встроенные стили — чтобы найти истинный источник правды. Если желтый заголовок создан с помощью класса Tailwind, агент обновляет `text-yellow-400` на `text-red-500`, вместо того чтобы вставлять случайный стиль `style={{ color: "#FF0000" }}`. Если сетка расположена в `className="grid grid-cols-3 gap-6"`, она переписывает это на `grid-cols-2` и соответственно настраивает промежутки.
Крайне важно, что Cursor не просто добавляет новые CSS-фрагменты в конец файла. ИИ выполняет целенаправленные рефакторинги: редактирует существующие классы, консолидирует дубликаты и сохраняет целостность дизайн-токенов или переменных. Он может модифицировать:
- 1React/Next.js JSX и пропсы
- 2CSS, SCSS и CSS-модули
- 3Tailwind и строки классов утилит
Этот мост между визуальной идеей и структурными изменениями в коде является настоящим прорывом. Cursor превращает ваши эксперименты с перетаскиванием в последовательные изменения по всему репозиторию, которые сохраняются после обновлений, код-ревью и будущих доработок, вместо того чтобы оставлять вас с кучей невменяемых переопределений.
Новый соперник: Cursor против действующих участников рынка
Новый Визуальный Редактор Cursor сразу вызывает ассоциации с Figma, но выполняет другую роль в цепочке инструментов. Figma занимает раннюю стадию: исследование, дизайн-системы, прототипирование, многофункциональные комментарии. Cursor подключается на более позднем этапе, функционируя как инструмент внедрения кода, который редактирует реальные компоненты и стили, а не артборды и фреймы.
Figma по-прежнему превосходит Cursor по строгости систем дизайна, вариантам компонентов и кроссплатформенному прототипированию. В то же время, Cursor выигрывает, когда вопрос меняется с "Как это должно выглядеть?" на "Как нам интегрировать этот точный макет в рабочий код React на моем компьютере?"
Безкодовые и малокодовые конструкторы, такие как Webflow и Framer, ближе к обещанию Cursor, но с одним важным нюансом: они контролируют выполнение. Ваш проект существует в их визуальном холсте, на их хостинге, по их схеме, а пути экспорта часто ощущаются как нечто второстепенное, а не как полноценный рабочий процесс.
Курсор переворачивает эту модель. Визуальный редактор работает непосредственно с вашим локальным кодом на основе фреймворка — Next.js, React, Vue или тем, что вы уже используете — так что: - Вы сохраняете свою историю Git и стратегию ветвления - Вы сохраняете свой процесс сборки, тесты и инфраструктуру - Вы избегаете привязки к платформе и проприетарным движкам рендеринга
В сравнении со стандартной настройкой VS Code + GitHub Copilot, преимущество Cursor заключается в жесткой интеграции. Copilot предлагает строки и блоки; Cursor объединяет браузер внутри IDE, элементы управления в стиле Figma и AI-агентов в одну непрерывную область, где вы можете просматривать, настраивать и разрабатывать, не переключаясь между инструментами.
Типичный поток работы с Copilot выглядит так: редактируйте JSX, сохраните, переключитесь на Chrome, обновите, измените CSS, повторите. Курсор сжимает этот цикл в компактный визуальный feedback-цикл: выберите элемент, перетащите его, отрегулируйте отступы, нажмите Применить и смотрите, как ИИ переписывает ваш код, пока встроенный браузер обновляется в реальном времени.
С точки зрения рынка, Cursor теперь нацелен на неудобную середину между инструментами дизайна и конструкторами сайтов. Он предлагает визуальный контроль, который напоминает панель компоновки Webflow, но никогда не заставляет вас отказываться от вашего редактора, вашего репозитория или конвенций вашего фреймворка.
Если этот гибридный модель останется, устоявшиеся компании столкнутся с давлением с обеих сторон. Figma рискует утратить некоторую "релевантность передачи", поскольку дизайнеры и фронтенд-разработчики совместно редактируют в Cursor, в то время как Webflow и Framer должны оправдать свою привязку к инструменту, который предоставляет почти WYSIWYG редактирование поверх простого, поддающегося аудиту кода, который вы уже имеете в своем распоряжении.
Проверка реальности: Что этот инструмент пока не может сделать
Визуальный редактор Cursor кажется магией, когда он работает, но в настоящее время он существует в очень специфическом мире. Опыт наиболее отшлифован на React и других современных стэках JavaScript, где JSX, компоненты и свойства легко отображаются в DOM, который инструмент может манипулировать. При переходе к серверным шаблонам, устаревшим приложениям на jQuery или пользовательским веб-компонентам поведение становится менее предсказуемым, и гораздо меньше гарантий, что перетаскивание на экране преобразуется в адекватный код.
Поддержка дизайн-систем также достигает предела. Редактор может настраивать CSS-переменные, цвета и отступы, но пока не понимает вашу полную таксономию токенов, сложную настройку тем или индивидуальные утилитарные классы так, как это делает зрелая дизайн-система в Figma. Команды, которые полагаются на строгие атомарные или BEM-конвенции, могут обнаружить, что Cursor с радостью генерирует стили, нарушающие правила дома.
Система контроля версий добавляет еще один уровень сложности. Патчи, сгенерированные ИИ, часто затрагивают несколько файлов сразу, и одно нажатие «Применить» может создать изменения, которые смешивают структурные правки JSX с каскадными изменениями CSS. Чтение этих git-изменений в крупной кодовой базе React может ощущаться как просмотр минифицированного артефакта сборки, а не коммита, созданного человеком.
Команды должны будут создать процесс на основе этого. Некоторые будут ограничивать визуальные изменения правилами проверки или требовать, чтобы каждое AI-сгенерированное изменение включало: - Краткое резюме, написанное человеком - Скриншоты или GIF-файлы изменения - Ссылку на сеанс Cursor или подсказку
Даже тогда отладка неожиданного изменения макета через две недели означает копание в коде, созданном ИИ, а не аккуратно рассказанная рефакторинг.
Сложная работа на фронтенде также не исчезает. Управление состоянием в Redux, Zustand или контексте React, сложная валидация форм, процессы аутентификации и информационно насыщенные панели управления по-прежнему требуют инженеров, которые понимают жизненные циклы компонентов, мемоизацию и бюджеты производительности. Cursor может изменить стиль сетки ценовых карточек с 3x2 на 2x3 за считанные секунды; он не может разработать надежный механизм синхронизации с приоритетом оффлайна.
Для команд, оценивающих этот рабочий процесс, ресурсы, такие как Новый визуальный редактор Cursor превращает ваш IDE в студию веб-дизайна, помогают правильно сформулировать это: мощный инструмент для реализации кода, а не замена фронтэнд-архитектуры или глубокого мышления о продукте.
За пределами кода: IDE как творческая студия
Редакторы кода перестали быть просто текстовыми полями много лет назад; визуальный редактор Cursor приближает их к полноценным творческим студиям. Когда ваша среда разработки включает в себя браузер, панель компоновки в стиле Figma и AI-парного программиста, который переписывает код по команде, вы уже не просто «редактируете файлы», а управляете производственным процессом в одном месте.
Этот шаг соответствует более широкой тенденции к Интегрированным Личным Средам — рабочим пространствам, где программирование, дизайн, документация и управление проектами объединяются на единой платформе. Сравнения Git, изменения дизайна, архитектурные диаграммы и спецификации функций начинают восприниматься как разные взгляды на один проектный граф, а не как отдельные приложения, скрепленные между собой копированием, вставкой и перепиской в Slack.
Сегодня стек Cursor — это код + браузер + визуальный редактор + ИИ, но траектория указывает дальше. Представьте живые управления состоянием компонентов, которые раскрывают React-пропсы, варианты в стиле Storybook и флаги функций прямо в боковой панели, чтобы вы могли просматривать состояния загрузки, ошибки и успеха, не касаясь JSX.
Следующие шаги почти пишутся сами собой. Изнутри IDE вы могли бы: - Запустить A/B тесты, созданные с помощью ИИ, для главного раздела - Направить процент трафика через конфигурацию вашего сервера разработки - Передавать метрики в реальном времени обратно в боковую панель редактора
Обзоры дизайна могут происходить прямо в кодовой базе: менеджер продукта перетаскивает карточку, редактирует текст, помечает изменение как «Эксперимент 14», и ИИ открывает ветку, настраивает аналитику и публикует сводку в вашем трекере по выбору. Артефакт — это не рамка Figma или PDF; это работающий эксперимент с кодом, данными и обоснованием, всё находящееся в одном месте.
Поскольку интегрированные среды разработки продолжают поглощать смежные инструменты, центр тяжести программной работы решительно смещается к этому универсальному интерфейсу. Визуальный редактор Cursor выглядит как небольшое улучшение качества жизни для фронтенд-разработчиков, но тихо перекраивает границу между «дизайнерским инструментом» и «развивающей средой».
С этой точки зрения, это обновление не просто убивает часть передачи дизайна. Оно дает представление о будущем, где «открыть редактор» означает войти в основную студию для создания, формирования и выпуска программного обеспечения от начала до конца.
Часто задаваемые вопросы
Что такое новый Визуальный Редактор Cursor?
Это функция, которая добавляет интерфейс, похожий на Figma, внутри встроенного браузера IDE, позволяя вам визуально редактировать пользовательский интерфейс вашего веб-приложения, пока ИИ-агент пишет соответствующий код.
Является ли Cursor Visual Editor полным заменителем Figma?
Пока нет. Он превосходно справляется с реализацией и итерацией дизайнов непосредственно в коде, но не заменяет основные сильные стороны Figma в начальном дизайне, прототипировании или командном сотрудничестве.
Как Визуальный Редактор фактически изменяет мой код?
Вы выбираете элемент, визуально изменяете его свойства, а затем подтверждаете изменения. Искусственный интеллект интерпретирует эти визуальные правки и обновляет ваши исходные файлы (например, CSS или JSX).
Эта функция уже доступна?
Да, Визуальный Редактор доступен для всех пользователей в версии Cursor 2.2 и выше. Возможно, вам нужно обновить приложение, чтобы получить к нему доступ.