Архив блога · Figma · Handoff

Figma Dev Mode: как разработчику снимать размеры и стили и что дизайнер должен подготовить

Как использовать Dev Mode в Figma для точного handoff: inspect, code, assets/export и подготовка файла дизайнером.

Что дает Dev Mode разработчику

В Dev Mode разработчик снимает размеры, отступы, типографику и цвета напрямую из макета, а также копирует автогенерируемые фрагменты кода.

  • Inspect: расстояния, размеры, стили слоев.
  • Code: CSS/Swift/Android-сниппеты.
  • Assets: быстрый доступ к иконкам и графике.
  • Export: выгрузка SVG/PNG/JPG/PDF.

Что должен подготовить дизайнер

  • Привести компонентный нейминг к единому стандарту.
  • Отметить фреймы и экраны статусом Ready for dev.
  • Проверить export-настройки ассетов.
  • Добавить пояснения к нестандартной логике.

Нужен взгляд со стороны на ваш сайт или продукт?

Переведём наблюдения из статьи в конкретный план улучшений.Обсудить задачу

Следующий шаг

Применим методику к вашему продукту

Пришлите ссылку и коротко опишите задачу. Вернёмся с первым приоритетом и форматом работ.