Дуплекс в веб-дизайне: обзор цветового тренда, который захватывает мир

uploadgrqz9pq6n6.jpg

Современный веб-дизайн наполнен цветами: от сдержанных оттенков до ярких, кричащих тонов. Встречайте: дуплекс — самый крутой цветовой стиль 2016 года.

Автор: Sean Hervo (Шон Хево)
Перевод: AIC

Чистый дуплекс и другие тональные группы

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

Дуплексом часто ошибочно называют изображения с тремя или четырьмя цветами (не спрашивайте); на самом деле такие изображения правильнее было бы называть «триплексом» и «квадроплексом» соответственно.

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

Я поиграл с некоторыми популярными черно-белыми фотографиями — такими как фото Элизабет Тейлор в заголовке (кстати, именно это фото — триплекс, остальные дуплексы).

Авраам Линкольн

Мохаммед Али

LZ 129 «Гинденбург»

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

Можно использовать эти изображения для оформления сайта или образа бренда — и они будут уместны.

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

А теперь пример настоящего сайта.

New Deal Design

За счет контраста между оттенками розового и желтого получилось очень энергичное изображение, но оно отлично работает — особенно с этими дурачащимися людьми. Я улыбаюсь всякий раз, когда смотрю на эту картинку (а ведь в этом вся суть дуплекса — вызывать улыбку).

Градиенты

Градиенты — это тоже дуплекс (или мультиплекс, в зависимости от количества цветов), но в градиенте другое распределение цветов.

По сути цвет делится на зоны, которые контролируются линией градиента или радиусом.

Градиенты часто используются в качестве фонов, но иногда их применяют для наложения (на другое изображение). Градиенты стары как мир, но в 2016 они снова в тренде.

Опять же покажу вам несколько примеров на скорую руку:

Очень базовый макет приложения с градиентным фоном

Наложение градиента на фото Дональда Трампа

Можем ли градиент сделать Дональда Трампа веселым и клевым? Задача, конечно, сложная, но градиент почти справился, невероятно!

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

Solid Giant

Snippet

В примере Snippet мы видим достаточно стандартное наложение градиента, но благодаря прохладным оттенкам сайт выглядит благонадежно и расслабленно. Эффект простой, но работает хорошо.

Solid Giant выглядит более сложно и профессионально. У меня сложилось впечатление, что дизайнер следит за трендами дизайна и способен профессионально использовать их в своей работе.

Применить эффект триплекса совсем не сложно, но он фантастически выглядит и создает отличное первое впечатление.

Fantasy Premier League

В этом примере одни и те же четыре цвета используются для оформления разных элементов страницы. Это дополняет баннеры в стиле дуплекс и привлекает внимание.

Полный текст статьи читайте на CMS Magazine