Ещё больше уроков в нашей группе Вконтакте!





сортировать посты по: Рейтингу | Посещаемости | Комментируемые

Введите свои исправления:


Имя:
Комментарий:

Подсказка

Если Вы нашли неточность в переводе, ошибку или считаете, что содержание данного шага не совсем точное – используйте функцию «Изменить», чтобы внести свои изменения.

*Ваши изменения будут отправлены администрации на модерирование.
*Поля "Имя" и "Комментарий" не обязательны.

Прежде чем, мы начнём урок, запомните, что мы будем работать со стилями слоя. Все настройки стилей, показанные в уроке, вы должны будете применять в меню Стилей слоя
(Layer Style - Blending Options). Вот, что мы будем создавать:


Web портфолио фотографа


1. Создайте новый документ с холстом размером 766×629 пикселей и разрешением 72 dpi. Залейте фон цветом #P52513f, используя инструмент Заливка (Paint Bucket Tool). Потом примените следующие стили слоя:

Наложение узора (Режим – Мягкий свет):


Web портфолио фотографа


Обводка (Положение – Снаружи; Режим – Нормальный; Тип обводки – Цвет):


Web портфолио фотографа


2. Инструментом Прямоугольник (Rectangle Tool) создайте фигуру цветом #5d5c4b.


Web портфолио фотографа


3. К слою с фигурой примените эти стили:

Наложение узора (Режим – Наложение):


Web портфолио фотографа


Отбрасывание тени (Режим – Умножение):


Web портфолио фотографа


4. Создайте ещё один прямоугольник внутри первого тем же инструментом. Цвет - #454435. Ко второму прямоугольнику примените следующие стили:

Внутренняя тень (Режим – Умножение):


Web портфолио фотографа


Наложение узора (Режим – Наложение):


Web портфолио фотографа


5. В тёмном прямоугольнике создайте два выделения в новом слое инструментом Прямоугольная область (Rectangular Marquee Tool) и залейте их цветом #8d8b72. Можете создать выделение в слое с фигурой и залить его в новом, но создаваемая фигура обязательно должна быть в слое отдельном от предыдущей фигуры. Залить выделение можно инструментом Заливка
(Paint Bucket Tool). В результате вы должны получить ещё два прямоугольника:


Web портфолио фотографа


6. Таким же образом создайте ещё два прямоугольника цветом #61604e. К этим фигурам примените стиль Внутренняя тень (Режим – Нормальный):


Web портфолио фотографа

Web портфолио фотографа


7. Теперь нужно создать ещё несколько прямоугольных областей, которые мы будем использовать для фотографий. Результат должен быть таким:


Web портфолио фотографа


Эти области можно создать тем же инструментом Прямоугольная область
(Rectangular Marquee Tool). Залить выделение в этот раз нужно цветом #dcd3b8. Не забудьте, что выделение должно создавать в новом слое. Есть и другой метод – можете просто использовать инструмент Прямоугольник (Rectangle Tool) для создания новых прямоугольников цветом #dcd3b8. Это автоматически создаст каждую фигуру в новом слое. Далее приведены настройки стилей слоя, которые нужно применить к слоям с областями для фотографий:

Обводка (Положение – Внутри; Режим – Нормальный; Тип обводки – Цвет):


Web портфолио фотографа


Внутренняя тень (Режим – Нормальный):


Web портфолио фотографа


Теперь нужно создать горизонтальную полосу прокрутки. Цвет полосы должен быть таким же как и цвет фона, на котором она создаётся. То есть, нам фактически нужно создать тонкую рамку. Поэтому мы будем использовать инструмент Прямоугольная область
(Rectangular Marquee Tool). Этим инструментом создайте выделение в новом слое, залейте его любым цветом и установите Заливку (Fill) слоя - 0%. К этому слою примените эти стили:

Внутренняя тень (Режим – Нормальный):


Web портфолио фотографа


Наложение узора (Режим – Мягкий свет)


Web портфолио фотографа


Обводка (Положение – Внутри; Режим – Нормальный; Тип обводки – Цвет):


