Алита Джойс из Nielsen Norman Group написала о помощи и документации в цифровом продукте.

— Документация должна быть доступной для поиска, ориентированной на пользовательскую задачу, не слишком объёмной, а также содержать список конкретных действий;
— Проактивная помощь предоставляется до того, как пользователь столкнулся с проблемой: онбординг, контекстные подсказки, шаблоны, визарды;
— Реактивная помощь предоставляется, когда пользователь столкнулся с проблемой и пытается её решить: часто задаваемые вопросы, документация, обучающие материалы;
— Они могут служить и для проактивной помощи, но люди редко читают документацию перед использованием продукта;
— Push-подсказки — сообщения, не связанные с текущей пользовательской задачей. Например, оверлеи, появляющиеся при старте работы и рассказывающие о новых функциях;
— Pull-подсказки  — контекстные сообщения, относящиеся к текущей задаче. Могут появляться при наведении курсора на элементы интерфейса или запуске конкретного сценария. Пользователи меньше игнорируют такие подсказки;
— Давайте возможность легко пропускать push-подсказки (закрывать их);
— Размещайте сообщения проактивной помощи где-нибудь ещё. Пользователь может вспомнить о пропущенном сообщении и захотеть его посмотреть потом;
— Помогайте сканировать документацию: разбивайте на части, соблюдайте визуальную иерархию, выделяйте ключевые слова, используйте списки;
— Описывая сложное взаимодействие, в дополнение к тексту записывайте видеоинструкции;
— Выделяйте часто просматриваемые статьи в документации.

#heuristic #help

В Markswebb написали о лучших практиках чекаута в российских интернет-магазинах.

— Определяйте локацию покупателя и заранее предупреждайте об условиях доставки (Связной) и доступности товара в его регионе (антипример — AliExpress);
— Позволяйте заказать отдельные товары и сохранить остальные (Wildberries). Часто клиенты используют корзину как список покупок и экран сравнения — собирают несколько вариантов, а затем заказывают отдельные позиции;
— Организуйте лёгкий вход по номеру телефона и коду (Ozon). Пользователю не надо запоминать параметры входа и совершать лишние действия, импульс к покупке сохраняется;
— Давайте выбрать способ доставки по цене, положению точки выдачи, времени ожидания, дополнительным услугам вроде примерки и возврата (220 Вольт);
— Стимулируйте предоплату по карте, начисляя бонусы (СберМегаМаркет). Это снижает риск неоплаты товара;
— На экране предпросмотра позволяйте изменить способ и место доставки, тип оплаты и получателя (Детский мир);
— Предусмотрите возможность управления заказом уже после оформления и оплаты. Например, в DNS можно заменить самовывоз на платную курьерскую доставку, доплатить и получить заказ удобным способом.

https://vc.ru/trade/282339

Райан Тэн написал о повышении доступности при использовании эмодзи и смайликов.

