Дизайн ландшафтного сайта в фотошопе. Урок №5 — «Доводим композицию до совершенства»

Итак, в этом уроке мы доведем до конца нашу композицию. Сейчас мы хорошенько поработаем с тенями, рефлексами, свечением и сделаем нашу картинку более реальной.

Так, давайте приступим и начнем мы с теней. Для начала мы добавим тень нашей вот этой окружности, на которой все держится, выделяем ее и добавляем стиль слоя с тенью, делаем примерно на 18 пикселей размер, цвет темно-коричневый ближе к черному, не 18, а 15 пикселей поставим, и поставим смещение немножко на 5 пикселей непрозрачность уберем до 70%, не до 80%, и вот так оставим. Отлично. Итак, приступаем к прорисовке наших теней и объектов.

И первая у нас будет беседка. Создаем новый слой, берем инструмент «Прямолинейное лассо» и будем сейчас рисовать свет. Как мы видим источник света у нас за домом это солнце, вообразите себе, что лучи идут на беседку и представьте примерно, какая должна быть тень. Далее берем заливку темно-коричневый цвет, заливаем, теперь мы будем размывать, и делать более реальной эту тень, чем тень дальше от объекта, тем она больше размытая, чем ближе, тем четче. Берем инструмент «Размытие»и размываем. Теперь берем инструмент «Ластик», непрозрачность на 20 пикселей, размер поменьше и проходимся по тени нашей беседки, ставим на 10 пикселей и делаем вот такую вот тень, еще немного размоем. Берем инструмент «Перемещение» и подвинем немножко вниз, так отлично, тень от беседки готова. Теперь сделаем тень под самой беседкой. Для этого мы копируем слой с беседкой, зажимая Alt, нажимаем Ctrl+L, двигаем ползунок налево, нажимаем «ОК». Берем инструмент «Перемещение», перемещаем на 2 пикселя вниз, далее идем в фильтр, «Размытие», «Размытие по Гауссу» и размываем примерно на 1,5 пикселя, нажимаем «ОК». После этого берем терку и стираем всю тень сверху, оставляем только под самой беседкой, в данном случае здесь и здесь, в остальных же местах на беседке тень нам не нужна. Отлично. Теперь давайте сделаем тень для этого декоративного дерева. Создаем новый слой и делаем точно также тень как у беседки. Берем инструмент «Прямолинейное лассо», рисуем область, заливку берем, цвет темно-зеленый, переместим этот слой под сам куст и размываем, немного удаляем там, где у нас тень заканчивается дальше, тень получилась слишком зеленая, нажимаем Ctrl+L и двигаем ползунок на право. Теперь добавим тени под сам куст, для этого его дублируем, в уровнях делаем черный цвет, с помощью терки убираем не нужную нам тень, здесь у нас тень слишком яркая, немножко уберем до 90% непрозрачность. Здесь мы тень, пожалуй, сдублируем, поработаем, тень объединим. Отлично. Теперь сделаем тень у этого кустарника. В принципе можно попробовать и здесь скопировать, перенесем данный слой под правый куст, посмотрим, как у нас выглядит, здесь тень немного трансформируем примерно так, здесь тоже трансформируем примерно вот так. От правого куста зажимаем Alt, копируем, с помощью уровней меняем на черный цвет, «Размываем по Гауссу» и удаляем лишнее. Теперь добавим тень от этой насыпи, находим ее в папочки растительности, создаем новый слой и точно также рисуем тень, перенесем тень под растительность и размываем, так папку с растительностью перенесем под беседку, чтобы тень не налазила на кустарник с беседкой, тень немножко сместим вниз и сюда. Отлично. Теперь добавим тень от нашего дома. Берем инструмент «Перемещение», щелкаем по дому, нашли этот слой, создаем новый. Берем «Прямолинейное лассо» и рисуем тень, переходим на слой с тенью, листаем ее вниз, заливаем и проделываем все те же операции. Здесь у нас тень должна падать на растительность, поэтому папку с растительностью мы переносим вниз. Опять заходим в папку с домом подбираем слой с тенью и продолжаем работу. С помощью «Ластика» дальнюю тень немного убираем и снова размываем. Вот уже похоже на реальность. Теперь сдублируем эту тень и удалим лишнее. Так вот уже похоже на реальность.

