Простой серый дизайн сайта
Конечный результат:
1. Создайте новый документ размером 800х800 пикселей с белым фоном. Разблокируйте фоновый слой (кликните дважды на нём) и примените к нему стиль Наложение градиента (Layer Style — Gradient Overlay):
Режим – Умножение, Стиль – Радиальный
Режим – Умножение, Стиль – Радиальный
2. Инструментом Прямоугольная область (Rectangular Marquee Tool) создайте две 1-пиксельные линии разных цветов на всю ширину холста:
3. Создайте фигуру инструментом Прямоугольник с закруглёнными краями (Rounded Rectangle Tool), потом инструментом Прямоугольная область (Rectangular Marquee Tool) обрежьте её нижнюю часть, чтобы внизу углы были острыми. Назовите этот слой “navigation”. Примениие к нему такие стили в меню Стилей слоя (Layer Style — Blending Options):
Отбрасывание тени (Режим – Умножение):
Отбрасывание тени (Режим – Умножение):
Наложение градиента (Режим – Нормальный, Стиль – Линейный):
Обводка ( Положение – Снаружи, Режим – Нормальный, Тип обводки – Градиент, Стиль – Зеркальный):
Расположите обрезанный прямоугольник, как показано ниже:
4. Создайте новый документ с прозрачным фоном размером 4х4 пикселя. Инструментом Карандаш (Pencil Tool) нарисуйте узор, показанный ниже.
5. Перейдите в меню Редактирование»Определить узор (Edit > Define Pattern) и сохраните ваш узор. Вернитесь в основной документ, сделайте выделение слоя с прямоугольником (Ctrl+Click), создайте новый слой (Create New Layer) и залейте выделение сохранённым узором, используя инструмент Заливка (Paint Bucket Tool). Установите Режим наложения этого слоя – Перекрытие (Blending Mode – Overlay) и Непрозрачность – 25%.
6. Инструментами Прямоугольная область (Rectangular Marquee Tool) и Овальная область (Elliptical Marquee Tool) создайте простое свечение на этой фигуре.
7. Добавьте заголовок сайта, логотип, слоган, навигационный текст и область поиска:
8. Инструментом Прямоугольник с закруглёнными краями (Rounded Rectangle Tool) создайте большую фигуру, как показано ниже.
9. Примените к ней такие стили слоя:
Отбрасывание тени (Режим – Умножение):
Отбрасывание тени (Режим – Умножение):
Наложение градиента (Режим – Нормальный, Стиль – Линейный):
Обводка (Положение – Снаружи, Режим – Нормальный, Тип обводки – Градиент, Стиль – Линейный):
10. Внутри большого прямоугольника создайте ещё один:
11. Примените к нему стиль Наложение градиента (Layer Style — Gradient Overlay):
Режим – Нормальный, Стиль – Линейный
Режим – Нормальный, Стиль – Линейный
12. В середине большого серого прямоугольника создайте две 1-пиксельные линии, как мы делали это ранее. Можете затереть края линий, используя маску слоя или ластик.
13. Добавьте контент:
14. Создайте ещё один прямоугольник ниже:
15. Примените к нему такие же стили, как и к большому. Потом заполните его нужным контетом:
16. Стрелки можете найти в стандартном наборе фигур. Скопируйте навигационную панель вниз и заполните её информацией футера:
Вас может также заинтересовать:
21 августа 2018
Дата анонса: 2008/01/23 Эффективное разрешение, МП: 8.1 Диагональ ЖК-дисплея, дюймы: 2.4
21 августа 2018
Дата анонса: 2009/11/10 Эффективное разрешение, МП: 10 Диагональ ЖК-дисплея, дюймы: 3
21 августа 2018
Высококачественный стандартный зум-объектив Nikon 24-85 mm f/3.5-4.5G ED-IF AF-S Zoom-Nikkor G типа включает в себя особенности улучшенных технологий: линзы из ED-стекла, суперсоставное покрытие, систему внутренней фокусировки, асферические линзы, технологию контроля расстояния и систему управления диафрагмой напрямую из камеры.