У меня есть несколько проектов для домашних животных, где я - единственный разработчик/программист, и я трачу слишком много времени на изменение пользовательского интерфейса, чтобы упростить использование реальными пользователями и избегать ярко-желтого и зеленого, которые так часто встречаются в проектах "программистов".
У вас есть советы по выбору цветовой схемы, когда у вас нет дизайнера графики? Как избежать создания типичного интерфейса "программист"?
kuler содержит множество цветовых схем, представленных пользователем
edit: просто запомнилось... также попробуйте colorlovers
Позвольте мне рассказать вам историю.
У меня нет абсолютно никакой уверенности в моей способности делать эстетический выбор - вам нужно только взглянуть на то, как я одеваюсь, чтобы понять, что я оправдан в своем недоверии. Во всяком случае, много лет назад я был назначен ответственным за создание gui для нового продукта ( "Редактор клипов" в Cineon, для всех, кто это знает). Я набросал дизайн, но попросил моего начальника, руководителя отдела продаж и маркетинга, и различных "специалистов по применению" для помощи в выборе цветов. Никто не ответил, поэтому я сказал "черт с ним", и выбрал цветовую схему настолько безобразно, что я уверен, что бета-тестеры отвратятся от ужаса и потребуют изменения. Но они этого не сделали - так оно и было. И я слышал, что клиенты любили "смелые цвета". И не только это, но через несколько лет конкурент добавил программу, которая выглядела как прямая копия моего редактора клипов для их продукта, и они скопировали мою цветовую схему!
Для настольных приложений получите цвета из ОС. Я лично хочу, чтобы все мои приложения выглядели и чувствовали то же, что и моя ОС.
Для веб-приложений я не уверен.
Имейте в виду, что почти 10% мужского населения мира имеют некоторую значительную форму цветной слепоты. Вы всегда должны учитывать это, выбирая цвета интерфейса (особенно если вам нужен капитал - угадайте, что? 1 из 10 мужчин-инвесторов могут не увидеть ваши красные точки на зеленой диаграмме фона, показывающие риск и возвращение!).
MSDN имеет разумный обзор этого, и существует несколько фильтры веб-сайта, которые показывают вам, как выглядит ваш сайт (или любой сайт) с учетом любой формы слепоты.
Кроме того, мне очень нравится COLOURLovers - у них нет большого выбора пользовательских тегов и определенных цветовых схем, они дайте их вам разными способами, и вы можете войти в систему и отслеживать избранных (или ваших любимых производителей цветовой схемы).
Пойдите, проверьте осенние темы! Нельзя ошибаться в цветах Мичигана, когда листья меняются...
-Adam
Цветовые направляющие, такие как Kuler, - отличное начало, если вы не имеете представления о выборе цветов.
Некоторые основные соображения:
Используйте контраст, а не цвет, чтобы отличить ваш дизайн. Это должно учитывать цветную слепоту и слабовидящих пользователей.
Используйте как можно более ограниченную цветовую палитру. Выберите один цвет как свою тему и выберите оттенки этого цвета, а затем, возможно, один или два контрастных цвета, чтобы пойти с ним.
Получить совет - не обязательно быть от дизайнера, вы все равно можете знать кого-то, у кого есть хороший взгляд на эти вещи. Кроме того, более широкая обратная связь - попросите нескольких людей о своем мнении, что может помочь.
В последнее время я использую следующий веб-сайт: http://www.nickherman.com/colormatch/ чтобы помочь мне (также не дизайнеру) выбрать соответствующие цветовые схемы. Я обычно нахожу цвет, который довольно приятен, а затем используйте соответствующие цвета с этого сайта.
Если все остальное терпит неудачу, я также прошу мою жену!
Мне нравится использовать ColourSchemer и EasyRGB.
Некоторые обновленные ресурсы, которые я использую:
Colorotate.org - это хорошо спроектированный сайт с пользовательскими палитрами различного размера (в отличие от кулера, который обеспечивает только 5 цветов на палитре). Это позволяет вам увидеть, как комбинации выглядят для разных людей с ослабленным цветом.
colorschemedesigner.com генерирует согласованные палитры для вас, используя различные алгоритмы (дополнение, триада, тетрад...)
Adobe Kuler на веб-сайте есть много пользовательских цветовых схем, загруженных дизайнерами. Сначала я ищу сначала более ранжированные схемы.
В Интернете много "цветных подборщиков". Если вы их используете, ваши цвета будут, по крайней мере, похожими на то, что они принадлежат друг другу. Первый, на который я посмотрел на google: http://www.yafla.com/dforbes/yaflaColor/ColorRGBHSL.aspx?
Цель для пастельных цветов, которые немного тускнеют, чем их полноразмерные копии, т.е. пастельный красный цвет более темный, чем (255,0,0) красный, например. Попробуйте выбрать цвета из одной и той же палитры, один мошеннический способ определения цветовых схем, которые я использую, - сделать снимок экрана приложения Office 2007, как правило, превзойти и вставить некоторые цвета из их скоординированных палитр, используя инструмент цветной капельницы в как Paint.NET. На самом деле этот мошеннический подход расширяется до "заимствования" цветовых схем из уже существующих приложений, которые имеют схемы цветов, которыми вы восхищаетесь: -)
Если вы выбираете цвет темы для своего приложения, вы можете использовать Kuler, чтобы помочь сформировать палитру.
Похожие сообщения:
Я стараюсь использовать много граней вместе с черным и белым, держать вещи простыми и избегать любых раздражающих ярких цветов. Кажется мне так, как это сделали парни SO.
Vitaly Friedman Essential Bookmarks для веб-дизайнеров и веб-разработчиков перечисляет множество онлайн-инструментов , а также сокращенная версия
Существует также список цветных инструментов на twiki.org, в котором есть несколько дополнительных сайтов.
Я рекомендую вам начать с изучения вычислительной теории цвета. Википедия на самом деле является прекрасным местом для обучения на эту тему. Попробуйте найти цвет по имени в Википедии. Вы найдете больше, чем вы ожидаете. Отправляйтесь оттуда, пока не получите краткий обзор поля.
Когда вы разрабатываете свой аналитический взгляд, сосредоточьтесь на понимании ваших любимых (или самых презренных) цветов интерфейса и палитр с точки зрения их различных представлений в разных цветовых пространствах: RGB, HSB, HSL. Храните Photoshop/GIMP открытым, чтобы вы могли сопоставить субъективный опыт палитр с их количественными аспектами. Посмотрите, как ваши цвета отображаются на паршивых мониторах. Обратите внимание на то, что всегда остается читаемым, и какие цветовые комбинации имеют тенденцию давать нехаризматические или неразборчивые результаты. Обратите внимание на эмоциональную информацию, передаваемую конкретными палитрами. Вы быстро увидите, как появляются шаблоны. Например, вы поймете, что цвета с высоким насыщением лучше избегать в компонентах пользовательского интерфейса, за исключением особых целей.
В конце концов, вы сможете проанализировать выходные данные генераторов палитр, рекомендованных здесь, и вы разработаете свои собственные теории о том, что хорошо подходит, и о том, какой контраст необходим для наилучшего воспроизведения на большинстве дисплеев.
(Чтобы избежать потенциальных разочарований, вам может потребоваться перейти на тест восприятия цвета Pantone, который лучше всего воспринимать на цветном откалиброванном дисплее. Если он говорит, что у вас плохое восприятие цвета, то для вас важнее цифровой анализ.)
Почему программисты думают, что у них нет навыков dsign? Это мое домашнее животное. Это обучаемое умение, как и все остальное.