| Главная » Статьи » Веб-дизайн |
Шапка сайта
Конечный результат: Изменить  Шаг 1 Создайте новый документ размером 540х350 пикселей. Установите цвет заливки - #372819 и залейте фон (Alt+Backspace). Изменить  Шаг 2 Создайте новый слой (Create New Layer) и назовите его "Header Background”. Инструментом Прямоугольная область (Rectangular Marquee Tool) создайте выделение на всю ширину холста высотой 185 пикселей. Изменить  Шаг 3 Установите цвета по умолчанию (D) и залейте выделение чёрным цветом (Alt+Backspace). Потом уберите выделение (Ctrl+D). Изменить  Шаг 4 Теперь нам понадобится узор для оформления шапки (можете скачать его здесь). Перейдите в меню стиля Наложение узора (Layer Style - Pattern Overlay) и загрузите нужный узор: Изменить  Шаг 5 Установите Режим – Свечение Изменить  Шаг 6 Параметры наложения – понизьте Заливку до 0%. Изменить  Шаг 7 Стиль Внутреннее свечение (Режим – Затемнение основы, Метод - Мягкий): Изменить  Вы заметите, что на слое появилась иконка стилей: Изменить  Шаг 8 Создайте новый слой "Red Bar” и инструментом Прямоугольная область (Rectangular Marquee Tool) создайте выделение на всю ширину холста высотой 45 пикселей. Залейте его цветом #88160F и снимите выделение (Ctrl+D). Изменить  Шаг 9 Примените следующие стили к слою с красным прямоугольником: Наложение узора (Режим – Затемнение основы, Узор – "Sparse Basic Noise” из набора "Texture Fill 2”): Изменить  Наложение градиента (Режим – Нормальный, Стиль – Линейный): Изменить  Обводка (Положение – Снаружи, Режим – Нормальный, Тип обводки – Цвет): Изменить  У меня на картинке двойная обводка. Её я создал при помощи инструмента Горизонтальная строка (Single Row Marquee Tool). Шаг 10 Сделайте копию слоя "Red Bar” и инструментом Перемещение (Move Tool) переместите полоску в верхнюю часть холста. Изменить  Шаг 11 Добавим тень под нижнюю красную полоску. Создайте новый слой "Red Bar Shadow” над слоем "Header Background”. Выберите инструмент Градиент (Gradient Tool) и настройте, как показано ниже. Сделайте короткую заливку от нижней полоски линии вниз. Изменить  Шаг 12 Создайте такую же тень под верхней красной полоской. Можете просто скопировать слой с тенью. Потом установите Заливку (Fill) обоих слоёв тени – 80%. Изменить  Шаг 13 Теперь при помощи градиентной заливки создадим свечение. Создайте новый слой над слоем "Header Background” и назовите его "Header Glow”. Настройте градиент, как показано ниже: Изменить  Шаг 14 Выполните заливку, как показано ниже, и не переживайте если градиент выходит за границы шапки. Изменить  Шаг 15 Сделайте выделение слоя "Header Background” и к слою "Header Glow” добавьте слой-маску (Layer Mask). Изменить  Шаг 16 Понизьте Заливку (Fill) слоя с градиентом до 30%. Изменить  Финальный результат: Изменить | |
| Просмотров: 993 | Рейтинг: 0.0/0 |
| Всего комментариев: 0 | |
