для самых маленьких, но уже немножко умных =) [показать]

сегодня мы сделаем себе аватарку - переливающееся сердечко.

внимание! этот урок написан для Photoshop CS3.

[показать]
[показать]


создаем в ФШ два файла.
большинство значений фотошоп по умолчанию выставит сам, но на всякий случай посмотрим, какими они должны быть:

1. "serdechko.psd" - 100х100 пиксел
[показать]

2. "blesk.psd" - 200х200 пиксел
все точно также, только размер 200х200 (пиксел, не сантиметров или дюймов)

~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
работаем с файлом 100х100 "serdechko.psd". часть 1-я.

устанавливаем цвета foreground желтый и background темно-красный. сознательно не даю никаких цветовых кодов - вдруг вам захочется фон других цветов =) [показать]
цвета foreground и background устанавливаются на квадратиках в свободной боковой панели. клик квадратик - и бродим по палитре, выбираем цвета. квадратик поближе - foreground, подальше - это background.

выбрав цвета, активизируем инструмент "градиент" в боковой панели. Gradient Tool (G). устанавливаем инструменту "градиент" значение "радиальный".
[показать]

устанавливаем курсор на глазок в середину. зажимаем клавишу Shift.  и тя-яянем, зажав левую кнопку, мышкой от центра в любой угол.
отпускаем левую кнопку, у нас получился красивый цветовой переход - градиент. это будущий фон. так и назовем этот слой в меню слоев F7 - "фон" (кто делал с нами "сверкающую розу", помнит, как это делается).

создаем новый слой Shift+Ctrl+N. можно вызвать меню слоев F7 и нажать иконку "создание нового слоя",
[показать]

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

называем слой "сердечко".

теперь рисуем сердечко.
не умеете рисовать сердечко?
а в Фотошопе, как в Греции - все есть. надо только знать, где.
активизируем инструмент Custom Shape Tool (U) [показать]. слева наверху выставляем ему значение "Fill pixel". рядом с этой функцией есть еще один пункт меню свойств custom shapes - для размеров и соотношений. устанавливаем, как на картинке.
[показать]

открываем библиотеку custom shapes, и там есть сердечко =) [показать].
если вдруг его нет, вы уже умеете устанавливать кисти нажатием маленькой круглой кнопочки с черным треугольником внутри.
точно такая же кнопочка есть и у библиотеки автофигур custom shapes.
жмем ее, выбираем "Load Shapes". по умолчанию фотошоп отправит нас в библиотеку автофигур на нашем жестком диске. остается только выбрать коллекцию фигур "All". и там совершенно точно есть сердечко. даже не одно. входят в комплект поставки, знаете ли =) [показать]

свойства автофигуры выбраны, значения установлены.
осталось только щелкнуть мышкой, целясь в середину картинки. цвет сердечка не имеет значения.
с остальными фигурами поиграем потом, хорошо? =) [показать]

теперь сердечко нужно отцентровать.
в верхнем меню выделяем картинку Select »» All и центруем. вот так:
[показать]
кликом мышки по любой части картинки снимаем выделение.
и идем навестить файл "blesk.psd".


~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
работаем с файлом 200х200 "blesk.psd"

устанавливаем цвета foreground белый и background - черный.

заливаем картинку белым цветом [показать]Alt+Backspace.

идем в меню Filter »» Noize »» Add Noize...
выставляем значения шума, как на картинке:
[показать]


должна получиться картинка вроде этой:
[показать]

выделяем картинку Select »» All и копируем Edit »» Copy.

щелчком по картинке снимаем выделение, и отправляемся трудиться с файлом "serdechko.psd".


~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
работаем с файлом 100х100 "serdechko.psd". часть 2-я.

мы ведь не забыли поименовать слои, правда?
находясь в слое "сердечко", выбираем инструмент выделения Magic Wand Tool (W)
[показать]

кликаем по фигурке сердечка, оно приобретает такой вид:
[показать]

помните, в буфере обмена у нас находится кусочек блеска?
вот сейчас мы его и пристроим.

в верхнем баре функция Edit »» Paste Into.

пожалуйста, обратите внимание, НЕ просто Paste, а именно [показать]Paste INTO. это важно.
меню слоев F7 теперь должно иметь такой вид:
[показать]
мы с вами создали так называемую "маску слоя". мы молодцы!

выбираем в верхнем меню File »» Save for Web&Devices.
сохраняем наше сердечко в формате *.PNG-24 и назывем файл ani_01.


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

поворачиваем кусочек шума под маской:
Edit »» Transform »» Rotate 90°.

и теперь
Save for Web&Devices в *.PNG-24 - ani_02

повторить операцию поворота. сохранить *.PNG-24 - ani_03

повторить операцию поворота. сохранить *.PNG-24 - ani_04.


сохраните все четыре файла сердечек в одной папочке, чтоб не потерялись =) [показать]

закрываем файл "serdechko.psd"


~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
для очень ленивых в этом альбоме лежат
четыре готовых файла с сердечками.
можко брать и тренироваться.
~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~

приступим к анимации.

не ищите в боковой панели Photoshop CS3 кнопочки "Edit in Image Ready". ее там нет.
этот Фотошоп все делает сам.

создаем новый файл 100х100 с известными нам значениями //см.начало урока.
называем его "animation".

по очереди открываем Фотошопом все четыре файла *.PNG наших сохраненных сердечек (ani_01, ani_02 и т.д.).

выделяем каждый Select »» All, копируем Edit »» Copy и вставляем Edit »» Paste в наш новый файл 100х100 "animation". и раз, и два, и три, и четыре. все четыре сердечка. слои F7 теперь выглядят так:
[показать]


идем в меню Windows  »» Workspace и меняем свойства на [показать]Video and Film
[показать]

в рабочем окне появится окошечко анимации, знакомое нам по Image Ready и предыдущему уроку.
пока там только один кадр-фрейм.
но мы это сейчас исправим. в маленьком окошке анимации нажмем крохотную правую верхнюю менюшку, и увидим выпадающий список. в котором выберем опцию "Make Frames from Layers" - "Превратить слои в кадры".
[показать]
оп! все получилось!

осталось только выставить время задержки, проигрыша каждого кадра:
[показать]

и приказать Фотошопу, что проигрывать эту анимацию надо "Forever" - "Постоянно"
[показать]

File »» Save for Web&Devices
[показать]

кто не умеет сам выставлять значения сохраняемых *.GIF, подсказка здесь.

вот и всё. мы сделали это =) [показать]

[показать]

*не забудьте по окончании работы в меню Windows  »» Workspace поменять свойства на Default. а то вам трудно будет найти некоторые привычные функции для редактирования фотографий и рисования статики.

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

---

Источник