Он-лайн аптека

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

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

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

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

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

4. Используя инструмент Прямоугольник (Rectangle Tool), создайте вертикальную полосу вдоль левой стороны фона.

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

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

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

7. Снова выберите инструмент Прямоугольник (Rectangle Tool) и разделите фон на 2 половины:

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

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

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

10. Примените для элемента стиль Внутреннее свечение (Layer Style - Inner Glow):

Тиснение:

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

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

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

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

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

13. Создайте новый слой (Create New Layer) и выберите инструмент Кисть (Brush Tool) для создания тени под капсулой.

14. Далее выберите 2 инструмента для затемнения нижней части капсулы. Для начала выберите инструмент Прямоугольник (Rectangle Tool) и создайте чёрный прямоугольник над поверхностью капсулы, затем, удерживая Alt, инструментом Эллипс (Ellipse Tool) вырежьте отверстие на капсуле. Форму отверстия подкорректируйте инструментом Преобразовать точку привязки (Convert Point Tool).

15. Удерживая Alt, кликните между слоем отверстия и слоем капсулы, чтобы получить нужный эффект затемнения капсулы.

16. Сделайте другую копию капсулы и расположите её над всеми слоями. Удерживая Alt, инструментом Прямоугольник (Rectangle Tool) вырежьте копию в середине.

17. Примените для копии стиль Внутреннее свечение (Layer Style - Inner Glow).

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

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

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

19. Для вашего удобства, объедините в группу все слои, составляющие капсулу и её отражение, тень и затемнение. Перейдите к созданию кнопок, расположенных на меню заголовка сайта. Следует разместить кнопки ниже упомянутой группы. При помощи инструмента Прямоугольник (Rectangle Tool) создайте кнопку.

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

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

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

21. Скопируйте последний слой и в режиме Свободного трансформирования (Free Transform) расположите копию, как в следующем рисунке. Измените настройки копии (нам необходимо расположить слой копии ниже предыдущей).

22. Нам следует изменить нижеуказанные настройки, а остальные из них останутся такими же. Примените для копии стиль Наложение градиента (Layer Style - Gradient Overlay).

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

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

24. С помощью инструмента Прямоугольник (Rectangle Tool) нарисуйте тонкую полосу на нижней части рисунка, цветом #E3E3E3.

25. Создайте новый слой (Create New Layer) и при помощи инструмента Карандаш (Pencil Tool) нарисуйте указательную линию цветом #C6C6C6 и расположите её выше последней созданной полосы.

26. Кликните на начало линии, затем нажмите на клавишу Shift и кликните на конец линии.

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

28. Создайте новый слой (Create New Layer), выберите инструмент Карандаш (Pencil Tool) разных размеров и нарисуйте окно поисковой системы - 4 рх для контура и большой размер для внутренней зоны.

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

30. Примените для кнопки стиль Внутреннее свечение (Layer Style - Inner Glow).

31. А также напишите логотип сайта. Настройки для “Online”:

Настройки для “Pharmacy”:

Настройки для “all you need for your health”:

32. Добавьте названия кнопок меню, расположенных на заголовке сайта. Настройки для “Home”:

Настройки для “About Us, Price List, Contact Us”:

33. Теперь необходимо вставить соответствующие надписи в систему поиска. Настройки для “Search”:

Настройки для “Go”:

34. Вставьте названия разделов сайта. Настройки для “Welcome, Special”:

Настройки для “to our store, offers”:

35. Заполните раздел сайта соответствующим текстом. Настройки для выделенного текста:

Настройки для основного текста разделов:

36. Затем вставьте надписи на нижнюю панель, соблюдая указанные настройки: