Анимация GIF в прототипе
Описание
Figma позволяет использовать анимированные изображения GIF в прототипах, при этом в редакторе анимация не воспроизводится.
Вы можете применять GIF в качестве заливки как и обычные изображения для любых шейпов, фреймов и текста.
Техническое ограничение по размеру для GIF составляет 4096 пикселей по одной стороне, все изображения с большим разрешением будут отмасштабированы.
Для чего пригодится
В прототип Figma пока что нельзя добавить видео или svg/css-анимацию, однако в современном веб-дизайне анимированные элементы и фоны уже более чем норма. Вставка GIF является альтернативой для демонстрации, но в верстке лучше использовать более современные форматы.
Как добавить GIF
Добавить анимацию можно как и любое другое изображение — выбрав его в качестве заливки в поле Fill (тип Image), перетащив его в редактор или вставив после копирования.
Учитывайте, что анимация GIF делает прототип более тяжелым.
Управление анимацией
В редакторе показывается статичное изображение, но вы можете настроить превью, перемести ползунок в окне Fill в нужное место (см скриншот).
Вы можете, как и с обычными изображениями, выполнять с гиф следующие манипуляции:
- Масштабировать, вращать, изменять размеры и пропорции
- Изменять режим заливки
- Изменять прозрачность
- Менять режим наложения
- Присенять к GIF маски
