сортировать посты по: Рейтингу | Посещаемости | Комментируемые
Подсказка
Если Вы нашли неточность в переводе, ошибку или считаете, что содержание данного шага не совсем точное – используйте функцию «Изменить», чтобы внести свои изменения.
*Ваши изменения будут отправлены администрации на модерирование.
*Поля "Имя" и "Комментарий" не обязательны.
1. Создайте новый документ размером 800×800 px и разрешением 72 dpi. При помощи инструмента Заливка (Paint Bucket Tool) залейте фон цветом #111111.

2. При помощи инструмента Прямоугольник с закругленными краями (Rounded Rectangle Tool) (радиус 7 рх) создайте первичный слой кнопки меню, расположенной на заголовке сайта.






4. Тем же инструментом Прямоугольник с закругленными краями (Rounded Rectangle Tool) создайте свечение на кнопке меню. Сначало создайте зону свечения, затем, удерживая Alt, сотрите ненужные элементы.

5. Установите Заливку (Fill) слоя - 0% и примените для свечения стиль Наложение градиента (Layer Style - Gradient Overlay).




6. Используя тот же инструмент Прямоугольник с закругленными краями
(Rounded Rectangle Tool) (радиус 7 рх), создайте зону для указателя кнопок белого цвета. Затем, удерживая Alt, инструментом Прямоугольник (Rectangle Tool) сотрите ненужные элементы:
(Rounded Rectangle Tool) (радиус 7 рх), создайте зону для указателя кнопок белого цвета. Затем, удерживая Alt, инструментом Прямоугольник (Rectangle Tool) сотрите ненужные элементы:



8. Объедините в группу все слои, содержащие кнопку меню. Скопируйте группу и в режиме Свободного трансформирования (Free Transform) расположите копию, как на рисунке ниже. Примените для первичного слоя копии стиль Наложение градиента
(Layer Style - Gradient Overlay).
(Layer Style - Gradient Overlay).



Установите для свечения копии Заливку (Fill) - 0% и примените стиль Наложение градиента (Layer Style - Gradient Overlay).




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


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





12. При помощи инструмента Карандаш (Pencil Tool) (1 рх) нарисуйте символы белого цвета на кнопках, расположенных на заголовке сайта.






Для надписей “About me, Services, Gallery, Contact me” настройки стиля Обводка
(Layer Style - Stroke).
(Layer Style - Stroke).


15. При помощи инструмента Прямоугольник с закругленными краями (Rounded Rectangle Tool) (радиус 7 рх) создайте первичный слой логотипа. Удерживая Alt, инструментом Прямоугольник (Rectangle Tool) сотрите ненужные элементы, как в рисунке ниже:

16. Установите Заливку (Fill) слоя - 0% и примените для слоя стиль Наложение градиента
(Layer Style - Gradient Overlay).
(Layer Style - Gradient Overlay).







18. Создайте свечение на логотипе на новом слое (Create New Layer). Сначало с помощью инструмента Прямоугольная область (Rectangular Marquee Tool) выделите зону, показанную ниже. Затем выберите инструмент Кисть (Brush Tool) (Непрозрачность (Opacity) - 50%) и обрисуйте выделенную зону белым цветом.





20. Снова используя инструмент Прямоугольник с закругленными краями
(Rounded Rectangle Tool) (радиус 7 рх), создайте первичный слой меню поиска, расположенного на заголовке сайта. Удерживая Alt, инструментом Прямоугольник (Rectangle Tool) сотрите ненужный фрагмент на правой стороне.
(Rounded Rectangle Tool) (радиус 7 рх), создайте первичный слой меню поиска, расположенного на заголовке сайта. Удерживая Alt, инструментом Прямоугольник (Rectangle Tool) сотрите ненужный фрагмент на правой стороне.







23. Используя инструмент Карандаш (Pencil Tool) (1 рх) и цвет - #FF9E00, нарисуйте указатели возле кнопок:

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





27. При помощи инструмента Прямоугольник с закругленными краями (Rounded Rectangle Tool) (радиус 3 рх) создайте кнопку цветом #CC6600 для запуска поиска.






30. Используя инструмент Прямоугольник с закругленными краями (Rounded Rectangle Tool) (радиус 7 рх), создайте первичный слой для картинок портфолио цветом #111111.








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

35. Теперь выберите необходимые картинки, вырежьте их соответственно размерам созданных слоёв. Расположите картинки над слоями для фото. Удерживая Alt, кликните между слоями картинок и слоем для фото. Проделайте ту же операцию для каждой картинки и каждого слоя.

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






40. Снова выберите инструмент Прямоугольник с закругленными краями
(Rounded Rectangle Tool) (радиус 7 рх) и создайте специальный раздел для автора портфолио. Удерживая Alt, тем же инструментом вырежьте ненужные элементы. Цвет раздела - #333333.
(Rounded Rectangle Tool) (радиус 7 рх) и создайте специальный раздел для автора портфолио. Удерживая Alt, тем же инструментом вырежьте ненужные элементы. Цвет раздела - #333333.


41. Тот же инструмент Прямоугольник с закругленными краями (Rounded Rectangle Tool) (радиус 7 рх) поможет создать слой для фото автора портфолио. Цвет слоя - #939393.




43. Расположите фото автора над слоем для фото. Удерживая Alt, кликните между слоем для фото и слоем, содержащим фото автора.








46. Создайте новый слой (Create New Layer) и выберите инструмент Карандаш (Pencil Tool) (1 рх) для создания указателей белого цвета возле ссылок.


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

49. Добавьте маску слоя, кликнув на иконку внизу палитры слоёв, и выберите инструмент Градиент (Gradient Tool) чёрного цвета:



51. При помощи инструмента Карандаш (Pencil Tool) (1 рх) создайте вертикальные разделительные линии белого цвета:

Ссылка на источник урока
Создан: 16 октября 2009