Основные элементы графического интерфейса

Почему надо следовать принципам построения пользовательского интерфейса?

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

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

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

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

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

Три принципа разработки пользовательского интерфейса формулируются так:

1)контроль пользователем интерфейса;

2)уменьшение загрузки памяти пользователя;

3)последовательность пользовательского интерфейса.

Введение

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

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

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

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

^

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

Интерфейс – в широком смысле слова, это способ (стандарт) взаимодействия между объектами. Интерфейс в техническом смысле слова задаёт параметры, процедуры и характеристики взаимодействия объектов. Различают:

Интерфейс пользователя – набор методов взаимодействия компьютерной программы и пользователя этой программы.

Программный интерфейс – набор методов для взаимодействия между программами.

Физический интерфейс – способ взаимодействия физических устройств. Чаще всего речь идёт о компьютерных портах.

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

Рисунок 1. Взаимодействие пользователя с компьютеромВ основном пользователь генерирует сообщения следующих типов:

запрос информации

запрос помощи

запрос операции или функции

ввод или изменение информации

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

Интерфейс пользователя компьютерного приложения включает:

средства отображения информации, отображаемую информацию, форматы и коды;

командные режимы, язык “пользователь – интерфейс”;

устройства и технологии ввода данных;

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

поддержку принятия решений в конкретной предметной области;

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

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

Это не только экран, который видит пользователь. К этим элементам относятся:

набор задач пользователя, которые он решает при помощи системы;

используемая системой метафора (например, рабочий стол в MS Windows®);

элементы управления системой;

навигация между блоками системы;

визуальный (и не только) дизайн экранов программы;

средства отображения информации, отображаемая информация и форматы;

устройства и технологии ввода данных;

диалоги, взаимодействие и транзакции между пользователем и компьютером;

обратная связь с пользователем;

поддержка принятия решений в конкретной предметной области;

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

МЕТОДЫ И СРЕДСТВА РАЗРАБОТКИ ПОЛЬЗОВАТЕЛЬСКОГО ИНТЕРФЕЙСА

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

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

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

Bluetooth

Активно продвигаемая консорциумом Bluetooth Special Interest Group (Bluetooth SIG), технология Bluetooth предназначена для построения так называемых персональных беспроводных сетей (personal area network). Оборудование Bluetooth работает в диапазоне частот 2.4 ГГц, для передачи трафика используется метод расширения спектра со скачкообразной перестройкой частоты.

Суммарная пропускная способность сетей Bluetooth – 780 кбит/с. При использовании асинхронного протокола максимальная скорость однонаправленной передачи данных составляет 722 кбит/с. В первоначальном варианте спецификаций (v1.0) предусматривалось, что длина соединений в сетях Bluetooth не будет превышать 10 м, однако в 2001 году нескольким производителям удалось увеличить дальность связи до 100 метров (при работе вне помещений).

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

Согласно спецификации Bluetooth, два совместимых устройства должны взаимодействовать друг с другом на расстоянии до 10 метров. Например, можно свободно перемещаться, оставив телефон на столе и разговаривая по гарнитуре. Это действительно удобно и просто.

Заключение

Популярность новых внешних интерфейсов постепенно растет. При этом если шина USB ориентирована, в основном, на устройства ввода, телекоммуникационное оборудование, принтеры, аудио / видео устройства, то IEEE 1394 – на высокоскоростные устройства, такие как устройства хранения данных и цифровую видеоэлектронику.

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

Пока что, технически преимущества на стороне 1394 и его последующей модификации – 1394b, у которого гарантированное соединение и передача данных между устройствами на расстоянии до 100 метров со скоростью от 800 Мбит/с до 3.2 Гбит/с. Найдутся ли весомые аргументы у USB против такого серьезного противника – покажет время.

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

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

Firewire

Единственным реальным соперником USB 2.0 в борьбе за сердца и кошельки пользователей является интерфейс FireWire, называемый также IEEE1394. В настоящее время этот стандарт все еще дороже своего конкурента и менее распространен.

