Два месяца назад одноимённый фонд (не смейся, такой есть) выпустил статью «Что такое дизайн взаимодействия», её перевели всё, кто только можно, но почему-то сделали это забив на контекст. Вот мой вольный перевод на русский, где вместо «время» я пишу «анимация», а вместо «слова» буду писать «язык текста». А также я перепишу то, с чем не до конца согласен.
Содержание
Что такое проектирование взаимодействия
Если просто: это то, что происходит между пользователем и продуктом. Хорошее взаимодействие поможет пользователю получить желаемое от продукта максимально понятным и простым способом. Взаимодействие — это также процесс использования интерфейса.
Довольно размытое определение, но и область широкая. Взаимодействия включает в себя такие области, как эргономика, анимация, звук и множество других. Каждый отдельный случай может затрагивать какие-то очень специфичные вещи: от отклика вибрацией по нажатию, до озвучивания статусов или реакций продукта на взаимодействие.
Между UX проектированием и проектированием взаимодействий очень сильное пересечение. Лично я включаю последнее в UX, так как в проектировании пользовательского опыта множество других дисциплин, помимо взаимодействия. Это исследования, проектирование навигации, тестирование, логика, структура, паттерны проектирования и пр.
5 измерений дизайна взаимодействия
Полезной моделью для понимания дизайна взаимодействия модет быть разбиение его на «измерения». В оригинальной статье это представлено, как представление разных «срезов» предмета, но я скорее воспринимаю их как уровни и добавлю свой комментарий по этому поводу, в каждый. Первые 4 были разработаны Gillian Crampton Smith, последний дополнен Kevin Silver из IDEXX Laboratories.
Язык текста
В оригинально статье «слова», с чем я не согласен. Слова — лишь форма смысла, поэтому я заменил этот пункт на «язык текста». Важно, чтобы пользователю через взаимодействие была предоставлена исчерпывающая, но не избыточная информация. Тогда он сможет прилагая минимальные усилия принимать решения о дальнейших действиях с продуктом. Человеческая речь — непростой инструмент, который может легко как убить нужные смыслы, так и добавить ненужные. Чтобы этого избегать, текст при взаимодействии должен быть простой и однозначный.
Визуальный язык
Второй уровень, визуальный язык, поддерживает текст. Такие вещи, как типографика, стиль коммуникации, изображения и иконки очень важны для передачи информации. Если использовать паршивое форматирование текста и нечитаемые цвета, то это усложнит взаимодействие. Заставит пользователя больше думать, меньше доверять сказанному.
Медиум и контекст
Физический способ взаимодействия и то, как и где оно происходит. Через ноутбук, смартфон, или хрустальный шар, с помощью мыши, трясущегося пальца или геймпада. В офисе, дома на диване или за рулём. Всё это важно учитывать при проектировании взаимодействия. Не будет хорошего взаимодействия у серфингиста с умными часами, в которых больше 4 кнопок, как и не будет хорошего взаимодействия у пользователя в сложных задачах при чрезмерно упрощённом интерфейсе.
Анимация
Тут скорее в расширенном понимании слова, как «оживление». В оригинальной статье это время и всё, что связано с моментами во времени: движение, звуки, отклики и прочее. В моём понимании, весь интерфейс, безотносительно взаимодействия существует и работает через движение времени, поэтому я переписал определение. В работе с интерфейсом обратная связь очень важна. Отклик на действия пользователя, или независимое функционирование интерфейса «оживляет» его, делает взаимодействие более естественным и понятным.
Характер
Хотел сначала даже перевести это измерение, как «повадки». То, как продукт ведёт себя в целом, и как складываются все прошлые уровни в конечное взаимодействие. Тот самый Look&Feel, который определяет характер продукта.
Важные вопросы которые задают дизайнеры взаимодействия
Эти вопросы помогают сформировать принципы в дизайне взаимодействия, которые будут работать корректно во всех ранее перечисленных измерениях. В отличие от оригинальной статьи, я привяжу их к измерениям, чтобы было прозрачнее.
- Как пользователь может вводить информацию? Ответ на этот вопрос поможет спасти сёрфера, который тыкается пальцами на экране часов от разгадки ребусов, а пользователя компьютерной мыши от гигантских кнопок. Относится к уровню Медиум и контекст.
- Что в визуальном языке поможет пользователю лучше понимать функцию? Это про визуальный язык взаимодействия: форма, цвет, размер, расположение, акцент. Всё может помочь пользовательскому пониманию.
- Помогают ли пользователю сообщения об ошибках решать проблему? Это относится и к языку текста и характеру.
- Какой отклик получит пользователь после действия? Это относится к анимации, важно в разумное время предоставлять адекватную обратную связь, показывать, что система живая, а не повисла.
- Подходящего ли размера органы в интерфейсе? Для хорошего взаимодействия важно дать пользователю попадать толстым пальцем в кнопочку. Это так же относится к визуальному языку.
- Используются ли знакомые пользователю общепринятые элементы? Идеально, если взаимодействию с продуктом не приходится учиться вообще, для этого лучше использовать известные паттерны. Относится сразу ко всем слоям взаимодействия.
Роль дизайнеров взаимодействия, что они делают
Если компания достаточно большая, то может быть целесообразно разделять труд. Например на: проектировщиков взаимодействия, UX исследователей, визуальных или UI дизайнеров. В небольших компаниях UX могут заниматься пара человек, названия должностей которых могут включать «проектирование взаимодействия», а могут не включать. Так или иначе, ежедневная работа проектировщиков взаимодействия включает в себя следующее.
Концепции и принципы дизайна взаимодействия
Каждая работа нуждается в систематизации. Обычно из успешных частей интерфейса извлекают набор удачных решений, и на основе их строят сначала концепцию, а затем и принципы-руководства. Так же принципы взаимодействия могут быть важным свойством отстройки от конкурентов и сильно перекликаются с идентичностью бренда и бренд-стратегией.
Стратегия проектирования
Стратегия опирается на пользовательские цели и те взаимодействия, которые нужны, чтобы их достичь. Иногда дизайнер взаимодействия проводит пользовательские исследования, чтобы выяснить эти цели и проблемы, чтобы позже интерпретировать их во взаимодействия.
Вайрфреймы и прототипы
В зависимости от разделения ролей в команде, дизайнеры взаимодействия могут проектировать вайрфреймы с точками контактов пользователи и системы, Интерактивные прототипы, чтобы покрыть уровень «оживления» и высокодетальные прототипы, чтобы описать визуальный язык взаимодействия.
UX-копирайтинг
В оригинальной статье не сказано, но я также сюда включаю и работы по написанию текстов для пользователей. Хорошим тоном является понятный язык при взаимодействии с интерфейсом, поэтому в обязанности таких дизайнеров полезно включать и UX-копирайтинг.
Что почитать
Неплохим стартом будет книжка «Не заставляйте меня думать» Стива Круга.