Концепции хорошего интерфейса С чего начать

Концепции хорошего интерфейса

С чего начать улучшение интерфейса Малое изменение в значимом интерфейсе дает в сотни раз лучше эффект, чем большое изменение в малозначимом интерфейсе: Итоговое улучшение интерфейса = % пользователей затронутого фрагмента интерфейса * коэффициент важности этого типа аудитории * заметность улучшения качества интерфейса

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

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

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

Концепции хорошего интерфейса Например, приборная панель пассажирского лайнера и мотодельтаплана.

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

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

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

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

Эргономические показатели Скорость обучения навыкам оперирования сложно оценить и тем более сложно измерить. В результате этот показатель существует только номинально и почти не используется в практической работе.

Эргономические показатели Модель ничего не говорит о том, какие показатели по каждой из шкал следует считать наилучшими из возможных в данном продукте. Но достоинства показателей Шнейдермана всё-таки перевешивают недостатки

Дизайн, ориентированный на пользователей (ДОП) Следующим подходом, как по сложности, так и по времени своего появления, является т. н. дизайн, ориентированный на пользователей (User Сentered Design, далее ДОП). Его сущность кратко можно охарактеризовать следующим образом — если мы хорошо изучим нашу аудиторию и оптимизируем интерфейс под неё, наш интерфейс будет хорошим.

Дизайн, ориентированный на пользователей (ДОП) Два основных следствия ДОП: Отношение пользователей к интерфейсу является главным показателем качества интерфейса Работа над интерфейсом невозможна без изучения особенностей аудитории , например, уровня начальной подготовки пользователей, их ожиданий, знаний предметной области и физиологических особенностей.

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

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

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

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

Дизайн, ориентированный на пользователей (ДОП) Как учитывать принципы ДОП в таких случаях? Ориентироваться на пользователя текущего, неадаптированного, или на уже адаптированного.

Дизайн, ориентированный на пользователей (ДОП) ДОП требует исследований. Эти исследования, по сути, являются этнографическими. В свою очередь, этнографические исследования всегда дороги и длительны, чем запланировано (вероятно, потому, что этнографическое исследование применительно к интерфейсу — это всегда «найди то, не знаю что» ).

Дизайн, ориентированный на пользователей (ДОП) Суммируя, можно сказать, что ДОП негласно подразумевает: есть система (интерфейс) и есть её пользователи, которые и важны. Того, что делают пользователи в системе и ради чего они, собственно, с системой взаимодействуют, ДОП не покрывает.

Дизайн, ориентированный на задачи пользователей (ДОЗ) Когда проблемы ДОП стали несомненны, на смену старой концепции пришла новая. Согласно дизайну, ориентированному на задачи пользователей (Task Centered Design, далее ДОЗ), тот интерфейс хорош, в котором эффективно выполняются задачи пользователей.

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

Дизайн, ориентированный на задачи пользователей (ДОЗ) Дело дизайнера интерфейсов, согласно идеям ДОЗ — выбрать наиболее эффективное решение задачи и обеспечить её выполнение. Этот метод несколько лучше ДОП, так как шире и включает в себя ДОП (как мы выберем наилучшее решение для пользователей, если мы не знаем всего об этих пользователях? )

Дизайн, ориентированный на задачи пользователей (ДОЗ) Достоинства: В отличие от ДОП, цели и методы которого не имеют прямого коммерческого выражения, дизайн, ориентированный на задачи пользователей, может быть оценён экономически.

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

Дизайн, ориентированный на задачи пользователей (ДОЗ) В отличие от потенциальных особенностей пользователей, число задач более предсказуемо при планировании. Благодаря этому проекты с ДОЗ значительно более управляемы

Дизайн, ориентированный на задачи пользователей (ДОЗ) Недостатки: ДОЗ не позволяет определить, какое именно число решаемых продуктом задач является необходимым и достаточным. Всегда есть задачи, которые система (ещё) не решает.

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

