Имя Пароль
Зарегистрироваться


* При перепечатке материалов ссылка на www.SeoLiga.ru обязательна! RSS



Принципы дизайна интерфейса
7 февраля 2009

Дизайн пользовательского интерфейса во многом определяет впечатление от рабо-
ты с приложением. От него зависит, примут ли пользователи приложение и как
быстро они освоят его. Основных принципов дизайна немного:
• простота;
• оптимальное размещение элементов управления;
• логика и последовательность;
• эстетика внешнего вида.
Простота
Простота пользовательского интерфейса — это одна из важнейших его характерис-
тик. Освоение и использование программы с запутанным или чересчур сложным
интерфейсом весьма затруднительно и требует много времени. Пользовательский
интерфейс должен помогать быстро исполнять любые операции, необходимые для
взаимодействия с программой, предоставляя ровно столько возможностей, сколь-
ко требуется на данном этапе работы.
Конструировать интерфейс следует с учетом логики работы приложении. Эле-
менты управления, отображающие логически связанные данные, следует размещать
на формах группами. То же касается списков, полей и флажков для выбора и уста-
новки предопределенных параметров. Корректная передача фокуса позволяет быс-
тро перемещаться между элементами управления, составляющими группу, нажи-
мая клавишу Tab.
При разработке интерфейса часто допускают ошибку, пытаясь точно воспроиз-
вести объект из реального мира. Например, при конструировании формы для заме-
ны бумажного бланка возникает естественное желание воспроизвести этот бланк
«один к одному». Иногда такой подход оправдан, но чаще он лишь ограничивает
возможности приложения, не принося реальной выгоды. В любом случае следует
хорошо обдумать ситуацию и попытаться расширить функциональность приложе-
ния за счет дополнительных возможностей, которые предоставляет компьютер,
Применение значений по умолчанию также позволяет упростить пользователь-
ский интерфейс. Если большинство клиентов выбирают значение «Вашингтон» для
поля «Штат», имеет смысл назначить «Вашингтон» значением по умолчанию для
этого поля. Однако следует позаботиться о том, чтобы при необходимости пользо-
ватель смог без труда указать другое значение.
Пользовательский интерфейс рекомендуется создавать на основе данных опро-
са целевой аудитории. Узнайте, как пользователи хотят работать с приложением, и
постарайтесь спроектировать интерфейс так, чтобы упростить решение наиболее
типовых задач. Результаты опросов также пригодятся для совершенствования гото-
вых приложений.
Композиция формы
При размещении элементов управления следует учитывать, насколько они важны и
как часто они требуются. Предположим, есть форма для ввода обязательной и нео-
бязательной информацию. Ясно, что элементы управления для ввода обязательной
информации важнее и поэтому должны выделяться среди остальных элементов
формы. Как правило, предполагают, что пользовательский интерфейс просматри-
вают слева направо и сверху вниз, поэтому считается, что наиболее важные и вос-
требованные элементы управления лучше размещать в верхней части формы. Эле-
менты управления, с которыми пользователь работает после завершения основных
действий на форме (такие, как кнопка Submit), логично разместить в нижней части
формы.
Следующий вопрос — согласованность отображаемой информации. Элементы
управления, показывающие логически связанные данные, следует группировать.
Допустим, вы создаете форму для публикации сведений о клиенте, товаре или слу-
жашем. Для ее создания можно сгруппировать необходимые элементы управления
средствами элемента Tab, чтобы пользователь легко перемешался между ними.
Наконец, позаботьтесь об эстетике размещения элементов управления на фор-
ме. Избегайте перегруженных форм, содержащих больше данных, чем можно усво-
ить с первого взгляда. Старайтесь оставлять достаточно свободного места между
элементами управления — так вы придадите форме привлекательный вид и облег-
чите ее чтение.
Согласованность
Облик интерфейса должен гармонировать с содержанием приложения, в против-
ном случае интерфейс раздражает взгляд, а приложение кажется нелогичным и де-
зорганизованным, что затрудняет его освоение.
Согласованность следует закладывать в проекте. Для этого необходимо еще до
разработки создать стройную и логичную схему внешнего вида приложения. Опре-
деляя облик интерфейса, продумайте цвета, шрифты, размеры и тип используемых
элементов управления. Не поддавайтесь искушению сделать интерфейс броским —
применяйте лишь то, что требуется для решения поставленной задачи. Перегрузка
элементами управления и множество броских, но неуместных эффектов лишь от-
влекает пользователя и в конечном счете снижает производительность его труда.
Все формы приложения необходимо создавать по единой схеме. Позаботьтесь о
том, чтобы пользователю не пришлось заново привыкать к размещению элементов
интерфейса каждый раз, когда он открывает новую форму.
Эстетика внешнего вида
По возможности сделайте внешний вид приложения привлекательным и приятным,
однако ни в коем случае не приносите ясность и простоту интерфейса в жертву при-
влекательности. Достаточно, чтобы интерфейс не был отталкивающим.
Выбор цветов
Грамотное использование цветов — один из действенных способов улучшить вне-
шний вид интерфейса, однако берегитесь излишеств. Яркие кричащие цвета при-
влекают одних пользователей, но вызывают дискомфорт у других, поэтому в каче-
стве фона лучше выбирать приглушенные тона.
При разработке цветовой схемы приложения также важно ориентироваться на
целевую аудиторию. Если вы выполняете заказ компании, стоит воспользоваться
ее фирменными цветами, а если программа предназначена для многонациональ-
ной аудитории, учитывайте смысловую нагрузку тех или иных цветов в различных
культурах. Стремитесь к последовательности в оформлении интерфейса, но в ра-
зумных пределах.
Подумайте, будут ли выбранные цвета удобными для пользователей, в том числе
для людей с дефектами зрения. Например, голубой цвет на черном фоне читается
очень плохо. Не забывайте также о цветовой слепоте: некоторые люди не ра:шича-
ют красный и зеленый цвета, поэтому они не увидят красный текст на зеленом фоне.
Сделайте важные элементы приложения контрастными, но не полагайтесь при вы-
делении информации исключительно на цвет.
Подбор шрифта
Основным критерием выбора шрифта является его удобство, причем схема приме-
нения шрифтов должна быть единой для всего приложения. Избегайте трудно чи-
таемых и вычурных гарнитур, старайтесь применять простые, легко читаемые
шрифты вроде Palatine или Times New Roman. Шрифты, имитирующие рукопис-
ный текст, а также декоративные допускаются для визуального выделения, напри-
мер, заголовков страниц, но только там, где это уместно. Никогда не оформляйте
такими шрифтами важный текст.
Изображения и значки
Изображения и значки делают интерфейс более привлекательным, но при этом важ-
но тщательно продумать их применение. Излишние и отвлекающие изображения
затрудняют работу с приложением. Хотя значки успешно применяются во многих
приложениях как альтернативный способ представления информации, это не от-
меняет необходимость их тщательного выбора с учетом потребностей конечного
пользователя. Например, значок в виде дорожного знака «stop», запрещающего дви-
жение, подходит для предупреждения пользователя о возможных нежелательных
последствиях их действий. Однако дорожные знаки одинаковы не во всех странах,
и вполне вероятно, что для некоторых ваших пользователей такой значок окажется
бессмысленным. Изучайте целевую аудиторию и выбирайте значки и другие графи-
ческие элементы, исходя из ее особенностей.
Лучше для значков применять простые изображения, которые легко передаются
квадратом размеров 16x16 пикселов. Более сложные значки сильно искажаются при
просмотре с низким разрешением.
Фигурные и прозрачные элементы управления
.NET Framework предоставляет инструменты для создания элементов управления
разной прозрачности и формы, отличной от традиционного прямоугольника. Хотя
это чрезвычайно мощное средство создания визуальных эффектов для интерфейса,
пользуйтесь им в меру. Например, текстовое поле в форме пончика выглядит за-
бавно и оригинально, но едва ли оно повысит эффективность приложения или сде-
лает его удобнее. Применяя подобные эффекты, всегда помните об интересах ко-
нечного пользователя. Разнообразные элементы управления и формы (например
круглые кнопки) делают пользовательский интерфейс привлекательным и не вы-
биваются из стиля приложения, только когда применены со вкусом. Полупрозрач-
ные формы хороши тем, что позволяют держать в поле зрения форму, расположен-
ную на заднем плане. Эстетика повышает удобство работы с приложением.

Теги: .NET

Статьи по теме:

Работа с классом Help
Установка порядка передачи фокуса при нажатии клавиши Tab
Конструирование меню во время разработки
Модификаторы доступа для вложенных типов
Создание дополнительных типов объектов Doughnut
Blend PDF with Silverlight
Перебор элементов массивов и наборов
Отображение текста
Локализация формы
Создание обработчиков событий элементов управления
Извлечение из сопутствующих сборок ресурсов, специфичных для культуры
Полиморфизм
Наборы
Распространение приложений через Интернет
Типы данных .NET Framework
| .NET | Pavel |
 


Пн Вт Ср Чт Пт Сб Вс
1 2 3 4 5 6
7 8 9 10 11 12 13
14 15 16 17 18 19 20
21 22 23 24 25 26 27
28 29 30 31


     



Rambler's Top100

Данный сайт или домен продается ICQ: 403-353-727

© 2009 Seoliga.ru | .NET | Принципы дизайна интерфейса. Регион сайта: Москва и Санкт-Петербург