— Не размещайте в призывах к действию на кнопках одни лишь эмодзи. Например, вместо 👍 пишите Like. Слова всё ещё важны, эмодзи лишь помогают улучшить впечатление;
— Не используйте эмодзи в объёмном тексте. У них есть альтернативный текст, который будут озвучивать скринридеры, и это может помешать восприятию текста;
— По той же причине размещайте эмодзи после призыва к действию и в конце предложения;
— Используйте понятные эмодзи. Например, вместо вулканского салюта 🖖 пишите 👋;
— Не используйте текстовые смайлики. Скринридеры будут читать их как знаки препинания :(
— Проверяйте контрастность эмодзи. Жёлтая рука одинаково хорошо видна на тёмном и светлом фоне.

https://design-glory.com/7081/smajly-i-dostupnost-kak-ih-pravilno-ispolzovat

Таннер Кристенсен написал о ступоре при поиске идеального решения задачи.

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

https://ux.pub/razrabotka-nailuchshego-vozmozhnogo-resheniya/

Тарас Бакусевич написал, как улучшить визуализацию данных.

— Располагайте положительные и отрицательные значения по разные стороны базовой линии диаграммы;
— Гистограмму начинайте с нулевых значений. Усечение приводит к искажению данных;
— Для линейной диаграммы адаптируйте масштаб оси Y, чтобы она не была слишком плоской;
— В линейной диаграмме маркеры, представляющие данные, соединены линиями. Люди могут ошибочно принимать за данные также и эти линии. Если ваши данные и временная шкала провоцируют такое восприятие, используйте вертикальную гистограмму;
— Не используйте сглаженные линейные диаграммы. Они искажают стоящие за ними данные;
— Ограничивайте количество секторов (5–7) на круговой диаграмме. Самые маленькие сегменты можно сгруппировать в «Другое»;
— Вместо легенды наносите метки прямо на диаграмму, но не наносите их на сегменты круговой диаграммы;
— Есть общепринятые способы упорядочить сегменты: 1) Самый большой на 12 часов, остальные в порядке убывания по часовой стрелке; 2) Самый большой на 12 часов, второй по величине после него по часовой стрелке, третий на 11 часов, остальные в порядке убывания по часовой стрелке;
— Не сортируйте данные по алфавиту. Размещайте самые большие значения в начале диаграммы;
— Не используйте тонкие кольцевые диаграммы. Их сложно читать;
— Выберите подходящую цветовую палитру. Типы палитр: 1) Качественная; 2) Последовательная; 3) Дивергентная;
— Старайтесь не поворачивать метки. Возможно, для этого придётся вертикальную гистограмму заменить на горизонтальную;
— Помогайте пользователям исследовать данные, изменяя параметры, тип визуализации, временную шкалу.

#data_visualization

Юля Кондратьева написала, как повысить конверсию рекламных всплывающих окон.

— Если они отображаются по таймеру, лучше конверсия у тех, которые всплывают через 8 секунд;
— Если попап отображается при прокручивании страницы, лучше показать его после прокрутки трети страницы;
— Если он отображается после того, как пользователь посмотрел пару страниц сайта, конверсия в 2 раза выше, чем у попапа, показанного на лендинге;
— Попапы с картинкой работают на 84% лучше, чем без неё;
— С обратным отсчётом — на 113% лучше, чем без него;
— На мобильных средняя конверсия попапов 5,8%, а на десктопе 3,1%;
— Если в попапе форма, разделяйте её на шаги, чтобы на первом шаге было не больше 2 полей.

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

https://habr.com/ru/company/tinkoff/blog/574812/

Слава Шестопалов рассказал, что понял после перехода в дизайн-менеджмент.

— Решения менеджера иногда кажутся специалистам несправедливыми. Это из-за незнания контекста. Его работа полна выбора из плохих вариантов: наименее рискованный вариант, хороший, но с бомбой замедленного действия, и так далее;
— Пристальное внимание раздражает специалистов и заставляет их избегать менеджера. Решать проблемы людей невозможно без доверия, они должны поверить, что за них заступятся. Доверие → Больше информации → Проще решать проблемы на ранних этапах → Больше доверия;
— Отстаивать интересы команды жизненно важно, и это соответствует естественному желанию начинающего менеджера, но это не единственно возможное поведение. В лице менеджера компания не хочет получить очередного жалобщика. Он должен связывать специалистов с миссией компании;
— Фраза специалиста «Я в порядке» часто предвещает проблемы в будущем;
— Целеустремлённые, самоорганизованные и вдохновляющие команду люди часто перегружают себя новыми инициативами. Такими специалистами менеджер склонен затыкать дыры, так как они справляются и не отказывают. Из-за этого лучшие исполнители — первые в очереди на выгорание, а их потеря — огромный ущерб;
— Обычные специалисты могут переварить лишь малую долю офисной политики. Стоит дважды подумать, прежде чем рассказывать, например, о внутренних соперниках, которые хотят построить карьеру руками вашей команды;
— Заработная плата — пример управленческой информации, которая не делает знающего её счастливым;
— Даже хорошие менеджеры занимаются политикой и лишены в этом сочувствия со стороны своих команд.

https://ux.pub/5-gorkih-urokov-dizayn-menedzhmenta-kotorye-ya-hotel-by-usvoit-ranshe/

