Опыт взаимодействия

Функциональные спецификации способствуют улучшению пользовательского опыта. Гаррет определяет их как «детальное описание функций, которые должен содержать сайт для удовлетворения потребностей пользователя». Также требуется описание «контента, необходимого на сайте: какой тип информации будет обрабатываться, для кого она предназначена и т. д.»^[2].

Одна из проблем работы веб-страниц, по мнению Стива Круга, в том, что люди не изучают, как работают вещи, а адаптируют их под себя. Это отличается от изначального замысла веб-дизайнера. Так происходит потому, что для большинства важно, чтобы вещь просто работала, а не то, как она устроена. Для этого не требуется высокий интеллект, скорее наблюдается недостаток заботы и внимания^[3].

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

Основные характеристики функциональных спецификаций^[4]:

1. Подробное описание всех критических ситуаций и аспектов, связанных с функциональностью продукта.
2. Чёткое описание функций, информацию о которых требуется получить.
3. Избегать технических подробностей, которые затрудняют понимание функций, указывая их только если это совершенно необходимо.
4. Краткость и точность; избегать повторов.
5. Концептуальная гибкость: описание не должно быть жёстким, нужно учитывать вариативность требований.
6. Использование таблиц или приложений, помогающих понять, что должно содержать каждое изделие.

Как составить функциональную спецификацию^[4]:

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

Следует учитывать, что функциональная спецификация отличается от технической спецификации. Отличие в том, что «функциональная спецификация описывает работу продукта с точки зрения пользователя, не заботясь о способе реализации: она говорит о функциях — экранах, меню, диалогах и др. Техническая спецификация описывает внутреннюю реализацию: структуры данных, модели реляционных баз данных, выбор языков и инструментов программирования, алгоритмы и т. д.»^[5].

Это процесс создания и оценки продуктов, систем или устройств, которые выполняют свои задачи и поддерживают деятельность людей как в работе, так и в повседневной жизни^[6].

Также это методика создания интерфейсов между человеком и автоматизированными системами, с целями:

1. Повышение эффективности.
2. Снижение кривой обучения.
3. Снятие барьеров на границе «человек-машина»^[7].

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

1. Определение нужд и требований.
2. Создание эскизов.
3. Построение прототипов.
4. Оценка результатов.

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

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

Дизайнеру необходимо понять цели, задачи, потребности и желания пользователей при использовании продукта^[9].

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

Большие объёмы данных требуют системной структуры, специализированных методов и новых профессий, ориентированных на информационные нужды пользователей. Это способствовало развитию новой области — архитектуры информации (AI).

Архитектор информации проектирует цифровое «здание»: определяет компоненты, коридоры, открытые пространства и сервисные зоны (только теперь компонентами здания становятся информационные блоки), — выстраивая внутреннее пространство сайта, строя навигационные и меточные системы для облегчения доступа к данным^[10].

Ричард Сол Вурман впервые применил термин в книге «Архитекторы информации». В 1976 году, будучи архитектором и руководителем ежегодной конференции Американского института архитекторов в Филадельфии, он вынес эту концепцию в качестве основной темы^[11].

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

• Понятные документы.
• Интерактивные системы.
• Навигационные информационные пространства.

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

Дервин (1999) утверждает, что информационный дизайн следует рассматривать с точки зрения коммуникационных процессов. В прошлом информация считалась просто описанием упорядоченной реальности; в эпоху Возрождения развитие техники увеличило объём доступных данных. XIX век поставил под сомнение единство порядка в информации из-за различий культурных, личных, пространственных и временных. В XX веке информация становится инструментом власти, влияя на принятие решений, подвергая сомнению идею скрытого порядка^[12].

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

«Процесс создания цифровых документов — неотъемлемая часть современного развития информационной науки, и именно в этом контексте должен рассматриваться информационный дизайн»^[13].

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

В проектировании информационных систем оптимизируются доступные ресурсы: человеческие, перцептивные — зрительные, слуховые, тактильные — экономические и прочие. Информация создаётся с учётом намерения, опыта, культуры, особенностей восприятия и понимания адресата^[14].

Как и в традиционном исследовании взаимодействия человек-компьютер, здесь речь идёт о проектировании элементов интерфейса для облегчения взаимодействия пользователя с функциональностью^[15].

Дизайн пользовательского интерфейса (интерфейс — поверхность физического и когнитивного контакта пользователя, программного обеспечения, компьютера и сетей информации) — это процесс проектирования, формализации и создания гипермедийных документов, которые легко воспринимать, с которыми удобно взаимодействовать и которые способствуют навигации. В широком смысле это означает соединение и взаимное влияние индивида, компьютера и культуры^[16].

Руководства по лучшим практикам акцентируют внимание на микроинтеракциях и визуальных сигналах (состояние hover, изменения курсора, всплывающие уведомления), чтобы повысить ясность интеракции и обеспечить немедленную обратную связь^[17]. Также рекомендуется предотвращать ошибки (маски ввода, неактивные кнопки), предлагать действия «Отменить» и упрощать операции типа «копировать в один клик». Подобные операционные приёмы дополняют традиционные теоретические подходы к UX.

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

Выбор структуры зависит от типа контента. Основные виды структур навигации^[18]:

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

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

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

Из главной страницы можно свободно переходить на другие без чётко выраженного порядка. Свободная организация подходит для небольших сайтов; для крупных — нежелательна из-за риска дезориентации.

Простой способ оценить визуальный дизайн продукта — спросить: куда в первую очередь направлен взгляд? Какие элементы привлекают внимание первыми? Соответствуют ли эти элементы главным продуктам по стратегическим целям, или наоборот, отвлекают пользователя от его задач^[20]? В жизненном цикле сайта визуальный дизайн — одна из последних стадий, поскольку множество аспектов внешнего облика определяется решениями на более ранних этапах^[21].

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

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

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

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

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

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

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

Опыт взаимодействия в видеоиграх

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

Видеоигра создаётся с чёткой целью — чтобы игроку было приятно с ней взаимодействовать. Здесь важен термин «игровой процесс» (играбельность). В работе «От юзабилити к играбельности: разработка видеоигр, ориентированная на игрока» играбельность определяется как «совокупность характеристик, описывающих опыт игрока с игровой системой, основной целью которой является развлечение и создание достоверного, приятного опыта — в одиночку или в компании»^[22].

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

Для разработки пользовательского опыта применяются разные методологии: проектирование, ориентированное на человека (англ. Human-Centered Design, HCD), проектирование, ориентированное на пользователя (англ. User-Centered Design, UCD) и проектирование, ориентированное на опыт (англ. Experience-Centered Design, XCD).

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

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

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