SIMS2 LOVE

Информация о пользователе

Привет, Гость! Войдите или зарегистрируйтесь.


Вы здесь » SIMS2 LOVE » Уроки по работе с PhotoShop » Создание анимированного аватара


Создание анимированного аватара

Сообщений 1 страница 3 из 3

1

Adobe Photoshop — один из наиболее популярных растровых графических редакторов. Многофункционален. Используется во всех дизайнерских студиях и конторах для работы, поэтому, если вы захотите посвятить себя профессиям рекламный или веб-дизайн, то знание Adobe Photoshop вам необходимо.

У кого фотошоп не 2,9,а выше, то вместо Image Ready - Окно ->Анимация,дальше все тоже самое.

0

2

Создание анимированного аватара.

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

Шаг 1.

Откроем в Фотошопе (в дальнейшем будем называть его сокращенно ФШ) понравившуюся картинку (или фотографию) для аватара.

Прим.
Если картинка большая, нужно её заранее подготовить, вырезать из неё нужный фрагмент (например, лицо) и задать картинке требуемый размер, например 80 х 80 или 100 х 100 пикселей. Для разных форумов могут быть разные требования.

Итак, у меня уже есть картинка 80 х 80.
Вот она.
http://i050.radikal.ru/0802/52/6194bb1c1e8ft.jpg

Я хочу сделать на обруче у девушки бегущий блик.

Создаю новый слой. Называю его "блик 1".
Выбираю кисть, выбираю цвет.
http://i008.radikal.ru/0802/89/1a5cc84cc62dt.jpg
Прим.
Цвет для блика лучше всего брать ближайший к белому. Можно и чисто белый, но тогда ваш блик будет слишком ярким.
Мне на золотом обруче слишком яркий белый блик не нужен.
Беру светло-желтый цвет.

Шаг 2.

На слое "блик 1" кисточкой в виде звездочки рисую собственно сам блик, т.е. тыкаю кисточкой в нужное место на обруче.
Мой блик почти незаметен. Тыкаю еще раз в то же место.

А теперь делаю блику доп. акцент:
Беру Карандаш (толщиной 1 пиксель), и в центре моего блика ставлю маленькую яркую точку.
http://i033.radikal.ru/0802/fe/7d5904beb9eft.jpg
Для наглядности, я отключу картинку с девушкой и создам дополнительно чёрный фон, на нём очень хорошо будет виден мой блик.

http://i031.radikal.ru/0802/9d/2e482e27b2fdt.jpg

Шаг 3.

Создаю копию слоя с нарисованным бликом.

А теперь на этом новом слое я сдвигаю блик чуть дальше по обручу девушки.

http://i005.radikal.ru/0802/0b/76aa6745447at.jpg

Шаг 4.

Повторяю шаг 3 несколько раз.

Вот, что у меня получилось.

http://i007.radikal.ru/0802/17/fc337a18e438t.jpg

И для наглядности, проверяю на черном бэкграунде.

http://i044.radikal.ru/0802/2c/6a7ecb3c4563t.jpg

Шаг 5.

Теперь у меня есть нужное количество бликов.
Нужно заставить их двигаться!

Для этого есть программа, продукт фирмы Adobe, с полным названием Adobe Image Ready (или просто Image Ready).

НЕ ВЫХОДЯ из ФШ мы можем открыть эту программку-компаньона очень легко и быстро, при этом наш рабочий файл (.psd) автоматически переместится в эту программу, а ФШ останется пока висеть пустым.
Сделать переход можно через выпадающее меню Файл, выбрав там строку Edit Image Redy:

http://i020.radikal.ru/0802/ed/82b67b997cabt.jpg

0

3

Шаг 6.

Передо мной рабочее окно программы Имидж Реди.
Посмотрите, программа очень похожа на ФШ, плюс, тут есть дополнительный фрейм для создания анимации.
Анимация - это игра в переключение слоёв из видимости в невидимость. Сейчас я поиграю"глазками" слоёв

Самое нужное мне для анимации окно, расположено внизу.
(Если оно по какой-то причине не активировалось, нужно просто открыть его через вкладку Окна вверху программы).