Людвиг Быстроновский написал, как делать дизайн без стресса.

— Выберите с клиентом день для регулярной демонстрации наработок;
— Работу ведите онлайн, весь дизайн должен быть доступен в любой момент времени для просмотра и обсуждения;
— Не утверждайте концепцию в начале проекта, в конце может оказаться, что она никуда не годилась;
— Прорабатывайте решения постепенно: создайте пустые страницы для всех шагов сценария (уже виден масштаб) → накидайте в каждый блоков → и так далее;
— Все сомнения выписывайте туда же, где находится ваш дизайн;
— Не сравнивайте варианты решения в уме, превращайте их в картинки;
— Веселитесь: распихивайте весёлые мемы между рабочими файлами и так далее;
— Добавляйте изюминки в проекты, даже если их никто кроме вас не оценит: весёлая иконка, микроанимация, игра с цветом;
— Если не можете делать проект, сделайте выбор и уйдите или останьтесь (и не нойте);
— Не формируйте ожиданий вроде «Мы сделаем страницу, с которой запишется 100 человек», а задавайте вопросы вроде «А что если мы сделаем вот такую страницу?»;
— Рассказывайте о своей работе, чтобы понять, где слабые места или можно упростить, или чтобы преодолеть затык;
— Будьте собой: любите или ненавидьте букву ё, вставляйте зелёный во все свои проекты;
— На время отключайтесь от проекта. Самый простой способ это сделать — завести несколько проектов;
— Всегда пробуйте новое и странное. Если решение окажется оторванным от земли, инженеры помогут его приземлить.

https://collab.ldwg.ru/stressless-design

Игорь Штанг написал о выравнивании текста по правому краю.

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

Дизайнеры пытаются его использовать, чтобы:

1. Выровнять правый край макета. Не стоит, даже если там блок с числами.

2. Показать связь текста с элементом справа:
— Подпись к полю в форме;
— Боковик и данные в таблице. Есть более аккуратные способы показать связь, включая линейки и отточия;
— На картах и схемах. Правая выключка бывает необходима, в компактной вёрстке выравнивание часто остаётся единственным способом связать подпись с объектом;
— В титрах. Традиционное решение;
— Подпись и иллюстрация. Приём достаточно редкий.

3. Передать симметричную структуру. Иногда сама информация подталкивает к сочетанию правой и левой выключки:
— Игровой счёт;
— Информация о предыдущей и следующей публикации. Правый флаг здесь оправдан, но не обязателен.

4. Сделать нестандартно. Здесь правый флаг обычно служит какой-то композиционной задаче.

Одна строчка текста может стоять справа, потому что она не создаёт рваного края.

https://nobelfaik.livejournal.com/237819.html

Михаил Правдин написал детальный разбор тестовых заданий на должность UX-исследователя в Авито.

Основные ошибки кандидатов, не связанные с сутью самих заданий:
— Прислать тестовое в 23:59 в последний день. Если кандидат начинает заранее и уделяет заданию внимание равномерно на протяжении всего времени, такие работы, как правило, немного лучше;
— Нет доступа к результату выполнения задания: 10 случаев на 130 тестовых работ;
— Небрежное оформление. Такие тестовые сложнее проверять, а хорошее оформление сразу располагает к себе;
— Не сделанная часть задания. «Были кандидаты, которые ставили под вопрос то или иное задание: говорили, что вопросы странные, на них не стоит отвечать, и что какие-то гипотезы не требуют проверки. Возможно, всем хочется выглядеть хорошими экспертами. Но если вы откликаетесь на стажёрскую программу, то, наверное, не стоит показывать, что вы умнее ребят, которые придумали тестовые»;
— Мнение, что это бесплатная работа. «Гораздо проще проверять то, что уже сделано нами, так мы не тратим время на дополнительный анализ нового материала, а только оцениваем, насколько результат работы кандидата совпадает с нашими выводами».

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

https://habr.com/ru/company/avito/blog/575524/

Женя Арутюнов выложил в публичный доступ 4-ю главу книги «Сложный дизайнер». Глава посвящена работе с трудными клиентами.

