Инструменты и софт: Adobe Photoshop CS2 и Adobe ImageReady.

Шаг 1.
Надеюсь вы уже открыли свой Фотошоп? Я использую Фотошоп CS2.Смотрим скрин 1. Открываем картинку, будущий образ, (файл JPEG или Gif). Для работы нам нужно 2 открытых Окна Слои и История, если у вас они не активированы, то на верхней панельке Фотошопа жмем Окна и далее понятно.

Шаг 2.
Выбираем Инструмент Лассо, мой коллега Ядовитый советовал выделять образ кропотливо и аккуратно, я же скажу что можно и не аккуратно В общем выделяем образ примерно как показано на скрине (пунктир вокруг образа) Не страшно что останется много фона по краям образа, далее решим эту проблему. Выделили образ с помощью Лассо и жмем клавиши Ctrl+X(вырезать) (надеюсь у вас стоит латинская раскладка :))

Шаг 3.
Опять смотрим на скрин 3. После нажатия комбинации Ctrl+X Наш образ, как мы его выделили исчез не пугайтесь, он не пропал. Как указано на скрине 3 жмем в верхней панеле Фотошопа на Файл и Новый. у вас появится окно такое как на скрине. Выставляем в появившемся окне значение как указано на скрине (больше ничего не трогаем) и нажимаем Enter или Ok. Появится Окошка для вставки нового рисунка с фоном в шашку. Это признак прозрачности фона. Кликаем мышкой по пустому пространству нового окошка и Нажимаем Ctrl+V(вставить), и о чудо! появился наш вырезанный образ :). Теперь, убедитесь что все что у вас в Фотошопе совпадает со скрином номер 3. Убедились? Совпадает? Отлично. идем дальше.

Шаг 4.
На скрине 4 я уже обработал образ и удалил лишний фон, оставшийся после выделения Лассо. Как удалять я не стал описывать подробно, Взгляните на скрин 4 и вы поймете. Здесь нам помощник инструмент Ластик(1). Приближаем образ с помощью инструмента Лупа Выбираем Ластик, выставляем свойства ластика как показано на скрине 4 и потихоньку и аккуратно удаляем фон с образа(1), меняя размер ластика где надо (не в каждом месте образа можно пользоваться ластиком с размерами 9, так же как и не везде с размерами 1 удобно). Разобрались как удалить фон от образа с помощью ластика? Не забываем увеличивать образ почти максимально. Тип ластика используем Кисть. Вы наверное уже заметили не соответствие Образа на скрине 4 с исходной картинкой? я объясню. тут пошла Авторская работа, и мне просто не понравилось то что у нее болталось у бедра(2), я это стер ластиком, а так как у нее уж очень красивые бедра то и лишние ремешки пришлось удалять. Как именно я это сделал? Просто. На скрине 4 указан еще один инструмент Штамп. с помощью его и затираем ремешки на бедре. Если все сделали правильно и разобрались что к чему, должно получиться как у меня на скрине 4.

Шаг 5.
В шаге 5 вгоняем наш уже очищенный образ в нужные размеры. Но, не забываем про то, что образ должен быть плавным. Это делаем ластиком. аккуратно, эстетично и практично. на глаз. Смотрим скрин 5, на нем указан инструмент новый для вас. Два уголка скрещены. Выбираем этот инструмент. Выставляем значения как показано на скрине вверху. И зажав левую клавишу мышки, выделяем образ от верхнего левого угла к нижнему правому.

Шаг 6.
Смотрим скрин 6. Выделили образ рамкой, (новый инструмент Кадрирование. см. шаг 5) Нужно растянуть рамку так чтобы образ вошел в нее аккуратно. Далее правой клавишей мыши на выделении и жмем Кадрировать. (у меня русская версия фотошопа, если у вас Английская, то жмем что будет кроме Cancel). Должно получиться как на втором рисунке на скрине 6. Это наш почти готовый образ в размерах 81/168 пикс.

Шаг 7.
В шаге 7 я основательно поработал с образом, добавил много своего. Вы можете сделать так же. Все зависит от вашей фантазии. В шаге 7 нам нужно наложить обводку. Для начала, нажмем Файл(File) Сохранить в сеть(Safe for web) и уберем там функцию matte выставив Нет. Потом жмем Done и опять возвращаемся к нашей "мастерской" окошко образа в фотошопе. Обводку можно сделать очень просто, достаточно скопировать себе на компьютер рисунок который я представлю в конце урока. Это фон для образов в ВиВе. Далее открываем этот файл(рисунок) в фотошопе и перетаскиваем его на наш образ (уже готовый и сжатый до нужных размеров). В окне Слои наш фон должен быть самым нижним. Советую растянуть его чуть чуть. Правый клик по фону, Свободное Трансформирование. Далее удаляем этот фон так, чтобы по краю образа остался 1 пиксель.(надеюсь не нужно объяснять что такое пиксель?). Как сделать обводку понятно? Надеюсь да, если что переспросите меня в игре. На скрине 7 я перекрасил одежду девушке и добавил оружие. Чтобы перекрасить какую либо вещь на образе нужно эту вещь выделить с помощью Лассо и в верхней панели Фотошопа нажать на Изображение(Image) далее на Коррекция(вторая строчка) и Выбрать Цветовой тон/насыщенность(Hue Saturation). Теперь Переходим к анимации. С помощью Лассо, как показано на скрине 7 выделяем часть образа, на что будем накладывать анимацию. Выделили? Хорошо, теперь жмем клавиши Ctrl+Alt+J далее Enter. Должно получиться как на скрине 7. Наша выделенная часть оказалась новым слоем(2).

Шаг 8.
Смотрим скрин 8. Создаем новый слой(1) и выбираем инструмент Градиент(2) Внимательно расставляем тип Градиента и цвет как показано на скрине. Подводим курсор к ранее выделяемой части (у меня это был топ) и зажав левую клавишу мыши чуть тащим полоску по диагонали.

Шаг 9.
На скрине 9 после того как мы залили градиентом наш образ (получится черный фон с белой полоской) Новый слой который мы создавали будет выглядеть так как на скрине под цифрой 2. Чем больше будет белая полоса на черном фоне, тем больше будет блеск. После выполнения Градиента, отмечаем рабочий слой наш градиент (как у меня на скрине 9 слой выделен синем. цифра 2) и жмем клавиши Ctrl+Alt+G, должно получиться как на скрине 9. теперь черный фон и белая полоса будут только на топе. Получилось? Если да, то поздравляю, Вы неплохо владеете Фотошопом и внимательно следовали моим указаниям. Если Не получилось как на скрине, не переживайте, я тоже не с первого раза стал рисовать, попробуйте перечитать все внимательнее сначала, возможно что то Вы упустили.

Шаг 10.
Делаем все как на скрине 10. выбираем Мягкий свет (1) Рабочий слой у нас должен быть как на скрине (градиент). Теперь черный фон пропал, и топ нормальный как раньше. вот только появилась белая прозрачная полоска. Это наш блеск. Вот мы нарисовали нашу анимацию. Осталось расставить кадры. Переходим в программу Adobe ImageReady(2)