Изобретателем нового высокоскоростного последовательного интерфейса, который сначала разрабатывался как скоростной вариант SCSI, является фирма Apple. После решения Apple открыть стандарт и сотрудничества с заинтересованными фирмами в 1990 году вышло техническое описание этой шины в виде стандарта IEEE1394 (Institute of Electrical and Electronic Engineers 1394 – стандарт института инженеров по электротехнике и электронике 1394).

Скорость передачи данных шины IEEE 1394 – 100, 200, 400 Мбит/c, расстояние – до 4.5 м, количество устройств – до 63. Как и USB, шина IEEE 1394 обеспечивает возможность переконфигурации аппаратных средств компьютера без его выключения. В соответствии с принятым стандартом IEEE1394 существует два варианта разъемов и кабелей.

Первый вариант с 6-контактным разъемом IEEE1394 предусматривает не только передачу данных, но и подачу электропитания на подключенные к соответствующему контроллеру ПК устройства IEEE1394. При этом общий ток ограничен величиной 1.5 А.

Второй вариант с 4-контактным разъемом IEEE1394 рассчитан только на передачу данных. В этом случае подключаемые устройства должны иметь автономные источники питания.

Шина IEEE 1394, используемая для подключения различного видео и аудио оборудования (телевизоры, видеомагнитофоны, видеокамеры и т.д.), осуществляющего передачу данных в цифровом коде, широко известна под названием i.LINK (это торговая марка Sony).

Tidystartmenu”

Со временем у вас накопилось много программ в меню “Пуск”, и каждый раз для запуска нужной программы вам нужно тратить время на поиски? Программа “Tidy Start Menu” поможет вам навести порядок в меню и сделать работу комфортной!

Для этого программа предлагает разбить все программы из меню на категории. Так, например, программы, которые используются для работы в Интернет, можно объединить в группу “Интернет”, а все игры поместить в категорию “Игры”.

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

Ниже приведены исходники програмы и снимки его интерфейса.

program Man;

uses

Forms,Dialogs,Controls,

Viewing in ‘Viewing.pas’ {look},

Setuping in ‘Setuping.pas’ {setup},

Editing in ‘Editing.pas’ {Edit},

ADOTableofset in ‘ADOTableofset.pas’ {TabSheetset};

{$R *.res}

begin

try

Application.Initialize;

Application.Title := ‘Programs’;

Application.CreateForm(Tlook, look);

Application.CreateForm(Tsetup, setup);

Application.CreateForm(TEdit, Edit);

Application.CreateForm(TTabSheetset, TabSheetset);

Достоинства

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

Как правильно расположить эи на экране?

• Есть утверждение, что визуальная привлекательность основана на пропорциях. Помните известное число 1.62? Это так называемый принцип Золотого сечения. Суть в том, что весь отрезок относится к большей его части так, как большая часть, относится к меньшей. Например, общая ширина сайта 900px, делим 900 на 1.62, получаем ~555px, это ширина блока с контентом. Теперь от 900 отнимаем 555 и получаем 345px. Это ширина меньшей части:
• Перед расположением, ЭИ следует упорядочить(сгруппировать) по значимости. Т.е. определить, какие наиболее важны, а какие — менее.
• Обычно(но не обязательно), элементы размещаются в следующей градации: слева направо, сверху вниз. Слева в верху самые значимые элементы, справа внизу — менее. Это связано с порядком чтения текста. В случае с сенсорными экранами, самые важные элементы, располагаются в области действия больших пальцев рук.
• Необходимо учитывать привычки пользователя. Например, если в Windows кнопка закрыть находится в правом верхнем углу, то программе аналогичную кнопку необходимо расположить там же. Т.е. интерфейс должен иметь как можно больше аналогий, с известными пользователю вещами.
• Размещайте ЭИ поближе там, где большую часть времени находится курсор пользователя. Что бы ему не пришлось перемещать курсор, например, от одного конца экрана к другому.
• Соблюдайте пропорции
• Элемент интерфейса можно считать видимым, если он либо в данный момент доступен для органов восприятия человека, либо он был настолько недавно воспринят, что еще не успел выйти из кратковременной памяти. Для нормальной работы интерфейса, должны быть видимы только необходимые вещи — те, что идентифицируют части работающих систем, и те, что отображают способ, которым пользователь может взаимодействовать с устройством.
• Делайте отступы между ЭИ равными или кратными друг-другу.

Как эи должны себя вести?

• Пользователи привыкают. Например, при удалении файла, появляется окно с подтверждением: «Да» или «Нет». Со временем, пользователь перестает читать предупреждение и по привычке нажимает «Да». Поэтому диалоговое окно, которое было призвано обеспечить безопасность, абсолютно не выполняет своей роли. Следовательно, необходимо дать пользователю возможность отменять, сделанные им действия.
• Если вы даете пользователю информацию, которую он должен куда-то ввести или как-то обработать, то информация должна оставаться на экране до того момента, пока человек ее не обработает. Иначе он может просто забыть.
• Избегайте двусмысленности. Например, на фонарике есть одна кнопка. По нажатию фонарик включается, нажали еще раз — выключился. Если в фонарике перегорела лампочка, то при нажатии на кнопку не понятно, включаем мы его или нет. Поэтому, вместо одной кнопки выключателя, лучше использовать переключатель(например, checkbox с двумя позициями: «вкл.» и «выкл.»). За исключением случаев, когда состояние задачи, очевидно.
  Такой переключатель напрямую отражает состояние ЭИ
• Делайте монотонные интерфейсы. Монотонный интерфейс — это интерфейс, в котором какое-то действие, можно сделать только одним способом. Такой подход обеспечит быструю привыкаемость к программе и автоматизацию действий.
• Не стоит делать адаптивные интерфейсы, которые изменяются со временем. Так как для выполнения какой-то задачи, лучше изучать только один интерфейс, а не несколько. Пример — стартовая страница браузера Chrome.
• Если задержки в процессе выполнения программы неизбежны или действие производимое пользователем очень значимо, важно, чтобы в интерфейсе была предусмотрена сообщающая о них обратная связь. Например, можно использовать индикатор хода выполнения задачи (status bar).
• ЭИ должны отвечать. Если пользователь произвел клик, то ЭИ должен как-то отозваться, чтобы человек понял, что клик произошел.

Какой должен быть дизайн эи?

На самом деле, дизайн ЭИ — тема отдельной статьи. Тут нужно учитывать все: начиная от цвета, формы, пропорций, заканчивая когнитивной психологией. Однако, несколько принципов все же стоит отметить:

• Цвет. Цвета делятся на теплые(желтый, оранжевый, красный), холодные(синий, зеленый), нейтральные(серый). Обычно для ЭИ используют теплые цвета. Это как раз связано с психологией восприятия. Стоит отметить, что мнение о цвете — очень субъективно и может меняться даже от настроения пользователя.
• Форма. В большинстве случаев — прямоугольник со скругленными углами. Или круг. Полностью прямоугольные ЭИ, лично мне нравятся меньше. Возможно из-за своей «остроты». Опять же, форма как и цвет достаточно субъективна.
• Основные ЭИ(часто используемые) должны быть выделены. Например размером или цветом.
• Иконки в программе должны быть очевидными. Если нет — подписывайте. Ведь, по сути дела, вместо того чтобы объяснять, пиктограммы зачастую сами требуют для себя объяснений.
• Старайтесь не делать слишком маленькие элементы — по ним очень трудно попасть.

Классификация

Выделяют следующие виды графического интерфейса:

• простой: имеет типовые экранные формы и стандартные элементы интерфейса, которые обеспечивает сама подсистема графического интерфейса;
• истинно-графический, двумерный: имеет нестандартные элементы интерфейса и оригинальные метафоры, которые реализуются собственными средствами приложения или сторонней библиотекой;
• трёхмерный.

Литература

Джеф Раскин

, «Интерфейс: новые направления в проектировании компьютерных систем»

Алан Купер

, «Об интерфейсе. Основы проектирования взаимодействия»

Алан Купер

, «Психбольница в руках пациентов»

Недостатки

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

Общие принципы

• Интерфейс должен быть интуитивно понятным. Таким, чтобы пользователю не требовалось объяснять как им пользоваться.
• Для упрощения процесса изучения необходима справка. Буквально — графическая подсказка, объясняющая значение того или иного ЭИ. Полное руководство должно быть частью интерфейса, доступной в любой момент.
• Возвращайте пользователя в то место, где он закончил работу в прошлый раз. Зачем нажимать все заново?
• Чаще всего, пользователи в интерфейсе сначала ищут сущность(существительное), а затем действие(глагол) к ней. Следуйте правилу «существительное -> глагол». Например, шрифт -> изменить.
• Чем быстрее человек увидит результат — тем лучше. Пример — «живой» поиск, когда варианты, в процессе набора поискового запроса. Основной принцип: программа должна взаимодействовать с пользователем на основе наименьшей значимой единицы ввода.
• Используйте квазирежимы. Например, ввод заглавных букв с зажатой клавишей shift — это квазирежим. С включенным capslock — режим. Основное отличие в том, что человек может забыть в каком режиме он находится, а в квазирежиме(с зажатой доп. клавишей) это сделать гораздо сложнее.
• Следует с осторожностью предоставлять пользователю возможность, по установке личных настроек. Представьте, сколько времени потратит сотрудник настраивая Word, если его интерфейс был полностью переделан предыдущим.
• Чем больше пользователь работает с какой-то конкретной задачей, тем больше он на ней концентрируется и тем меньше перестает замечать подсказки и сообщения, выводимые программой. Чем более критической является задача, тем меньше вероятность того, что пользователь заметит предупреждения относительно тех или иных потенциально опасных действий.

Правило 1: дать контроль пользователю

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

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

Принципы, которые дают пользователю контроль над системой:

1)использовать режимы благоразумно;

2)предоставить пользователю возможность выбирать: работать либо мышью, либо клавиатурой, либо их комбинацией;

3)позволить пользователю сфокусировать внимание;

4)демонстрировать сообщения, которые помогут ему в работе;

5)создать условия для немедленных и обратимых действий, а также обратной связи;

6)обеспечить соответствующие пути и выходы;

7)приспосабливайте систему к пользователям с различным уровнем подготовки;

8)сделать пользовательский интерфейс более понятным;

9)дать пользователю возможность настраивать интерфейс по своему вкусу;

10)разрешить пользователю напрямую манипулировать объектами интерфейса;

Правило 2: уменьшить нагрузку на пользователя

Основанная на знании того, как люди хранят и запоминают информацию, сила компьютерного интерфейса должна защитить память людей от излишней загруженности.

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

1)не загружать кратковременную память;

2)полагаться на распознавание, а не на повторение;

3)представить визуальные заставки;

4)предусмотреть установки по умолчанию, команды Undo и Rendo;

5)предусмотреть “быстрые” пути;

6)активировать синтаксис действий с объектами;

7)использовать метафоры из реального мира;

8)применять раскрытие и объяснение понятий и действий;

9)увеличить визуальную ясность.

Правило 3: сделать интерфейс совместимым

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

Реферат графический интерфейс ос windows

Технология командной строки

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

Команды набираются в командной строке. Командная строка представляет собой символ приглашения и мигающий прямоугольник – курсор (см. рисунок A.3.) При нажатии клавиши на месте курсора появляются символы, а сам курсор смещается вправо. Это очень похоже на набор команды на пишущей машинке.

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

Рис. A.3. Приглашения командной строки в различных операционных системах:

а) MS-DOS, б) IRIX.

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

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

Преобладающим видом файлов при работе с командным интерфейсом стали текстовые файлы – их и только их можно было создать при помощи клавиатуры. На время наиболее широкого использования интерфейса командной строки приходится появление операционной системы UNIX и появление первых восьмиразрядных персональных компьютеров с многоплатформенной операционной системой CP/M.

В заключении

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

Спасибо за внимание.