— Трудный клиент — это такой ярлычок для перекладывания ответственности. Если трудно, хочется сказать, что это из-за того, что он такой человек (или вы такой человек, потому что трудно вам);
— Плохое поведение провоцируют: 1) Среда, в которой оно считается нормой; 2) Ситуация, в которой человек чувствует опасность и защищается;
— Если проблемы дизайнера звучат как «я боюсь сказать», «мне все говорят, что делать» и «меня заставляют делать плохо», лучше обратиться за психологической помощью;
— Когда клиент ведёт себя не так, надо понять настоящую причину, тогда будет проще отреагировать правильно;
— Если клиент хочет «больше дизайна», потому что не уверен в ценности своего сообщения и хочет от дизайна весомости, это корректный запрос. Иногда картинка нужна, чтобы один человек почувствовал себя увереннее;
— Если он хочет срочно, потому что не подумал заранее: 1) Отказывайтесь; 2) Предлагайте намеренно упрощённое решение, чтобы не заставлять искать замену, но и не поддерживать иллюзию, будто срочное можно сделать нормально. Если просит выручить, но не воспринимает упрощённый вариант, значит, это просто манипуляция;
— Если хочет больше вариантов, потому что у него есть образ решения, но он этого не понимает или специально скрывает, надо осознать, что есть важное не выявленное требование к дизайну, попытаться его раскопать и показать такой вариант;
— Если затягивает процесс, потому что реально не успевает делать всё, даже важное, предлагайте укрупнить проект: «Давайте мы возьмём на себя этот вопрос целиком? Сами проконтролируем соответствие всем критериям, сами договоримся с производством и проследим за реализацией»;
— Если советуется с другими людьми, потому что у проекта несколько стейкхолдеров, будьте на этих встречах и управляйте дискуссией: находите убедительные аргументы, пресекайте попытки голосовать за дизайн простым большинством, гарантируйте, что никого не забудут спросить;
— У вас есть право на «нет». Базовый уровень — «нет» в ответ на просьбу: «Успеете к пятнице? И пытаться не будем»;
— Самая страшная тайна: можно не работать с клиентом просто потому, что он вам не нравится, без уважительной причины;
— Первый проект с клиентом должен быть маленьким, ведь первый проект — единственная настоящая проверка совместимости;
— Полной совместимости не бывает. Всегда будут возникать ситуации, требующие осознания и вмешательства. Важно понимать, что это война не со злом, а с хаосом, и не против клиента, а вместе с ним;
— Важно не скатываться в серую зону, где всё делается по инерции. Если нормально работать не можете, приложите усилия, чтобы уйти или исправить ситуацию. Если ничего не сделать, всё останется как есть.

https://intuition.team/book/chapter-4-free

Дмитрий Подлужный кратко рассказал о 7 основных артефактах проектирования интерфейса.

1. Дерево KPI. Очевидные, измеримые, проранжированные цели проекта (стратегические и более мелкие операционные) помогают избавиться от лишних споров и сфокусироваться на главном при принятии решений;
2. Стратегический план. Показывает отдельные шаги (действия и тактические задачи), необходимые для достижения цели. Помогает видеть объём предстоящих работ и понимать влияние разных факторов на результат;
3. Поведенческая сегментация. Позволяет выделить группы пользователей со схожими поведенческими паттернами, подумать о триггерах перехода на следующий этап взаимодействия. Характеристики одного и того же пользователя меняются в зависимости от этапа взаимодействия с продуктом;
4. Верхнеуровневый прототип. На ключевых страницах показывает общее видение продукта, его функций, логики взаимодействия с пользователями, основные принципы построения интерфейса. Позволяет получить раннюю обратную связь от бизнеса, экспертов и пользователей;
5. Сценарии. Описывают действия пользователя и ожидаемые результаты, помогают проверить полноту проектного решения. Должны быть написаны понятным языком, могут быть приоритизированы;
6. Информационная архитектура. Позволяет увидеть составляющие продукт объекты, их количество и взаимосвязи и, как следствие, уточнить объем работ по проектированию и ещё раз проверить полноту проектного решения. Большая часть названий и обозначений, зафиксированных в ИА, переходит в интерфейс;
7. Детальный прототип. Фиксирует представление о том, как пользователь будет взаимодействовать с продуктом, включая интерфейсный текст. Может не показывать все варианты поведения системы — так его проще воспринимать и экономится время дизайнеров.

