Вопрос

У меня есть пара любимых проектов, где я являюсь единственным дизайнером / программистом, и я трачу слишком много времени на изменение пользовательского интерфейса, чтобы упростить его использование от реальных пользователей и избегающий ярко-желтый и зеленый это так часто встречается в проектах "программистов".

Есть ли у вас советы по выбору цветовой гаммы, когда рядом с вами нет графического дизайнера?Как избежать создания типичного интерфейса "программиста"?

Это было полезно?

Решение

кулер имеет множество цветовых схем, представленных пользователями

Редактировать:только что вспомнил...также попробуйте цветные любовники

Другие советы

Позвольте мне рассказать вам одну историю.

Я абсолютно не уверена в своей способности делать эстетический выбор - вам достаточно взглянуть на то, как я одеваюсь, чтобы понять, что моя неуверенность оправдана.Как бы то ни было, много лет назад меня назначили ответственным за написание графического интерфейса для нового продукта ("Редактор клипов" в Cineon, для всех, кто это знает).Я набросал дизайн, но попросил своего босса, руководителя отдела продаж и маркетинга и различных "специалистов по применению" помочь с выбором цветов.Никто не ответил, поэтому я сказал "к черту это" и выбрал такую уродливую цветовую гамму, что, уверен, бета-тестеры отшатнулись бы в ужасе и потребовали изменений.Но они этого не сделали - так что оно отправилось вместе с ним.И я слышал , что клиенты любимый "смелые цвета".И не только это, но и несколько лет спустя конкурент добавил в свой продукт программу, которая выглядела как прямое заимствование моего редактора клипов, и они скопировали мою цветовую гамму!

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

Что касается веб-приложений, я не совсем уверен.

Имейте в виду, что почти 10% большая часть мужского населения земного шара страдает какой-либо значительной формой дальтонизма.Вы всегда должны учитывать это при выборе цветов интерфейса (особенно если вам нужен заглавный - угадайте, что?1 из 10 инвесторов-мужчин может не увидеть ваши красные точки на зеленом фоне графика, показывающего соотношение риска и доходности!).

MSDN имеет разумный обзор этого, и есть несколько фильтры веб-сайта которые показывают вам, как выглядит ваш сайт (или любой другой сайт) при любой форме дальтонизма.

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

Ознакомьтесь с осенними темами!Нельзя ошибиться с цветами Мичигана, когда листья меняются...

-Адам

Руководства по цвету, такие как Kuler, - отличное начало, если вы понятия не имеете о выборе цветов.

Некоторые основные соображения:

Используйте контраст, а не цвет, чтобы выделиться в вашем дизайне.Это сделано для того, чтобы приспособить пользователей с дальтонизмом и плохим зрением.

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

Получите совет - не обязательно от дизайнера, вы все равно можете знать кого-то, кто разбирается в этих вещах.Кроме того, более широкая обратная связь - спросите несколько человек об их мнении, которое может помочь.

В последнее время я пользуюсь следующим веб-сайтом: http://www.nickherman.com/colormatch/ чтобы помочь мне (тоже не дизайнеру) подобрать подходящие цветовые решения.Обычно я нахожу довольно приятный цвет, затем использую подходящие цвета с этого сайта.

Если все остальное не поможет, я тоже спрошу свою жену!

Мне нравится использовать Выбор цвета и EasyRGB.

Некоторые обновленные ресурсы, которые я использую:

Colorotate.org это красиво оформленный сайт с пользовательскими палитрами различных размеров (в отличие от kuler, который предоставляет только 5 цветов на палитру).Это позволяет вам увидеть, как эти комбинации выглядят для различных типов людей с нарушениями цвета кожи.

colorschemedesigner.com генерирует для вас согласованные палитры, используя различные алгоритмы (дополнение, триада, тетрада ...)

Adobe's Кулер на веб-сайте есть множество цветовых схем, созданных пользователями и загруженных дизайнерами.Обычно я сначала ищу схемы с более высоким рейтингом.

В Интернете есть множество "подборщиков цветовой темы".Если вы будете использовать их, ваши цвета, по крайней мере, будут выглядеть так, как будто они сочетаются друг с другом.Первый, который я просмотрел в Google: http://www.yafla.com/dforbes/yaflaColor/ColorRGBHSL.aspx?

Выбирайте пастельные тона, которые немного тусклее, чем их насыщенные аналоги, т.е.пастельно-красный цвет более тусклый, чем, например, (255,0,0) красный.Попробуйте выбрать цвета из одной палитры, один из хитрых способов определения цветовых схем, которые я использую, - это сделать снимок экрана приложения Office 2007, обычно Excel, и вставить некоторые цвета из их согласованных палитр, используя инструмент color dropper в приложении вроде Paint.NET .Фактически, этот мошеннический подход должен быть расширен до "заимствования" цветовых схем из приложений, которые уже существуют и в которых есть цветовые схемы, которыми вы восхищаетесь :-)

Если вы выберете цвет "темы" для своего приложения, вы можете использовать Кулер чтобы помочь дополнить палитру.

Связанный пост:

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

Основные закладки Виталия Фридмана для веб-дизайнеров и веб-разработчиков содержат множество онлайн- инструменты для раскрашивания, также являющийся сокращенная версия

Существует также список цветовых инструментов на twiki.org у этого есть несколько дополнительных сайтов.

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

Развивая свой аналитический взгляд, сосредоточьтесь на понимании ваших любимых (или наиболее презираемых) цветов интерфейса и палитр с точки зрения их различного представления в разных цветовых пространствах:RGB, HSB, HSL.Держите Photoshop / GIMP открытым, чтобы вы могли сопоставить субъективное восприятие палитр с их количественными аспектами.Посмотрите, как ваши цвета отображаются на паршивых мониторах.Обратите внимание, что всегда остается читаемым и какие цветовые комбинации, как правило, приводят к нехаризматичным или неразборчивым результатам.Обратите внимание на эмоциональную информацию, передаваемую определенными палитрами.Вы быстро увидите, как появляются закономерности.Например, вы поймете, что цветов высокой насыщенности лучше избегать в компонентах пользовательского интерфейса, за исключением специальных целей.

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

(Чтобы избежать возможного разочарования, вы можете перейти к бесплатному тесту Pantone на цветовосприятие.Лучше всего снимать на цветном откалиброванном дисплее.Если это говорит о том, что у вас плохое цветовосприятие, значит, числовой анализ для вас особенно важен.)

Почему программисты думают, что у них не может быть навыков dsign?Это моя любимая мозоль.Этому навыку можно научиться, как и всему остальному.

http://www.hackification.com/2010/05/16/designing-a-vs2010-color-scheme-consistency-consistency-consistency/

Лицензировано под: CC-BY-SA с атрибуция
Не связан с StackOverflow
scroll top