6 классических схем для сочетания цветов на цветовом круге

Ссылки, описания, дополнительная информация для моих уроков на YouTube
Canonical Link
Аватара пользователя

Автор темы
aeplug
Санта
Санта
Сообщения: 2802
Зарегистрирован: 18 мар 2016 23:20
Откуда: С Ютуба
Благодарил (а): 18 раз
Поблагодарили: 274 раза

6 классических схем для сочетания цветов на цветовом круге


Теги:

Сообщение aeplug » 13 май 2016 01:21

Каждому дизайнеру нужно хотя бы раз ознакомиться с понятием цветового круга - волшебного инструмента для составления красивых и гармонично выглядящих композиций. Давно уже подмечено, что человеческий глаз большинства людей определённые сочетания цветов воспринимает гораздо лучше, чем другие. Результатом исследований в данной области и стал цветовой круг. Зная несколько простых схем и умея пользоваться таким кругом, даже новичок сможет быстро подобрать цвета, которые не вызовут у зрителя противоречивых чувств при просмотре.
Цветовой-круг.jpg
Цветовой-круг.jpg (75.84 КБ) 18220 просмотров
Цветовой-круг.jpg
Цветовой-круг.jpg (75.84 КБ) 18220 просмотров

Вот шесть основных схем цветовых сочетаний, которые вы можете начать использовать уже сейчас:

1. Монохроматические цвета (Monochromatic)
1 Monochromatic.jpg
1 Monochromatic.jpg (43.76 КБ) 18221 просмотр
1 Monochromatic.jpg
1 Monochromatic.jpg (43.76 КБ) 18221 просмотр

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

2. Аналогичные цвета (Analogous Colors)
2 Analogous.jpg
2 Analogous.jpg (49.19 КБ) 18221 просмотр
2 Analogous.jpg
2 Analogous.jpg (49.19 КБ) 18221 просмотр

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

3. Триады (Triads)
3 Triadic.jpg
3 Triadic.jpg (53.74 КБ) 18221 просмотр
3 Triadic.jpg
3 Triadic.jpg (53.74 КБ) 18221 просмотр

Контрастная яркая схема их трех цветов с одинаковым расстоянием между друг другом на круге.

4. Дополняющие цвета (Complementary Colors)
4 Complementary.jpg
4 Complementary.jpg (56.82 КБ) 18221 просмотр
4 Complementary.jpg
4 Complementary.jpg (56.82 КБ) 18221 просмотр

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

5. Расщепленные дополняющие цвета (Split Complementary Colors)
5 Split Complementary.jpg
5 Split Complementary.jpg (61.5 КБ) 18221 просмотр
5 Split Complementary.jpg
5 Split Complementary.jpg (61.5 КБ) 18221 просмотр

Более сложный вариант комплиментарной схемы, где вместо одного из цветов на противоположном конце берутся два по соседству. Более мягкая и разнообразная.

6. Прямоугольная схема (Tetradic Colors)
6 Tetratic.jpg
6 Tetratic.jpg (77.38 КБ) 18221 просмотр
6 Tetratic.jpg
6 Tetratic.jpg (77.38 КБ) 18221 просмотр

Схема, состоящая из двух комплиментарных. Может быть выполнена в виде квадрата (равноудаленные цвета) или прямоугольника. Рекомендуется один цвет выбирать в качестве доминирующего.

Больше информации с примерами вы может найти в этом видео: Мастер-класс "Понимание цвета" Understanding Color
https://www.youtube.com/watch?v=wuCEHnw2N4g
Еще одно полезное видео: Построение композиции
https://www.youtube.com/watch?v=izKlGmEZHAM


Видео уроки для After Effects http://www.youtube.com/AEPlug
Платные консультации по работе в программах

Теги:


Аватара пользователя

Автор темы
aeplug
Санта
Санта
Сообщения: 2802
Зарегистрирован: 18 мар 2016 23:20
Откуда: С Ютуба
Благодарил (а): 18 раз
Поблагодарили: 274 раза

Полезные онлайн сервисы для работы с цветовыми схемами

Сообщение aeplug » 13 май 2016 21:34

Несколько инструментов для подбора цветов с использованием цветового круга, которые доступны прямо из вашего браузера.
Цветовой круг | Цветовые схемы - Adobe Color CC
https://color.adobe.com/
Наверное самый известный сервис от компании Adobe с некоторыми элементами интеграции в его облачные сервисы. Ранее был известен под именем Kuler.
Adobe Color.jpg
Adobe Color.jpg (71.6 КБ) 18210 просмотров
Adobe Color.jpg
Adobe Color.jpg (71.6 КБ) 18210 просмотров


ColorScheme.Ru — Цветовой круг он-лайн: Подбор цветов и генерации цветовых схем
http://colorscheme.ru/
Интересный сервис в русском сегменте интернета с множеством настроек, предпросмотром на web странице и неплохими параметрами экспорта.
colorscheme.jpg
colorscheme.jpg (56.09 КБ) 18210 просмотров
colorscheme.jpg
colorscheme.jpg (56.09 КБ) 18210 просмотров


Paletton - The Color Scheme Designer
http://paletton.com/
Просто еще один :)
paletton.jpg
paletton.jpg (47.56 КБ) 18210 просмотров
paletton.jpg
paletton.jpg (47.56 КБ) 18210 просмотров



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