https://habr.com/ru/company/agima/blog/577056/

Bang Bang Education опубликовали беседу с Владимиром Зиминым.

— Первая книга о проектировании — «Психбольница в руках пациентов» Алана Купера;
— У нас такая область, что надо напрашиваться в компанию мечты и забывать все знания на практике. Не должно быть только теории;
— Когда из компании уходят руководители, внутри это всегда воспринимают сильно острее, чем снаружи. Кажется, что компания разваливается, у неё нет будущего. Будущее, конечно же, есть (про Альфа-банк);
— Фразу «Делай как у Гугла» я слышал каждый день. Это оказалось не интересно (про Яндекс Облако);
— Когда работаешь с людьми, например, при проведении пользовательского тестирования, снобизму (какие они тупые) и предвзятости нет места. Надо понять, что ими движет и какие у них проблемы;
— Если в команде 5−6 дизайнеров, наиболее эффективна плоская структура. Вы вместе общаетесь и принимаете решения. Если людей больше 10−15, неизбежна иерархия, как бы дизайнерская душа этой бюрократизации ни противилась;
— Когда дизайн-менеджер приходит из дизайна, сложно научиться делегировать, потому что все его сотрудники всё делают не так. Надо учиться бить себя по рукам и давать людям самим находить и исправлять ошибки;
— Дизайн-менеджер не должен заниматься контролем качества дизайна и арт-дирекшеном, чтобы не стать бутылочным горлышком и чтобы дизайн не отвечал интересам только одного человека;
— Встречи 1 на 1 позволяют замерять температуру коллектива, смотреть, есть ли у людей проблемы в профессиональной и личной жизни, и стараться помочь. Особенно это важно в удалённой работе;
— Если говорить прямо, главная задача встречи — понять, не собирается ли человек уйти в ближайшее время;
— Про встречи 1 на 1 на Ютубе есть классная лекция Сергея Кондаурова из Яндекса;
— Дизайнерам стоит прочитать книги «Человек, который принял жену за шляпу» (в ней можно увидеть, какими невероятно разными бывают люди) и «Гарри Поттер и методы рационального мышления». Также можно рекомендовать «Думай медленно, решай быстро» Канемана и «Искусство войны»;
— На собеседовании люди, бывает, отвечают не на те вопросы. Обсуждая, что для человека продукт и как он строит дизайн-процесс, за 15 минут можно выяснить, понимаем ли мы друг друга и получится ли у нас светлое будущее;
— Многое зависит от ответов, почему человек выбрал нашу компанию и почему уходит из текущей. Ответ, что «это крупная, стабильно развивающаяся компания» кажется правильным, но в нём нет какой-то искорки. Для человека это просто работа. Если он жалуется на текущую компанию, это худший соискатель на свете;
— Хорошо, когда у дизайнера есть цель (например, изменить какое-то направление, изменить всю компанию), даже небольшая. Плохо, если он зарывается в свой продукт и не смотрит по сторонам;
— Дизайн-мышление больше ориентировано на бизнес, а не дизайнеров. Оно помогает вовлечь бизнес в дизайн-процесс, поверить в его важность;
— Дизайн — в первую очередь функция, но и форма тоже имеет значение, и клиенты с большей вероятностью будут пользоваться привлекательными продуктами;
— Сейчас знаний и источников столько, что начинаешь сомневаться в их качестве и правильности выбора источника. Но научиться что-либо делать уже проще, чем раньше. Важна хорошая настройка фильтра. Хорошим дизайнером может стать человек с хорошим системным и критическим мышлением.

https://www.youtube.com/watch?v=Sle3o1HRjYc

Михаил Букин поделился нехитрыми рекомендациями, как сделать «бесконечный скрол» удобнее.

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