Теперь следующее, что мы сделаем — это немного изменим цвет нашего водоема, сейчас у нас он голубой, а должен иметь желтоватый оттенок, так как отражает небо. Для этого мы его сначала находим с помощью инструмента «Перемещение», щелкаем по слою, затем в режиме быстрой маски с помощью «Кисточки» мы выделяем его воду, снимаем выделение, у нас водоем выделился, сейчас мы сделаем инверсию, нажимаем Ctrl+Shift+I, вызываем цветовой тон насыщенности сочетанием клавиш Ctrl + Alt + U и меняем на желтый цвет, сделаем чуть поярче, как мы видим, было голубое, а стало желтое. Также создаем новый слой, берем «Пипетку», здесь узнаем цвет, берем «Кисточку» и закрашиваем эту область, снимаем выделение, нажимая Ctrl+D, заходим в слои и ставим режим наложения на «Цветность», непрозрачность ставим на 25%, как мы видим сейчас у нас озеро приняло желтый оттенок, оттенок неба и стало более реалистичней. Отлично.

Теперь давайте нарисуем тени от этих двух кустов. Создадим новый слой, сейчас мы будем использовать инструмент «Овальную область», перенесем под первый куст и размоем, тень от первого куста готова, мы ее просто скопируем под второй, зажимая клавишу Alt, в слоях перенесем вниз под наш слой с кустом. Так, где у нас куст правый, мы видим здесь полоски. Берем ластик и удаляем их, чтобы они не портили нашу картину. Отлично. Теперь нарисуем тень от наших фонарей. Находим первый фонарь, создаем новый слой, рисуем нашу тень, выглядеть она будет примерно так. Теперь рисуем тень от среднего фонаря, направление будет немного другое. Создадим слой для этого и также уменьшим непрозрачность. Теперь нарисуем вот здесь тень, и последнюю небольшую тень от дальнего фонаря. Отлично.

Теперь мы добавим рефлексы. Рефлексы – это такое свойство текстур у некоторых объектов, например у металла, то есть они отражают цвет, который рядом. К примеру, у нас вот есть данный фонарь рядом с ним желтое небо. Фонарь у нас не будет вот здесь светло-серого цвета, а будет светло желтого, поэтому мы находим слой с фонарем, создаем новый слой, назовем его коррекция, нажимаем Alt и прикрепляем к слою с фонарем, после этого берем «Пипетку», узнаем цвет, который расположен рядом, берем «Кисточку» и закрашиваем, то же самое здесь снизу только зеленый цвет. После этого в режим «Наложения» узнаем «Цветность» и с помощью терки удаляем то, что было лишнее. Давайте сравним теперь результат, какой был до коррекции, какой стал с коррекцией, как вы видите фонарь как будто из другого места совсем, а сейчас уже совсем реальный как будто находится там. То же самое мы сделаем со всеми остальными фонарями. Рефлексы мы сделали, здесь у нас стоит немного неправильная тень, повернем ее немного направо, примерно вот так, то есть так же немного повернем налево. Отлично. Так же добавим немного рефлексов на эти кустарники, выбираем его, создаем корректирующий слой, непрозрачность уменьшаем до 40%. То же самое сделаем со вторым кустарником. Отлично. Здесь мы добавим немного зеленого цвета  и уменьшим непрозрачность до 40%. На этих кустарниках сделаем то же самое, только здесь до 30% непрозрачность, здесь у нас будет коррекция только с одной стороны. Отлично. Теперь мы добавим немного вот такого вот цвета, делается это очень просто: берем беседку, создаем слой, называем «свет», берем «Пипетку», узнаем цвет неба, затем берем «Кисточку» и проводим там, где должен падать цвет, немного «Размоем по Гауссу» и уменьшим непрозрачность, к примеру, до 40% уменьшили, делаем размер кисточки поменьше, создаем новый слой и делаем тоже самое, размываем уже поменьше, вот так вот и непрозрачность также ставим поменьше. Как мы видим, сейчас, у нас не было света, после коррекции стало свечение, довольно реальное. То же самое сделаем с деревом. Находим его, создаем слой света, здесь еще немного уменьшим, примерно так. На кустарниках сделаем то же самое.

Ну, вот в принципе, и все. Мы закончили работу над нашей композицией. Как вы видите, получилось красиво, гармонично, единственное, что стоит добавить, чтобы все объекты были примерно в одной цветовой гамме похожей на цвет неба, это один корректирующий слой поверх всех слоев, называем его коррекция, убираем желтый цвет примерно от сюда, берем «Заливку» и заливаем весь фон, после этого выбираем режим наложения «Цветовой тон» и мешаем непрозрачность до 15%, сейчас посмотрим, как было без него и как с ним стало. Как вы видите, цвета становятся ближе по гамме с таким корректирующим слоем и становятся более реальным. Отлично.

На этом мы заканчиваем работу над шапкой, над нашей композицией и уже в следующем видеоуроке мы нарисуем наш контент и футер.

На этом все. Спасибо за внимание и до встречи в следующем видеоуроке!

Пройдите курс "Профессия веб-дизайнер" за 10 дней бесплатно:



Понравилась статья?
Сделайте доброе дело — поделись ей со своими друзьями и коллегами, кликнув по всем кнопкам соц.сетей:

Нравится
comments powered by HyperComments