1 / 8

Технология создания gif-анимации в Photoshop или  ImageReady .

Технология создания gif-анимации в Photoshop или  ImageReady. Создание аватарок для Web -страниц. Что такое аватар ?.

Download Presentation

Технология создания gif-анимации в Photoshop или  ImageReady .

An Image/Link below is provided (as is) to download presentation Download Policy: Content on the Website is provided to you AS IS for your information and personal use and may not be sold / licensed / shared on other websites without getting consent from its author. Content is provided to you AS IS for your information and personal use only. Download presentation by click this link. While downloading, if for some reason you are not able to download a presentation, the publisher may have deleted the file from their server. During download, if you can't get a presentation, the file might be deleted by the publisher.

E N D

Presentation Transcript


  1. Технология создания gif-анимации в Photoshop или  ImageReady. Создание аватарок для Web-страниц

  2. Что такое аватар? • Аватар — картинка размером 100×100 (120×120, 80×80, 64×64 и др.), которую обычно используют на форуме, блоге или дневнике в своем профиле в качестве юзерпика. Аватары бывают статическими(без анимации) и анимированными. Для создания аватар лучше всего использовать PhotoShop (для статических) и ImageReady (для анимированных).

  3. Для того, чтобы создать анимацию, нужно выбрать рисунок, который вы будете анимировать. • Открыть его с помощью Photoshop, версия CS2 или ранее. • Создать анимацию в AdobePhotoshop CS3 ещё можно, а вот при редактировании уже созданной картинки с анимацией возникают некоторые сложности, например, при открытии готовой GIF-анимации программа заменяет прозрачный фон белым.

  4. Прежде, чем начать что-нибудь с ним делать , выбрать инструмент Image-Mode-RGB Color. • Скопировать изображение на несколько слоев. Движение-это смена картинок, в каждой из которой что-нибудь изменяется. Необходимо на каждом слое с помощью инструментов выделения выделить тот участок изображения, который хотим изменить.

  5. Изменение производим с помощью свободной трансформации. • Таким образом получается несколько слоев, на которых можно проследить покадровое движение. • Переходим в Adobe Image Ready. • Чтобы отобразить на рабочем столе программы, необходимо выполнить команду меню Window → Animation (Окно → Анимация).

  6. Теперь необходимо на раскадровку поместить слои в той последовательности, каким мы хотим видеть анимацию. Для этого нажимаем кнопку добавить слой, а в поле слоев оставить видимым только необходимый кадр. И так повторять, пока не поместим все необходимые слои.

  7. Для запуска анимации необходимо установить время для смены кадров. • Анимация готова! Осталось сохранить и оптимизировать файл. Для этого нужно воспользоваться командой меню File → SaveforWeb & Devices... (Файл → Сохранить для веб и устройств...) и в диалоговом окне выбрать 4-Up. Теперь можно, подбирая разные параметры, сразу посмотреть общий вес картинки и то, как она будет выглядеть.

  8. Анимация готова! Теперь можно вставлять её в сайт!

More Related