Введение в пользовательские интерфейсы

Из этой статьи вы узнаете:

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

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

Начнём с важного свойства любого интерфейса, а именно с аффорданса.

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

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

Перед нами наглядный пример того, как дизайнер (или проектировщик) не подумал о таком свойстве создаваемого им предмета, как аффорданс.

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

Если упростить, то это такое свойство предмета или объекта окружающей среды (к чему можно отнести и программные продукты), которое своим видом показывает, что можно с ним сделать.

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

Дизайнеры интерфейсов часто нарушают правило аффорданса.

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

Исправила данную ситуацию сама же Dyson, выпустив сушилки для рук с более понятным аффордансом:

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

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

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

Если мы рассмотрим современный электронный будильник, то часто понять как им управлять будет достаточно сложно. Часто на одну кнопку может быть «навешано» 3–4 функции. И в случае возникновения внезапной необходимости настройки такого будильника вы, скорее всего, испытаете определённые сложности.

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

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

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

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

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

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

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

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

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

Оба эти слова (дизайн и проектирование) я считаю синонимами, так как «дизайн» (design) в переводе с английского языка и означает проектирование. Отрадно, что всё больше людей понимают, что дизайн это не просто красивые картинки, а нечто большее. И что за хорошим дизайном (верхней частью айсберга) скрывается значительная подготовительная работа (нижняя часть айсберга).

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

Существует огромное количество определений, что такое дизайн. Мое любимое определение сформулировано Владом Головачом в его книге «Культура Дизайна»:

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

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

Рассмотрим значение отдельных составляющих этого определения подробнее.

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

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

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

2. Теперь рассмотрим эту часть определения дизайна: «превышающее себестоимость/трудозатраты этого улучшения».

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

Примерно в XVIII веке появилась продажа предметов обихода по каталогу: вам давали красивый каталог, вы выбирали товар, который изготавливался непосредственно под ваш заказ. Именно в то время профессия дизайнер стала более-менее массовой.

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

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

Не стоит забывать, что технологии, которые позволяют делать что-то принципиально новое, могут удешевлять продукт (то есть вещи, которые ранее были дорогими, при развитии технологий могут стать доступными всем) и/или дают реализовывать совершенно новые возможности. Артур Кларк сказал как-то про это: «Любая достаточно развитая технология неотличима от магии».

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

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

Дональд Норман изобразил эту связку в виде табуретки, где в качестве «ног» рассматриваются 3 сущности: человек, бизнес и технология. Её теперь так и называют: «Табуретка Нормана». Если одна из «ножек» слишком коротка или не учитывается при выпуске продукта, то такая табуретка будет неустойчивой, и продукт может провалиться на рынке. Лучшим решением для компании станет сбалансировать все 3 «ножки».

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

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