Дизайн пользовательского интерфейса
Проектирование пользовательского интерфейса (UI) или проектирование пользовательского интерфейса — это проектирование пользовательских интерфейсов для машин и программного обеспечения , таких как компьютеры , бытовая техника , мобильные устройства и другие электронные устройства , с упором на максимальное удобство использования и удобство использования . При проектировании компьютеров или программного обеспечения дизайн пользовательского интерфейса (UI) в первую очередь фокусируется на информационной архитектуре. Это процесс создания интерфейсов, которые четко сообщают пользователю, что важно. Дизайн пользовательского интерфейса относится к графическим пользовательским интерфейсам и другим формам дизайна интерфейсов. Цель дизайна пользовательского интерфейса — сделать взаимодействие пользователя максимально простым и эффективным с точки зрения достижения целей пользователя ( дизайн, ориентированный на пользователя ).
Пользовательские интерфейсы — это точки взаимодействия между пользователями и проектами. Есть три типа:
- Графические пользовательские интерфейсы (GUI). Пользователи взаимодействуют с визуальными представлениями на экране компьютера. Рабочий стол является примером графического интерфейса.
- Интерфейсы, управляемые с помощью голоса . Пользователи взаимодействуют с ними с помощью голоса. Большинство умных помощников, таких как Siri на смартфонах или Alexa на устройствах Amazon, используют голосовое управление.
- Интерактивные интерфейсы, использующие жесты . Пользователи взаимодействуют со средой трехмерного проектирования посредством своих тел, например, в виртуальной реальности (VR). играх
Проектирование интерфейсов задействовано в самых разных проектах: от компьютерных систем до автомобилей и коммерческих самолетов; все эти проекты включают во многом одни и те же базовые человеческие взаимодействия, но при этом требуют некоторых уникальных навыков и знаний. В результате дизайнеры, как правило, специализируются на определенных типах проектов и обладают навыками, основанными на их опыте, будь то дизайн программного обеспечения , исследование пользователей, веб-дизайн или промышленный дизайн .
Хороший дизайн пользовательского интерфейса облегчает выполнение поставленной задачи, не привлекая к себе лишнего внимания. Графический дизайн и типографика используются для обеспечения удобства использования , влияя на то, как пользователь выполняет определенные взаимодействия, и улучшая эстетическую привлекательность дизайна; Эстетика дизайна может улучшить или ухудшить возможности пользователей использовать функции интерфейса. [ 1 ] Процесс проектирования должен сбалансировать техническую функциональность и визуальные элементы (например, мысленную модель ), чтобы создать систему, которая не только работоспособна, но также пригодна для использования и адаптируется к меняющимся потребностям пользователей.
По сравнению с UX-дизайном
[ редактировать ]По сравнению с UX-дизайном , дизайн пользовательского интерфейса больше ориентирован на внешний вид и общий вид дизайна. Дизайн пользовательского интерфейса — это ремесло, в котором дизайнеры выполняют важную функцию по созданию пользовательского опыта. Дизайн пользовательского интерфейса должен держать пользователей в курсе происходящего, своевременно предоставляя соответствующую обратную связь. Визуальный внешний вид дизайна пользовательского интерфейса задает тон пользовательскому опыту. [ 2 ] С другой стороны, термин UX-дизайн относится ко всему процессу создания пользовательского опыта.
Дон Норман и Якоб Нильсен сказали:
Важно отличать общий пользовательский опыт от пользовательского интерфейса (UI), хотя пользовательский интерфейс, очевидно, является чрезвычайно важной частью дизайна. В качестве примера рассмотрим сайт с обзорами фильмов. Даже если пользовательский интерфейс для поиска фильма идеален, UX будет плохим для пользователя, которому нужна информация о небольшом независимом релизе, если базовая база данных содержит только фильмы крупных студий. [ 3 ]
Процессы
[ редактировать ]
Дизайн пользовательского интерфейса требует хорошего понимания потребностей пользователя. В основном он фокусируется на потребностях платформы и ожиданиях ее пользователей. В разработке пользовательского интерфейса есть несколько этапов и процессов, некоторые из которых более востребованы, чем другие, в зависимости от проекта. [ 4 ] (Примечание: в оставшейся части этого раздела слово « система» используется для обозначения любого проекта, будь то веб-сайт , приложение или устройство .)
- Сбор требований к функциональности – составление списка функциональности, необходимой системе для достижения целей проекта и потенциальных потребностей пользователей.
- Анализ пользователей и задач — форма полевых исследований, это анализ потенциальных пользователей системы путем изучения того, как они выполняют задачи, которые должен поддерживать дизайн, и проведения интервью для уточнения их целей. [ 5 ] Типичные вопросы включают:
- Что пользователь хочет от системы?
- Как система будет вписываться в обычный рабочий процесс или повседневную деятельность пользователя?
- Насколько технически подкован пользователь и какие подобные системы он уже использует?
- Какие стили внешнего вида интерфейса нравятся пользователю?
- Информационная архитектура – разработка процесса и/или информационного потока системы (т. е. для систем телефонного дерева это будет блок-схема дерева вариантов, а для веб-сайтов это будет поток сайта, показывающий иерархию страниц).
- Прототипирование — разработка каркасов в виде бумажных прототипов или простых интерактивных экранов. Эти прототипы лишены всех элементов внешнего вида и большей части контента, чтобы сконцентрироваться на интерфейсе.
- Проверка юзабилити – предоставление оценщику возможности проверить пользовательский интерфейс. Обычно считается, что это дешевле реализовать, чем тестирование юзабилити (см. шаг ниже), и его можно использовать на ранних этапах процесса разработки, поскольку его можно использовать для оценки прототипов или спецификаций системы, которые обычно не могут быть протестированы на пользователях. Некоторые распространенные методы проверки юзабилити включают когнитивное прохождение , которое фокусируется на простоте выполнения задач с помощью системы для новых пользователей, эвристическую оценку , в которой набор эвристик используется для выявления проблем с юзабилити в дизайне пользовательского интерфейса, и плюралистическое прохождение , при котором выбранная группа людей проходит сценарий задачи и обсуждает вопросы удобства использования.
- Юзабилити-тестирование — тестирование прототипов на реальном пользователе — часто с использованием метода, называемого протоколом «думай вслух» , когда вы просите пользователя рассказать о своих мыслях во время опыта. Тестирование дизайна пользовательского интерфейса позволяет дизайнеру понять восприятие дизайна с точки зрения зрителя и, таким образом, облегчает создание успешных приложений.
- Проектирование графического пользовательского интерфейса — фактический внешний вид окончательного графического пользовательского интерфейса (GUI). Это панели управления и грани дизайна; интерфейсы с голосовым управлением подразумевают устно-слуховое взаимодействие, а интерфейсы на основе жестов позволяют пользователям взаимодействовать с пространствами трехмерного дизайна с помощью телесных движений. Он может быть основан на результатах, полученных в ходе исследования пользователей, и усовершенствован для устранения любых проблем с удобством использования, обнаруженных в результате тестирования. [ 6 ] В зависимости от типа создаваемого интерфейса этот процесс обычно включает в себя некоторое компьютерное программирование для проверки форм, установления ссылок или выполнения желаемого действия. [ 7 ]
- Обслуживание программного обеспечения — после развертывания нового интерфейса может потребоваться периодическое обслуживание для исправления ошибок программного обеспечения , изменения функций или полного обновления системы. Как только будет принято решение об обновлении интерфейса, устаревшая система пройдет еще одну версию процесса проектирования и начнет повторять этапы жизненного цикла интерфейса. [ 8 ]
Требования
[ редактировать ]Динамические характеристики системы описываются с точки зрения требований к диалогу, содержащихся в семи принципах части 10 стандарта эргономики ISO 9241 . Этот стандарт устанавливает структуру эргономических «принципов» для техник диалога с определениями высокого уровня, иллюстративными приложениями и примерами этих принципов. Принципы диалога представляют собой динамические аспекты интерфейса и в основном могут рассматриваться как «ощущение» интерфейса.
Семь принципов диалога:
- Пригодность для задачи: диалог подходит для задачи, когда он поддерживает пользователя в эффективном и результативном выполнении задачи.
- Самоописательность: диалог является самоописательным, когда каждый шаг диалога сразу понятен благодаря обратной связи от системы или объясняется пользователю по запросу.
- Управляемость: диалог является управляемым, если пользователь может инициировать и контролировать направление и темп взаимодействия до момента достижения цели.
- Соответствие ожиданиям пользователя: диалог соответствует ожиданиям пользователя, если он последователен и соответствует характеристикам пользователя, таким как знание задачи, образование, опыт и общепринятым соглашениям.
- Толерантность к ошибкам: диалог толерантен к ошибкам, если, несмотря на очевидные ошибки во вводе, намеченный результат может быть достигнут без каких-либо действий со стороны пользователя или с минимальными действиями.
- Пригодность для индивидуализации: диалог способен к индивидуализации, когда программное обеспечение интерфейса можно модифицировать в соответствии с потребностями задачи, индивидуальными предпочтениями и навыками пользователя.
- Пригодность для обучения: диалог пригоден для обучения, если он поддерживает и направляет пользователя в обучении использованию системы.
Концепция удобства использования определяется стандартом ISO 9241 эффективностью, результативностью и удовлетворенностью пользователя.
Часть 11 дает следующее определение юзабилити:
- Удобство использования измеряется степенью достижения намеченных целей использования всей системы (эффективность).
- Ресурсы, которые приходится затрачивать для достижения намеченных целей (эффективность).
- Степень, в которой пользователь находит всю систему приемлемой (удовлетворение).
Эффективность, результативность и удовлетворенность можно рассматривать как качественные факторы удобства использования. Чтобы оценить эти факторы, их необходимо разложить на подфакторы и, наконец, на показатели удобства использования.
Представленная информация описана в части 12 стандарта ISO 9241 для организации информации (расположение, выравнивание, группировка, метки, расположение), для отображения графических объектов и для кодирования информации (аббревиатура, цвет, размер, форма, визуальные сигналы) по семи атрибутам. «Атрибуты представленной информации» представляют собой статические аспекты интерфейса и в целом могут рассматриваться как «внешний вид» интерфейса. Атрибуты подробно описаны в рекомендациях, приведенных в стандарте. Каждая из рекомендаций поддерживает один или несколько из семи атрибутов.
Семь атрибутов представления:
- Ясность: содержание информации передается быстро и точно.
- Различимость: отображаемую информацию можно точно различить.
- Лаконичность: пользователи не перегружены посторонней информацией.
- Последовательность: уникальный дизайн, соответствие ожиданиям пользователя.
- Обнаруживаемость: внимание пользователя направлено на необходимую информацию.
- Разборчивость: информация легко читается.
- Понятность: смысл ясно понятен, недвусмыслен, интерпретируем и узнаваем.
Руководство пользователя в части 13 стандарта ISO 9241 описывает, что информация руководства пользователя должна быть легко отличима от другой отображаемой информации и должна быть специфичной для текущего контекста использования.
Руководство пользователя может предоставляться следующими пятью способами:
- Подсказки, явно указывающие (конкретные подсказки) или неявно (общие подсказки), что система доступна для ввода.
- Обратная связь, информирующая о вводе пользователя своевременная, ощутимая и ненавязчивая.
- Информация о состоянии, указывающая постоянное состояние приложения, аппаратных и программных компонентов системы, а также действия пользователя.
- Управление ошибками, включая предотвращение ошибок, исправление ошибок, поддержку пользователей для управления ошибками и сообщения об ошибках.
- Онлайн-справка по запросам, инициируемым системой и пользователем, с конкретной информацией для текущего контекста использования.
Исследовать
[ редактировать ]Дизайн пользовательского интерфейса стал предметом серьезных исследований, в том числе его эстетики . [ 9 ] Стандарты для определения удобства использования программных продуктов были разработаны еще в 1980-х годах. Одной из структурных основ стала эталонная модель пользовательского интерфейса ИФИП.
Модель предлагает четыре измерения для структурирования пользовательского интерфейса:
- Измерение ввода/вывода (внешний вид)
- Измерение диалога (чувство)
- Технический или функциональный аспект (доступ к инструментам и услугам)
- Организационный аспект (поддержка коммуникации и сотрудничества)
Эта модель во многом повлияла на разработку международного стандарта ISO 9241, описывающего требования к дизайну интерфейса для удобства использования. Желание понять проблемы пользовательского интерфейса, специфичные для приложения, на ранних этапах разработки программного обеспечения, даже во время разработки приложения, привело к исследованию инструментов быстрого прототипирования графического пользовательского интерфейса, которые могли бы предложить убедительное моделирование того, как реальное приложение может вести себя в рабочем использовании. [ 10 ] Некоторые из этих исследований показали, что широкий спектр задач программирования для программного обеспечения с графическим интерфейсом на самом деле может быть определен с помощью других средств, помимо написания программного кода. [ 11 ]
Исследования последних лет сильно мотивированы растущим разнообразием устройств, которые в силу закона Мура могут иметь очень сложные интерфейсы. [ 12 ]
См. также
[ редактировать ]
- Главный специалист по опыту (CXO)
- Когнитивные аспекты
- Обнаруживаемость
- Опыт проектирования
- Гендерный ИЧК
- Рекомендации по человеческому интерфейсу
- Взаимодействие человека и компьютера
- Дизайн иконок
- Информационная архитектура
- Дизайн взаимодействия
- Шаблон проектирования взаимодействия
- Язык моделирования потока взаимодействия ( IFML )
- Техника взаимодействия
- Визуализация знаний
- Смотри и чувствуй
- Мобильное взаимодействие
- Естественное картографирование (дизайн интерфейса)
- Новые интерфейсы для музыкального самовыражения
- Совместный дизайн
- Принципы проектирования пользовательского интерфейса
- Процессно-ориентированный дизайн
- Прогрессивное раскрытие информации
- Т-макет
- Дизайн пользовательского опыта
- Ориентированный на пользователя дизайн
Ссылки
[ редактировать ]- ^ Норман, Д.А. (2002). «Эмоции и дизайн: привлекательные вещи работают лучше» . Журнал «Взаимодействия», ix (4) . стр. 36–42. Архивировано из оригинала 28 марта 2019 года . Проверено 20 апреля 2014 г. - через jnd.org.
- ^ Рот, Роберт Э. (17 апреля 2017 г.). «Дизайн пользовательского интерфейса и пользовательского опыта (UI/UX)» . Свод знаний по географической информатике и технологиям . 2017 год (второй квартал). дои : 10.22224/gistbok/2017.2.5 .
- ^ «Определение пользовательского опыта (UX)» . Нильсен Норман Групп . Проверено 13 февраля 2022 г.
- ^ Вольф, Лорен (23 мая 2012 г.). «6 советов по разработке оптимального пользовательского интерфейса для вашего цифрового мероприятия» . ИНКСПО. Архивировано из оригинала 16 июня 2013 года . Проверено 22 мая 2013 г.
- ^ Энн Блэндфорд. «Полуструктурированные качественные исследования» . Энциклопедия взаимодействия человека и компьютера, 2-е изд . Фонд интерактивного дизайна . Проверено 20 апреля 2014 г.
- ^ Карен Хольцблатт и Хью Р. Бейер. «Контекстный дизайн» . Энциклопедия взаимодействия человека и компьютера, 2-е изд . Фонд интерактивного дизайна . Проверено 20 апреля 2014 г.
- ^ Мартин Фаулер. «Формы и контроль» . Архитектура графического интерфейса . публикация мыслительных работ . Проверено 20 февраля 2017 г.
- ^ «8 этапов жизненного цикла интерфейса HL7 — Caristix» . Каристикс . 05.10.2010 . Проверено 01 марта 2017 г.
- ^ «Роль контекста в восприятии эстетики веб-страниц с течением времени» . Международный журнал человеко-компьютерных исследований. 05.01.2009 . Проверено 2 апреля 2009 г.
- ^ «ГУМАНОИДНАЯ модель дизайна интерфейсов» . Труды ЧИ'92. 1992.
- ^ «Создание пользовательских интерфейсов с использованием программирования на примерах, визуального программирования и ограничений» . АКМ. 11 апреля 1990 г. Проверено 2 апреля 2009 г.
- ^ «Прошлое, настоящее и будущее программных инструментов пользовательского интерфейса» . АКМ. 01.03.2000 . Проверено 2 апреля 2009 г.