ADV.Systems

09 Июл 2017

Методы разработки интерфейса

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

Сразу оговорюсь, что за редким исключением, я практически полностью опираюсь в этом вопросе на работы Алана Купера (Alan Cooper), Джеффа Раскина (Jeff Raskin) и Джеймса Гарретта (James Garrett). Глобальным различием может быть лишь тот факт, что разработка юзабилити интерфейса в рамках каждой конкретной социальной и территориальной группы пользователей имеет свои нюансы.

Разработка архитектуры и юзабилити проекта

«Если в интерфейсе соблюдается принцип видимости, то каждая функция и способ ее использования для большинства людей из той культуры, на которую этот интерфейс ориентирован, становятся очевидными только лишь по одному виду. Элемент управления, который имеет такое свойство, стали называть состоятельным (affordance). «Состоятельность является хорошим средством для связки элемента интерфейса с его целью. Ручки используются для настройки; гнезда — для вставки чего-то; мячи — для их бросания или пинания» (Norman, стр. 9)»
(Jeff Raskin, стр. 50).

Этапы разработки

— Анализируем полученные данные.
— Создаём логику и архитектуру проекта.
— Создаём прототип.
— Из простого в элементарное. Сокращаем количество кликов.
— Из элементарного в интуитивное…

Адаптивный интерфейс — «Палка о двух концах»

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

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

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

Взаимодействие с пользователем должно быть обоюдным

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

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

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

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

Обращение к конкурентному ресурсу, не обладающему достойными характеристиками интерфейса. Например, использующему обычные гиперссылки, открывающие E-mail-клиент, определённый по умолчанию, вместо ожидаемого сервиса «Всё в одном» вызовет некоторую задержку. Человеку, привыкшему использовать web-интерфейс своей электронной почты это не принесёт ничего кроме раздражения. Попытка защитить страницу от копирования при помощи блокировки базовых функций операционной системы вызывает у пользователя бешенство…

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

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

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

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

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

Этапы разработки

Разработка интерфейса обычно начинается с определения задачи или набора задач, для которых продукт предназначен. Суть задачи, а также средства, имеющиеся для реализации ее решения, часто формулируют в виде требования или спецификации. (Jeff Raskin стр. 62) Фактически, всё остальное время посвящено непосредственно анализу информации о задачах, которые ставит целевая группа и синхронизацией их требований с поставленными менеджерами условий.

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

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

Третий этап — оптимизация и упрощение интерфейса. Вырезаем и перемещаем все отвлекающие функции. Удаляем неактивные элементы меню. Чистим, моем и отсекаем всё лишнее… Снова создаём прототип и повторяем второй и третий этапы. Когда всё готово — смело переходим к графическому дизайну.

Графический дизайн

«Видимость означает не просто возможность заметить наличие. Любой объект может быть видимым в том смысле, что он может быть обнаружен в определенном месте, но при этом он может быть очень небольшим по размеру или иметь небольшой контраст с фоном,чтобы быть легко замеченным. Оптимизация качества восприятия интерфейса является важным аспектом с точки зрения эргономики, и основное значение здесь имеют когнитивные свойства интерфейса.»
(Jeff Raskin, стр. 51)

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

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

Если мы делаем web-интерфейс для сток-центра, задачей которого является реализация продукции эконом-класса, авторский дизайн, выполненный на высшем художественном уровне может оказать противоположное влияние и снизить продажи. При этом простое, в том числе нестандартное решение — повысит популярность этого предприятия. Говоря о простом и доступном дизайне, я ни в коей мере не пропагандирую “ширпотреб” или откровенную халтуру. Стереотипы так же не выход. Хороший дизайнер всегда сохраняет свой индивидуальный стиль, однако он не должен превалировать над задачами проекта.

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

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