Многие люди полагают, что мир, запечатлённый в черно-белых фотографиях, не может быть столь же прекрасен, как и мир в цветных изображениях. Но это не совсем так и такие люди немного заблуждаются. Природа – пейзажи водные и лесные, пустынные и горные; простые житейские вещи, улицы, города, подземки и окружающие нас люди – на самом деле все это может выглядеть по иному и новому, хотя секрет сводится к тональностям, линиям и текстурам.

С эпохой Instagram наступило немного печальное время. Так как люди стали думать, что самое обычное превращение из цветного в черно-белое с помощью стандартных фильтров способно сделать фотографию «крутой» или «артом», или даже «высокохудожественной». Увы, но нет. Простой фильтр на такое не способен. Лучшие черно-белые изображения обрабатываются не меньше, чем цветные, к ним все также применяют огромное количество корректирующих слоев, фильтров резкости-размытости, их редактируют по маске, правят кисточками, стилями наложений слоев и прочее, и прочее. И это уже не просто ненасыщенная версия цветного изображения. Это уже новое произведение, новая композиция, имеющая свою визуальную силу, свою историю, свое влияние на наши с вами эмоции.

Попробуйте взять обычное изображение и обесцветить его. Оно будет скучным. Попробуйте его отредактировать и создать новое творение – результат вас ошеломит,  возможно, вам не захочется с ним расставаться (в зависимости от сюжета и на рабочий стол можно «повесить»).

Веб-дизайн в черно-белом

Мы уже рассказывали о том, что сочетание черного и белого с оттенками серого считается классикой стилизации в веб-дизайне и устареть не может от природы своей. Несмотря на яркие и динамические цветовые схемы, на стремление трендов  и моды привнести «оживление» в интернет, монохромные дизайны существуют и их немало. Что интересно, но черно-белые сайты способны пробудить чувства и оживить наши с вами эмоции ничуть не меньше, чем яркие и цветные проекты. Даже сложно иногда  сказать, а что действительно лучше создавать веб-дизайнеру: цветное или чёрно-белое? Одно понятно – работа с черно-белым – сложное искусство.

Вот небольшая часть интересных и красивых сайтов в черном и белом и даже с оттенками цветного. Это: mrprezident, founders, marie, theboat, flplny, eattheordinary, weareisland, heckhouse.

А еще посмотрите на работы известных фотографов, таких как BERT (QUASEBART), HUGHES LEGLISE-BATAILLE, Ansel Adams, Adam Meek, stephane, Giuseppe Milo, Emilien ETIENNE. Каждая их фотография притягивает взор пользователя, её хочется рассматривать и она не вызывает неприязни. Фантастика, но, казалось бы, у «обесцвеченной» фотографии есть свой характер.

И для примера обычная фотография, переведенная в черно-белое с помощью простого фильтра, встречающегося в разных приложениях. Это изображение «уголка Каталонии» мы и будем использовать в качестве рабочего в этом материале. Разница в качестве и игры цветотонов разительна. Возникает резонный вопрос: почему? Как же добиться того, чтобы черно-белые фотографии действительно получались ошеломляющими и их можно было смело использовать в веб-дизайне, чтобы и самому не стыдно было, и пользователям с заказчиком очень понравилось? Вот об этом и поговорим сегодня.

Секрет оттенков серого

Когда вы осуществляете конвертацию из цветного в оттенки серого, то создаете псевдоабстрактное изображение и подчеркиваете важные аспекты композиции, чего не может сделать цветная фотография. Вся работа переводится на тональность, и на первый план выходят текстуры, контрастность, графичность. По сути, черно-белому изображению и не нужно быть чем-то иным. Оно словно зарисовка момента жизни, мгновения. Иными словами, фотография не рассказывает о красоте Испании (выше на примере), но она старается передать и подчеркнуть чувства, что вас охватывают, когда вы пребываете в данном месте, настроение. Поэтому и веб-дизайны в черно-белом варианте очень влияют на эмоции людей.

Добиться такого эффекта можно, только если черно-белое изображение дополнительно отредактировать в том же Photoshop. Но редактировать тоже надо понимать как.

Изначально определите, зачем вам нужна черно-белая фотография и что вы хотите с помощью нее передать. Например, «уголок Каталонии» может предавать эмоции природного простора, красоты гор, заселенности среди гор или даже красоту неба. Много вариантов, а нужно выбрать один!

Также важно помнить, что при конвертации тональность исчезает, а светлость и насыщенность остается. То есть приближенные по оттенку цвета в черно-белом варианте будут иметь похожий серый цвет и будут уже едва различимы человеческому глазу. Поэтому ваша задача добиться того, чтобы с помощью насыщения и светлости, остаточной тональности подчеркнуть детали и образы.

В Photoshop существует много вариантов конвертации в черно-белое и каждый из них имеет свои нюансы, свои особенности. Вот и рассмотрим их.

Обесцвечивание

Открываем наше изображение и переходим в меню Изображение -> Коррекция -> Обесцветить. Это наиболее частый и первый инструмент, которым пользуются буквально все люди, когда им нужно перевести цветное и черно-белое.

Особенность инструмента в том, что свою задачу-то он выполняет, но делает это банальным удалением цвета, не учитывая при этом цветовые тона, присутствующие в изображении.

Результат – своего рода «вымытая» картинка, в которой синий и красный цвет выглядят в одинаковом сером оттенке.

Оттенки серого

Другой вариант, который также распространен и который «убивает» красоту, это режим «Градации серого» в Photoshop. Для этого переходим в Изображение -> Режим -> Градации серого.

Особенность в том, что вся информация о цвете удаляется полностью и потому даже написать поверх изображения что-то цветное не получится. Но при этом сам Photoshop даст вам об этом предупреждение.

