UX Notes
24.7K subscribers
59 photos
4 videos
1 file
1.18K links
В соцсетях: vk.com/ux_notes и fb.com/uxnotes
Чат читателей: @uxnoteschat
О карьере в UX-дизайне и вакансии: @uxwork

Рекламодателям: uxnotes.ru/ads · В перечне РКН: gosuslugi.ru/snet/67a9a56970de7b4d761a81ae

Est. 2016 · Автор: @zGrav
加入频道
Подготовил пересказ доклада Александра Брагина из продакшена VR2GO на тему «Виртуальная реальность для бизнеса. Особенности проектирования взаимодействия»:

— Как используется сейчас (ссылки на интересные кейсы);
— Советы маркетологам;
— Технологии;
— Рекомендации по дизайну виар-приложений.

https://medium.com/rofldorf/5820f05091b4
Работу аналитика и дизайнера, когда это 2 разных человека, обычно видят так: аналитик собирает и предоставляет данные, а дизайнер на их основе принимает решения и создаёт макеты. Наталья Бабаева объяснила, почему это не работает.

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

Одна из точек пересечения — пользовательские сценарии. Дизайнер может их увидеть, а аналитик просчитать. Основные вопросы: 1) откуда люди переходят на страницу, 2) куда уходят? Маршрут помогает понять людей и цель их визита гораздо лучше, чем средний возраст и пол. Из идей, как изменить эти маршруты, рождаются дизайнерские решения.
Евгений Брянцев поделился кейсом создания автобусной остановки, который не ограничился красивыми макетами. Внутри: 4 месяца согласования с мутными экспертами, выдающееся качество работы подрядчиков, создание официальной транспортной схемы. И это за свой счёт, без намерения залезть в бюджет.

«Раз в две недели начали ходить на заседания градостроительного совета и рассказывать о нашем проекте. Раз в две недели нам отказывали. Причин было много, но основные три: она была чёрной, на ней не было функции обращения к правительству и она не несла патриотической нагрузки. Да. Управление транспорта ставило остановки из металла со скамейками, раскрашенными в триколор.

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

Чтобы такого не происходило, Мэтт Ходжес рекомендует и показывает, как это делает Intercom:

— Поймите, ради какой работы пользователи нанимают ваш продукт (методика JTBD);
— Определите, на какие вопросы и в каком порядке следует ответить;
— Подумайте, как на страницу попадут люди без конкретного образа продукта, и поправьте текст и URL;
— Покажите на первом экране, как продукт справляется с работой;
— Если есть возможность, добавьте объясняющие видео (не длиннее 2 минут);
— Используйте прилипающую шапку со ссылками на ключевые разделы, чтобы облегчить навигацию;
— Покажите, из каких подзаданий складывается выполнение работы;
— Расскажите, за счёт какой функциональности это возможно (функции необходимые, плюс, отличающие продукт от конкурентов);
— Предъявите доказательства качества: покажите клиентов и достигнутые ими результаты;
— Помогите определить, сколько продукт будет стоить;
— Дайте возможность легко перейти к регистрации: разместите несколько призывов к действию;
— Измеряйте эффективность страницы и тестируйте другие варианты.

In English.
Кристиан Холст из Baymard Institute по итогам большого исследования чекаута написал, как упростить ввод номера карты. Рассмотрены: разделение номера на блоки, валидация с учётом пробелов и разной длины номера, форматы и разметка номера (есть шпаргалка).

Основные рекомендации:
— Дайте пользователям ввести пробелы в поле ввода номера карты;
— Сайты не должны запрещать символ пробела и устанавливать ограничения на количество символов;
— В идеале поле должно на лету форматировать введённый номер;
— Для номеров карт VISA, MasterCard, JCB и Discover, состоящих из 16 цифр, можно автоматически добавить пробел после каждой 4-й цифры;
— Для состоящей из 15 цифр AMEX — использовать схему 4−6−5.

https://vc.ru/27451-kak-uprostit-vvod-nomera-kreditnoy-karty-dlya-polzovateley
Во многих формах подписки на email-рассылку встречается фраза «без спама» и её вариации. Не уверен, существовали ли времена, когда любой бизнес тут же присылал новому пользователю тонны спама, но это не так важно.

Продавать рассылку обещанием не присылать спам — всё равно что продавать пиццу, обещая не добавлять в неё крысиные хвосты. Мы как вид уже давно условились, что в пицце не должно быть крысиных хвостов, а в рассылках — спама.

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

Михаил Кафанов написал, почему в форме подписки на рассылку не стоит писать «без спама».

http://avemisha.com/korotko-i-bez-spama/
Константин Самойлов рассказал о голосовых помощниках и своём опыте работы над OK Google. Снова актуальная тема в свете выхода яндексовой Алисы.

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

4 года назад начали проводить тесты. На первом же тесте пользователь сказал что-то, чего разработчики не планировали. Система не сработала, разработчики сказали: "Чёрт, мы об этом не подумали".

Год назад на очередном тесте пользователь сказал улучшенной системе что-то такое, что она не сработала, и разработчики сказали: "Чёрт, об этом мы тоже не подумали". Шло время, развивалось дерево решений и грамматики для конкретной задачи, и каждый новый тест выявлял исключение, которое разработчики не учли».

https://vc.ru/27565
Channel photo updated
Channel name was changed to «UX Notes»
Саша Бизиков сделал редизайн иконки нашего канала. Ура, товарищи!
Дмитрий Мацкевич рассказал о поведенческом дизайне:

— Как работает мозг;
— Как люди принимают решения;
— Какие при этом совершают ошибки;
— Как работают дофаминовые циклы, привычки и зависимости;
— И как всё это применить к продуктовому дизайну.
В лекции о поведенческом дизайне (в прошлой заметке) Дмитрий Мацкевич порекомендовал книги для более глубокого изучения темы:

1. «Думай медленно… Решай быстро» Дэниел Канеман
ozon.ru/context/detail/id/24286114/

2. «Психология глупостей. Заблуждения, которые мешают нам жить» Дэвид Макрэйни
ozon.ru/context/detail/id/17968046/

3. «Покупатель на крючке. Руководство по созданию продуктов, формирующих привычки» Нир Эяль
ozon.ru/context/detail/id/28516860/

4. «Правила мозга. Что стоит знать о мозге вам и вашим детям» Джон Медина
ozon.ru/context/detail/id/28349838/

5. «Nudge. Архитектура выбора. Как улучшить наши решения о здоровье, благосостоянии и счастье» Касс Санстейн, Ричард Талер
ozon.ru/context/detail/id/142027458/

6. «Пластичность мозга: Потрясающие факты о том, как мысли способны менять структуру и функции нашего мозга» Норман Дойдж
ozon.ru/context/detail/id/5102427/

7. «Как мы принимаем решения» Джона Лерер
ozon.ru/context/detail/id/5317226/

8. «Buyology: Увлекательное путешествие в мозг современного потребителя» Мартин Линдстром
ozon.ru/context/detail/id/4734395/

9. «Neuroscience» Dale Purves, George J. Augustine
amazon.com/Neuroscience-Dale-Purves/dp/0878936955/

10. «Theory of Fun for Game Design» Raph Koster
amazon.com/Theory-Game-Design-Raph-Koster/dp/1449363210/

11. «Мозг. Ваша личная история» Дэйвид Иглмен
ozon.ru/context/detail/id/137324220/

12. «Переломный момент. Как незначительные изменения приводят к глобальным переменам» Малкольм Гладуэлл
ozon.ru/context/detail/id/19901037/

13. «Эгоистичный ген» Ричард Докинз
ozon.ru/context/detail/id/142030241/

14. «Эволюция разума» Рэй Курцвейл
ozon.ru/context/detail/id/32926032/

15. «Sapiens. Краткая история человечества» Юваль Ной Харари
ozon.ru/context/detail/id/141677922/
Николай Бабич написал об интерфейсных анимациях, которые улучшают UX.

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

In English.
Гай Лигертвуд поделился рекомендациями UX-писателям.

— Сотрудничайте с дизайнерами, вместе прорабатывая структуры страниц и адаптируя дизайн под контент;
— Сотрудничайте с исследователями, чтобы говорить с пользователем на одном языке;
— Ориентируйте текст на пользователя. Пишите «вы ввели неверный пароль», а не «произошла ошибка входа»;
— Пишите лаконично, сначала говорите о важном;
— Убирайте жаргон и технические термины, чтобы расширить контекст;
— Призывайте пользователей к адекватным ситуации действиям. На кнопке под сообщением «неверный пароль» пишите не «Ок», а «Попробовать ещё» и «Восстановить пароль»;
— Переписывайте текст в стиле вашего бренда. Google вместо «Wrong password» напишет «That password doesn’t look right» (но это не точно);
— Проводите а/б-тесты.

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

In English.
👍1
Филипп Фильченко рассказал, как MobileUp использует прототипы и дизайн-концепты в своих продажах, в том числе через тендеры. Сколько времени на это тратят и по каким критериям выбирают клиентов, за чьи проекты стоит побороться.

https://vk.com/video-128666765_456239035
Дмитрий Коваленко написал о формах оформления заказа. Среди рекомендаций:

— Спрашивайте как можно меньше данных и заполняйте за пользователя поля, которые можете;
— Автоматически фокусируйтесь на первом поле;
— Используйте одноколоночную структуру (есть исключения);
— Разделяйте поля на смысловые группы;
— Ограничивайте размеры полей и вводимые данные;
— Проверяйте данные сразу после заполнения поля;
— Не прячьте подписи к полям после их заполнения;
— Помечайте необязательные поля (если их меньше, чем обязательных);
— Не отвлекайте пользователя лишними ссылками;
— Активируйте кнопку отправки данных после заполнения формы;
— Объясняйте, зачем вам нужны специфические данные;
— Не забывайте о дальтониках.
В aic провели карточную сортировку, чтобы уточнить каталог продовольственных товаров для одного из клиентов. Часто каталог создаётся хаотично — новые категории добавляются без строгой последовательности. Обычно встречаются 2 видимых проблемы: слишком много категорий 2-го и 3-го уровня и нелогичное расположение категорий.

В статье можно узнать, какие виды карточной сортировки бывают, когда их лучше применять и как к ним готовиться:
— Обратная карточная сортировка: респондент в готовом каталоге должен указать, в какой категории он бы искал конкретные продукты;
— Гибридная: по категориям 1-го уровня респондент распределяет категории 2-го уровня. Можно создавать свои первоуровневые категории, этим гибридная сортировка отличается от закрытой;
— Открытая: респондент группирует категории 2-го уровня и придумывает названия для получающихся первоуровневых категорий. Это снижает, но не исключает вероятность копирования существующей структуры каталога.

Анализ сортировок более 600 респондентов проводится с помощью дендограммы и матрицы сходств.

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

Выводы:
— После карточной сортировки вы не получите готовую структуру каталога, вы получите более точное понимание отдельных его частей;
— Следует сочетать количественные и качественные данные. Друг без друга они не работают;
— Большинство проблем навигации происходит из-за 1-го уровня каталога;
— В каталогах лучше не использовать больше 3 уровней;
— Продукты пользователи склонны искать по составу, а не состоянию. Например, замороженное мясо будут искать в мясе, а не замороженных продуктах.

#card_sorting