Инструментарный инвентарь разработчика интерактивных систем

РУДН

Кафедра Информационных технологий

 

 

 

 

Реферат

на тему

«Инструментарный инвентарь разработчика интерактивных систем»

(часть1)

 

 

 

Выполнила

Студентка НИ-501

Захарова Алёна

 

 

Москва 2012 

Введение.

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

Инвентарь разработчика интерактивного ПО включает в себя следующие группы компонентов:

• Элементы управления
• Меню
• Окна
• Остальное (пиктограммы, курсоры, цвет, звук…)

В рамках данного реферата будет  рассмотрена первая группа инструментов, а именно элементы управления.

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

 

Виды элементов управления

Элементы управления, которые использует разработчик интерактивного ПО подразделяются на следующие категории:

• Кнопки
• Списки
• Комбобоксы
• Поля ввода
• Ползунки

Давайте рассмотрим каждую категорию  по подробней.

 

Кнопки

Кнопкой называется элемент управления, всё взаимодействие пользователя с которым ограничивается одним действием – нажатием.

Кнопки имеют несколько разновидностей: командные, кнопки доступа к меню, и так далее. Рассмотрим первый вид кнопок:

 

Командные кнопки.

Нажатие на такую кнопку запускает какое-либо явное действие, поэтому Командные кнопки правильнее называть такие кнопки «кнопками прямого действия». С другой стороны, из-за тяжеловесности этого словосочетания им всегда пренебрегают.

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

В интернете кнопка должна быть оформлена  как текстовая ссылка, если она перемещает пользователя на другой фрагмент контента,

 и как кнопка – если она запускает действие.

 

Размеры и поля.

Как вы уже знаете, чем  больше кнопка, тем легче попасть  в нее курсором. Это правило  по мере сил всеми соблюдается, во всяком случае, кнопок размером 5 на 5 пикселей уже практически не встретишь. Однако помимо простоты нажатия на кнопку есть другая составляющая проблемы: пользователю должно быть трудно нажать не на ту кнопку. Добиться этого можно либо изменением состояния кнопки при наведении на неё курсором, либо установлением пустого промежутка между кнопками. Первый способ пробрел существенную популярность в интернете, второй – в обычном ПО. Ни тот, ни другой способы не обеспечивают стопроцентной надежности, так что при прочих равных использовать стоит оба.

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

 

Другой составляющей проблемы размера кнопок в интернете является несоответствие видимой площади кнопки её действующей площади. Кнопки часто реализуют посредством окрашенных ячеек таблицы, в которых размещается текст, являющийся гипертекстовой ссылкой. Проблема заключается в том, что пользователи воспринимают кнопкой всю ячейку, хотя реально «нажимается» лишь малая её часть.

 

Объем.

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

 С другой стороны,  этот объем плох тем, что при его использовании возникает рассогласование между обликами кнопок прямого и непрямого действия. Разумеется, никто не отменял ещё и тот факт, что псевдообъем кнопок, вообще говоря, в существенной степени есть визуальный шум.

Еще с одной стороны, зачастую возникает необходимость максимально  повышать шансы нажатия пользователем  какой-либо отдельной кнопки (например, «О компании»), в этих случаях псевдообъем этой кнопки (при прочих плоских) сильно повышает вероятность нажатия.

Направление теней во всех элементах  управления должно быть одинаковым: снизу справа.

 

Состояния.

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

• Нейтральное
• Нажатое
• Нейтральное с установленным фокусом ввода
• Состояние кнопки по умолчанию
• Кнопка по умолчанию с установленным фокусом ввода
• Заблокированное состояние

В интернете обычно используют меньший набор состояний:

• нейтральное
• готовое к нажатию (onMouseOver)
• активное (в случаях, когда набор кнопокиспользуется для индикации навигации)

Нажатое и заблокированное  состояние используются очень редко, а «нейтральное с установленным  фокусом ввода» старается, как может, создать браузер.

 

Обычно, чем больше набор  состояний, тем лучше. Но главное  не это, а отсутствие дублирования состояний: не должно быть разных состояний, выглядящих одинаково. Также очень важно делать

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

 

Текст и пиктограммы.

Все руководства по разработке интерфейса требуют снабжать командные  кнопки названиями, выраженными в  виде глаголов в форме инфинитива (Прийти, Увидеть, Победить). Кнопка, запускающая действие, недаром называется командной. С её помощью пользователи отдают системе команды. Команда же в русском языке формируется посредством глагола в повелительном наклонении.

 

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

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

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

 

 

Кнопки доступа к меню.

Также к группе командных кнопок относится кнопка доступа к меню. Она представляет собой комбинацию раскрывающегося списка и командной  кнопки.

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

У использования этого  вида кнопок есть некоторые недостатки. Так текст на самой кнопке не будет виден, следовательно, значение кнопки будет менее понятным, чем контекстное меню безо всякой кнопки. Формально, для совсем неопытных пользователей, кнопка работать будет, но, как только пользователи «подрастут», контекстное меню окажется эффективней.

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

 

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

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

 

Чекбоксы и радиокнопки.

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

 

Главное различие заключается в том, что группа чекбоксов даёт возможность пользователям выбрать любую комбинацию параметров, радиокнопки же позволяют выбрать только один параметр.

 

Внешний вид.

Традиционно сложилось так, что чекбоксы выглядят как квадраты, а радиокнопки – как кружки. Нарушать это правило нельзя.

Желательно вертикально располагать  чекбоксы и радиокнопки в группе, поскольку это облегчает поиск конкретного элемента.

 

Текст подписей.

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

Подписи к стоящим параллельно  кнопкам лучше стараться делать примерно одинаковой длины. Если подпись не помещается в одну строку, выравнивайте индикатор кнопки по первой строке подписи.

 

Взаимодействие.

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

 

Списки.

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

Списки бывают пролистываемыми и раскрывающимися.

 

Раскрывающиеся списки

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

 

Пролистываемые списки

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

 

Списки единственного  выбора.

Список единственного  выбора является промежуточным вариантом  между группой радиокнопок и  раскрывающимся списком.

Он меньше группы радиокнопок с  аналогичным числом элементов, но больше раскрывающегося списка. Соответственно, использовать его стоит только в  условиях «ленивой экономии» пространства экрана.

 

Списки множественного выбора.

С точки зрения дизайна  интерфейсов, списки множественного выбора интересны, прежде всего, тем, что их фактически нет в интернете. Гораздо  лучше обстоят дела в ПО. Возможность безболезненно выводить в списке чекбоксы позволяет пользователям без труда пользоваться списками, а разработчикам – без труда эти списки создавать.