0
Графическое представление смайла эволюционировало вместе с развитием компьютерных технологий и от кружка с двумя точками и одной кривой добралось до использования полноцветного изображения с высокой детализацией. Почему бы и нам не внести свою лепту в "смайлостроение" и не сделать свой собственный смайл образца начала 21 века? Этим и займемся.
1. Начнем с создания нового изображения. Мелочиться не будем и размер зададим 500x600 px (что-что, а уменьшить всегда успеем). Фон при помощи Paint Bucket Tool(Заливка) зальем белым.
2. Создадим новый слой (щелчок по иконке Create a New Layer(Создать новый слой) внизу панели слоев(Layers)). Теперь при помощи инструмента Ellipse Tool(Эллипс) нарисуем большой круг, такого размера, чтобы сверху и снизу осталось место (как на картинке). Напоминаю - чтобы у вас получился ровный круг держите нажатой клавишу Shift во время создания.
Переходим к заданию эффектов для слоя с получившимся кругом - двойной клик правой клавишей мыши по свободному месту справа от изображении слоя в панели слоев и в появившемся окне Layer Style(Эффект слоя) выбираем пункт Gradient Overlay(Наложение градиента). Выставляем там следующие параметры:
Для того чтобы изменить цвета градиента, кликните два раза левой клавишей мыши по полоске с градиентом и задайте градиент следующего вида:
Теперь переходим к пункту Inner Shadow(Внутренняя тень):
Следующий пункт - Inner Glow(Внутреннее свечение):
и, наконец, в пункте Stroke(Штрих) выставим такие параметры:
Градиент следующий:
Кнопкой Ok подтверждаем изменения.
Тело нашего смайла почти готово.
3. Добавим блик.
Для этого создадим новый слой и с помощью Ellipse Tool(Эллипс) разместим вот такой эллипс белого цвета:
Для этого же слоя применим маску, для чего кликните по иконке Add a mask(Добавить маску) в нижней части панели слоев. Выберите на панели инструментов Gradient Tool(Градиент) и в качестве градиента выберите переход от черного к белому. Залейте им маску, начиная с точки немного ниже нижнего края эллипса и заканчивая верхним краем (удерживайте клавишу Shift чтобы градиент был вертикальным).
Устанавливаем непрозрачность слоя примерно на 85% (Opacity(Непрозрачность)) в верхней части панели слоев.
В результате должно получиться вот так:
4. Начинаем рисовать глаза.
Для начала создадим группу в которой объединим все элементы которые будут принадлежать одному глазу. В нижней части панели слоев кликните по иконке Create a new group(Создать новую группу). Теперь на панели среди слоев появится заголовок новой группы. Двойной щелчок по названию этой группы и назначим группе более говорящее название, например "Глаз правый". Можно приступать к рисованию. Инструментом Ellipse Tool(Эллипс) нарисуйте эллипс белого цвета как на рисунке ниже. Его форму нужно немного изменить. На иллюстрации слева - исходный эллипс, правее - измененный, как он получился у меня, после правки при помощи инструмента Direct Selection Tool(Непосредственное выделение). Для наглядности на картинке приведены опорные точки и направляющие.
С формой разобрались, теперь применим эффекты для этого слоя. В окне Layer Style(Эффект слоя) выбираем пункт Drop Shadow(Отбросить тень) и устанавливаем следующие параметры:
в пункте Inner Shadow(Внутренняя тень):
в пункте Inner Glow(Внутреннее свечение):
и в пункте Stroke(Штрих):
Жмем Ок и должны получить похожую картинку:
5. Теперь нарисуем радужку глаза.
Создайте новый слой. Обратите внимание на панель слоев - предыдущий и новый слой автоматически должны располагаться в группе, созданной нами ранее (картинки изображающие слой смещены вправо относительно других слоев не принадлежащих группе; щелчок по пиктограмме в виде глаза, расположенной справа от названия группы, делает невидимыми/видимыми все слои принадлежащие группе). В любом случае, Вы всегда можете как добавить любой слой в группу, так и изъять из группы простым перетаскиванием мышью.
При помощи Ellipse Tool(Эллипс) нарисуйте кружок - основу для радужки:
Переходим к заданию эффектов. В Layer Style(Эффект слоя) устанавливаем для Inner Shadow(Внутренняя тень) следующие параметры:
в пункте Inner Glow(Внутреннее свечение):
в пункте Gradient Overlay(Наложение градиента):
используя следующий градиент:
http://rq.foto.radik...6729ca09efe.png
Завершаем нажатием на Ok. Вот результат применения эффектов:
6. Нужно нарисовать зрачок.
Создаем новый слой. Рисуем инструментом Ellipse Tool(Эллипс) кружок черного цвета внутри радужки. Зрачок готов.
7. Добавим блик.
Создаем новый слой. Рисуем белый эллипс в верхней половине радужки и заливаем его аналогичным описанному в пункте 3 способом. Устанавливаем непрозрачность слоя на 50% (Opacity(Непрозрачность)) в верхней части панели слоев. В результате должны получить следующее:
8. Брови. Создаем новый слой. Инструментом Ellipse Tool(Эллипс) рисуем эллипс. Теперь изменим его форму инструментом Direct Selection Tool(Непосредственное выделение). Передвиньте опорные точки расположенные на длинных сторонах эллипса вверх, а направляющие, расположенные по бокам, наклоните. На рисунке ниже - пример расположения опорных точек и направляющих.
Применим эффекты к получившейся фигуре. В Layer Style(Эффект слоя) выбираем пункт Gradient Overlay(Наложение градиента) и устанавливаем следующие параметры:
Градиент вот такого вида:
9. Вот мы и сделали один глаз. Остался еще один. Глаза у нас будут симметричны, поэтому мы просто сделаем копию. Проверьте чтобы все слои, использованные для построения глаза и брови, относились к группе, созданной нами ранее. Дублируем группу. Для этого правый щелчок по названию группы в панели слоев -> Duplicate Group...(Дублировать группу). В появившемся окне, для порядка, изменим предлагающийся вариант названия "Глаз правый copy" на "Глаз левый" и согласимся нажатием на Ok. Итак, несмотря на название, новая группа является копией, а значит и глаз по прежнему правый, расположеный на том же месте. Исправим это, зеркально отразив по горизонтали т.е. выполнив комманду Edit->Transform->Flip Horizontal(Правка->Трансформация->Отразить горизонтально). Теперь глаз действительно левый, осталось только поместить его на место. С помощью инструмента Move Tool(Перемещение) сдвиньте глаз влево, на положенное ему место(для того чтобы глаз не свигался выше/ниже - во время передвижения держите зажатой клавишу Shift).
10. Глаза готовы, но добавим еще пару штрихов - по еще одному блику для каждого глаза. Перейдем опять к группе "Глаз правый", щелкнув по названию группы. Инструментом Ellipse Tool(Эллипс) рисуем эллипс белого цвета - как на рисунке, поворачиваем его немного вправо (Edit->Transform->Rotate(Правка->Трансформация-Поворот>)) и устанавливаем непрозрачность слоя на 70% (Opacity(Непрозрачность)) в верхней части панели слоев. Теперь дублируем получившийся слой (Клик правой клавишей мыши на названии слоя -> Duplicate Layer(Дублировать слой)) и перемещаем эллипс с помощью Move Tool(Перемещение) на соседний глаз. Вот теперь глаза закончены.
11. Ну а теперь переходим к самому главному - улыбке (ведь на то он и смайл). Раз уж начали организовывать слои группами, давайте продолжим. Создайте еще одну группу и назовите ее "Рот" (если забыли как создавать группу - посмотрите пункт 4), и разместите ее вне уже созданных.
Рисуем прямоугольник при помощи инструмента Rectangle Tool(Прямоугольник), примерно как на картинке.
Теперь выберите инструмент Add Anchor Point Tool(Добавить опорную точку) и поставьте две новых опорных точки - по одной примерно посередине каждой из горизонтальных границ прямоугольника.
Выберите инструмент Delete Anchor Point Tool(Удалить опорную точку) и удалите опорные точки расположенные в нижних правом и левом углах. В результате должна получиться фигура похожая на приведенную на рисунке.
Инструментом Direct Selection Tool(Непосредственное выделение) передвиньте опорную точку, расположенную посередине верхней стороны фигуры, вниз, до получения формы похожей на улыбку. Нужно еще немного изменить радиус кривизны верхней и нижней части с помощью маркеров расположенных на концах направляющих.
К слою с улыбкой применим в Layer Style(Эффект слоя) один эффект - Stroke(Штрих) со следующими параметрами:
12. Нарисуем язык. Создайте новый слой и при помощи Ellipse Tool(Эллипс) нарисуйте эллипс внутри улыбки.
Инструментом Direct Selection Tool(Непосредственное выделение) немного подвиньте вниз верхнюю и нижнюю опорные точки.
Для слоя примените следующие эффекты:
Inner Shadow(Внутренняя тень):
Inner Glow(Внутреннее свечение):
Satin(Шелк):
Gradient Overlay(Наложение градиента):
со следующим градиентом:
Вот что должно получиться:
13. Добавим улыбке небольшие ямочки по краям. Нарисуйте небольшой эллипс. Инструментом Direct Selection Tool(Непосредственное выделение) измените его форму и установите непрозрачность заливки (Fill в верхней части панели слоев) на 0% :
Примените к слою эффект Bevel and Emboss(Тиснение):
http://rr.foto.radik...d44f3282d48.png
Дублируйте слой и отразите его горизонтально. Передвиньте вторую ямочку на ее место с другой стороны улыбки. Вот мы и нарисовали рот.
http://rr.foto.radik...cb21981e0d1.jpg
14. Для разнообразия добавим нашему смайлику чубчик. Создайте слой. Нарисуйте прямоугольник, нижние углы которого будут находиться на окружности ограничивающей тело смайлика.
http://rr.foto.radik...6bd1e384915.jpg
Выберите инструмент Add Anchor Point Tool(Добавить опорную точку) и поставьте одну новую опорную точку посередине нижней горизонтальной границы прямоугольника, а также пять на верхней границе.
Инструментом Direct Selection Tool(Непосредственное выделение) передвиньте опорную точку, расположенную посередине нижней стороны фигуры, вверх так, чтобы эта сторона огибала окружность тела смайла. Верхние опорные точки разведите примерно так, как показано на рисунке.
http://rr.foto.radik...cf136c87ae3.jpg
Обратите внимание - углы, вершинами которых являются добавленные нами опорные точки, являются сглаженными. Чтобы получить острый угол там где нам нужно, а именно в вершинах средних двух частей волос, нужно воспользоваться инструментом Convert Point Tool(Преобразовать опорную точку).
Работает он так:
если просто щелкнуть им по опорной точке, то она становится острой(угловой) без направляющих;
если зажать левую клавишу мыши и потянуть немного в сторону, то появятся две направляющие (с обоих сторон точки) связанные между собой (опорная точка при этом называется сглаженной);
если после получения сглаженной опорной точки тем же инструментом подвинуть маркер на одном из концов направляющих, то эта направляющая станет независимой от второй части (такая опорная точка называется острой с направляющими.
Вот такое длинное пояснение к тому как работает Convert Point. Между тем, все что нам нужно сделать - щелкнуть им по двум опорным точкам и при необходимости поправить расположение точек Инструментом Direct Selection Tool(Непосредственное выделение).
http://rr.foto.radik...0a667e0a4e7.jpg
Примените к слою следующие эффекты:
Satin(Шелк):
http://rr.foto.radik...37697855c5a.png
Gradient Overlay(Наложение градиента):
http://rr.foto.radik...8dc2882fc8a.png
со следующим градиентом:
http://rr.foto.radik...82e183fda0c.png
15. Последний штрих - тень под нашим смайликом. Создайте новый слой. Нарисуйте черный эллипс.
http://rr.foto.radik...aee6a2a818f.jpg
Растеризуйте его (щелчок правой клавишей мыши на названии слоя в панели слоев -> Rasterize Layer(Растеризовать слой)) и размойте его границы - Filter->Blur->Gaussian Blur(Фильтр->Размытие->Размытие по Гауссу), с радиусом размытия(Radius) 17px.
Установите непрозрачность слоя примерно на 70% (Opacity(Непрозрачность) в верхней части панели слоев). и разместите его позади всех остальных, кроме фонового.
http://rr.foto.radik...539c97f0a8c.jpg
В результате получили довольно симпатичного смайлика. Вы вполне можете сделать целую гамму эмоций, ведь достаточно немного изменить форму бровей, рта, глаз и/или добавить еще какие-нибудь элементы и получите совершенно другое «лицо». Ну а как использовать получившийся образ - решать Вам . Можно, например, сделать его небольшого размера, загрузить на на сервер для публикации изображений и при необходимости вставлять в Ваше сообщение Ваш собственный, эксклюзивный смайлик.
http://rr.foto.radik...fe59fb421d0.gif
Автор: Matias.
]]>http://forum.designa...p?showtopic=430]]>
Наверх
