Сайт адаптирован под браузеры Opera и Mozilla Firefox. Во всех остальных браузерах этот сайт может показываться не коректно. Приносим свои извинения за неудобства.
Для этого урока мы использовали: изображение стеклянной лестницы (фото Chris Borrell) и Векторные кисти набор #2 от PAULW. Скачать кисти Abstract - Vector brushes 2 можно здесь: Скачивание с нашего сервера доступно только зарегистрированным пользователям
Скачать изображение можно здесь: Скачивание с нашего сервера доступно только зарегистрированным пользователям
Шаг 1 – создаем фон: Открываем новый документ 750 на 550px. Заливаем фон цветом #41432B.
Шаг 2a - регулируем настройки Кистей: Откройте Brush Palette (Палитру Кистей), нажав F5. Проверяем настройки в Shape Dynamics, Scattering и Other Dynamics (Динамика Формы, Рассеивание и Другая Динамика). В «Динамика Формы» выставляем значения, показанные ниже:
Шаг 2c - регулируем настройки Other Dynamics (Другая Динамика): Выставляем значения как в примере ниже. Эти параметры создают двойную форму кисти и рассеивание мазков вокруг курсора в процессе рисования.
Шаг 3a – красим Shapes: Создайте новый слой и назовите его «Фигура 1». Устанавливаем цвет foreground (переднего плана)#48180A и выбираем Brush 4 (из нового архива). Рисуем подобно примеру ниже. Нет никакого правила, как красить кистью, все рисуем произвольно.
Шаг 3b: Создайте другой новый слой выше предыдущего и назовите «Фигура 2». Устанавливаем цвет foreground #EEF4DA и выбираем Brush 25. Рисуем этой кистью как в шаге 3a. Возможно, вы захотите уменьшить кол-во сгенерированных форм и выделить центр более ярким цветом.
Шаг 4 - группируем слои: Создайте новую папку (Create a new group) и назовите «Узор». Перемещаем слои «Фигура 1» и «Фигура 2» в эту папку. Проведите белую вертикальную линию в 2px, как в примере ниже. Это определит справа пустую область, где вы позже сможете добавить текст.
Шаг 5 - маскируем Группу: Используя инструмент Rectangular Marquee tool, выделяем левую часть холста, ограниченную белой линией. Выберите папку «Узор» и создайте маску слоя с загруженным выделением (левой части).
Шаг 6a – добавляем лестницу:
Выделяем часть изображения лестницы, используя инструмент Pen tool. Нет необходимости точно очерчивать контур. Разместите слой «Лестница» в папке «Узор» и выровняйте изображение, как в примере:
Шаг 6b -
В слое «лестница» идем Image > Adjustments > Levels (Изображение > Регулировка > Уровни). Устанавливаем значения 60, 1, 180. Это должно увеличить контраст изображения.
Шаг 6c - Меняем Blending Mode (Режим смешивания) слоя «лестница» на Multiply (Умножение). Разместите слой выше слоя «Фигура 2».
Шаг 7 - добавляем больше деталей:
Повторяем Шаги 6a, b и c, чтобы вставить в проект больше деталей. Возможно, понадобится изменить значения Непрозрачности и Уровней, чтобы достичь лучших результатов.
Шаг 8 – рисуем прямоугольники: Рисуем на разных слоях цветную навигацию сайта. Цвета, которые я использовал (сверху вниз) - #4C0C02, #A3CA9D, #3B2F19 и #000000.
Дополнение: Макет сайта готов. Теперь вы можете добавить текст различного размера и непрозрачностью. Я предлагаю использовать пиксельные шрифты, так как они лучше сочетаются с данным проектом. Шрифт, который я использовал, называется Visitor.
