Сервис Animatron. Как создать мультфильм в формате GIF?

Чтобы создать простой мультфильм, совсем необязательно уметь рисовать или осваивать дорогущие профессиональные программы. Есть довольно много онлайн-сервисов, которые умеют превратить набор картинок в связную анимированную историю. Достаточно вспомнить Biteable, Animaker, PowToon…

Давайте добавим в это ряд еще и Animatron: этот сервис умеет создавать небольшие мультфильмы хорошего качества в формате GIF.

Создатели сервиса предлагают два разных продукта: «Wave» (предназначен для создания маркетинговых видеороликов) и «Studio» (создаёт видеоанимацию). Вот о последнем и поговорим более подробно.

У Animatron Studio есть бесплатный тариф, в котором можно создать всего пять проектов, зато не ограниченных по количеству сцен и продолжительности.

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

Второй пример — уже посложнее (экспертный режим). Это мультик-корометражка с прописанной траекторией движения персонажей.

А теперь подробнее о том, как это всё работает.

Регистрация

Заходим на сайт сервиса и выбираем «Animatron Studio» — нажимаем «Try free».

Теперь регистрируемся — нажимаем кнопку «Sign Up» вверху справа. В дальнейшем для входа на сайт можно пользоваться кнопкой «Log In».

Выбираем вариант регистрации: с помощью электронной почты или через аккаунт Google.

Это форма для регистрации по адресу электронной почты. Указываем эту самую почту, записываем своё имя и придумываем пароль. Подтверждаем, что «мы не роботы» и нажимаем «Create My Free Account».

Осталось всего ничего — найти в почте письмо от создателей сайта и подтвердить свой электронный адрес.

Адрес подтверждён — самое время приступать к творчеству. Для этого нажимаем «Start Creating» (любую кнопку из двух).

Рабочее поле

Это рабочее поле сервиса. В центре — слайд для редактирования, слева — библиотека элементов. Внизу — лента времени, а справа — «список» созданных слайдов, которые можно менять местами с помощью «мыши».

Вверху — некоторые полезные кнопки: «отменить / повторить», «импортировать», «загрузить», «озвучить» и «поделиться».

Работать в сервисе довольно просто: берём нужную фигуру из встроенной библиотеки сервиса и помещаем её на слайд. В зависимости от уровня квалификации можно выбрать между «экспертным» (Expert) или «облегченным» (Lite) режимом. Кнопка переключения режимов находится вверху (показана красной стрелкой).

Временная шкала Animatron Lite немного сжата, так как в облегченном режиме есть только одна строка. В экспертном режиме временная шкала более широкая.

Режим Lite

Самое простое — начать работу в «облегчённом режиме».

Рассмотрим подробнее библиотеку сервиса. Ресурсы в ней делятся на несколько категорий: анимированные наборы, видео, изображения, фоны, текст, аудио и файлы проекта. К сожалению, фотографии, видео и аудио доступны только для платных подписок.

Анимированные наборы — это наборы связанной графики, например, фона и персонажей, часто с готовой анимацией.

Фоны — это большие изображения, которые можно использовать в качестве фона для слайда. Некоторые картинки анимированы.

Картинки для проекта можно искать, перелистывая наборы, а можно воспользоваться поисковой строкой: разыскивать персонажей (Objects) или фоны (Sets). Поиск на английском языке: набираем ключевое слово и нажимаем «Enter».

Текст — основной инструмент для добавления любых надписей видео. Кириллица поддерживается, но не всеми шрифтами. Если нужен какой-то особый шрифт, его можно загрузить, нажав на кнопку со стрелкой. Загружать можно файлы формата .ttf. Можно менять размер шрифта, выравнивание, размер, цвет и толщину.

Загрузки — это библиотека проекта. Здесь будут жить любые ресурсы, которые вы загрузите сами. Есть два способа добавления своих файлов. Первый: открыть «Загрузки» и просто «мышью» перенести в пустое поле нужные файлы (изображения, аудио или видео).

