Руководство пользователя - как создавать анимированные изображения GIF и APNG
- 1. Анимайзер - специальная форма для редактирования анимированных изображений
- 2. Сборка анимации - объединяет статичные (неанимированные) изображения в анимированные
- 3. Разбивание анимации - разбивает анимированное изображение на статичные (по кадрам)
- 4. Смена формата - изменяет формат анимированных изображений из GIF в APNG и обратно
- 5. Анимировать статичное изображение - создает анимированное изображение GIF/APNG из одного статичного изображения
- 6. Анимированный текст - впишите текст и наш сервис анимирует его
Анимайзер - специальная форма для редактирования анимированных изображений
На главной странице Анимайзера вам предоставлена форма для загрузки изображений. Нажмите на кнопку "Выбрать" и выберите все изображения, которые хотите включить в ваше анимированное изображение. После выбора изображений, кнопка "Перейти к редактору" активируется если выбраны только изображения (в противном случае будет показана ошибка):
Выбрав все файлы, нажмите на кнопку "Перейти к редактору" и дождитесь пока все картинки загрузятся. После этого вы увидите форму Анимайзера слева и предварительный просмотр анимации справа с разными опциями для скачивания. Форма Анимайзера содержит следующие средства для редактирования анимации:
Чтобы добавить изображения к существующей анимации, нажмите на кнопку "Загрузить" в поле "Добавить кадры", выберите изображения и дождитесь пока они загрузятся. | |
Предоставляет возможность выбрать тип изображения - анимированное GIF или APNG. Заметьте, что не все браузеры поддерживают формат анимированных PNG. Если же вам все таки нужна анимация в формате PNG и чтобы она правильно отображалась во всех браузерах, можете использовать дополнительные возможности при скачивании - "скачать в виде спрайтов" и "Анимировать JavaScript`ом" или "Анимировать Canvas`ом". Изображение снизу позволяет вам определить поддерживает ли ваш браузер APNG: Заметка: Формат .GIF поддерживает или полную прозрачность или полную непрозрачность. Соответственно, когда вы выбираете формат GIF и устанавливаете прозрачный фон, вам все равно предоставляется функция установки цвета фона, который заполнит фон всех полупрозрачных пикселей изображения. Пример: |
|
Делает фон анимации прозрачным. Заметка: Учтите что при выборе формата GIF все полупрозрачные пиксели будут находиться над выбранным цветом фона. |
|
Позволяет создавать подргузчики с цветами установленными по умолчанию. Заметка: Опции "Отражать фон" и "Цвет переднего плана" становятся неактивными при использовании этой функции |
|
Цвет закрашивания анимации (работает по алгоритму раскраски - colorize) | |
Цвет фона анимированного изображения. Все прозрачные пиксели заполняются выбранным цветом. | |
Интервал времени между переходами с кадра на кадр. Чем ближе синяя точка к плюсу, тем быстрее анимация и наоборот. Вы также можете устанавливать интервалы времени после каждого кадра по отдельности инструментом "Настройка кадров". | |
Ширина и высота подгрузчика в пикселях. По умолчанию выбирается размер лучшего качества максимального размера каждого выбранного из списка изображения. Чтобы размеры изменялись пропорционально, отметьте опцию "Соблюдать пропорции". Если хотите вернуть исходные размеры изображения нажмите на ссылку "сбросить размеры" Если вам надо чтобы все изображения внутри анимации соблюдали оригинальные пропорции или растянуто на все изображение используйте опцию "Соблюдать все пропорции" в "Дополнительных настройках" |
|
Открывает опции дополнительных возможностей для анимаций | |
Открывает специальный интерфейс для управления кадрами. Этот интерфейс можно также открыть нажав на темну линию с надписью "Кадры анимации" внизу страницы: В окне настроек кадров вы можете:
|
|
Если вы загружаете изображения разных пропрорций и установите "Да" на инструменте "Соблюдать все пропорции", изображение будет растянуто внутри анимированного изображения, но будет соблюдать свои оригинальные пропорции. Если же установлено на "Нет", изображение будет полностью растянуто по всем краям анимации. | |
Инвертирует цвета изображения по схеме RGB. Например белый превращается в черный, красный в голубой и т.п.. Пример: |
|
Переворачивает изображение вертикально и/или горизонтально. Заметьте что некоторые подгрузчики не будут меняться при использовании этой функции, т.к. они могут быть абсолютно симметричны относительно центра изображения |
|
Расставляет последовательность кадров в обратном порядке | |
Количество раз проигрывания анимации. При вводе нуля (0) анимация будет прогрываться бесконечно |
Область предварительного просмотра
В этой области отображается предварительный просмотр изображения
Этот инструмент позволяет выбрать 3 типа скачивания:
- - Скачать в виде спрайтов - Позволяет скачать анимированное изображение в виде спрайтов (одно неанимированное изображение, кадры которого вставлены одно за другим в ряд)
- - Анимировать JavaScript`ом - Позволяет анимировать изображение в виде спрайтов при помощи скрипта JavaScript
- - Анимировать Canvas`ом - Позволяет анимировать изображение при помощи скрипта JavaScript и технологии Canvas