https://deadsign.ru/ux/best-practices-for-infinite-scrolling/

А вот ещё статья Baymard Institute об использовании бесконечного скрола, пагинации и кнопки «Показать ещё»: https://vandergrav.ru/pagination-infinite-scrolling-load-more-buttons/

Вадим Митякин опубликовал 8-ю главу книги «Метод параноика» (@theparanoidmethod). Глава посвящена роли продюсера цифровых продуктов.

— Продюсер участвует в создании концепции продукта и обладает компетенциями для управления проектом;
— В глазах проектной команды он представляет собой заказчика, а в глазах бизнеса — партнёра, помогающего найти технологическое решение;
— Многие компании относятся к привлечению внешних участников скорее как к исключению. Проблема в том, что внутри компании нельзя собрать всех, кто необходим для уникального проекта: иногда нужны люди с неожиданными компетенциями; крутые специалисты, без которых не найти нестандартных решений, ищут интересные задачи и участвуют в разных проектах;
— Продюсер несёт ответственность за результат проекта и наделён полномочиями, в том числе правом менять состав команды;
— Его 1-я функция — найти, как решить задачи бизнеса с помощью цифровых инструментов, описать принципиальную схему решения и выстроить обновлённую бизнес-модель, связанную с продуктом;
— 2-я функция — определить наиболее подходящий способ воплощения найденного решения в виде цифрового продукта. Участники проекта в рамках своих компетенций могут учесть отдельные факторы, влияющие на устройство продукта, но собрать всё вместе может только продюсер;
— 3-я функция — организовать проектную работу (не управлять): выявить требования к команде, подобрать подходящих специалистов, запустить рабочий процесс. Управление распределяется между ключевыми участниками;
— Обладание информацией само по себе ничего не даёт, нужна способность к её интерпретации, критерии для оценки;
— Повторение схемы работы конкурента даёт её снимок на определённый момент, но не вектор развития. Пока вы её скопируете, конкурент сделает следующий шаг, и вы останетесь догоняющими;
— Крайне важно, чтобы тот, кто формулирует бизнес-модель, делал это для себя (не консультант);
— Работоспособность бизнес-модели проявляется в способности находиться компании в нужной среде продолжительное время и извлекать из этого пользу;
— Нельзя просто нанять разработчиков для создания цифровых инструментов под одновременно формулируемую бизнес-модель. Это напрасная и часто невосполнимая трата времени и денег;
— Бессмысленно делать это после того, как бизнес в своих терминах сформулировал схему работы, так как модель должна быть выстроена вокруг сценариев использования цифровых инструментов;
— Базовый набор продюсера: компетенции в технологиях, навыки системного мышления и проектирования, опыт управления проектами, предпринимательский опыт;
— Он понимает исходные цели, лежащие в основе проекта, и может донести их до проектной команды, не потеряв важные детали;
— При необходимости продюсер готов искать решение и без использования цифровых инструментов.

https://paranoidmethod.org/paranoid-method-book-08

Роман Камушкин рассмотрел примеры использования аватарок (userpic) в интерфейсах. Полезно, если планируете сделать хороший компонент или дизайните взаимодействие с группами и отдельными пользователями.

— Состояния: пустое, инициалы, фото;
— Размеры: 24−40dp для шапки сайта, 40−48dp для списков; 56+dp для пользовательского профиля и настроек;
— Дополнительные элементы: индикатор статуса (например, что человек онлайн), бейдж с числом (количество сообщений от человека), кнопка действия с этим пользователем;
— Рядом с аватаром может быть текст: имя пользователя, расшифровка статуса, дополнительные детали (например, когда был онлайн, должность);
— В профиле текст часто размещают под аватаркой;
— Об отдельных событиях (пользователь опубликовал новую историю) можно сообщить с помощью рамки вокруг аватара;
— Пользовательский прогресс можно показать частично закрашенной рамкой;
— То, что пользователь выбран из списка, можно показать рамкой и бейджем с галочкой или большой галочкой поверх аватара;
— Плюс рядом с группой аватаров символизирует возможность добавить ещё людей;
— А число (например, +5) — что по нажатию можно увидеть ещё 5 пользователей из этой группы;
— При наведении курсора на аватар в группе можно показать тултип с именем пользователя.

