Палитра из картона своими руками. Создание цветовой палитры: инструменты и ресурсы. Основные свойства палитры
Цвета для веб делаются при помощи сочетаний красных, зелёных и синих оттенков, этот способ сочетания цветов называется RGB (Red Green Blue).
Каждый цвет представлен целым числом от 0 до 255, и у каждого цвета есть значение для красного, зеленого и синего. Черный, например, не имеет никакого тона, и в RGB он обозначается как 0, 0, 0. Первая цифра всегда означает значение красного цвета, вторая-зелёного и третья-синего.
Поскольку есть 256 разновидностей каждого оттенка, cуществует и 16 миллионов всевозможных цветовых комбинаций RGB. Большинство компьютеров на сегоднешний день может точно отображать все эти 16 миллионов оттенков цветов. Есть так называемые «безопасные цвета», о необходимости их использовать мы уже писали здесь.
При указании цвета Вы можете употреблять значение RGB или же шестнадцатеричную систему HEX. Цвета HEX обозначаются шестью цифрами, перед которыми стоит знак #. HEX состоит из комбинации чисел и букв; 0- самое маленькое значение, FF (255) — самое высокое. Каждый из этих шести знаков в HEX соответствует числам в кодировке RGB. Черный цвет имеет значение HEX #000000.
147 цветов определяются по названию для HTML и CSS согласно w3schools.com. Есть 17 стандартных цветов — морская волна (aqua), чёрный (black), синий ( blue), фуксия (fuchsia), серый (gray), серый (grey), зелёный (green), лайм (lime), тёмно-бардовый (maroon) , тёмно-синий (navy), оливковый (olive), пурпурный (purple), красный (red),серебряный ( silver), сине-зелёный (teal), белый ( white) и жёлтый (yellow). У каждого цвета есть своё определенный RGB и значение HEX . У тёмно-бардового, например, есть значение RGB 128, 0, 0 а значение HEX #800000; у серебристого — 192, 192, 192 или #C0C0C0.
Что нужно для создания палитры цветов
Вполне очевидно, что вы не сможете реализовать полноценный стоящий проект, используя всего пять HEX кодов веб-цветов. Вам нужен более широкий набор элементов для создания идеального работающего прототипа.
Давайте разделим нашу палитру на три группы.
Оттенки серого
Тексты, панели инструментов, фоны и др. – в большинстве интерфейсов почти всегда они серые.
Не исключено, что в вашем случае понадобится намного больше вариантов серого. Поначалу кажется, что 3-4 — это более, чем достаточно, однако вскоре вам захочется, например, добавить элемент чуть темнее №2, но немного светлее №3 и т.п.
Практика показывает, что для полноценного результата будет достаточно 8–10 сероватых оттенков — это не так много, дабы вы ударялись в крайности и мучились при выборе, но в то же время вполне достаточно, чтобы не так часто идти на компромиссы.
Как правило, чистый черный выглядит немного неестественно, советуем начинать с самого насыщенного темно-серого, а затем шаг за шагом переходить к белому.
Основной цвет(а)
В большинстве сайтов будет достаточно двух базовых цветов, которые по сути, и формируют общий вид интерфейса – так Facebook ассоциируется у нас с синими оттенками, хотя в действительности в дизайне там чаще встречаются серые.
По аналогии с предыдущим пунктом дабы сделать хорошую цветовую палитру вам потребуется 5–10 вариантов, дающих бОльший выбор при проектировании внешнего вида: оттенки посветлее можно применять в качестве фона для оповещений; в то время как темные прекрасно подойдут для оформления текстов.
Цвета для акцентов
Кроме базовых, любому веб-интерфейсу требуется несколько визуальных «акцентов», позволяющих обращать внимание на ту или иную важную информацию. Вы можете использовать такие привлекающие внимание решения, как цвет морской волны, розовый, желтый и др.:
Вам также понадобятся способы демонстрации определенных событий и состояний. Допустим, красным будете выделять важную/критичную информацию и сообщения о возможных опасных последствиях выбираемого действия:
…желтый (по аналогии со светофором) будет предупреждать посетителей:
…а с помощью зеленого сможете выделить положительную динамику:
Хотя в пользовательском интерфейсе эти цвета должны применяться довольно умеренно, вам желательно проработать по несколько оттенков каждого из них.
Если при разработке сайта/приложения вам надо создать цветовую палитру для классификации или различения похожих объектов (календарных событий, тегов, линий графиков и т. д.), то, возможно, вам потребуется больше акцентов. При создании сложных или нестандартных UI-интерфейсов нередко берется до 10-ти различных цветов с 5-10 полутонами у каждого.
4. Adobe Color CC
Этот инструмент считается одним из лучших для выбора цветовых подборок. Он позволяет не только создавать собственные схемы, но и вдохновляться работами других. Для создания палитры необходимо выбрать оттенок на колесе (или на изображении) и применить правила гармонии цветов. Например, последовательные, монохромные или оттенки выбранного вами цвета.
Недавно инструмент обзавелся новой функцией. Она подскажет, подойдут ли выбранные цвета для людей, страдающих дальтонизмом, и можно ли использовать их в качестве фона для текста.
6 основных советов по работе с цветом в презентациях PowerPoint
Правильная цветовая гамма — один из аспектов успешной презентации, ведь когда упаковка проекта выглядит органичной и привлекательной, то сами тексты и информация в презентации воспринимаются намного лучше и проще. Чтобы создать профессиональные и чистые презентационные слайды, жизненно важно использовать правильную цветовую гамму.
1. Придерживайтесь одной цветовой схемы
Для упрощения поиска идеального сочетания цветов уже было разработано несколько принципов подбора цветовых схем. Одна из самых простых — это Монохромная цветовая схема, которая предполагает использование различных оттенков одного цвета. Все оттенки отлично сочетаются друг с другом и создают успокаивающий эффект.
В этой презентации мы использовали коричневый цвет в качестве основного цвета, сочетая его с белым, серым и черными элементами. Такой прием помог создать дополнительный акцент на фотографиях продукции.
Также существует аналоговая цветовая схема, в которой используются родственные цвета, то есть те, что расположены в цветовом круге рядом друг с другом. Выбираем один доминирующий цвет и используем один-два дополнительных цвета.
В презентации для VR MED мы выбрали именно такую цветовую схему, создав слайды в сочетании синего и зеленого цветов.
И третья популярная цветовая схема — Комплементарная, основанная на использовании контрастных (противоположных) цветов. Такую схему чаще всего берут для привлечения внимания и выделения контрастных деталей.
Пример такой цветовой палитры можно найти в нашей презентации для компании «Гидроснаб». В качестве основных цветов выбрали желтый и синий цвета, которые расположены на противоположных сторонах цветового круга.
№2 Придерживайтесь простых цветовых гамм
Если вы не опытный дизайнер, то создавайте простые цветовые схемы. Монохромная цветовая схема является хорошей отправной точкой для новичков, так как в ней очень сложно ошибиться, ведь все возможные цветовые комбинации будут прекрасно смотреться на любых слайдах.
Вы просто работаете с одним цветом и используете различные оттенки и тона, а для разбавления слайдов и увеличения количества «воздуха» добавляете белые, серые и черные акценты.
Для более продвинутых дизайнеров (которые еще не считают себя экспертами) рекомендуется использовать не более 4 цветов. Будет не просто сбалансировать 4 различных цвета, которые, скорее всего, относятся как к теплым, так и к холодным цветовым категориям.
Работая с несколькими цветами нужно выбрать доминирующий оттенок, а остальные использовать в качестве вспомогательных и акцентных цветов.
3. Применяйте в работе онлайн-инструменты
Не нужно делать все самостоятельно и подбирать сочетания цветов на глаз. Существуют сотни ресурсов, которыми можно пользоваться, чтобы упростить процесс проектирования. Онлайн-генераторы цветовых схем отлично справляются со своей задачей, особенно если вы недостаточно уверены в своих дизайнерских способностях.
Вам просто нужно выбрать цвет, тип цветовой схемы и вы сразу получите другие цвета, которые хорошо будут с ней сочетаться. А также при работе над дизайном презентаций PowerPoint пипетка — ваш лучший друг. Копируйте цвета с помощью пипетки для того, чтобы облегчить свою жизнь и получить именно тот оттенок, который вам нужен.
Сервисы для генерации цветовых схем:
№4. Применяйте высококонтрастные цвета
Контраст важен в слайдах презентации. Необходимо чтобы аудитория могла читать все, что написано на ваших слайдах. Вам нужно использовать цветовую схему, которая выделит ваш контент. Не используйте светлые цвета для текста, если на ваших слайдах белый или светлый фон.
А также помните, что если вы хотите использовать дополнительные контрастные решения для выделения акцентов, то в этом случае фон должен быть нейтрального цвета, например, белый, черный или серый.
№5. Следуйте правилу 60-30-10
Эти рекомендации актуальны тогда, когда вы используете в презентации более 3х цветов.
- 60% основной цвет — используем его в качестве фонового цвета или для подложек для фотографий;
- 30% вторичный цвет — используем для заливки дополняющих блоков, форм и примитивов;
- 10% акценты — выделяем яркие цифры или слоганы, на которые аудитория должна обратить внимание, также этим цветов можно обозначить контуры.
№6. Учитывайте особенности своего бизнеса
И последняя вещь, о которой следует помнить при работе с цветами в презентации. Важно сосредоточиться на своем бренде!
Бизнес-презентации во многом являются визитной карточкой для вашей аудитории. Это первое, что потенциальные клиенты и инвесторы увидят, поэтому это отличная возможность произвести первое положительное впечатление.
Дизайн слайдов презентации PowerPoint может передать гораздо больше, чем вам кажется. Потратьте дополнительное время, чтобы спросить себя: какова миссия и видение вашей компании? Какие идеи и ценности вы хотите, чтобы ваша аудитория связывала с вашим брендом?
Яркие теплые цвета лучше всего подходят для передачи таких вещей, как творчество, радость и молодость. Прохладные цвета, такие как синий, черный и серый, скорее сделают вашу презентацию более сдержанной и элегантной!
Учитывайте интересы своей целевой аудитории и думайте о том, как будет восприниматься ваш бренд. Например, если вы продвигаете лавку полезных и здоровых продуктов питания, то имеет смысл использовать приятный зеленый оттенок. Да, этот цвет есть уже во многих торговых марках. Но гораздо лучше в этом случае заморочиться над оригинальностью логотипа, чем сделать вырвиглазный красный цвет своим фирменным, чтобы отстроиться от конкурентов.
Точно также вам не захочется использовать цвета, которые, по вашему мнению, выглядят великолепно, но на самом деле могут иметь более зловещее значение для аудитории. Скажем, например, фиолетовый цвет. Во многих странах он может ассоциироваться с богатством, но в Таиланде и Бразилии фиолетовый цвет символизирует смерть и траур.