Создание простой анимации своими руками
Многие люди считают, что для создания простой анимации своими руками в домашних условиях требуются специальные навыки и много времени. На самом деле для этого достаточно простых компьютерных программ и стандартных приложений операционной системы Windows.
Анимация своими руками при помощи стандартных программ ОС Windows
Анимация — последовательная демонстрация (показ) графических файлов, которая создает иллюзию движения объектов. Для ее разработки понадобится всего две стандартные программы, которые имеются почти на всех компьютерах с операционной системой Windows — Paint и Movie Maker. Первая позволяет создавать и редактировать графические рисунки, вторая — видео. Качество разработанной анимации будет зависеть от ваших способностей рисования.
1. Создание кадров
Открываем Paint. Выбираем на панели инструментов кисть, подбираем нужный цвети рисуемна рабочем поле любой объект. Сохраняем рисунок в заранее созданную папку под именем «Кадр 1». Затем снова рисуем тот же объект, но немного меняя его положение (например, в первом кадре стрелка часов может стоять на отметке «12», а на втором на «1»). Сохраняем изображение под именем «Кадр 2». Таким образом, разрабатываем несколько кадров. Чем больше их количество, тем плавней будет движение объекта в анимации.
2. Соединение нарисованных кадров в один ролик
Открываем программу Movie Maker. В панели задач выбираем «Импорт изображений» и загружаем кадры. Они будут отображаться в панели «Сборник». Поочередно переносим их на расположенную внизу дорожку. Нажимаем на «Отображение шкалы времени». Если не изменять стандартное для программы время показа, объект анимации будет двигаться резко и медленно. Чтобы изменить это, щелкаем по кадрам и передвигаем появившуюся полоску влево. Кадры будут становиться уже, а значит, время их показа уменьшится.
3. Озвучка анимации
К анимации можно добавить комментарии, записав их через микрофон, или поставить фоновую музыку. В первом случае заходим во вкладку «Сервис» и выбираем «Шкала времени комментария». Затем жмем «Запустить», озвучиваем персонажа или читаем закадровый текст. По завершению нажимаем «Остановить», сохраняем комментарий, добавляемего в проект, а потом на звуковую дорожку в нижней панели.
4. Сохранение анимации в нужном формате
Выбираем пункт меню «Файл» и последовательно кликаем «Сохранить файл фильма», «Показать дополнительные варианты», «Другие варианты». Затем выбираем формат будущего видеофайла. Рекомендуем сохранять анимацию в популярном формате (например, AVI, MPEG, PAL, и др.), чтобы ее можно было воспроизводить на многих плеерах и проще закачать наYouTube.
Создание GIF анимации 
GIF анимация («гифка») состоит из отдельных кадров, для которых задается такой параметр, как длительность показа до появления следующей картинки. Она поддерживает лишь 8-битную палитру, из-за чего отображается не больше 256 цветов, что является преимуществом перед другими форматами. Наиболее часто анимационные GIF файлы применяются как элементы навигации на сайтах и рекламные баннеры.
Наиболее простой программой для создания GIF анимации является Easy GIF Animator Pro. Скачиваем ее, открываем, в главном окне кликаем «Создать новую анимацию», после чего откроется «Мастер анимации». Далее добавляем изображения (подбираем в интернете или самостоятельно рисуем в программе Paint). Нажимаем «Вперед». Устанавливаем продолжительность каждого кадра. При необходимости выбираем показ анимации по кругу.
Если подобраны изображения разных размеров, программа предлагает несколько вариантов позиционирования картинок относительно наибольшего изображения:
Жмем «Финиш». Далее открывается окно сопциями для редактирования анимации. Выполнив необходимые настройки, в меню выбираем «Файл», а затем«Сохранить».
Также GIF анимацию можно создать при помощи программы UnFREEz. Для этого достаточно разработать кадры и «перетянуть» их в окно программы. Затем нужно выполнить указание времени задержки между кадрами и включение цикличности. В конце необходимо нажать «Make Animated GIF».
Все о создании раскадровки
Создание анимации: что, где, когда
В этой статье мы расскажем вам о том, какая бывает анимация и кто стоит за кулисами волшебного мира мультфильмов
Программы для создания анимации
Pensil
Программа с большим функционалом и понятным интерфейсом. Она позволяет создавать рисованных персонажей и «оживлять» их в 2D-анимации. Ее возможности:
Synfig Studio
При помощи этой бесплатной программы можно создать простую анимацию в 2D-формате — похожую на ту, которая используется в художественных фильмах. Ее преимущества:
ToonBoom Studio
Программа имеет два рабочих режима: Рисования и Сценарный. Содержит необходимые инструменты для разработки векторных рисунков: кисть, карандаш, «прямоугольник», «ломаная линия», «эллипс». Функции: рисование с применением планшета, векторизация растровых изображений, наложение анимированных сцен на реальный видеоролик, экспорт данных (например, отдельных фрагментов из фотографий).
Blender
Это популярная программа для создания 3D-анимации. Ее преимущества:
Другие популярные программы для создания анимации своими руками: Plastic animation paper, Creatoon, 3D Studio Max, Adobe Image Ready, MyPaint, Jasc Animation Shop.
Закажите создание анимации, написание сценария или разработку идеи для видеоролика в компании KINESKO — мы качественно выполним свою работу!
ТОП-15 лучших программ для анимации
Программы для создания анимации превращают бездушное изображение или набор картинок в связную историю. Это благотворно сказывается на вовлечении аудитории. Ведь, если честно, мультики любят все, и дети и взрослые. Но чтобы освоить профессиональный софт уровня AfterEffects или Maya, понадобится талант художника и 10 лет обучения.
Не спешите отчаиваться! Мы в этой игре больше 10 лет и точно знаем, чтобы “собрать недорогой короткий ролик”, “анимировать баннер или кнопку”, не обязательно посвящать анимации полжизни. Достаточно выбрать подходящий софт. А может, вы даже откроете в себе талант серьезного моушн-дизайнера?
Итак, несложные коммерческие или личные задачи по анимации решаются с помощью:
| Софт | Русский язык | Лицензия | Стоимость |
| Stop Motion Studio | Нет | Пробная | От 125 руб. |
| Cartoon Animator 4 | Нет | Пробная | От 6300 руб. |
| Moho Anime Studio Debut | Нет | Пробная | От 6300 руб. |
| DigiCel FlipBook | Нет | Пробная | От 1300 руб. |
| Toon Boom Harmony | Да | Пробная | От 2800 руб. |
| Adobe Animate | Да | Пробная | От 1350 руб. |
| Blender | Нет | Бесплатная | Бесплатная |
| Pencil2D | Нет | Бесплатная | Бесплатная |
| Wideo | Нет | Пробная | От 1300 руб. |
| Easy GIF animator | Да | Пробная | От 1800 руб. |
| Synfig Studio | Да | Бесплатная | Бесплатная |
| Animaker | Да | Пробная | От 1300 руб. |
| Explaindio | Да | Пробная | От 2300 руб. |
| Pivot Stickfigure Animator | Да | Бесплатная | Бесплатная |
| CrazyTalk | Да | Пробная | От 3800 руб. |
Stop Motion Studio
Идеальный выбор для абсолютного новичка в видеопроизводстве. Программа неприлично проста в освоении, разберется даже пятиклассник. С ее помощью можно создавать забавные ролики в стиле стоп-моушн, когда анимация и движение объектов строится из последовательных кадров. Можно использовать как на компьютере, так и на телефоне или планшете. Умеет создавать видео не только из фото, но и из рисунков.
Cartoon Animator 4
Программа для создания анимации подойдет как новичкам, так и опытным. Для начала выберите 2D-персонажа из огромной библиотеки, кастомизируйте его по своему усмотрению. Затем в редакторе можете “оживить” персонажа, выбрав из многочисленных шаблонов движения. Помимо простейшей анимации “человечек идет, бежит, прыгает, машет рукой”, вы контролируете его мимику, движения губ и т.д. Точек и траекторий движения великое множество.
Пожалуй, это лучший инструмент, чтобы новичок смог почувствовать себя профессиональным аниматором.
Moho Anime Studio Debut
Выходя на рынок, Moho Anime Studio Debut позиционировалась, как революционная программа, благодаря которой даже дети смогут создавать крутую анимацию. Симбиоз расширенного функционала и простого, интуитивно понятного интерфейса. И в общем, обещание свое разработчики сдержали.
Но только посмотрите на этот роскошный функционал!
DigiCel FlipBook
Победитель в номинации “просто и со вкусом”. Эта программа дает понять, как создавали покадровую 2D анимацию во времена Уолта Диснея. Интерфейс напоминает классический Paint, с той лишь разницей, что нарисованные изображения можно “оживить”. Находка для тех, кто любит рисованную мультяшную анимацию из детства.
Toon Boom Harmony
Канадская программа для создания анимации для хардкорных профессионалов. Один из самых мощных софтов в подборке. Формально — для любителей, фактически — не уступает профессиональным программам. Это с ее помощью создавали культовый мультфильм Space Jam, тот самый где Майкл Джордан играет в баскетбол с персонажами мультсериала “Веселые мелодии”. Toon Boom Harmony фаворит для аниматоров Disney, Warner Bros и студий поменьше.
У программы мощнейший функционал. На обработку всего одного кадра может уйти до нескольких часов, но результат того стоит. Позволяет создавать любой тип анимации, от классической рисованной до комбинации 2D и 3D. Все, что вам нужно для создания анимации по приятной цене.
Adobe Animate
Как и любой продукт компании Adobe, эта программа для создания анимации стоит на принципе “широкие возможности, высокий порог вхождения”. Она не дружественна к новичкам, но опытному веб-дизайнеру позволит за несколько минут создать уникальную 2D-анимацию с чистого листа. Подойдет для создания баннеров, мультфильмов, анимации для игр и оживления инфографики. Полученный контент можно быстро загружать на любые устройства и платформы.
Для индивидуального пользователя
Blender
Open Source программа для создания 3D анимации с широким набором инструментов. Подойдет для аниматоров, игроделов, создателей моделей и рендеров. Возможно, профессионалам возможности Blender покажутся ограниченными, но начинающим аниматорам будет где разгуляться.
Pencil2D
Если тяготеете к старой доброй 2D-анимации, на базе карандашных рисунков от руки, Pencil 2D имеет все шансы стать вашей самой любимой программой. Pencil 2D позволяет рисовать изображения в растре и векторе. Это удобно, легко и бесплатно!
Wideo
Онлайн-сервис для создания анимации, который отлично подойдет как для энтузиастов, так и для коммерческих задач. При помощи Wideo можно создавать простую анимацию для любого типа видео: эксплейнеры, инфографика, презентации, классическая реклама и т.д.
Программа работает по принципу конструктора. Выберите объект из библиотеки, укажите траекторию движения, перетащив объект мышью и смотрите как картинка “оживает”. Добавляйте звуки, музыку и текст по своему усмотрению.
Easy GIF animator
Как следует из названия, это скачиваемая утилита, позволяющая быстро и легко создавать анимированные гифки, из картинок. С ее помощью можно делать несложные баннеры, кнопки и прочие маленькие радости интернет-маркетолога.
Разобраться в интерфейсе программы для создания анимации Easy GIF animator не сложнее, чем в Windows Paint. Даже школьнику будет достаточно беглого взгляда, чтобы понять основные принципы работы.
При этом функционал программы нельзя назвать куцым. В нее “зашит” хороший арсенал спецэффектов, возможность добавить текст и музыку, настроить интервалы смены картинки и сделать красивые плавные переходы. Результат Easy GIF animator сохраняет в AVI, GIF или Flash.
Synfig Studio
Бесплатный open-source программа для создания 2D-анимации. Специалисты любят называть Synfig бесплатной альтернативой Adobe Flash. Функционала программы хватит, чтобы делать полноценные детские мультфильмы.
Здесь вам и “костная” анимация, и возможность перегонять растровое изображение в векторное, и 50+ фильтров и эффектов. Сходу разобраться в интерфейсе будет сложно, но прямо на сайте есть бесплатный обучающий курс на русском. Из минусов — не очень удобная механика экспорта видео. А еще программа требовательна к оперативной памяти.
Animaker
Мы уже говорили об Animaker в подборке лучших сервисов для создания инфографики. Но этот универсальный солдат хорош и для создания и 2D-анимации с персонажами. Особенно хорош, если вы не умеете рисовать и не сильны в английском.
Animaker работает, как конструктор. Вы выбираете один из более 120 шаблонов, удобно сгруппированных по тематикам “образование”, “бизнес”, “путешествия” и т.д. Затем загружаете его в интуитивно понятный “ленточный” редактор и вносите необходимые коррективы. Добавляете, текст, музыку, простые эффекты. Можно даже подтянуть картинки из интернета. Результат можно прямо из сервиса экспортировать в YouTube или Facebook.
Чтобы добавлять больше шаблонов персонажей, эффектов и прочих опций, придется подключать платные тарифы. Тариф “Бизнес” позволяет создавать видео длиной до 30 минут в Full HD.
Explaindio
Еще одна программа для создания несложной анимации, которая подходит для людей без опыта в видеодизайне. Умеет создавать 2D анимацию, дудл видео и даже несложное 3D. В продвинутой версии есть возможность настраивать движение персонажей по траекториям (простые движения, поворот).
Pivot Stickfigure Animator
Забавная и простая в освоении программа для создания анимации, которая позволяет рисовать и человечков из палочек, а затем оживлять их, указав траектории движения. При желании, можно дорисовать или подгрузить еще изображения или текст. Есть немного кривой русский перевод, но программа столь проста в освоении, что вы разберетесь с ней даже на китайском.
CrazyTalk
Еще одна забавная утилита, которая позволит создать несложную 3D-анимацию, даже с собой любимым в главной роли. Не требует дизайнерских скиллов. Просто загружаете изображение лица, будь то фото или картинка, настраиваете эффекты и наблюдаете, как голова на экране двигается и разговаривает.
БОНУС для тех кто долистал до конца!
Xplainto.me
Отечественное приложение для iOS для создания анимированных doodle-роликов длинной не больше минуты. Придумываем текст, озвучиваем его, добавляем музыку, выбираем изображение для каждой сцены и смотрим как происходит магия.
Что еще важно понимать
Этих программ, сервисов и приложений для создания анимации должно хватить, чтобы попробовать свои силы и понять насколько это “ваше”.
Если спустя пару часов ковыряния в любой из программ, вам не захотелось плюнуть и все бросить, поздравляем, у вас есть потенциал! Практикуйтесь каждый день, смотрите обучающие видео и вскоре сможете создавать простейшую анимацию на уровне любителя.
Затем, можно переходить и к более “взрослым” программам для создания анимации, вроде Adobe After Effects, Adobe Illustrator или Cinema4D.
Второй важный момент, почти весь софт для создания анимации англоязычный. Думаю, вы уже и сами это поняли. То же самое и с самыми подробными и полезными обучающими курсами по анимации. Позаботьтесь о том, чтобы знать английский хотя бы на среднем уровне. Иначе в мире компьютерной графики, анимации и моушн дизайна вам придется сложно. Но это волшебный чарующий мир и он стоит немного усилий.
Продолжайте развиваться, заглядывайте к нам в блог и помните, ВидеоЗаяц.рф любит вас 😉
6 популярных программ для создания анимации
Быстро сменяющиеся кадры создают иллюзию движения, а аниматоры с её помощью — живые продукты. Разбираем инструменты для моушн- и UI-дизайна.
Изначально анимацию в интернете использовали для развлечения: создавали весёлых персонажей или рассказывали короткие истории. Сейчас она помогает улучшить юзабилити сайта или приложения, управлять вниманием пользователя и делать продукты интерактивными.
Чтобы разобраться в правилах создания анимации, мы приглашаем начинающих и опытных дизайнеров на курс «Анимация интерфейсов» от Skillbox. А выпускникам с дипломами гарантируем трудоустройство в компании-партнёры.
Пишет про дизайн в Skillbox. Рисует макеты и верстает страницы для клиентов.
Для чего нужна анимация
Для прототипов. С помощью анимации дизайнеры оживляют макеты сайтов и приложений. Создают интерактивные переключения между разными экранами приложений и страницами сайтов.
Для презентации кейсов. Дизайнеры используют анимацию для того, чтобы показать актуальные работы и продемонстрировать своё портфолио. Движущиеся элементы привлекают и удерживают внимание пользователей. А интерес и внимание — критерий хорошей презентации.
Для реализации микровзаимодействий — анимаций интерфейса, которые сообщают о состоянии страницы, о реакции элемента на действия пользователя и показывают результат этого действия. Отвлекают и развлекают, пока приложение или сайт загружается.
Анимация: какие программы использовать
Анимации создают в специальных программах, но универсального инструмента для решения всех задач не существует. Поэтому необходимо выбрать тот софт, который лучше всего подходит для конкретных целей.
Программы в нашей подборке условно разделены на два направления: для анимирования прототипов и создания полноценных анимаций.
Анимирование прототипов
С помощью таких программ создают бесшовные переходы между экранами и страницами сайта. При правильной настройке можно имитировать поведение элементов интерфейса и собрать несложную анимацию.
Программы работают на основе макетов из графических редакторов. И создают анимацию, если задать начальное и конечное состояние экрана и триггер — событие, при котором запускается переход. Вид анимации, плавность, скорость и остальные параметры можно настроить.
1. Principle
Один из популярных инструментов для создания интерактивных прототипов и анимации интерфейса. Подходит для детальной настройки сложных переходов между экранами и разными состояниями. Работает только на macOS.
Сфера применения: создание коротких сценариев в 2–4 экрана.
| Плюсы | Минусы |
|---|---|
| Простой инструмент для несложной анимации | Неудобно работать со сложными сценариями |
| Простой интерфейс | Работает только на macOS |
2. Marvel
Онлайн-сервис для создания прототипов. Работает из браузера или как дополнение к графическим редакторам. Позволяет не только создать и настроить переходы, но и изменить макеты при необходимости или посмотреть прототип на смартфоне.
Сфера применения: удобное создание прототипов прямо из браузера.
Цена: несколько тарифных планов, есть бесплатный.
| Плюсы | Минусы |
|---|---|
| Кросс-платформенный, работает из браузера | Долго загружается при медленном интернете |
| Условно-бесплатный |
3. InVision Studio
Универсальный дизайн-редактор. Помогает легко работать с прототипом и редактировать анимацию, поддерживает все сервисы InVision. Находится в раннем доступе и пока распространяется бесплатно.
Сфера применения: создание дизайна и прототипов.
Цена: бесплатный в раннем доступе.
| Плюсы | Минусы |
|---|---|
| Подходит для совместной работы | Ранний доступ |
| Работает на Windows | Иногда возникают ошибки во время работы |
Создание полноценных анимаций
Этими инструментами дизайнеры пользуются для создания презентаций, микровзаимодействий и движущихся баннеров. Чтобы решить, в какой программе делать анимацию, необходимо сформулировать цель: какая анимация будет и для чего она нужна.
Универсальные программы для анимирования — это продукты компании Adobe. Простую анимацию можно сделать и в Photoshop, для сложного подойдёт Animate или After Effects.
Последние две программы появились как логическое продолжение Photoshop и даже сейчас работают в связке с ним. В последних версиях After Effects нет возможности сохранить проект в GIF напрямую, поэтому это нужно делать через Photoshop.
4. Adobe Photoshop
Универсальный редактор для обработки графики. С помощью инструмента Timeline («Шкала времени») можно создавать покадровую анимацию работ. Photoshop — самый простой инструмент от Adobe, в котором имитируют движение. Интерфейс более сложных программ построен на основе Photoshop. Поэтому знакомство с созданием анимации лучше начать с него.
Сфера применения: работа и анимация сайтов, фотографий, иллюстраций и другой графики.
Цена: подписка, 1 288 рублей в месяц.
| Плюсы | Минусы |
|---|---|
| Популярный редактор для обработки графики | Универсальность, много лишних функций |
| Поддержка Windows и macOS | Нет веб-версии |
5. Adobe Animate
Это одна из тех программ, которые используют для анимации изображений. Есть удобная шкала времени с раскадровкой. В Animate удобно работать с макетами из Photoshop. Идеально подходит для создания интерактивных презентаций и баннеров. Позволяет экспортировать анимацию в формате HTML и CSS.
Сфера применения: анимация презентаций, баннеров, рекламы.
Цена: подписка, 1 288 рублей в месяц.
| Плюсы | Минусы |
|---|---|
| Работа с векторной графикой | Иногда встроенного редактора не хватает |
| Поддержка Windows и macOS | Нет веб-версии |
| Развитое сообщество, много уроков |
6. Adobe After Effects
Продвинутый редактор для создания анимированной графики. Он пригодится и для обработки видеоклипов, оформления рекламных роликов и заставок.
After Effects требует значительных ресурсов и довольно сложен для изучения. Поэтому знакомство с ним лучше начать уже после изучения Photoshop и Animate.
Сфера применения: создание спецэффектов, заставок, титров, анимаций.
Цена: подписка, 1 288 рублей в месяц.
| Плюсы | Минусы |
|---|---|
| Мультифункциональный инструмент | Сложно освоить |
| Поддержка Windows и macOS | Запутанный интерфейс |
| Развитое сообщество, много уроков | Необходим мощный компьютер |
В какой программе сделать анимацию
Выбор программы зависит от вида анимации, поэтому мы составили таблицу, которая поможет определиться с нужной программой.
| ПРОГРАММА | ПРОСТЫЕ АНИМАЦИИ | РАБОТАЕТ В БРАУЗЕРЕ | PRO-УРОВЕНЬ | БЕСПЛАТНАЯ |
|---|---|---|---|---|
| InVision | Нет | Нет | Нет | Да |
| Adobe Photoshop | Да | Нет | Нет | Нет |
| Principle | Да | Нет | Нет | Нет |
| Marvel | Да | Да | Нет | Да |
| Adobe Animate | Нет | Нет | Нет | Нет |
| Adobe After Effects | Нет | Нет | Да | Нет |
Резюме
Программ для создания анимации много, каждая из них подходит для своей цели. Если хотите узнать, какими программами пользуются для анимации интерфейсов, и научиться с ними работать, обратите внимание на наш курс.
Анимация интерфейсов
Вы сможете самостоятельно создавать любую анимацию в интерфейсах и эффективно доносить концепции проектов до клиентов. Мы начнем с анимации простейших элементов, таких как иконки, и дойдем до создания полноценных кейсов и шоурилов.