Перевод плохой, так что ссылки две:
— Перевод: https://ux.pub/vse-chto-nuzhno-znat-o-dizayne-avatarok/
— Оригинал [English]: https://blog.prototypr.io/a22af3daa1f2

В Passteam написали о транзакционных уведомлениях.

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

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

https://vc.ru/marketing/289646

Джастин Бейкер написал вводную статью о проектировании тактильного взаимодействия.

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

https://ux.pub/haptic-ux-dizayn-taktilnyh-oschuscheniy-sensornogo-interfeysa/

Марина Яланска написала о контрасте в интерфейсе.

— Максимально возможный контраст изображения называется динамическим диапазоном;
— Люди с нарушениями зрения различают видимые объекты в основном за счёт контраста;
— В академическом искусстве контраст применяется не только для управления вниманием, но и для создания настроения, атмосферы, добавления разнообразия, визуального интереса или драматизма в произведение;
— В дизайне интерфейсов это один из ключевых факторов, влияющих на визуальную иерархию и возможность беглого изучения страниц;
— Способы создания контраста: 1) Цвет; 2) Размер; 3) Форма (форма одного элемента отличается от формы остальных); 4) Расположение; 5) Текстура; 6) Ориентация (один элемент повёрнут относительно остальных);
— Полезно чёрно-белое тестирование интерфейса. Цветной интерфейс может выглядеть иначе на других экранах, низкий контраст неудобен дальтоникам;
— Есть разные типы типографского контраста. Например: контраст начертаний (жирное начертание выделяется на фоне основного) или структур (формы букв разных шрифтов);
— Среди менее популярных типов — контраст через ритм. Элементы, нарушающие ритм, привлекают больше внимания;
— Позаботьтесь о контрасте, если размещаете текст поверх изображения;
— Слишком большой контраст вызывает чрезмерное напряжение глаз и усложняет взаимодействие. Контраст мешает на страницах с длинным текстом;
— Много разного контраста = его отсутствие. Также возрастает время, необходимое для изучения системы, выполнения задачи и запоминания маршрутов в системе;
— Не забывайте о негативном пространстве, которое помогает элементам интерфейса дышать и повышает эффективность разных типов контраста.

https://www.uprock.ru/articles/tipy-kontrasta-v-ui-dizayne

В «Собаке Павловой» написали о быстром формате предоставления результатов пользовательского тестирования.

— При обработке результатов тестирования легко потерять важную информацию. Кажется, что нужно фиксировать каждое слово, но это долго и дорого;
— Для предоставления результатов важно выбрать формат. Он зависит от того, а) кто будет их использовать, б) зачем они нужны, в) на какой стадии готовности находится интерфейс;
— В «Собаке Павловой» используют 3 формата, отличающиеся подробностью: 1) Скринкаст тестирования с полной расшифровкой; 2) Скринкаст с заметками в виде структурированного конспекта; 3) Инсайты, важные комментарии, ошибки;
— 3-й формат стоит попробовать, когда исследователь полностью в теме или нельзя записывать экран. Нужен навык мультизадачного активного слушателя;
— Можно записывать аудио, но не обязательно. Главное, зафиксировать всё важное: инсайты, комментарии, ошибки;
— В результатах надо обозначить, как респонденты выполняют сценарии, микросценарии и задачи. Подходит табличная форма;
— Не стоит интерпретировать результаты с точки зрения частотности. Но если проблема возникла только у одного респондента, возможно, это его индивидуальная непонятливость;
— Находки тестирования удобно передавать не в таблице, а прямо в контексте — комментариями к макетам в Фигме или Миро;
— В зависимости от задачи, цветом можно кодировать источник проблемы (пользовательское тестирование или экспертная оценка), её критичность или сложность исправления;
— От заказчика не требуется большой квалификации, чтобы перевести найденные проблемы в задачи для разработчиков: пробежался глазами по экранам и показал пальцем, что делать, а потом проверил внедрение.

https://vc.ru/design/297038