Другой вариант — добавить контент прямо на нужный слайд. Для этого выбираем этот самый нужный слайд и нажимаем кнопку «Import» на панели инструментов вверху.

Загрузить контент можно с ПК и по ссылке из Сети. Для того, чтобы картинка-видео-аудио добавились на слайд, нажимаем «Finish».

Несколько слов о загрузке аудио. Можно добавить по одному треку на каждый слайд, а можно озвучить одним музыкальным фоном сразу весь видеосюжет. Для этого после загрузки надо выбрать опцию «Across csenes». Дополнительно можно отрегулировать громкость.

Дополнительно мультфильм можно озвучить голосом в режиме онлайн: озвучка к каждому слайду записывается отдельно. Выбираем слайд и нажимаем на кнопку с изображением микрофона. Остаётся только подключить микрофон и прочитать текст.

Если нужно добавить к каждому слайду своё музыкальное сопровождение, то файлы нужно заранее обрезать так, чтобы продолжительность музыки не была больше продолжительности самой сценки, иначе все звуки смешаются, так как сервис автоматически звуковые файлы обрезать не умеет.

Порядок работы очень прост: создаём слайды, нажимая справа вверху на значок «+». На каждый слайд добавляем фон, текст и персонажей, сопровождаем это всё музыкой и озвучкой.

Все объекты тут же отображаются на ленте времени внизу. Чтобы отрегулировать время появления и исчезновения объекта, используем синие маркеры, передвигая их влево и вправо.

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

Знаки «плюс» и «минус» в конце временной шкалы могут использоваться для добавления или вычитания времени из сцены (по умолчанию каждая сценка длится 10 секунд).

Если на ленте времени выделить один из объектов и нажать на белый «+» вначале или в конце, то можно добавить дополнительную анимацию на вход и исчезновение персонажа. На ленте времени эти дополнительные эффекты отобразятся в виде белого сектора с голубым кругом посередине. Кликнув по нему, открываем целый список эффектов.

Картинку и текст может рисовать рука (на выбор аж три варианта: человеческая, анимированная и рука робота), эта же рука может выносить их на экран и убирать обратно. Объекты могут по-разному двигаться и появляться. В общем, есть из чего выбрать.

Кстати, чуть не забыла: каждый объект можно дублировать, копировать, вставить, развернуть по вертикали и горизонтали и удалить. Для этого щелкаем по нему и выбираем нужную кнопку из черного меню вверху.

И это ещё не всё. На боковой панели справа находится список слайдов анимации. Можно добавить переходы между ними. Для этого нажимаем синюю надпись «No transitions» и выбираем подходящий эффект из списка.

И подводя итоги. Единственный недостаток Animatron, на мой взгляд, — это отсутствие готовых шаблонов, которые можно было бы использовать для создания мультиков.

Экспертный режим

Если в мультфильме необходимо движение персонажей по экрану, то нужен более продвинутый «экспертный режим» (переключается нажатием на кнопку «Expert» на верхней панели).

Интерфейс «экспертного» режима не сильно отличается от «облегчённого». Основные различия — это обновленная панель инструментов и расширенная временная шкала. На панели слева уже нет отдельных вкладок для наборов, фонов и другого. Все готовые материалы находятся во вкладке «Market».

Из бесплатного доступны такие разделы:
— Animated Sets — анимированные шаблоны;
— Backgrounds — фоны;
— Shapes — формы и иконки.

Кроме того, в режиме Expert вверху есть две разные вкладки: Design (Дизайн) и Animation (Анимация).

В режиме Design любые изменения, которые вы вносите в объект, будут статичными. Например, если мы изменим положение объекта, то он просто появится в новой позиции и останется там. Но если мы переместим объект в режиме анимации, будет создан путь, и во время воспроизведения мультфильма объект будет перемещаться из старого места в новое. Так создаётся эффект движения.