Color Palette Generator: Automagically create a color palette from any photo.
https://bighugelabs.com/colors.php
bighugelabs.jpg
bighugelabs.jpg (40.57 КБ) 18210 просмотров
bighugelabs.jpg
bighugelabs.jpg (40.57 КБ) 18210 просмотров


Create Natural Palettes from Images - Color Palette Generator
http://palettegenerator.com/
palettegenerator.jpg
palettegenerator.jpg (51.33 КБ) 18210 просмотров
palettegenerator.jpg
palettegenerator.jpg (51.33 КБ) 18210 просмотров


Color Palette Generator
http://www.degraeve.com/color-palette/
degraeve.jpg
degraeve.jpg (25.5 КБ) 18210 просмотров
degraeve.jpg
degraeve.jpg (25.5 КБ) 18210 просмотров


Pictaculous - A Color Palette Generator
http://www.pictaculous.com/
pictaculous.jpg
pictaculous.jpg (33.73 КБ) 18210 просмотров
pictaculous.jpg
pictaculous.jpg (33.73 КБ) 18210 просмотров


Color palette generator
https://www.canva.com/color-palette/
Еще один онлайн-генератор палитры на основе загруженного изображения. Перетаскиваете любую фотку — получаете 5 цветов в виде hex-кода.
Color palette generator.jpg
Color palette generator.jpg (58.65 КБ) 13828 просмотров
Color palette generator.jpg
Color palette generator.jpg (58.65 КБ) 13828 просмотров


PALETTE GENERATOR
https://learnui.design/tools/data-color-picker.html
PALETTE GENERATOR.jpg
PALETTE GENERATOR.jpg (17.89 КБ) 12440 просмотров
PALETTE GENERATOR.jpg
PALETTE GENERATOR.jpg (17.89 КБ) 12440 просмотров

Генератор палитр между двумя крайними цветами.

Google Art & Culture Experiment - Art Palette
https://artsexperiments.withgoogle.com/artpalette/
Google Art Palette.jpg
Google Art Palette.jpg (41.26 КБ) 12028 просмотров
Google Art Palette.jpg
Google Art Palette.jpg (41.26 КБ) 12028 просмотров

Еще один сервис от Google, позволяет загружать изображения и показывает похожие по цвету.
Видео уроки для After Effects http://www.youtube.com/AEPlug
Платные консультации по работе в программах

Аватара пользователя

Автор темы
aeplug
Санта
Санта
Сообщения: 2802
Зарегистрирован: 18 мар 2016 23:20
Откуда: С Ютуба
Благодарил (а): 18 раз
Поблагодарили: 274 раза

Популярные готовые схемы

Сообщение aeplug » 13 май 2016 21:48

А если совсем не хочется заморачиваться, то на многих подобных сайтах можно ознакомиться с популярными подборками, подготовленными и сохраненными другими дизайнерами. Например вот так это выглядит на сайте Adobe https://color.adobe.com/ru/explore/ Просто выбираете самую приглянувшуюся и используете в своем проекте.
Adobe Color Popular.jpg
Adobe Color Popular.jpg (122.79 КБ) 18205 просмотров
Adobe Color Popular.jpg
Adobe Color Popular.jpg (122.79 КБ) 18205 просмотров

Для After Effects существует специальный скрипт Ray Dynamic Color, который облегчает подбор и работу с цветами. А за счет выражений даже создается возможность их быстро менять во всем проекте за пару щелчком мыши.
Обзор Ray Dynamic Color для After Effects
https://www.youtube.com/watch?v=lahk5dRw8uM
Видео уроки для After Effects http://www.youtube.com/AEPlug
Платные консультации по работе в программах


ddd
Не Нуб
Не Нуб
Сообщения: 33
Зарегистрирован: 06 май 2016 01:14
Благодарил (а): 7 раз

Re: 6 классических схем для сочетания цветов на цветовом круге

Сообщение ddd » 23 май 2016 14:35

aeplug писал(а):Источник цитаты Каждому дизайнеру нужно хотя бы раз ознакомиться с понятием цветового круга

Звучит как «Каждому хирургу нужно хотя бы раз ознакомиться с понятием скальпеля». Куда мы катимся…

Вот, обязательно к регулярному чтению, пока наизусть не выучится — Иоханнес Иттен «Искусство цвета».
Лучше брать книгу, там постарались с точностью цветов, а сканы в интернете — уже не то.

А то у нас «дизайнером и фотографом может быть каждый». :o ;)

Аватара пользователя

Автор темы
aeplug
Санта
Санта
Сообщения: 2802
Зарегистрирован: 18 мар 2016 23:20
Откуда: С Ютуба
Благодарил (а): 18 раз
Поблагодарили: 274 раза

Полезные ссылочки

Сообщение aeplug » 31 май 2016 08:49

Крутая шпаргалка по сочетанию цветов
http://infogra.ru/design/krutaya-shparg ... yu-tsvetov
Видео уроки для After Effects http://www.youtube.com/AEPlug
Платные консультации по работе в программах


Вернуться в «Мои уроки»

Кто сейчас на конференции

Сейчас этот форум просматривают: нет зарегистрированных пользователей