Как начать работу с Arvess beta
- Установи плагин
Arvess в FigmaНайди плагин в фигме через панель ctrl+k, далее в поиске Arvess for Figma - Установи расширение
и посмотри инструкциюArvess доступен в магазине расширений по кнопке ниже, там же и инструкция ↓ - Наслаждайся!
А мы всегда рядом ;)В случае ошибок или вопросов, залетай к нам в tg чат — обязательно поможем
Стоимость Arvess beta
Расширение полностью бесплатно
на время бета теста
на время бета теста
Бесплатно
Полный доступ ко всем функциям
Бесконечное кол-во импортов
Регистрация не требуется
Arvess будет в бета версии до тех пор, пока не реализуются все планы по доработке
При желании, вы можете поддержать Arvess на любую сумму
Мы создали этот продукт, чтобы облегчить жизнь наших пользователей, и рады видеть его полезным для многих. Проект развивается благодаря энтузиазму команды и поддержке сообщества.
Любая помощь важна и позволит нам продолжать развивать сервис, улучшать функциональность и создавать новые полезные инструменты.
Следи за обновлениями и новостями в Telegram канале Arvess!
Инструкция для Arvess beta
Без этих знаний магия импорта не заработает.
Начало работы с Arvess beta
Все вкладки инструкции обязательны к просмотру, если лень, то есть наглядная видеоинструкция ниже
Для использования необходимо установить плагин для фигмы и расширение в браузер. Инструкции в соответствующих вкладках выше
Плагин для фигмы генерирует код, который нужно вставлять в основное расширение. А расширение уже импортирует всё в зероблок в Тильде.
Исчерпывающая информация и подробности по каждому элементу расписаны в ArvessWiki.
Для использования необходимо установить плагин для фигмы и расширение в браузер. Инструкции в соответствующих вкладках выше
Плагин для фигмы генерирует код, который нужно вставлять в основное расширение. А расширение уже импортирует всё в зероблок в Тильде.
Исчерпывающая информация и подробности по каждому элементу расписаны в ArvessWiki.
Установка плагина Arvess для Figma
Для установки плагина заходим в какой-нибудь свой проект в фигме, в котором есть права редактора и нажмаем «Actions» на панели инструментов внизу, либо CTRL/CMD+K
В поиске находим Arvess for Figma и нажмаем либо «Save» либо «Run». Теперь плагин будет доступен через эту панельку в любое время
Подробнее в базе знаний ArvessWiki
В поиске находим Arvess for Figma и нажмаем либо «Save» либо «Run». Теперь плагин будет доступен через эту панельку в любое время
Подробнее в базе знаний ArvessWiki
Установка расширения Arvess для браузера
Найти расширение можно через поиск в магазине расширений браузера, либо сразу по ссылке.
После установки, в интерфейсе Zeroblock появится новая кнопка "Импорт из Figma"
Подробнее в базе знаний ArvessWiki
После установки, в интерфейсе Zeroblock появится новая кнопка "Импорт из Figma"
Подробнее в базе знаний ArvessWiki
Отрисуй нужные брейкпоинты блока в Figma по трём обязательным правилам
Обязательно соблюдай эти три простых правила:
- Блоки должны быть в отдельных фреймах
- В одном фрейме нельзя делать одинаковые названия элементам
- Каждый элемент должен сохранить своё название на всех брейкпоинтах
Объедини все версии блока в один фрейм и запусти плагин
Как объединить:
Все подробности по адаптации макета и элементов под расширение смотри в базе знаний ArvessWiki
- Выдели все фреймы брейкпоинтов
- В меню выбери Frame selection или нажми CTRL/CMD+ALT+G
Все подробности по адаптации макета и элементов под расширение смотри в базе знаний ArvessWiki
В Tilda через кнопку расширения выгружаем блок
- Обязательно создай новый ZeroBlock, перейди в редактор и нажми кнопочку «Импорт из Figma»
- Вставь в появившемся окне то, что скопировалось из плагина для фигмы
- После импортирования сохрани блок стандартной кнопочкой save
- Повторяй цикл для каждого блока и радуйся сэкономленному времени на вёрстке
Здесь важная и полезная информация
Важная информация
- Чтобы кнопки выгружались, как элемент button, нужно назвать фрейм button или кнопка и поместить внутрь текст, если кнопок несколько, то добавляем рядом цифру button 1, button 2 и так далее
- Изображения выгружаются в image, не в shape, настроить это нельзя
- Фон блока задаётся через fill фрейма в фигме, общий фрейм должен быть без fill
- Spacing текста в тильде задаётся через line-height в фигме, через spacing paragraph межстрочка будет не соответствовать
- При выгрузке только одного брейкпоинта, он всё равно должен быть в "общем" фрейме (фрейм общий/фрейм блока/элементы)
- Автолейауты не поддерживаются (есть в планах, следите за обновлениями)
- Маски не поддерживаются
- В фигме желательно делать только целые значения, никаких 24,5 у шрифта, или 202,44x100,2 у шейпа
- Рекомендуем оставлять зазор 3-5 пикселей от края текста до края контейнера в фигме, чтобы в тильде они были также с небольшим зазором, иначе текст может съезжать на другую строку
- Импорт подходит для grid/autoscale вёрстки. Адаптация под Window вёрстку есть в планах
Настоятельно рекомендуем посмотреть полную видеоинструкцию (19 мин)
Ссылка на макет в фигме из примера, протестируй Arvess beta самостоятельно
Ссылка на макет в фигме из примера, протестируй Arvess beta самостоятельно
Мы используем файлы cookie, чтобы улучшить наши сервисы для пользователей. Продолжая использование сайта, вы подтверждаете своё согласие на использование файлов cookie. В случае несогласия, вы можете отключить использование «cookie» в настройках браузера или покинуть сайт.