Давайте поближе познакомимся с новой панелью инструментов.

Выбор и прямой выбор объекта (стрелки) — эти инструменты позволяют выбирать объекты на сцене. Используя первый, можно изменить размер объекта, а последний позволяет перемещать его.

Перо — это инструмент для рисования векторной графики.

Карандаш — это инструмент для рисования поверх экрана.

Кисть похожа на «Карандаш» — можно создавать рисунки произвольной формы. Однако кисть позволяет рисовать с помощью узоров, а не только сплошных цветов.

Инструмент «Текст» выглядит одинаково в облегченном и экспертном режимах. Он позволяет добавлять надписи и редактировать их.

Инструмент «Фигуры» умеет легко рисовать овалы, квадраты и пятиугольники.

Инструмент «Ведро» заполняет выделенную область (делает заливку).

«Ластик» удаляет объекты, изображения или рисунки.

«Масштаб» увеличивает или уменьшает слайд на экране.

«Панорамирование» можно использовать для перемещения фона на слайде.

У каждого инструмента есть свои настройки. Это настройки для выбора объекта.

Настройки инструмента «Перо».

У «Карандаша» настройки попроще.

Это настройки для «Кисточки».

Настройки для «Фигур».

В экспертном режиме временная шкала более продвинутая: у каждого объекта есть свой слой. Чем больше объектов на экране, тем более «слоёная» получается лента времени. Вместо кнопок «плюс» и «минус» для определения длины сцены можно настроить красную полосу, чтобы она отмеряла продолжительность каждого эпизода.

Например, в этой сцене на экране три объекта. Продолжительность эпизода — 10 секунд. Два объекта появляются и исчезают в нужное время, а один объект (фон) остаётся на экране все 10 секунд. Продолжительность нахождения объекта в кадре можно регулировать, передвигая «мышью» границы области, отмеченной на шкале синим цветом.

Осталось выяснить, как заставлять объекты двигаться: бегать, прыгать, летать, плыть… Для этого переходим во вкладку «Animation», выбираем из библиотеки подходящего героя и помещаем его на слайд. На ленте времени появляется отсечка в виде чёрного «бриллианта».

Это так называемый ключевой кадр. Точка, из которой будет двигаться наш персонаж. Осталось прочертить траекторию его движения и определить скорость перемещения. «Мышью» двигаем персонажа в нужную сторону. Щелкаем по ленте времени в нужном месте, то есть отмечаем, что в этот момент персонаж будет находиться здесь. Двигаем дальше, вновь щёлкаем по ленте времени. Если всё сделать правильно, на шкале появятся новые чёрные «бриллианты» — ключевые сцены.

Если выставить только два ключевых кадра — в начале и в конце движения, то персонаж будет двигаться по кратчайшему расстоянию. Если ключевых кадров сделать больше, то объект может двигаться с разной скоростью и менять направление движения.

Публикация и распространение

Когда все сценки мультфильма добавлены и отредактированы, настало время опубликовать свой шедевр. Но для начала озаглавим его. В левом верхнем углу нажимаем на надпись «Unnamed».

Открывается окошко для предварительного просмотра. Внизу — окошко для названия. Справа — кнопки для публикации и распространения. В бесплатном тарифе можно сохранить мультфильм в формате GIF, получить на него ссылку, поделиться работой в социальных сетях и с помощью кода вставить на страницу сайта или блога. Только скачать на ПК, к сожалению, нельзя.

Код для встраивания находится во вкладке «Embed». Здесь же несколько настроек: можно установить бесконечный показ мультфильма и автовоспроизведение (по умолчанию эти опции отключены).

На момент написания статьи эта вкладка «забастовала» и код для видео давать мне отказалась. Тогда я поступила так: вернулась назад в режим редактирования и вверху нажала на кнопку «Share».

В открывшемся окне выставила нужные настройки и нажала «Continue».