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





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

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


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

Подсказка

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

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

1. Создайте новый документ размером 1000×700 px и разрешением 72 dpi. При помощи инструмента Прямоугольник (Rectangle Tool) создайте фон рисунка:



Портфолио внештатного сотрудника


2. Примените для слоя стиль Наложение градиента (Layer Style - Gradient Overlay).



Портфолио внештатного сотрудника


Настройки градиента:



Портфолио внештатного сотрудника


Портфолио внештатного сотрудника


3. Выберите инструмент Прямоугольник (Rectangle Tool) и создайте заголовок сайта.



Портфолио внештатного сотрудника


4. Примените для заголовка стиль Наложение градиента (Layer Style - Gradient Overlay).



Портфолио внештатного сотрудника


Настройки градиента:



Портфолио внештатного сотрудника


Портфолио внештатного сотрудника


5. Теперь необходимо создать узор инструментом, который расположен здесь: BGPatterns. Установите по очереди нижеуказанные настройки:



Портфолио внештатного сотрудника


Портфолио внештатного сотрудника


Портфолио внештатного сотрудника


6. Создайте новый узор, перейдите в меню Редактировать>Определить узор (Edit>Define Pattern) и сохраните узор. Затем на новом слое (Create New Layer) перейдите в меню Редактировать>Выполнить заливку (Edit>Fill) и установите сохранённый узор.



Портфолио внештатного сотрудника


7. Установите Заливку (Fill) слоя - 0% и Режим наложения – Осветление основы
(Blending Mode – Color Dodge).



Портфолио внештатного сотрудника


8. Добавьте маску слоя, кликнув на иконку внизу палитры слоёв и выберите инструмент Кисть (Brush Tool) чёрного цвета, чтобы стереть части узора, выходящие за края заголовка:



Портфолио внештатного сотрудника


Портфолио внештатного сотрудника


9. Вставьте название сайта, соблюдая настройки ниже (используйте этот шрифт - font):



Портфолио внештатного сотрудника


Портфолио внештатного сотрудника


Портфолио внештатного сотрудника


10. Примените для надписи стиль Отбрасывание тени (Layer Style - Drop Shadow).



Портфолио внештатного сотрудника


Внешнее свечение:



Портфолио внештатного сотрудника


Наложение градиента:



Портфолио внештатного сотрудника


Настройки градиента:



Портфолио внештатного сотрудника


Портфолио внештатного сотрудника


11. При помощи инструмента Прямоугольник с закругленными краями (Rounded Rectangle Tool) (радиусом 20 рх) создайте кнопку меню:



Портфолио внештатного сотрудника


12. Установите Заливку (Fill) слоя - 0% и примените для кнопки стиль Внешнее свечение
(Layer Style - Outer Glow).



Портфолио внештатного сотрудника


Обводка:



Портфолио внештатного сотрудника


Портфолио внештатного сотрудника


13. Сделайте 3 копии слоя кнопки и в режиме Свободного трансформирования (Free Transform) расположите их, как на рисунке ниже:



Портфолио внештатного сотрудника


14. Напишите названия кнопок меню, располагая каждое слово на отдельном слое:



Портфолио внештатного сотрудника


Портфолио внештатного сотрудника


15. Примените для надписей стиль Внешнее свечение (Layer Style - Outer Glow).



Портфолио внештатного сотрудника


Портфолио внештатного сотрудника


16. При помощи инструмента Прямоугольник (Rectangle Tool) создайте панель сайта цветом #F5F5F5.



Портфолио внештатного сотрудника


17. Примените для панели стиль Отбрасывание тени (Layer Style - Drop Shadow).



Портфолио внештатного сотрудника


Портфолио внештатного сотрудника


18. Сделайте 3 копии последнего слоя и в режиме Свободного трансформирования
(Free Transform) расположите копии, как на рисунке ниже:



Портфолио внештатного сотрудника


19. Вставьте рисунки на созданные слои. Вы можете использовать фото, которое находится здесь


Портфолио внештатного сотрудника


20. Примените для изображений стиль Обводка (Layer Style - Stroke):



Портфолио внештатного сотрудника


Портфолио внештатного сотрудника


21. Инструментом Прямоугольник (Rectangle Tool) нарисуйте кнопку белого цвета под рисунком:



Портфолио внештатного сотрудника


22. Примените для кнопки стиль Отбрасывание тени (Layer Style - Drop Shadow).



Портфолио внештатного сотрудника


Портфолио внештатного сотрудника


23. Сделайте 3 копии слоя кнопки и инструментом Свободное трансформирование
(Free Transform) расположите их, как показано ниже:



Портфолио внештатного сотрудника


24. Вставьте названия на сделанных кнопках:



Портфолио внештатного сотрудника


Портфолио внештатного сотрудника


25. Теперь вставьте основной текст сайта. Настройки указаны ниже:



Портфолио внештатного сотрудника


Портфолио внештатного сотрудника


26. При помощи инструмента Линия (Line Tool) создайте линию под текстом цветом #6E6969.



Портфолио внештатного сотрудника


Портфолио внештатного сотрудника


27. Теперь вставьте авторское право, соблюдая настройки ниже:



Портфолио внештатного сотрудника


Портфолио внештатного сотрудника


28. Примените для надписи стиль Отбрасывание тени (Layer Style - Drop Shadow):



Портфолио внештатного сотрудника


Внешнее свечение:



Портфолио внештатного сотрудника


Наложение градиента:



Портфолио внештатного сотрудника


Настройки градиента:



Портфолио внештатного сотрудника


Портфолио внештатного сотрудника







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

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

Ваше Имя

Ваш E-mail

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

Введите код: