Методы исследования UX – Опросы

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

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


Когда применять

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


Как проводить опоросы

Для начала проведите подготовительную работу:

1) Сформулируйте цель исследования

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

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

2) Подберите респондентов

Один из наиболее сложных этапов это, подбор нужных респондентов. Если у вас есть клиентская база тут все просто – делаете рассылку, пишите напрямую, стимулируете участие в опросе всякими плюшками. Сам попрос можно проводить, например через Google Forms или Surveymonkey. Можно также воспользоваться специализированными сервисами например от ЯндексВзгляд, anketolog.ru или oprosso.ru, но тут всегда есть риск, что на сторонней платформе вы не найдете свою ЦА.

3) Сформулируйте вопросы

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

Рассмотрим наиболее частые типы вопросов:

Вопросы да/нет
Помогают узнать отношение респондента к чему-либо или отсортировать аудиторию по категориям. Например:

– Вы когда-нибудь пользовались сервисом каршеринга?
– Вы бы заказали медикаменты через онлайн-сервис?

Вопросы с вариантами ответов
Могут быть использованы для сбора детальной информации о ЦА. Например:

– Как часто вы осуществляете покупки через интернет-магазины?
– Укажите ваши любимые спортивные бренды.

Открытые вопросы
Для уточнения какой-либо дополнительной информации или пожеланий можно предложить респонденту добавить развернутый ответ. Например:

– Какие дополнительные функции вы бы пожелали увидеть?

Оценочная шкала
Используется для субъективных оценок, например: определенных качеств, согласия с высказыванием, впечатления от чего-либо.
Например:

– Оцените сложность выполнения задания по 5-бальной шкале

Как задавать вопросы

Задавайте вопросы в логичной последовательности не перемешивая разные темы. Всегда лучше разбить вопросы на группы.

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

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

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

На этом все! Надеюсь было полезно.

#методы

Визуальные тренды года

Год неумолимо подходит к концу. Время подвести итоги... Редакция платформы EditorX выкатила обзор наиболее популярных приемов визуального дизайна этого года. Многие из них мы несомненно увидим и в предстоящем году. Что любопытно: нет никакой стилистической целостности в плане дизайна. Тут и ностальгия по интернет движу 90-х, и Веб 3, хэндмейд коллажи, мягкие 3д элементы, яркие цвета... В общем огромная поляна для экспериментов! 

Вот основные тенденции веб-дизайна этого года, по мнению платформы:

1. Брендинг на основе искусственного интеллекта

2. Кислотный зеленый

3. Динамическая айдентика и логотипы

4. Ретростиль 90-х

5. Субверсивная навигационная иерархия

6. Дружелюбные шрифты

7. Мягкие, тактильные 3D-элементы

8. Цифровые коллажи и эстетика хэндмейд

9. Анимация и триггеры на основе прокрутки

10. Конфетные цвета


Приятного просмотра!

Самый важный навык дизайнера

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

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

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

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

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

С Новым годом, мои дорогие подписчики!

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

Этот год хотелось бы открыть с опроса, он поможет мне понять в каком направлении стоит дальше писать статьи.

Да, опрос был на прошлой неделе, но я, в силу своей криворукости, благополучно его удалил ;) Поэтому, не сочтите за труд проголосовать еще раз.
Если есть предложения о чем еще стоит писать, кидайте в бот @uxtrends_bot или коменты. Спасибо 🙏

Полезное чтиво для саморазвития

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

Майк Монтейро: «Дизайн — это работа»
В книге доступно описан процесс работы в сфере дизайна – начиная от самопрезентации и заканчивая основами общения с клиентом. Автор разбирает распространенные рабочие эпизоды показывая на примерах как избежать многих ошибок.

Остин Клеон: «Кради как художник» 
Практичная и увлекательная книга для всех, кто хочет найти свой путь в творчестве. 
Отличное пособие, полное иллюстраций, упражнений и примеров для тех, кто мечтает реализовать свои идеи в цифровой век.

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

#почитать

Принципы проектировки интерфейсов – Правило третей

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


Как применять в дизайне

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


Совет

Если вы видите, что в вашем макете что-то пошло не так – попробуйте прогнать дизайн через правило третей. Это поможет гармонично распределить элементы и убрать все лишнее.

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

Визуальная иерархия

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

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

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

Как за 5 минут настроить шрифты в макете


1) Создаем гармоничные размеры

Взяв за основу базовый размер шрифта, например 16px, нужно определить его соотношение размеров – коэффициент с которым мы получим размеры шрифта для заголовков и более мелких надписей. 
Чем выше соотношение – тем контрастнее будет смотреться дизайн.
Наиболее просто, это можно сделать с помощью сервиса https://type-scale.com
Задав базовый размер мы получим 9 гармоничных размеров шрифта.


2) Создаем вертикальный ритм

Теперь необходимо найти оптимальную высоту вертикального отступа между элементами.
Наиболее наглядно это можно сделать с помощью сервиса https://gridlover.net Тут есть все, что нужно – HTML разметка, CSS стили, а также подсветка сетки вертикального ритма. С помощью слайдера можно легко настроить размер шрифта, соотношение размеров и высоту строки.

Дайте знать в реакциях, если было полезно!

Книги для саморазвития, правило третей, визуальная иерархия...

Посты, которые вы могли пропустить за эту неделю.

– Полезное чтиво для саморазвития

– Принципы проектировки интерфейсов – Правило третей

– Визуальная иерархия

– Как за 5 минут настроить шрифты в макете

Вдарьте по реакциям, если посты были для вас полезны!

Темные паттерны в UX – как не надо делать и как не попасться самому

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

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


1. Запрос кредитной карты при регистрации пробного периода

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


2. Автоматическая подписка на рассылку рекламных сообщений

Несмотря на европейский общий регламент по защите данных (GDPR) многие интернет-магазины тайно добавляют своих покупателей в коммерческие рассылки, не предлагая им двойное подтверждение подписки на рассылку (Double-Opt-In).


3. Незаметное добавление лишнего товара или услуги в корзину

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


4. Получение доступа к вашим контактам

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


5. Злоупотребление стимулирующими сообщениями

В электронной коммерции или бронировании билетов многие крупные компании злоупотребляют сообщениями, как например: «Скидка 10% только сегодня», «Этот товар был продан 5 минут назад», «Последнее место по этой цене»  и так далее. Как правило продавец просто пытается манипулировать своими пользователями.


В заключение

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

Кстати, есть сайт deceptive.design посвещенный данной тематике, с примерами и подробным разбором всех трюков.

Почему не стоит использовать меню-гамбургер

Исследование проведенное NNGroup в 2016 году пришло к выводу, что кнопка меню-гамбургер с тремя полосками негативно отражается на пользовательском опыте. Главная проблема – пользователи не знают какие разделы там скрыты, поэтому часто даже не пытаются вызвать скрытое меню. 

Как видно из графика под постом в мобильной версии только 57% пользователи вызвали скрытое меню, в версии для ПК таких пользователей было всего 27%
Ссылка на исследование.


Какую альтернативу тут можно использовать?

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


Есть несколько исключений когда меню-гамбургер все-таки можно применить

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

2) Если разделов слишком много и их все-таки надо отобразить в меню (например категории товаров в интернет-магазине). В этом случае пользователю стоит предложить альтернативные методы доступа к информации, например списком на отдельной странице или через поиск.

Также такое меню советуют подписывать и выделить на общем фоне. Но с точки зрения UX идеальным такое решение не будет. Всегда пробуйте проработать альтернативные варианты.

Методы исследования UX – Проверка качества восприятия

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


Как проводится тестирование

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

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

Психология в дизайне – Правило 100

Привило 100 – один из видов когнитивное искажения, при котором форма подачи информации влияет на ее восприятие человеком. Правило гласит:

Если стоимость товара меньше 100 долларов, то скидка в процентах кажется больше.  А если стоимость товара больше 100 долларов, то скидка, выраженная в долларах, кажется больше.

Это значит, что скидка в 10% на рубашку стоимостью $50, будет казаться нам более выгодной, чем скидка в $5. В то время как скидка для более дорогого товара, например для смартфона стоимостью $600, будет казаться нам более привлекательной если она выраженна в абсолютной величине – $120 вместо 20%.


Почему это важно для дизайна

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

Правило 100, один из способов управления восприятия пользователей через, так называемый фрейминг. Его применяют повсеместно: в политике, СМИ, маркетинге и конечно же в пользовательском опыте. О нём напишу позже, если тема вам интересна.

Как провести брифинг с клиентом и не облажаться

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


Подготовка

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


Какие вопросы задавать на брифинге с новым клиентом?

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


1. Выясните цели и задачи 

Узнайте вводные данные о проекте и какую задачу бизнеса он решает:
– Какое решение применяется сейчас? Почему оно не устраивает клиента?
– Кто клиенты компании для которых проектируется продукт?
– Какие конкурентные решения уже есть на рынке? 
– Что является УТП (уникальными торговыми предложениями) продукта?


2. Выясните требования

Выясните как клиент видит будущее решение:
– На какой платформе оно должно быть реализовано?
– Какие конкретные пожелания есть по функциональности?
– Какие функциональные и визуальные решения у конкурентных продуктов нравятся заказчику?
– Какие решения заказчик не хотел бы видеть в продукте?


3. Процесс

Согласуйте как будет выстраиваться работа с заказчиком и определите сферу ответственностей:
– Какие сроки отводятся на проектирование, дизайн и реализацию проекта?
– Кто и как будет утверждать результаты работ?
– Кто будет создавать контет (тексты/фото) для продукта?


4. Определите дальнейшие действия

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

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

Темные паттерны в UX, правило 100, брифинг с клиентом...

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

Посты, вышедшие за эту неделю на канале:

Темные паттерны в UX – как не надо делать и как не попасться самому


Почему не стоит использовать меню-гамбургер


Методы исследования UX – Проверка качества восприятия


Психология в дизайне – Правило 100


Как провести брифинг с клиентом и не облажаться

Как предотвратить дорогие ошибки – правило 1-10-100

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

Следуя правилу, любая задуманная и реализованная идея проходит три стадии:

1. Планирование

2. Воплощение

3. Применение

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

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


Какой вывод можно тут сделать?

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

Эффект фрейминга – как управлять восприятием пользователей

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


Применение эффекта

Представим, что пользователь хочет провести обновление системы. Нажав на кнопку «Запустить обновление системы» он увидит сообщение:

Вариант А:
«Вы собираетесь запустить процесс обновления системы. С вероятностью 99% операция пройдет успешно.»

Вариант Б:
«Вы собираетесь запустить процесс обновления системы. Есть крайне малая вероятность безвозвратной потери данных.»

Так в варианте Б, одно только упоминание о вероятности потерять данные может быть воспринято более остро, чем существующий риск в 1%. В данном случае подача меняет представление о риске.

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

«Вы получили 1250 очков, ваш рейтинг 92/100»  

«Вы заработали 1250 очков. Поздравляем, вы попали в ТОП 10 лучших игроков!»

Семантически, смысл сообщений тот же, однако второй вариант вызывает более сильные эмоции.


Вывод

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

На этом все!

Как запороть первую встречу с клиентом

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


1. Не стоит пытаться демонстрировать свою экспертность

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


2. Нельзя предлагать решения

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


3. Не стоит негативно оценивать посторонних людей

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


В заключение

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

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

На этом все! Стоит писать больше по теме общения с клиентом?