Web портфолио фотографа


Из-за того, что мы установили Заливку (Fill) слоя – 0%, мы получим простую рамку, а сам цвет фигуры не будет виден. Заливка (Fill) регулирует видимость самой фигуры, а Непрозрачность (Opacity) слоя регулирует весь слой, включая и стили, применённые к нему.


Web портфолио фотографа


8. Теперь инструментом Прямоугольник (Rectangle Tool) создайте небольшую полоску, как показано ниже. Это последний элемент полосы прокрутки.


Web портфолио фотографа


9. К этой маленькой полоске примените эти стили в меню Стилей слоя:

Внутренняя тень (Режим – Нормальный):


Web портфолио фотографа


Наложение узора (Режим – Наложение):


Web портфолио фотографа


10. Тем же инструментом создайте два прямоугольника на левой стороне цветом #5d5c4a.


Web портфолио фотографа


11. Инструментом Прямоугольная область (Rectangular Marquee Tool) создайте выделение и залейте его цветом #8d8b72 в новом слое. К этой фигуре нужно применить пару стилей, чтобы создать обводку и залить её полосатым узором:


Web портфолио фотографа


12. В отдельном слое инструментом Кисть (Brush Tool) обрисуйте нижнюю часть созданного прямоугольника, чтобы создать тень:


Web портфолио фотографа


13. По краям создайте выделения инструментом Прямоугольная область
(Rectangular Marquee Tool). Потом инструментом Кисть (Brush Tool) закрасьте части фигуры, вылезающие за пределы окна:


Web портфолио фотографа


14. Эту полосатую область мы будем использовать для размещения кнопок. Чтобы создать кнопки, нужно просто написать их названия инструментом Горизонтальный текст
(Horizontal Type Tool). К текстовому слою примените стиль Отбрасывание тени (Режим – Умножение):


Web портфолио фотографа

Web портфолио фотографа


15. Инструментом Линия (Line Tool) создайте разделители. Я использовал два цвета для этого. Концы линий можно немного подтереть мягким ластиком. Потом создайте ещё две горизонтальные линии, как показано ниже. Их можете обрисовать кистью с маленькой непрозрачностью, либо применить стили слоя, чтобы создать небольшое свечение вокруг них. Горизонтальные линии также можно создать инструментом Прямоугольная область
(Rectangular Marquee Tool) и залить выделения градиентом:


Web портфолио фотографа


16. Теперь напишите текст, содержащий информацию о вас, как показано ниже:


Web портфолио фотографа


17. Инструментом Прямоугольник (Rectangle Tool) создайте несколько рамок:


Web портфолио фотографа


18. К слоям с рамками примените следующие стили:

Внутренняя тень (Режим – Нормальный):


Web портфолио фотографа


19. Обводка (Положение – Внутри; Режим – Нормальный; Тип обводки – Цвет):


Web портфолио фотографа


20. Теперь создадим логотип. В новом слое создайте прямоугольник любым инструментом. Потом инструментом Свободное трансформирование (Free Transform) наклоните его. К этому слою примените стиль Отбрасывание тени (Режим – Умножение). Затем, используя инструмент Ластик (Eraser Tool), сотрите некоторые места, чтобы нарисовался узор, как показано на логотипе. То есть, мы просто стёрли часть верхнего слоя с прямоугольником и увидели цвет нижнего слоя.



Web портфолио фотографа

Web портфолио фотографа


21. Вставьте ниже показанные фотографии в наши рамки и области для фотографий:


Web портфолио фотографа

Web портфолио фотографа

Web портфолио фотографа

Web портфолио фотографа

Web портфолио фотографа

Web портфолио фотографа

Web портфолио фотографа


22. Расположите фотографию на рамке, предварительно уменьшив её, потом, удерживая Alt, кликните между слоями с фотографией и рамкой в палитре слоёв. Это ограничит фотографию пределами рамки


Web портфолио фотографа



Ссылка на источник урока

Добавление комментария

Ваше Имя

Ваш E-mail

Код:Включите эту картинку для отображения кода безопасности
обновить код

Введите код: