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

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

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

Руководящие принципы

Программа "Tidy Start Menu"

Заключение

Литература

Введение

"Золотое правило проектировщика гласит: "Никогда не делай другим того, что они сделали тебе". Вспомните, что вам не нравится в программном обеспечении, которым вы пользуетесь. И не делайте того же самого в программе, над которой работаете."

Трэйси Леонард

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

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

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

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

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

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

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

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

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

Где найти принципы разработки пользовательского интерфейса

Хансен представил первый список принципов проектирования. Принципы таковы:

1)знать пользователя;

2)сократить запоминание;

3)оптимизировать операции;

4)устранить ошибки.

Многие крупные производители операционных систем, выпусти на рынок свои новые продукты, публикуют соответствующие руководства и инструкции. В этих изданиях раскрываются принципы подхода к проектированию интерфейса. Руководства выпускали Apple Computer, Inc. (1992), IBM Corporation (1992), Microsoft Corporation (1995) и UNIX OSF/Motif (1993).

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

Важность соблюдения принципов

"Несовместимость интерфейса может стоить большой компании миллионов долларов убытка из-за потери продуктивности и увеличения стоимости технической поддержки." - Джесси Брист.

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

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

Трактовка этих принципов будет зависеть от аппаратного обеспечения, операционной системы, составляющих пользовательского интерфейса и его задач. Зачастую деловое решение довлеет над использованием принципов проектировщиками. Пользовательские модели и модели проектировщика также различны и влияют на то, как будут применяться принципы. На некоторых важных этапах разработки проекта может встать вопрос: "Что произойдет далее?". Ответ должен быть таким: "Что захочет пользователь!".

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

Правила проектирования пользовательского интерфейса

"Делай это проще, но не примитивнее."

Альберт Эйнштейн

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

Позволить человеку использовать мышь и клавиатуру

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

Позволить пользователю переключить внимание

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

Показывать поясняющие сообщения и тексты

Во всем интерфейсе использовать понятные для пользователя термины. Они не обязаны знать о битах и байтах!

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

Обеспечить немедленные и обратимые действия и обратную связь

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

Предоставлять понятные пути и выходы

Пользователи должны получать удовольствие при работе с интерфейсом любого программного продукта. Даже интерфейсы, применяемые в индустрии, не должны пугать пользователя, он не должен боятся нажиматься нажимать кнопки или переходить на другой экран. Вторжение Internet показало, что навигация - основная интерактивная техника в Internet. Если пользователь понимает, как зайти на нужную страницу в WWW, то существует 80-процентная вероятность, что он разберется в интерфейсе. Люди осваивают методы работы с браузером очень быстро.

Приспосабливаться к пользователям с разными уровнями навыков

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

Сделать пользовательский интерфейс "прозрачным"

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

yadobr 14 января 2014 в 09:10

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

  • Интерфейсы

Введение

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

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

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

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


Какие ЭИ создать?


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

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

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


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


В заключении

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

Литература

Джеф Раскин , «Интерфейс: новые направления в проектировании компьютерных систем»
Алан Купер , «Об интерфейсе. Основы проектирования взаимодействия»
Алан Купер , «Психбольница в руках пациентов»

Традиционный графический подход к интерфейсу с пользователем связан с работами Сазерленда, Ньюмена и др. , в котором взаимодействие базируется на использовании графического дисплея с регенерацией и светового пера. Дальнейшее развитие графического диалога связано с прогрессом в области систем интерактивной машинной графики, который привел к регламентации в виде международных стандартов.
GKS - первый международный графический стандарт. В нем впервые зафиксированы концепции "рабочих станций" и логических устройств ввода (клавиатура, выбор, локатор, валюатор, указатель, ввод последовательности координат). К сожалению задуман во время превосходства парадигмы векторного рисования. Отсюда слабость поддержки диалога: отсутствие возможности ввода новых устройств или видоизменения изображения устройства на экране даже из прикладной программы (пользователя графического пакета), что приводит к необходимости использования в основном символьного ввода при организации диалога. Реализация диалога в GKS прерогатива прикладной программы, возможности раздельного проектирования не предполагается.
Второе направление графики - растровая графика оказала чрезвычайно большое влияние на все последующее развитие интерактивных систем. Все основные черты интерфейса с пользователем на современных рабочих станциях суть производные от работ Xerox PARC: управление окнами

  • использование графических символов ("икон") для представления объектов
  • стиль взаимодействия, называемый непосредственным манипулированием
  • популярность "мыши" как устройства позиционирования на экране
  • объектно-ориентированный стиль программирования.