Дизайн, ориентированный на мотивы пользователей (ДОМ) Преодолеть лавинообразный рост числа функций помогает другая концепция — дизайн, ориентированный на мотивы пользователей (Goal Centered Design, далее ДОМ

Дизайн, ориентированный на мотивы пользователей (ДОМ) Согласно ДОМ, пользователи делают что- то для удовлетворения личных потребностей, иначе — мотивов; опознав эти потребности и сравнив их с задачами пользователей, мы получаем возможность лучше понять, что нужно делать.

Дизайн, ориентированный на мотивы пользователей (ДОМ) Например, рассмотрим интерфейс программы-органайзера для секретаря. В настоящий момент она разговаривает по телефону с клиентом, который просит назначить встречу с её начальником на 10 утра пятницы. Что дают рассмотренные ранее концепции дизайнеру интерфейса для этой ситуации?

Дизайн, ориентированный на мотивы пользователей (ДОМ) Дизайн, ориентированный на задачи , в таких ситуациях ограничивается тем, что мы записываем в ТЗ, что «система должна поддерживать создание событий в календаре» . Это очень хорошо; но для создания адекватного интерфейса этого явно недостаточно.

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

Дизайн, ориентированный на мотивы пользователей (ДОМ) Дизайн, ориентированный на пользователей , может помочь, например, при опечатывании при вводе с клавиатуры.

Дизайн, ориентированный на мотивы пользователей (ДОМ) Дизайн, ориентированный на мотивы пользователей , может сказать что у секретаря основной мотив действий — не получить нагоняй. Очевидно, что если интерфейс будет не очень быстрый, так что клиенту на телефоне придется подождать лишних пять секунд, неприятностей практически не будет. А вот если вместо 10 часов назначит встречу на 11, то неприятности обеспечены.

Дизайн, ориентированный на мотивы пользователей (ДОМ) Таким образом, ДОМ помог опознать важнейшую целевую характеристику нашего интерфейса — безошибочность. Соответственно, результирующее ТЗ на интерфейс должно звучать примерно как « интерфейс должен продуцировать минимум человеческих ошибок и быть по возможности быстрым»

Юзабилити К сожалению, все эти подходы (показатели Шнейдермана, ДОП, ДОЗ и ДОМ) довольно фрагментарны, поскольку концентрируются только на каком-то одном аспекте интерфейса. Общий подход, включающий в себя все эти концепции, очень желателен. Такой целостный подход существует — это юзабилити.

Юзабилити Наиболее часто используемое определение юзабилити (из стандарта ISO 9241 -11) гласит, что: Юзабилити — степень эффективности, трудоемкости и удовлетворенности, с которыми продукт может быть использован определенными пользователями при определенном контексте использования для достижения определенных целей/мотивов.

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

Юзабилити Например, если известно, что определенная операция всегда выполняется, когда пользователь разговаривает по телефону, есть все основания предполагать, что: Скорость взаимодействия очень важна, поскольку другой абонент не хочет ждать. Важна чувствительность продукта к операторским ошибкам (работать и одновременно слушать, что тебе говорят — тяжело )

Юзабилити Если известно, что пользователь разговаривает по обычному телефону, без специальной гарнитуры, интерфейс надо проектировать только под ввод одной рукой (либо мышь, либо клавиатура), поскольку другой рукой пользователь будет держать трубку.

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

Юзабилити Однако даже такая модифицированная формулировка юзабилити всё равно имеет определенные ограничения: 1. «Юзабилити — показатель. . . » . Какое, собственно, значение этого показателя является необходимым и достаточным для каждого конкретного продукта?

Юзабилити 2. C ведение юзабилити к единому показателю, с одной стороны, помогает работе, с другой — работе мешает. Мы можем измерить юзабилити, но как предсказать юзабилити во время дизайна? Как можно предсказать, насколько достигнутый показатель поможет хотя бы продажам?

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

Концепция деятельности Базовый тезис теории деятельности – не сознание определяет деятельность, а деятельность определяет сознание. Основные положения, принципы теории деятельности: сознание не может рассматриваться как замкнутое в самом себе, оно должно быть выведено в деятельности субъекта

Концепция деятельности поведение нельзя рассматривать в отрыве от сознания деятельность – активный, целенаправленный процесс действия предметны, они реализуют социальные цели

Концепция деятельности Данный подход начал формироваться в 20 -е гг. ХХв. Было предложено две трактовки: • С. Л. Рубинштейна – сформулировал принцип единства сознания и деятельности • А. Н. Леонтьев – разработал проблему общности внешней и внутренней деятельности (отличаются формой протекания, например, внутренняя – сопровождается эмоциями).

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

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

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

Резюме Под словом «простой» применительно к интерфейсам надо понимать уже знакомый или напоминающий что-то знакомое. Под словом «удобный» - надо понимать не требующий совершать большое количество непроизводительных действий , т. е. неудобный — это трудоёмкий.

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

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

Пример Меню. Его единственным нестандартным элементом является переключатель «Количество цифр в группе» . Если его включить, длинные числа будут делиться на части по три цифры.

Пример Начинаем задавать вопросы: 1. Можно ли ускорить взаимодействие пользователя с этим меню? — Нет. 2. Где в этом меню места, которые могут продуцировать человеческие ошибки? Можно ли изменить эти фрагменты? — Название пункта «Количество цифр в группе» затруднительно сделать совершенно понятным.

Пример 3. Что в этом меню не способствует обучению? — Если выкинем элемент «Количество цифр в группе» — ничего. 4. Известно ли мне что-нибудь о пользователях, что делает это меню плохим? — Нет. 5. Удовлетворяет ли это меню все известные мне мотивы пользователей? — Да.

Пример 6. Совместимо ли это меню со средой, в которой работают пользователи? — Да. 7. Проговариваем список всех задач, которые пользователь может решать с помощью меню. Вроде бы ничего проблематичного нет.

Пример Перейдем к выводу результата: 1. Можно ли ускорить взаимодействие пользователя с полем вывода? — Очевидно да, поскольку длинные числа медленно сканируются взглядом. Нужно включить режим разбиения длинных чисел по умолчанию.

Пример 2. Где в этом поле места, которые могут продуцировать человеческие ошибки? Можно ли изменить эти фрагменты? - Полезно увеличить размер цифр, чтобы улучшить их разборчивость. Ошибки в продукте такого типа чаще всего обнаруживаются слишком поздно. 3. Что в этом поле вывода не способствует обучению? — Вроде ничего.

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

Пример Анализ панели с цифрами 1. Можно ли ускорить взаимодействие пользователя с этой панелью? — Маловероятно 2. Совместима ли эта панель со средой, в которой работают пользователи? — Нет; как минимум для новых мониторов с высоким разрешением и небольшим размером экрана он не подходит — слишком мелкие элементы управления.

Пример 3. Где в этой панели места, которые могут продуцировать человеческие ошибки? Можно ли изменить эти фрагменты? — Разборчивость кнопок * и - не очень высока, что может приводить к ошибкам. Увеличить размер пиктограмм в кнопках арифметических операций. 4. Удовлетворяет ли этот интерфейс все известные мне мотивы пользователей? — Да.

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

Пример 7. Что в этой панели не способствует обучению? — Названия кнопок MC, MR, MS и M+ ничего не говорят пользователю, если он не знает их назначения. То же, хоть и в меньшей степени, касается кнопки sqrt. Либо увеличить, либо снабдить пиктограммой квадратного корня. И опять — чем отличается кнопка С от кнопки СЕ? Может быть, эту CE можно внедрить в поле вывода результата?

Пример Итак, в программе Калькулятор стоит, как минимум: 1. Показывать результаты вычислений разбитыми на группы цифр (317543=> 317 543) по умолчанию, убрав соответ- ствующий элемент меню. 2. Увеличить размер цифр в поле результатов. 3. Увеличить разборчивость кнопок математических операций.

Пример 4. Удалить кнопки операций с памятью, но зато вставить кнопки для скобок и что-то сделать с кнопкой квадратного корня. 5. В идеале — при запуске спрашивать у ОС разрешение экрана и увеличивать размер всех элементов, если разрешение слишком велико. 6. Реализовать показ промежуточных результатов калькуляции.

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

Пример