Результат – изображение получается на удивление «размытым» слегка, проявляются артефакты, пятна. Даже создается ощущение, что будто маленькое изображение сильно увеличили и потерялось качество. По крайней мере, в нашем случае, при большом разрешении картинка выглядит именно таковой, хотя в цветном варианте фотография хорошего качества.

Что делать и как быть?

Если стандартные методы так плохи для преобразования цветного в черно-белое, то возникает резонный вопрос: как быть, и почему же у других веб-дизайнеров и художников получается найти или создать самостоятельно весьма привлекательные изображения? Некоторые ответят, что потребуется нанять профессионального фотографа, чтобы он уже с помощью фотоаппарата снял качественное изображение.

Но!

Поверьте, существует гораздо больше возможностей для качественного преобразования при пост-обработке после конвертации. И даже именитые фотографы этим увлекаются «только так». К тому же у вас при этом существует шанс сохранить оригинальную фотографию на отдельном слое или файле.

Поэтому теперь давайте посмотрим, как же действительно можно преобразовать цветное в черно-белое и создать великолепные художественные работы, которые попросту «захотят сами» оказаться в оформлении того или иного сайта.

Микширование каналов

Микширование – классный инструмент для работы именно с черно-белым. Он позволяет произвести индивидуальные настройки для каждого цветового спектра и подобрать тщательный баланс по насыщенности и светлости.

Для этого выбираем наш слой с фотографией и добавляем корректирующий слой «Микширование каналов…» внизу панели Слоев.  Устанавливаем галочку Монохромный, чтобы удобнее было подобрать наилучший контраст цветности.

Теперь можно двигать ползунки для каждого канала, увеличивая контрастность, таким образом, каким вам необходимо, затемняя или осветляя области. Например, поиграйте с небом и оттенками  дня и ночи.

Важно также следить за общим показателем «всего». Если он будет более 100%, то это значит у вас слишком много белого. Но иногда это необходимо, поэтому все зависит от вашей фантазии.

Такой вариант гораздо лучше передает «цветность», нежели использование режима Градации серого, а затем настройки яркости/контрастности.

Черное и белое

Еще один корректирующий слой – «Черное и белое» существует со времен Photoshop CS3 и способен заменить «Микширование каналов». Инструменты очень похожи друг на друга, имеются также ползунки каналов.

Особенность этого варианта – в больших по количеству цветовых настройках и дополнительных вариантах, таких, как оттенки (сепия, кинематография и пр.) Существуют готовые наборы, которые можно выбрать, подобрать и настроить при необходимости.

Карта градиента

Еще один способ преобразования цветного изображения в черно-белое – это использование градиента. Да, именно его. И это несмотря на то, что ранее мы особо не уделяли этому внимания. Но тому были, причины, ибо наши рассказы касались исключительно цветных фотографий.

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

После добавления корректирующего слоя и выбора черно-белого градиента, дважды кликаем по градиенту и в появившемся диалогом окне мы сможем отредактировать цветовые выделения этого самого градиента.

Можно выбрать простой двухцветный градиент с чисто белым и черным или необычный темно-синий, почти черный, и кремово-желтый, для придания легкой тонировки. При этом появляется еще более тонкая настройка светимости белого.

Здесь главное уследить за деталями и не пересветить, например, наши облака. В противном случае, они зальются белым и потеряются на небе, или будут не объемными, а станут обычными пятнами. Всего несколько дополнительных шагов к обычному градиенту и ваша фотография преобразовывается, становится «горяченькой» и интересной.

Важно: Карта градиента не удаляет информацию о цвете, она просто его заменяет выбранными цветами градиента. Поэтому в данном случае черный и белый заменили собой все цвета на серый оттенок той же яркости, а потому общий контраст исходной фотографии сохранился.

Разумеется, что на одном изображении сложно сразу увидеть всю разницу  в способах конвертирования цветного изображения. Тем более, что для каждой фотографии или картинки придется подобрать иногда свой метод и свои уникальные настройки.

Например, еще вариант с Обесцвечиванием и Микшированием каналов.

Так или иначе, раздумывая над передачей серых оттенков, всегда сравнивайте варианты, что у вас есть. Кликайте на глазки по несколько раз и разница будет мелькать на экране. Например, желтый не должен превращаться в темно-серый или черный.  Сейчас мы сразу можем сказать, что в случае с Микшированием появляется больше свето-тени, проявляются некоторые детали (даже порой те, что на цветном малозаметны, но которые становятся как раз таки важными в случае с черно-белым вариантом), а не просто пятнами «заливается» все изображение.

Заключение

Веб-дизайн не может существовать отдельно от иных сфер деятельности человека и в особенности от художественного искусства. Можно не разбираться в музыкальных нотах, гаммах и октавах; можно даже не увлекаться чтением или писательством. Но художественное творчество важно и очень нужное. Нужна каллиграфия, нужно умение видеть цвета и тональности, свет и тени. Во всяком случае, базовые знания и умения фоторедактирования. Зачем? Да просто потому, что за самого веб-дизайнера мало кто сможет сделать работу именно так, как нужно ему.

Требуется изображение, фотография, арт, иконка, текстура. Можно часами искать в интернете, объяснять коллеге или другу, как и что нарисовать, а можно самому сделать, как минимум «набросок» или даже полностью готовую работу и уже её использовать в своем дизайне сайта.

Создавая черно-белый дизайн сайта всегда хочется, чтобы и фотографии соответствовали настроению или наоборот задавали его. Но это настроение самой фотографии тоже нужно создать. Как? Мы рассказали выше – путем тонкой настройки цветовых каналов, настройки светимости их, выделения деталей. Именно так рождаются весьма невероятные и завораживающие черно-белые фотографии, являющиеся прекрасными сами по себе в эпоху царствования цветов и красок.