С тех пор система классификации инструментария для создания и управления пользовательским интерфейсом рассматривается на трех уровнях:
  1. системы управления окнами (WMS - Window Manager System);
  2. специализированный инструментарий;
    • обычный (MacIntosh, SunView . . .)
    • объектно-ориентированный (Smalltalk-80, Andrew, InterView)
  3. системы управления пользовательским интерфейсом.
В следующих разделах будут даны краткие характеристики, статус и функциональное описание каждого из этих уровней.

Системы управления окнами (WMS)

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

  • перекрывающихся окон (прямоугольных областей экрана);
  • различных устройств ввода (цифровых и аналоговых);
  • курсоров;
  • шрифтов.
Интерфейс со стороны оператора и прикладной программы содержит команды заведения/уничтожения окон, изменения их размеров и положения, поднятие наверх, сжатия окна до пиктограммы и восстановления. Содержит графическую библиотеку вывода (только основные примитивы) и обработчик событий. Тем самым есть некие механизмы для реализации пользовательского интерфейса.
Возможны реализации WMS двух типов: базовая система (Kernel System), работающая на одной машине, и сетевая (Network oriented), реализуемая на основе модели клиент-сервер.

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

Стандарт GUI.

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

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

Семь принципов разработки GUI.

Семь общих принципов разработки GUI взяты из руководства по интерфейсу Micrisoft Windows. Они формируют схему, на основании которой вы можете создавать собственные стандарты. Эта схема дает разработчикам и пользователям два существенных преимущества. Во-первых, приложения выглядят профессионально. Во-вторых, они функциональны, согласуются с другими приложениями и легко осваиваются пользователями.

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

1. Позволяйте пользователю контролировать приложение.

2. Следуйте парадигме объект/действие.

3. Будьте последовательны.

4. Сделайте работу с приложениями простой и очевидной.

5. Стремитесь к гармонии.

6. Обеспечьте пользователю обратную связь.

7. Будьте снисходительны

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

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


Допустим пользователь хочет добавить нового клиента В примере, пользователь должен для этого перейти в модуль ACCOUNTS RECCIEVAble и затем добавить откуда нового клиента. Откуда ему знать, что нужно делать? Вероятно, из своего опыта работы с этим приложением. А в мире GUI пользователь просто выбирает в меню сначала команду New (Новый), потом Customer (Клиент), как показано на рис. В этой современной системе можно добавить нового клиента, продавца или пункт инвентаризационной записи посредством меню File (Файл). Это позволяет изменить запись клиента, находясь в экране продавца, и наоборот. Пользователю не нужно больше разбираться в сложном и запутанном иерархическом меню.

Принцип второй: следуйте парадигме объект/действие.

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

Принцип третий: будьте последовательны.

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

Таким образом, создавая новые приложения, будьте последовательны. Если для добавления новой записи употреблена команда New (Новый), используйте ее везде. Не следует заменять это слово другими – например, словом Add 9добавить). Благодаря вашей последовательности пользователи будут знать: где им ни встретилась команда New (Новый), е можно использовать для добавления новой записи.

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

Можно выразить эту мысль и так: не употребляйте жаргона. Есть экран с двумя кнопками. На одной из них написано «Упаковать базу данных», а на другой – «Убрать записи с пометкой на удаление». Вторая запись наверняка будет более понятна пользователю.

При разработке приложений часто возникает соблазн применить в интерфейсе программистский сленг. Старайтесь по возможности избегать этого.

Принцип пятый: стремитесь к гармонии

Даже в черно белом виде этот экран имеет существенный эстетический недостаток: белый фон и на нем контрастные объекты. На рис. Тот же самый экран выглядит хорошо сбалансированным в цветовом отношении.

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

Принцип шестой. Обеспечивайте пользователю обратную связь.

Представьте себе, что в вашем приложении есть процесс, который долго выполняется. В течение этого времени на экран можно выводить сообщение примерно такого содержания: «Программа работает, подождите пожалуйста». Удобное решение; но откуда пользователю знать, что она не зависла? Поэтому весьма вероятно, что он отдаст приложению «салют тремя пальцами» (Ctrl+Alt+Del), хотя с программой все будет в порядке.

Лучше показать пользователю, какая часть процесса выполнена. Тогда он не прервет программу понапрасну, сможет оценить, как далеко продвинулась работа, и заняться другими делами, пока процесс не завершится. Таким образом, производительность труда пользователя повысится примерно на 25 процентов. Этого результата можно достичь простым выводом измерителя на экран. Обычно выводятся сообщения типа «10 из 100 записей обработано» или «40% завершено». Еще лучше показать как число обработанных записей, так и их процент»

Принцип седьмой: будьте снисходительны

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

Важность соглашений по стандарту GUI.

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