Интеграция с Figma

Плагин Pushwoosh для Figma отправляет фреймы из вашего файла дизайна прямо в Медиахранилище приложения Pushwoosh. Изображения для push-уведомлений, баннеры In-App и шапки писем попадают из Figma в ваш контент без экспорта, скачивания и повторной загрузки файлов.

Плагин работает в редакторе Figma и в Dev Mode (режиме Figma, в котором разработчики изучают макеты).

Обзор интеграции

Тип интеграции

Назначение: изображения, экспортированные из Figma, отправляются в Медиахранилище Pushwoosh.

Предварительные требования

Аккаунт Pushwoosh. Если плагин недоступен для вашего аккаунта, свяжитесь с вашим Customer Success Manager или службой поддержки Pushwoosh.
Доступ к приложению Pushwoosh, в которое вы хотите отправлять изображения. Плагин показывает только те приложения, которые вы можете открыть в Control Panel.
Аккаунт Figma и плагин Pushwoosh из Figma Community.

Как работает интеграция?

Каждый пользователь Pushwoosh подключает плагин под своим логином. Вы начинаете вход в плагине, и он показывает короткий код. Вы вводите этот код в Control Panel Pushwoosh и разрешаете доступ. После этого плагин может от вашего имени делать две вещи:

видеть список ваших приложений
загружать изображения в Медиахранилище этих приложений

Плагин никогда не получает ваш пароль от Pushwoosh и не может читать или изменять что-либо ещё в вашем аккаунте.

Подключение плагина

Откройте плагин Pushwoosh в Figma Community и запустите его в своём файле дизайна.
В поле Region выберите Europe (app.pushwoosh.com).
Нажмите Sign in to Pushwoosh. Плагин покажет код, который действует 10 минут.
Нажмите Open Pushwoosh. Control Panel откроется на странице 3rd-party integrations с уже открытой формой ввода кода.

Если форма не открылась, например потому что вы раньше не пользовались Control Panel в этом браузере, перейдите в Settings > 3rd-party integrations и нажмите Enter code на карточке Figma.
Введите код из плагина и нажмите Continue.
Проверьте данные запроса на вход: аккаунт и пользователя, к которым подключается плагин, время начала входа, IP-адрес и устройство. Нажимайте Allow, только если вы сами начали вход из плагина.
Вернитесь в Figma. Плагин сам завершит вход и покажет имя и email вашего аккаунта.

Если код не работает:

Если срок действия кода истёк до того, как вы нажали Allow, плагин сообщит об этом. Снова нажмите Sign in to Pushwoosh, чтобы получить новый код.
После пяти неверных кодов Control Panel перестаёт принимать коды на срок до 10 минут. Подождите, затем нажмите Sign in to Pushwoosh в плагине, чтобы получить новый код.

Отправка фреймов в Медиахранилище

На холсте Figma выберите один или несколько фреймов. Можно также выбрать другие слои, например группы или компоненты.
В поле Application выберите приложение, в которое нужно отправить изображения. Если список пуст, у вас пока нет доступа ни к одному приложению. Попросите администратора аккаунта предоставить вам доступ.
В поле Format выберите PNG или JPG.
В поле Scale выберите 1×, 2× или 3×. Каждый выбранный фрейм отображается в списке со своим размером в Figma и размером экспортированного изображения, например 720×360 → 1440×720.
Нажмите Send. На кнопке указано, сколько фреймов будет отправлено, например Send 3 frames.

Когда загрузка завершится, каждый фрейм появится в Медиахранилище выбранного приложения. Чтобы сразу вставить изображение в контент, нажмите Copy URL рядом с фреймом в плагине.

Ограничения для изображений

Медиахранилище принимает изображения размером до 25 мегапикселей и до 10 МБ. Плагин проверяет оба ограничения перед отправкой:

25 мегапикселей: ограничение относится к экспортированному изображению после масштабирования. Фрейм, который превысил бы его, помечается в списке, например over 25 MP, use 2×, и не отправляется. Чтобы отправить его, выберите меньший масштаб.
10 МБ: PNG размером более 10 МБ отправляется в формате JPG. JPG размером более 10 МБ не отправляется.

JPG не поддерживает прозрачность, поэтому прозрачные области фрейма становятся белыми.

Отправка обновлённого фрейма

Если вы изменили фрейм и снова отправляете его в то же приложение, плагин загружает его как новую версию ранее отправленного изображения. Это видно на кнопке, например Send 3 frames (1 as new version), а сам фрейм помечается в списке как new version.

Медиахранилище показывает новую версию вместо предыдущей. У новой версии собственный URL, поэтому скопируйте его заново и обновите контент, в котором должно смениться изображение.

Удаление изображения в Медиахранилище удаляет только его последнюю версию, и её место занимает предыдущая. См. Удаление исходного изображения.

Фрейм отправляется как новое изображение, а не как новая версия, если:

вы отправляете копию фрейма или тот же фрейм из другого файла Figma
вы отправляете его в другое приложение
предыдущее изображение было удалено из Медиахранилища

Управление подключениями

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

Чтобы просмотреть или удалить подключения:

Перейдите в Settings > 3rd-party integrations.
На карточке Figma нажмите Manage.
Просмотрите список. Для каждого подключения указано, когда оно было создано, когда использовалось в последний раз, когда истекает и его IP-адрес.
Нажмите Disconnect рядом с подключением, которым вы больше не пользуетесь. Плагин на этом устройстве сразу перестанет работать, и в нём придётся войти заново.

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

FAQ

Могут ли мои коллеги отправлять изображения через моё подключение?

Нет. Каждый член команды подключает плагин под своим логином Pushwoosh, и каждое подключение видит только те приложения, к которым у этого человека есть доступ. Отключение одного подключения не влияет на подключения других.

Какие форматы и размеры можно отправлять?

PNG или JPG с экспортом в масштабе 1×, 2× или 3×. Каждое изображение может иметь размер до 25 мегапикселей после масштабирования и до 10 МБ.