Грамотно спроектированный интерфейс пользователя крайне важен для успешной работы системы. Сложный в применении интерфейс, как минимум, приводит к ошибкам пользователя. Иногда они просто отказываются работать с программной системой, несмотря на ее функциональные возможности. Если информация представляется сбивчиво или непоследовательно, пользователи могут понять ее неправильно, в результате чего их последующие действия могут привести к повреждению данных или даже к сбою в работе системы.
Хотя текстовые интерфейсы еще достаточно широко применяются, особенно в наследуемых системах, в наше время пользователи предпочитают работать с графическим интерфейсом. В табл. 15.1 перечислены основные элементы GUI.
Таблица 15.1. Элементы графических интерфейсов пользователя
Позволяют отображать на экране информацию разного рода
Представляют различные типы данных. В одних системах пиктограммы представляют файлы, в других – процессы
Ввод команд заменяется выбором команд из меню
Удобный и красивый интерфейс программы
Введение в пользовательские интерфейсы
Начнём с важного свойства любого интерфейса, а именно с аффорданса.
Скорее всего каждый из вас хоть раз сталкивался с ситуацией, когда не понятно, как использовать предмет, который находится перед вами. В качестве примера рассмотрим стеклянные двери на рисунке ниже. Согласитесь, не понятно, какое действие необходимо совершить, чтобы их открыть. То ли тянуть, то ли толкать?
Пример нарушения свойства аффорданс
В таких случаях приходится исправлять недостатки дизайна: например, с помощью поясняющих надписей.
Пример исправления ситуации с нарушенным свойством аффорданс
Перед нами наглядный пример того, как дизайнер (или проектировщик) не подумал о таком свойстве создаваемого им предмета, как аффорданс.
Аффорданс (по определению Дона Нормана) — это связь между свойствами объекта и возможностями агента (в данном случае человека), которые определяют, каким образом объект может быть использован.
Если упростить, то это такое свойство предмета или объекта окружающей среды (к чему можно отнести и программные продукты), которое своим видом показывает, что можно с ним сделать.
Следовательно, дизайн дверей с понятным аффордансом будет выглядеть следующим образом:
Пример дизайна дверей с понятным аффордансом (из книги Дона Нормана)
Дизайнеры интерфейсов часто нарушают правило аффорданса.
Одним из курьезных примеров нарушения этого правила стали первые сушилки для рук от компании Dyson, дизайн которых был настолько неоднозначен, что нашлись те, кто использовал данное изобретение в качестве писсуара.
Что такое интерфейс в ООП. Интерфейс c++ пример. Изучение С++ для начинающих. Урок #113
Сушилка для рук Dyson с нарушенным свойством аффорданс
Исправила данную ситуацию сама же Dyson, выпустив сушилки для рук с более понятным аффордансом:
Сушилки для рук Dyson с понятным аффорданс
На самом деле, таких законов как аффорданс в дизайне существует относительно много. С опытом дизайнеры узнают всё больше и больше законов, принципов дизайна и совершают меньше ошибок.
Пользовательский интерфейс
Почти любые вещи имеют пользовательский интерфейс. Начиная от предметов физического мира (топор, молоток, будильник и т.д.) до компьютерных интерфейсов. Голосовые помощники типа Яндекс Алиса также являются пользовательским интерфейсом.
У предметов физического мира, таких, как будильник, довольно однозначный аффорданс, поскольку у таких предметов ограниченное количество органов управления. Например, чтобы завести старый классический будильник, изображенный на рисунке, необходимо покрутить одну маленькую рукоятку, чтобы перевести время — другую и т.д. То есть, понимая концепцию времени, можно довольно легко понять, как пользоваться таким будильником.
Классический механический будильник с понятным аффорданс
Если мы рассмотрим современный электронный будильник, то часто понять как им управлять будет достаточно сложно. Часто на одну кнопку может быть «навешано» 3–4 функции. И в случае возникновения внезапной необходимости настройки такого будильника вы, скорее всего, испытаете определённые сложности.
Поскольку в электронной среде нет ограничений физического мира, можно довольно легко нарушать правила наглядности интерфейса, сделав аффорданс таким, что с интерфейсом очень сложно разобраться.
Стоит отметить, что умение пользоваться предметом — это не врожденное свойство человека, а приобретённое. Мы постоянно учимся пользоваться вещами, и более успешными становятся те вещи, аффорданс которых основан на уже известных нам способах взаимодействия.
Когда говорят об интуитивности интерфейса, это всегда означает, что он похож на то, чем мы привыкли пользоваться. Это означает, что у него понятный аффорданс, и мы легко можем его эксплуатировать.
Компьютерный пользовательский интерфейс
Если рассматривать пользовательский интерфейс компьютера, то он представляет собой тонкую «прослойку» между человеком и программой, где в качестве программы может выступать, например, мобильное приложение или веб-сайт. И, несмотря на то, что «прослойка» тонкая, она очень важна. Зачастую говорят, что интерфейс — это и есть программное обеспечение или приложение.
Пользовательский интерфейс с ПК
Можно сказать, что для типичного пользователя программное обеспечение или приложение без интерфейса не существует. При этом, у каждой стороны — у человека и компьютера — есть свои преимущества и недостатки.
Люди хороши в генерации идей, решении проблем, в задачах, где не хватает полноты информации. Но с рутинными операциями люди справляются плохо: часто ошибаются, быстро устают, отлынивают от такой работы.
С компьютерами всё полностью наоборот. Они плохи в принятии решений, генерации новых вещей, но хороши при выполнении рутинных операций: ничего не забывают, работают быстро, автоматически, невзирая на рутинность операций.
Хороший интерфейс усиливает положительные стороны каждой стороны взаимодействия пары человек-компьютер и нивелируют отрицательные. То есть, используя силу человека и компьютера, хороший интерфейс создаёт симбиотический союз, позволяющий решать очень сложные задачи в одиночку или коллективом людей, что раньше было совершенно недоступно и невозможно.
Определение дизайна
Давайте разберёмся теперь, как создавать хорошие интерфейсы. Для этого существует такая область деятельности, как дизайн или проектирование интерфейсов.
Оба эти слова (дизайн и проектирование) я считаю синонимами, так как «дизайн» (design) в переводе с английского языка и означает проектирование. Отрадно, что всё больше людей понимают, что дизайн это не просто красивые картинки, а нечто большее. И что за хорошим дизайном (верхней частью айсберга) скрывается значительная подготовительная работа (нижняя часть айсберга).
Опытный дизайнер знает и умеет выполнять всю эту невидимую глазу работу, в итого которой и рождается внешняя часть дизайна, видимая всем.
Существует огромное количество определений, что такое дизайн. Мое любимое определение сформулировано Владом Головачом в его книге «Культура Дизайна»:
Дизайн — это деятельность, направленная на улучшение потребительских/продающих свойств артефакта, превышающее себестоимость/трудозатраты этого улучшения.
Под артефактом здесь понимается какой-то конечный предмет/продукт потребительские свойства которого необходимо улучшить.
Рассмотрим значение отдельных составляющих этого определения подробнее.
1. С помощью формулировки «улучшение потребительских/продающих свойств», мы отделяем дизайн от искусства.
Совсем недавно дизайнеров и художников часто путали. Основное отличие между ними в том, что первостепенная цель художников в самовыражении, а для дизайнеров основная цель заключается в решении задач, связанных с улучшением свойств артефакта, например, создание более удобного с точки зрения пользовательских свойств и дешевого в производстве предмета.
Стоит отметить, что самые лучшие дизайнеры в некотором смысле достигают уровня искусства, создавая довольно странные, на мой взгляд, объекты дизайна, которые становятся культовыми, и при этом ещё и используются людьми по прямому назначению.
2. Теперь рассмотрим эту часть определения дизайна: «превышающее себестоимость/трудозатраты этого улучшения».
Здесь стоит упомянуть, что многие историки считают, что дизайн возник в тот момент, когда возникло массовое производство, и, вследствие этого, произошло разделение труда. Например, посуду раньше делал один и то же мастер, который самостоятельно осуществлял весь процесс изготовления посуды: от замеса глины, придумки дизайна изделий до их реализации. В какой-то момент люди поняли, что если они хотят производить посуды, то лучше разделить эти виды работы, и выделили отдельно профессию дизайнера, который стал отдельно заниматься дизайном.
Примерно в XVIII веке появилась продажа предметов обихода по каталогу: вам давали красивый каталог, вы выбирали товар, который изготавливался непосредственно под ваш заказ. Именно в то время профессия дизайнер стала более-менее массовой.
Каждый такой дизайнер помогал уменьшать себестоимость и трудозатраты изготовления товара. Ведь чтобы сделать 10 чашек, нам не нужно 10 супер-мастеров. Нам достаточно простых подмастерьев, которые могут изготовить заказ по шаблонам/лекалам, которые сделал дизайнер.
Источник: systems.education
Каким должен быть интерфейс программы?
В рамках одной из предыдущих статей я рассказывал о том, нужно ли включать короткую справку внутри программного продукта. В этой же статье я хотел бы привести несколько моментов, касающихся извечного вопроса «каким должен быть интерфейс программы».
Если открыть любой поисковик и попытаться найти определения «клевых интерфейсов», то вы можете натолкнуться на различные стандарты ГОСТ, ISO и прочее. Так же, найдете немало статей, описывающих отдельные детали или советы по проектированию удобных, эргономичных, качественных программ. Конечно, все это полезная информация, содержащая массу идей и задумок. Однако, почему-то какой-то одной единой инструкции не существуют. Где-то моменты совпадают, где-то мнения различаются (обычно, это выражается в тысячах страниц споров).
Например, часто можно встретить слова качество, удобство, понятность, элегантность и прочие другие красивые слова. Безусловно, плохого в этом ничего нет. Однако, в жизни немало примеров, когда программы с весьма «простыми» интерфейсами оказываются куда лучше всех этих «клевых интерфейсов». Как вариант, практически у большинства стоит что-то вроде Notepad++ (и тому подобные редакторы исходно кода), несмотря на то, что в добавок к этому стоит пяток другой полноценных IDE. Если рассматривать данный пример, то чаще всего это происходит из-за того, что мелкие правки банально удобнее вносить в простых редакторах.
Примечание: Notepad++ вообще отличная программа, просто ее интерфейс соответствует весьма старому варианту оформления интерфейса.
А теперь, посмотрите на картинку чуть выше. Скажите, это красивые элементы оформления? Кто-то скажет «ну так себе», кто-то скажет «ух ты красотень», кто-то скажет «такие элементы плохие, так как не будут очевидными пользователям» и все в том же духе. В принципе, все из этих ответов будут корректными.
Простой пример. Эти элементы могут смотреться красиво лишь только потому, что сейчас они представлены большими, а так же используется черный фон. Если фон будет белым, а элементы управления будут размером где-то в районе 10 пикселей, то все будет несколько иначе. Попробуйте сохранить себе эту картинку, вырезать фон и уменьшить до 10 пикселей каждый из элементов. И сами все увидите.
Как видите, однозначного ответа просто нет, хотя это касается лишь простых вещей.
Если вы спросите людей с опытом, как они представляют себе каким должен быть интерфейс программы, то в добавок ко всем красивым прилагательным (хотя периодически их можно и вовсе не услышать), вы так же услышите фразы вида «позволяет быстро решать задачи без лишних ковыряний» (при чем без уточнения в виде «отступы такие-то» и прочее), «установил и пользуешься» (есть инструкция, ничего не ломается при установке и прочее), «пользователям практически ничего не приходится объяснять» (не в плане «интуитивно понятный интерфейс для чайников», а в смысле, что пользователи, использующие данный продукт, знают свою область и поэтому им просто разобраться даже со сложными и нагроможденными интерфейсами).
Другими словами, фразы, которые относятся к реальным и насущным делам.
Простой пример, чтобы лучше понять. Представьте, что в мире существует всего две IDE. Одна, навороченная и крутая, вторая весьма простая. Так же считаем, что обе IDE грузятся моментально и на компьютере достаточно много ресурсов, чтобы не брать эту стезю в расчет. Какую из них вы установите? По факту, очевидного ответа нет.
Дело в том, что все очень сильно зависит от потребностей, так как даже в простых IDE всегда будет что-то удобнее сделано, чем в крутой IDE. Если, к примеру, вы пишите одну сложную программу, то, скорее всего, вы установите только первую среду. Если же вы пишите много мелких и небольших программ, то вторая будет предпочтительней, так как в интерфейсе не будет ничего лишнего. Если же программы разного уровня, то с большой вероятностью можно сказать, что у вас будут стоять обе среды.
Поэтому, какие бы советы вы ни читали, всегда помните про здравый смысл и реальность.
☕ Понравился обзор? Поделитесь с друзьями!
Источник: ida-freewares.ru