Оно похоже на мини-проигрыватель, не так ли? 
Оно-то мне и нужно.
В нём уже стоит начальный первый кадр моей анимации. А в списке слоёв справа видно, какой слой входит в мой первый кадр.
В начальный слой с девушкой изначально включились все мои слои с бликами, нарисованными в ФШ, ведь переходя сюда из ФШ я не отключала слои.

http://i047.radikal.ru/0802/71/1c7a30b79396t.jpg

Отключаю ненужные слои.
Оставляю включенным в первый кадр только начальный слой с девушкой.

Шаг 7.

Теперь продолжаю, в анимационном окне создаю второй кадр анимации.
Для этого я просто нажимаю на иконку Duplicates current frame.
У меня получился кадр № 2, дубликат первого.

Далее, к этому селектированному (выделенному синеньким в окне проигрывателя) кадру №2, мне нужно добавить первый блик на обруче.
Для этого я просто включаю в видимость слой с первым бликом "блик 1"

http://i043.radikal.ru/0802/39/cb3ac9ee4dcct.jpg

Итак, кадр № 2 - это слой с девушкой + слой с бликом 1

Создаю следующий кадр, кадр № 3 тем же путем дублирования предыдущего, второго кадра.
Не забываю переключить в зону видимости СЛЕДУЮЩИЙ СЛОЙ с БЛИКом, а ненужный отключаю из видимости

http://i012.radikal.ru/0802/80/fbf21fa72231t.jpg

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

Шаг 8.

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

http://i012.radikal.ru/0802/a3/7bf00b5b2b99t.jpg

Снова проиграю свою анимацию нажатием "Play".
Мой блик слишком быстро убегает и снова появляется.
Слишком быстрая анимация напрягает глаза.

Задаю задержку на первом кадре, чтобы блик появлялся не сразу после того как добежит до конца, а немного задерживал своё появление.
Для этого у первого кадра ставлю 0,2 сек. вместо 0 сек.

http://i039.radikal.ru/0802/91/690cd1110769t.jpg

Вот, теперь порядок.

Прим.
Путём изменения задержки кадра иногда можно добиться интересных эффектов.

Анимация готова.

Шаг 9.

Возвращаюсь в ФШ при помощи того же выпадающего меню Файл

http://i033.radikal.ru/0802/59/2e2a313bda09t.jpg

Шаг 10.

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

Просто сохраняю файл следующим способом:
Файл /Сохранить для Web...

Шаг 11.

Открылось окно для редактирования файла перед последним сохранением.
Это очень нужное окно, с его помощью можно сжать файл, если он получился большим, задать ему разные необходимые параметры и т.п.

Внизу отображается расширение файла и его размер в Кб.

http://i048.radikal.ru/0802/ae/7d68eb827250t.jpg

Расширение для анимации должно быть gif.
Меняю jpg на gif в окне вверху справа.

http://i016.radikal.ru/0802/89/7dcc8e99bdf7t.jpg

Теперь, смотрю на размер моего файла.
Размер достаточно мал, а значит можно чуть-чуть улучшить картинку, например, добавив ей количество цветов.
Смотрим, где как это делается.

http://i028.radikal.ru/0802/98/663af7be6b2ft.jpg

Остановлюсь на этом. Файл вполне готов.

Нажимаю Save.
Задаю имя своего файла.
Я делаю это не вполне корректно с точки зрения компьютерной грамотности. Я обзываю файл на русском языке.
Программа НЕ считает это ошибкой, она сохранит мой файл в любом случае, НО она предупредит меня вот таким окном:

http://i034.radikal.ru/0802/fd/5af88ba90e21t.jpg

Прим.
Для файлов, выкладывемых на Интернет-ресурсы, в т.ч. на хостинги, необходимо название файла писать только латинскими строчными буквами (цифры и тире допускаются).

Всё.

http://forum.materinstvo.ru/uploads/1202468171//post-43033-1202680085.gif

0


Вы здесь » SIMS2 LOVE » Уроки по работе с PhotoShop » Создание анимированного аватара