Делаем анимацию для аватара (на примере)

Это небольшой урок по созданию анимационного аватара для сайта с помощью программки Easy Gif Animator (её можно найти в интернете, как демку на 30 дней, так и полную версию). Начальное знание Фотошопа очень приветствуется .)

---

  Итак, для начала нам нужно решить, что мы хотим сделать. Я выбрал для наглядного примера урока простенькое вращение знака радиации. Открываем Фотошоп и создаём файл размерами стандартного аватара сайта (140 на 140) с прозрачным фоном и цветоразрешением 8 бит (меньше будет весить, что при лимитированном весе аватара имеет значение).

Я по быстренькому набросал значок (симметричность необходима, чтобы он вращался на одном месте по центру, а не болтался, как чёрт знает что). Тут то вам и пригодятся знания Фотошопа.

Теперь сохраняем наше творение в формате gif (можно сохранять и в формате png, но я предпочёл в данном случае первый для меньшего веса исходной аватарки). Это будет наш первый кадр анимации и мы назовём его, соответственно, 1.

Далее в разделе Редактирование и Трансформация выбираем Поворот. Из-за особенностей значка нам достаточно повернуть его на треть, чтобы он принял ту же позицию, что и в начальном кадре. То есть, нам нужно повернуть его на 120 градусов (третья часть от 360 - полного оборота). Выберем шаг, равный 12 градусам и у нас получится 10 шагов - 10 кадров по двенадцатиградусному повороту каждый. Вбиваем в окошко наверху (там будет символ угла) значение 12 и подтверждаем поворот.

Теперь снова сохраняем новый получившийся кадр, но уже под именем 2. И так соответственно со всеми кадрами. Поворот на 12 градусов, сохранение под именем следующего кадра. Внимание, так как значения угла указывает не абсолютный угол положения объекта, а именно насколько будет повёрнут объект относительно текущей позиции, то нужно каждый раз вбивать в значение угла поворота именно 12, а не 12, 24, 36 и так далее.

Итак, у нас есть10 кадров в виде файлов gif, которые мы будем задействовать в цикличной анимации.

Открываем Easy Gif Animator.

Кликаем Create New Animation, а затем Add Image

Теперь выбираем приготовленные нами кадры.

Указываем сколько циклов будет проигрываться анимация (или же бесконечное количество раз) и сколько сотых долей секунды будет длиться каждый кадр. Мы поставим 5, но в самой программе можно каждому кадру затем задать своё конкретное значение длительности.

Есть множество дополнительных функций в программе, таких, как эффекты переходов между кадрами, задание текста, рисование, выделение цвета пипеткой, который будет удален с выделенных кадров (эффект хрома кей). Но мы делали всё на прозрачном фоне, так что нам это пока не нужно.

Также можно просмотреть, как всё будет выглядеть. Нас всё устраивает и мы сохраняем файл в gif формате. Можно сохранить в виде avi или флэш файла, но нам нужен именно gif.

Заливаем на хостинг картинок, вставляем ссылку и вот, что у нас получилось.

Приятного и успешного аватаромоделирования .)