Импорт из Figma в Zero Block: как подготовить Frame, кнопки и изображения

Импорт из Figma в Zero Block экономит время, если исходный макет подготовлен как структура, а не как случайный набор слоев. Перед переносом нужно проверить ширину Frame, уровни вложенности, названия групп, автолейауты и изображения. Чем аккуратнее исходник, тем меньше ручной уборки после импорта.

Tilda рекомендует использовать Frame шириной 1200 px и не превышать шесть уровней вложенности групп. Для кнопки важна отдельная группа с понятным именем, а изображения после переноса могут потребовать загрузки на сторону Tilda.

Создайте отдельный Frame для одного логического блока или экрана. Не пытайтесь перенести весь длинный лендинг одной огромной областью: несколько небольших Frame проще проверить, адаптировать и заменить.

Размер Frame должен соответствовать рабочему артборду Zero Block. Если исходник создан на другой ширине, элементы могут импортироваться с неожиданными масштабами и отступами. Перед копированием удалите невидимые слои, лишние направляющие и тестовые подписи.

Соберите кнопку в группу из фона и текста и назовите ее так, чтобы плагин распознал назначение. Следите за тем, чтобы текст не выходил за форму кнопки, а ширина текстового слоя позволяла сохранить выравнивание.

Глубокую вложенность сокращайте заранее. Если группа нужна только для удобства в Figma, но не влияет на смысл, ее можно объединить. Важные элементы — заголовок, изображение, кнопка — лучше держать на понятном уровне.

Установите плагин Figma to Tilda, выберите нужный Frame или отдельный слой и подготовьте его к копированию. После вставки в Zero Block проверьте, импортирован ли Frame как группа или с применением настроек к артборду. Если в существующем артборде есть элементы, внимательно прочитайте предупреждение: некоторые режимы могут заменить текущую композицию.

Сравните расстояния между заголовком, кнопкой и изображением с исходником. Проверьте фон, градиенты, шрифты и размеры. Не начинайте править все вручную, пока не поймете, какие элементы импортировались правильно.

Изображения могут остаться связанными с Figma. Если блок должен жить независимо от исходного файла, загрузите нужные картинки в Tilda через настройки элементов. Проверьте разрешение, обрезку и вес файлов.

Автолейаут помогает сохранить расстояния, но не заменяет проверку адаптивности. Переключитесь на разные ширины экрана и посмотрите, как ведут себя длинный текст, кнопка и вертикальный стек.

Если пропала группа, проверьте уровень вложенности. Если кнопка стала обычным набором фигур, проверьте ее имя и структуру. Если фон или эффект превратился в изображение, решите, можно ли оставить его так или лучше собрать эффект средствами Zero Block.

Не создавайте новый API-токен и не передавайте его в сторонние формы. Если используете старый способ импорта через API, храните токен безопасно и отзывайте его, когда он больше не нужен.