Объекты: Анимация (Lottie)
Добавление Lottie-анимации
Lottie-анимация - это простая векторная графическая анимация.
Откройте слева раздел “Анимации” и выберите объект из категории Lottie-анимации.
Откройте слева раздел “Анимации” и выберите объект из категории Lottie-анимации.
![](https://yc-landing.supafiles.ru/page-revisions/20242908_143922_34466083/images/tild6537-3130-4930-b531-316336643038__-__empty__01-01_lottie.jpg)
Авторизация в LottieFiles для доступа к библиотеке анимаций
Обратите внимание, что полная библиотека Lottie-анимаций доступна только при авторизации в сервисе LottieFiles и настройке доступа.
Нажмите на название категории или на кнопку “Показать все”, чтобы открыть коллекцию анимаций.
Нажмите “Авторизоваться в LottieFiles”, чтобы перейти на страницу сервиса.
Нажмите “Авторизоваться в LottieFiles”, чтобы перейти на страницу сервиса.
![](https://yc-landing.supafiles.ru/page-revisions/20242908_143922_34466083/images/tild3935-3063-4133-b434-613236633866__-__empty__01-02__lottiefiles.jpg)
Авторизуйтесь в LottieFiles удобным способом, а после этого дайте разрешение на использование стороннего плагина сервиса.
Затем вернитесь на сайт SUPA.
Затем вернитесь на сайт SUPA.
![](https://yc-landing.supafiles.ru/page-revisions/20242908_143922_34466083/images/tild6530-3261-4430-a138-353538313932__-__empty__01-03__lottiefiles.jpg)
Теперь вам доступна вся библиотека Lottie-анимаций.
![](https://yc-landing.supafiles.ru/page-revisions/20242908_143922_34466083/images/tild3534-3761-4461-a534-303138663365__-__empty__01-04__lottie.jpg)
Вы также можете добавить на холст свою Lottie-анимацию с компьютера, в формате JSON. Перенесите файл из проводника на холст или вставьте его, используя горячие клавиши Ctrl-C и Ctrl-V. Анимация будет загружена в раздел “Загрузить” и появится на холсте.
Настройка Lottie-анимации
Каждая Lottie-анимация имеет множество настроек.
Выделите её, чтобы открыть следующие настройки:
● Замена Lottie-анимации
● Скорость воспроизведения
● Зациклить воспроизведение
● Редактор цветов анимации
● Отображение слоёв
Выделите её, чтобы открыть следующие настройки:
● Замена Lottie-анимации
● Скорость воспроизведения
● Зациклить воспроизведение
● Редактор цветов анимации
● Отображение слоёв
![](https://yc-landing.supafiles.ru/page-revisions/20242908_143922_34466083/images/tild3639-6562-4966-b336-373666306633__-__empty__02-01__lottie.jpg)
Замена Lottie-анимации
Чтобы заменить Lottie-анимацию, выделите её и нажмите в меню справа кнопку “Изменить Lottie”.
Выберите необходимую анимацию из истории загрузок или из категории “Lottie-анимации” раздела “Анимации”.
Выберите необходимую анимацию из истории загрузок или из категории “Lottie-анимации” раздела “Анимации”.
![](https://yc-landing.supafiles.ru/page-revisions/20242908_143922_34466083/images/tild3536-6235-4466-b635-393862666234__-__empty__03-01__lottie.jpg)
Скорость
Вы можете настроить скорость воспроизведения анимации.
Для этого выделите Lottie-анимацию и установите в меню справа ползунок “Скорость” на значение от 0,1 до 7.
Для этого выделите Lottie-анимацию и установите в меню справа ползунок “Скорость” на значение от 0,1 до 7.
![](https://yc-landing.supafiles.ru/page-revisions/20242908_143922_34466083/images/tild3263-3763-4538-a361-353732353333__-__empty__04-01__.jpg)
Зациклить
Вы можете выбрать, будет ли Lottie-анимация воспроизводиться один раз или она будет зациклена.
Выделите Lottie-анимацию и нажмите справа выпадающее меню настройки “Зациклить”. Выберите нужный вариант из предлагаемых:
● Да
● Нет
Выделите Lottie-анимацию и нажмите справа выпадающее меню настройки “Зациклить”. Выберите нужный вариант из предлагаемых:
● Да
● Нет
![](https://yc-landing.supafiles.ru/page-revisions/20242908_143922_34466083/images/tild6162-3530-4230-a665-366236306330__-__empty__05-01_.jpg)
Редактор цветов
Lottie-анимация - это объект, состоящий из множества отдельных элементов-слоёв.
Вам доступна настройка их цветов двумя способами.
Вам доступна настройка их цветов двумя способами.
Изменение цвета для группы элементов
Выделите Lottie-анимацию и найдите справа раздел настройки “Редактор Lottie”.
По умолчанию открыта вкладка “Цвета”. Здесь перечислены все цвета, использованные в анимации, а также количество элементов с такими цветами.
Нажмите на иконку цвета, чтобы открыть палитру и выбрать нужный цвет. Все элементы данной группы будут перекрашены в новый цвет.
По умолчанию открыта вкладка “Цвета”. Здесь перечислены все цвета, использованные в анимации, а также количество элементов с такими цветами.
Нажмите на иконку цвета, чтобы открыть палитру и выбрать нужный цвет. Все элементы данной группы будут перекрашены в новый цвет.
![](https://yc-landing.supafiles.ru/page-revisions/20242908_143922_34466083/images/tild6336-3438-4062-b866-363735656166__-__empty__06-01___.jpg)
Настройка отдельного элемента
Во вкладке “Слои” вы можете настроить отдельно каждый элемент Lottie-анимации.
Вы можете выбрать цвет любого элемента или вообще скрыть его.
Нажмите на иконку цвета, чтобы открыть палитру и выбрать нужный цвет.
Если вы хотите скрыть элемент, щелкните по иконке перечёркнутого глаза.
Чтобы сбросить все изменения, нажмите на кнопку “Сбросить”.
Вы можете выбрать цвет любого элемента или вообще скрыть его.
Нажмите на иконку цвета, чтобы открыть палитру и выбрать нужный цвет.
Если вы хотите скрыть элемент, щелкните по иконке перечёркнутого глаза.
Чтобы сбросить все изменения, нажмите на кнопку “Сбросить”.
![](https://yc-landing.supafiles.ru/page-revisions/20242908_143922_34466083/images/tild3836-3834-4365-b232-656164326230__-__empty__06-02___.jpg)
Анимированные стикеры Telegram
В SUPA есть возможность использовать файлы с расширением *.tgs - это анимированные стикеры из Telegram.
Чтобы сохранить стикер Telegram как файл, нажмите на него в диалоге правой кнопкой и выберите пункт “Сохранить как…”, укажите путь и нажмите кнопку “Сохранить”.
Чтобы сохранить стикер Telegram как файл, нажмите на него в диалоге правой кнопкой и выберите пункт “Сохранить как…”, укажите путь и нажмите кнопку “Сохранить”.
![](https://yc-landing.supafiles.ru/page-revisions/20242908_143922_34466083/images/tild6562-3966-4134-b664-363538356436__-__empty__07-01__.jpg)
Перетащите файл из проводника на холст SUPA, где он появится сразу после загрузки. После этого стикер останется доступным для использования из истории загрузок.
![](https://yc-landing.supafiles.ru/page-revisions/20242908_143922_34466083/images/tild6537-3832-4865-a334-656639366238__-__empty__07-02__.jpg)