Зелений, жовтий і червоний не можуть йти разом? Ефіопців треба страшенно ображати. Google для зелених, жовтих та червоних зображень, і я думаю, ви знайдете кілька привабливих прикладів (разом із потворними).
Те, наскільки добре поєднується будь-який набір кольорів, залежить від точних координат кольорів та відносних положень, форм, розмірів кольорових предметів та ефекту, який ви хочете мати (наприклад, заспокоєння проти захоплюючого, задоволення від серйозного, сміливого та тонкого ). Я не маю для вас жодних жорстких і швидких правил, але ось, з чим слід експериментувати.
Компроміс насичення розміром
Щоб уникнути ефекту нерівності (якщо ви цього не хочете), розмір кольорового предмета повинен бути обернено пропорційним його насиченості кольором. Ваш приклад мав досить високу насиченість, тому спробуйте або наситити більш низькі кольори (наприклад, пастелі), або пофарбуйте щось інше, ніж фон. Наприклад, ви можете розфарбувати текст і залишити фон нейтральним, або ви можете покрасити невелику форму або символ поруч із текстом. Останнє дасть можливість використовувати форму для надмірного кодування навичок відповідності для доступності та чорно-білого друку (зелена галочка на Задоволений, жовтий знак оклику для Недолік і червоний символ "Не введіть" для недостатньо гарного) .
Пробіл
Як кольори виглядають, залежить від їх близькості один до одного. Кольори, ніж зіткнення, коли сусідні виглядають нормально з невеликим відривом. Спробуйте поставити нейтральну межу навколо кожної комірки, щоб більше розділити кольори (як у ваших заголовках), якщо не має сенсу одноколірні клітини, що поєднуються разом, щоб сприймати їх як єдиний об'єкт. Спробуйте різну товщину. Спробуйте розділити кожну клітинку білими рамками, перейшовши на плитковий вигляд.
Візерунок
Наскільки добре поєднуються кольори, також змінюється залежність від кольорів, тому не забудьте оцінити макети з типовими пропорціями та положеннями кольорів. Наприклад, якщо більшу частину часу все зелене, і для користувачів найважливіше відвідувати "яскраві" жовті та червоні кольори, то вибирайте зелений, який забезпечує гарний фон (наприклад, низька насиченість, світло), а також жовтий і червоний, здається, сидить «зверху» (наприклад, більша насиченість, темний). Врахуйте, що естетичність візерунка може також спілкуватися та мотивувати користувача. Якщо у користувача є особливо непридатний або незбалансований набір навичок, можливо, вам потрібен некрасивий зразок. Найпривабливіший зразок повинен відповідати стану, який є найбільш вигідним для користувача.
Корисність
Ваше запитання стосується естетики, але вибір кольорового кодування також має великі наслідки щодо зручності використання. Вибір кольорів повинен бути:
Візуально відрізняються один від одного, особливо якщо вони використовуються при погіршених зорових умовах (наприклад, на мобільному при сонячному світлі).
Забезпечте хороший контраст із фоном (якщо передній план) або з переднім планом (якщо його фон). Наприклад, чорний текст червоним кольором не так добре. Як правило, передній план та фон потребують різного рівня яскравості.
Переконайтесь, що кольори класифікуються відповідно до того, що вони кодують. Наприклад, речі, які повинен відвідувати користувач, повинні більше контрастувати з фоном та іншими кольорами.
Забезпечити доступність та друкованість, коли кожен колір також має різний рівень темряви, при цьому темрява збільшується до рангів (червоний більше, ніж жовтий, ніж зелений). Зробіть свій зелений дещо синюватим та / або червоним дещо помаранчевим, тому користувачі червоно-зеленого кольору (найпоширеніший вид кольорової сліпоти) все ще можуть бачити кольорові відмінності.
Використовуйте кольорове кодування лише для однієї змінної. Я не знаю, для чого ви використовуєте сірий та оранжевий, але це, ймовірно, спричинить плутанину та ускладнить користувачам використання червоного зеленого та жовтого кольорів. У будь-який час, коли у вас є більше трьох кольорів, важко тримати речі зручними. Знайдіть інший спосіб кодування будь-якого сірого та помаранчевого коду (наприклад, використовуйте розмір шрифту чи вагу або використовуйте пунктирні лінії для меж комірок; див. Введення G у графічний інтерфейс ).
В одному з проектів, над яким я працював, кольори, з якими я прийшов, були: # E00000, # FF8400 та # C0FFE0 (не дуже жовтий, але все-таки працював).
У мене є більше про вибір кольорових кодів, зокрема про те, як розраховувати контраст кольорів та яскравості на Breaking the Color Code .
