Таня из Everest написала о формах поиска на сайтах клиник.

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

#form #search #health

Вадик Михалев написал, как минимизировать трудозатраты при найме дизайнера в пока ещё бедный стартап.

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

Ставьте 🖕 если не делаете тестовые и 🧑‍💻 если делаете. #hiring

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

В Heads and Hands написали о законах UX.

— Закон Парето. Фокусируйте внимание на 20% функций приложения, которые закрывают потребности 80% пользователей. Например, сделайте их легко доступными, когда пользователь держит телефон одной рукой и нажимает большим пальцем;
— Закон Фиттса. Элементы, на которые пользователь может нажимать в рамках одного сценария, располагайте рядом. Например, поле поиска, фильтры и сортировки. Так после ввода поискового запроса будет проще перейти к уточнению его результатов;
— Закон Якоба. «Пользователи проводят большую часть времени на других сайтах, а не на вашем. Поэтому они хотят, чтобы ваш сайт работал так же». Используйте привычные шаблоны взаимодействия, свойственные продуктам, похожим на ваш;
— Закон Хика. Сокращайте количество вариантов для выбора, группируйте, выделяйте основные;
— Эффект Зейгарник. Разделяйте большие задачи на несколько маленьких. Сложнее бросить то, что уже частично сделано;
— Модель Кано. Делите фичи на базовые (определяют жизнеспособность продукта), желаемые и восхищающие (определяют его конкурентоспособность).

#laws

Леви Ковач написал о мобильных формах.

— Если в раскрывающемся списке от 2 до 5 вариантов для выбора, лучше заменить его на Segmented Control. Так сделать выбор можно меньшим количеством нажатий;
— Если вариантов 2 и это, например, «Показать» и «Скрыть», можно заменить его на чекбокс или переключатель;
— Если варианты — это значения в рамках определённого диапазона, можно использовать ползунок;
— Если варианты — числовые значения и пользователи обычно не сильно меняют значения по умолчанию, подойдёт степпер. Меньше нажатий и ошибок;
— Иногда несколько раскрывающихся списков можно объединить в один. Например, выбор даты;
— Располагайте поля в одну колонку;
— Сообщения об ошибке при заполнении поля показывайте рядом с этим полем и показывайте по мере заполнения формы, не перечисляйте неправильно заполненные поля в конце или начале формы;
— Не повторяйте, что поле обязательно для заполнения. Старайтесь исключить из формы необязательные поля. Подписывайте необязательные поля, если такие всё-таки оказались в форме;
— Группируйте связанные поля.

In English. #form #mobile

Женя привет, мне твоя помощь нужна, посмотришь мой сайт резюме-портфолио? Я сейчас в поиске работы, много отказов по вакансиям, я не понимаю, почему, потому что обратную связь от эйчаров получить практически невозможно. Ищу работу продуктовым дизайнером, есть мысль, что отказы, потому что именно в продуктовых командах опыт нужен 3+ лет, а у меня и года нет. Если так, то как тогда быть? https://perfecti-ist.com

тэкс, ну всё просто оказалось

твоё портфолио никаким местом не говорит «продуктовый дизайнер»

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

это если поверхностно смотреть (как все и смотрят)

а если глянуть повнимательнее, то это то, что сейчас называется «UI»

и всякий графдизайн

я ровно месяц назад нанимал «продуктового дизайнера», посмотрел полсотни резюме, десятки портфолио, 5-6 собеседований мы провёли

короче, рассказываю

опыт в годах вообще не важен, не в этом проблема — довольно много дизайнеров с 5-7-10-летним опытом, они называют себя продуктовыми, потому что хотят деняк, но у них нет квалификации

а бывают ребята с опытом в 2-3 года, у которых квалификация есть

(но да, конечно же, не бывает с опытом до года)

Как выглядит портфолио продуктового дизайнера:

— это всегда ноушен, и в этом ноушене рассказы о проделанной работе; очень мало картинок, и это не очень-то крупные картинки, очень много жизы, страданий и фейлов

(биханс почти всегда означает, что там будут одни картинки, видимо, на бихансе не очень удобно рассказывать; там бывает пара абзацев текста для приличия, но это не то)

— любой проект начинается не с картинок, а с блоксхем, си-джей-эмов, исследований, с цветных стикеров всяких

— и заканчивается чем-то в духе «ни хуя не смогли внедрить, пидарасы, я уволился»; ну или «вот эту мааааленькую штучку за полгода внедрили, она заработала миллиард, но почему, никто так и не понял»

как стать продуктовым дизайнером — никто не знает

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

и так в нескольких местах по году-полутора, на сколько хватит отчаянности

и тогда у тебя появляются сюжеты для вот этих рассказов в ноушене

и с ними ты устраиваешься в контору, которой вроде как именно такие ребята и нужны

и там всё по новой

Кинерет Ифра написала о пустых состояниях.

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

In English. #empty_state #writing

Николай написал о механиках сервисов знакомств, перспективах развития, особенностях поведения их пользователей и почему люди ими пользуются — статья на 53 минуты чтения 0_0

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

Ставьте 🥱 если интересно, но 53 минуты — слишком много. #ugc

Станислав Хрусталёв написал о быстрых действиях в iOS.

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

#ecommerce #mobile

Кирилл Шерстобитов написал о подготовке прототипа к тестированию.

— Определите, что вы хотите проверить с помощью прототипа;
— Чтобы увидеть проблемы и сформулировать гипотезы, часто проводят модерируемые тесты, для которых подходят даже недоработанные прототипы — модератор может смягчить связанные с ними негативные эффекты;
— Для проверки интерфейсных гипотез лучше подходят количественные методы (от 100 человек на тест). Здесь модератор уже не поможет, поэтому важны понятное задание и работоспособность прототипа (в том числе быстрая загрузка);
— Чтобы проверить навигацию на удобство и понятность, не обязательно делать прототип, можно провести First click test;
— Прототипом можно проверить сценарии поведения в интерфейсе, взаимодействие с интерактивными элементами;
— Разбивайте интерфейс на короткие сценарии под конкретные задачи. Так проще будет готовить прототип, и грузиться он будет быстрее;
— Оптимизируйте прототип для более быстрой загрузки: убирайте лишние скрытые элементы, используйте облегчённые изображения вместо хайрезов;
— Часть советов повторяет статью Екатерины Бессчётновой, которая уже была в UX Notes.

#prototype #user_testing

Лена из Red Collar написала о слайдере для ввода суммы и проектировании кредитного калькулятора в целом.

— Поле для ввода суммы можно объединить со слайдером, чтобы пользователь указывал её, не переключаясь на клавиатуру;
— Кружок слайдера, который пользователь двигает, может быть небольшим, но с областью нажатия от 32 пикселей;
— Длина слайдера должна быть не маленькой, чтобы легко устанавливать нужное значение, но и не большой, чтобы взгляду и курсору не преодолевать большие расстояния по горизонтали;
— Если в слайдере можно указывать значения только с определённым шагом и вариантов для выбора немного, вместо поля со слайдером подойдёт Segmented contol;
— Если числа большие (стоимость недвижимости), округляйте вводимые слайдером суммы до 10000. Так проще воспринимать числа и обсуждать с кредитным менеджером условия;
— Для суммы первоначального взноса показывайте, какой процент она составляет от стоимости недвижимости;
— Для ввода суммы первоначального взноса и срока кредита можно добавить кнопки быстрого выбора популярных значений (например, для первоначального взноса — 15, 20, 25 и 30%);
— Не скрывайте размер переплаты и итоговую сумму, которую заплатит клиент;
— Расскажите о налоговом вычете, который можно получить;
— Покажите размер минимального дохода, необходимого для того, чтобы получить нужный кредит;
— Добавьте подсказки для терминов и пояснений к вычисленным суммам (например, как появилась сумма налогового вычета).

#slider #calculator #form

Юлиана Шевчук написала о сценарии модерируемого пользовательского тестирования.

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

#user_testing

Сергей Тимофеев и Георгий Струнин написали об ошибках при проведении немодерируемого тестирования.

— В таком исследовании не нужен модератор, но важно правильно сформулировать цель, выбрать аудиторию, подобрать задание и метод тестирования;
— Оно подойдёт для количественной проверки, получения ответа на конкретный вопрос вроде «Найдут ли пользователи точку входа в сценарий»;
— Не подойдёт для проверки большого сценария (больше 6 экранов), понимания пользовательских потребностей, мотивации и контекста, ответа на вопрос «Почему?»;
— Главное правило для выбора аудитории — у респондентов должен быть релевантный опыт. Иногда важно учитывать демографию;
— Для количественного исследования надо 95–100 человек;
— Ошибка — проверять минорные гипотезы или то, что можно было не проверять (когда известны best practices);
— Выбирайте такой метод исследования, результаты которого можно подсчитать автоматически: тест сценария, первого клика, предпочтения, пяти секунд, а также карточкая сортировка;
— Ошибки при формулировании вопроса: в нём содержится подсказка, строится предположение про будущее, которое нельзя проверить тестом, используются профессиональные термины;
— В тесте предпочтения сравниваемые макеты не должны отличаться несколькими элементами, иначе не поймёте, что повлияло на выбор респондентов;
— В макетах: размещайте реалистичные данные, если задаёте вопрос о конкретном элементе, выделите его;
— Проверяйте тест до запуска, а также статистическую значимость результатов (есть калькуляторы).

#unmoderated #user_testing

Алина Ермакова написала, как руководителю работать с лидами.

— Чтобы они не тратили время на профессиональную конкуренцию, можно разделить зоны их ответственности: один отвечает за методологии, второй за рекрутинг, третий за шаблоны отчётов;
— Это позволяет расти экспертизе в компании, не решать каждый вопрос кворумом, заниматься чем-то помимо основных задач, на что обычно не хватает времени;
— Можно делить по продуктам, рынкам (b2b, b2c и так далее), типам пользователей (внешние, внутренние);
— Чтобы отдел исследований не стал бутылочным горлышком и не тормозил разработку, распределяйте компетенции по направлениям. В каждом должен быть свой UX-лид, отвечающий за качество продукта (или группы продуктов) и развитие экспертизы в целом;
— Руководитель при этом менторит, управляет, развивает, следит за глобальным беклогом, ограждает подчинённых от того, чего они делать не должны;
— Становясь лидом, человек перестаёт кому-то нравиться, так как начинает спорить и отстаивать своё;
— Заведите гайд для новых лидов — обкатанные на опыте шаги по выстраиванию процесса исследований;
— Проводите встречи по синхронизации. На них можно обсуждать общий процесс, особенности общения с заказчиками, бюджет и ставки, делиться нововведениями. Это не отчёты подчинённых о проделанной работе, а собрание равных;
— Чтобы не заниматься микроменеджментом, давайте людям ошибиться, самим найти способ решения задачи. Они могут найти новые способы, о которых руководитель не знал;
— Роль руководителя — лоббировать, помогать с бюджетом, ресурсами и договорённостями. Плюс базовая психологическая поддержка (но без возможности сесть на шею).

#management

В 65pixels написали о модели Кано.

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

Ещё о модели Кано писали в Heads and Hands. И если я не ошибаюсь, в комментариях к этой записи доступны любые средства выражения, включая стикеры и кружочки 😉 #research #prioritization

В VK поделились статистикой, которая поможет убедить руководство заняться цифровой доступностью.

— Разные формы инвалидности есть у 8% жителей России. В 80% случаев она приобретённая (например, из-за автомобильной аварии);
— В России более 210 тысяч незрячих и слабовидящих;
— Кроме них есть люди с особенностями восприятия, которые видят всё в расфокусе (астигматизм, катаракта, близорукость и так далее) или других цветах (дальтонизм);
— Дальтонизм — у 8% мужчин и 0,5% женщин;
— В мире не менее 33% людей с нарушением зрения или слепотой, 17–23% с дислексией;
— В России примерно 10% слабослышащих и глухих;
— С 45–50 лет постепенно ухудшается зрение, со временем — слух. В России больше 33% людей старше 50;
— Люди также сталкиваются с ограничениями ситуационно: 69% людей в публичных местах смотрят видео без звука, иногда у людей руки заняты тяжёлыми сумаками;
— 52% людей с инвалидностью хотели бы активнее пользоваться услугами в сфере досуга и развлечений, 36% не пользуются отелями, кафе и ресторанами из-за ограничений;
— У них есть постоянные выплаты от государства. У 30% есть стабильная работа;
— 71% путешествует чаще раза в год. Более 65% посещают кафе и рестораны хотя бы раз в несколько месяцев;
— 52% меняют сервис на аналогичный, потому что не могут им пользоваться;
— 43% пользователей мобильных телефонов включают хотя бы одну настройку доступности. Чаще всего это увеличение шрифта, его жирности, инверсия цветов, увеличение фрагментов экрана.

#accessibility

Хочу вам, котаны и котанки, рассказать про так называемый «эффект Икеи».

Можете этот термин не гуглить, вы его не найдете. И это не потому, что Икея покинула просторы нашей Родины (о где же вы, ЧУСИГ, МЕЛЬТОРП и ЮСОС УВОС, о где же вы) - но потому, что этот термин мы изобрели сами внутри команды и я вообще хз, как он официально называется с точки зрения науки.

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

Это логично: представьте, что у вас 1200 товаров в Избранном - и вам резко захотелось найти деревянные музыкальные ложки, которые вы отложили себе в 2018 году, находясь в важной командировке в г. Кирово-Чепецк. При текущем инструментарии вы будете ошалело листать свое Избранное, попутно вспоминая, какие товары вы клали в Избранное в промежуток времени, близкий к своему кировочепецкому периоду, чтобы случайно не пролистать ложки. Товары не вспоминаются, ложки пролистываются - короче, уходите вы расстроенный и без ложек.

Как можно решить эту проблему? Да очень просто: дать пользователям полезные штуки, известные со времен первого похода Александра Македонского, а именно: а) возможность искать по Избранному; б) возможность фильтровать Избранное по категориям (мало ли, вдруг вы захотели кроме ложек еще и лютню себе купить, инвестируя тем самым в музыкальную культуру).

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

А золотые горы взяли и не пришли. Вместо этого мы обнаружили, что:

а) Пользователи активно пользуются поиском и фильтрами (что хорошо);
б) Выручка Избранного ощутимо упала (что плохо).

И вот тут мы пригорюнились. «ЛЁХА ЕПТ ЗНАЧИТ ВЫ ХУИКС СДЕЛАЛИ?» - вежливо спросите вы. Ан нет, не хуикс - мы сделали хорошую фичу: мы дали возможность пользователю быстро найти нужный товар, не отвлекаясь ни на что, положить его в корзину и скрыться на первой космической скорости - и тем самым мы сделали СЛИШКОМ удобную функцию. Сейчас поясню.

Вспомните свой последний (гм) поход в Икею: вы отправляетесь туда за парой красивых салфеточек и, допустим, ЮСОС ВУСОСом, а возвращаетесь с тремя шкафами, брусничным джемом, четырьмя коврами, плюшевой акулой и миндальным тартом (простите, что давлю на больное). И вы так поступите не потому, что так звезды сложились, но потому что Икея целенаправленно выстраивала свою навигацию так, чтобы вы в своем походе за салфетками протащились через весь магазин и насобирали на себя кучу Очень Нужных Вещей, придя в себя только дома (а желательно - вообще через пару десятков лет). По схожему принципу работает большинство хлебных отделов в супермаркетах - они, как очень востребованные товары, расположены в самой глубине магазина, и потому вы неизбежно купите что-то еще, хотя изначально желали купить хлебушек.

Можно ли продавать ЮСОС ВУСОС на входе в «Икею» сразу около входа (или хлебушек возле касс)? Можно, в моменте это будет удобно. Пойдет ли это во благо бизнесу магазина? Нет, не пойдет, потому что пользователь с энной вероятностью больше ничего не купит.

Так произошло у нас в «Избранном» - мы выдавали требуемый пользователем товар сразу на входе и отпускали пользователя с миром, не давая ему покопаться в Избранном и понабрать других вещей, которые он так бы спокойно положил в корзину. Удобно это? Удобно. Выгодно? Не выгодно.

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

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

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

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

Но будьте с этим осторожны.

#изкрестьянскогобыта

Эдвард Скотт написал о подсказках к поисковым запросам.

— Показывайте в списке не более 10 подсказок на десктопе и 8 на телефоне. В противном случае люди будут их игнорировать или тратить слишком много времени на изучение;
— Подсказки по категориям («красные коврики в категории Ванная комната») повышают вероятность найти нужную вещь. Выделяйте их в списке;
— В тексте подсказок выделяйте (например, жирным шрифтом) то, что не совпадает с введённым в поле поиска текстом. Так пользователь быстрее всё прочитает, пропуская повторяющиеся слова;
— Советы для десктопа: избегайте полос прокрутки;
— Не загромождайте список подсказок лишними функциями и содержимым, чтобы меньше отвлекать пользователей от подсказок;
— Отображайте состояние Hover для подсказок;
— Дайте возможность взаимодействовать с подсказками с помощью клавиатуры: стрелки вверх и вниз для перемещения по списку (список лучше закольцевать), нажатие на Enter для отправки запроса с выбранной подсказкой;
— Дополняйте текст в поле поиска текстом подсказки, оказавшейся в фокусе (например, как в поиске Яндекса и Гугла). Так можно дополнительно объяснить концепцию подсказки и дать возможность дополнения выбранной подсказки;
— Помогайте пользователю не отвлекаться на другие элементы страницы при просмотре подсказок. Можно затемнять всё остальное;
— На телефоне проверьте, что другие элементы страницы не мешают подсказкам: закреплённый хедер, баннер «Установите приложение», кнопка чата.

In English. #search

Андрей Яремко написал о размерах десктопных экранов.

— Иногда подача сайта в портфолио отличается от того же сайта в жизни тем, что пользователь может увидеть на первом экране («до линии сгиба»);
— Ограничения по высоте важно учитывать для проектов с объёмной навигацией и закреплёнными панелями управления, а также при решении закрепить шапку или вертикальное меню;
— Как и в адаптивном дизайне, надо учитывать минимальные размеры самых распространённых устройств;
— В Material Design 2 десктопные устройства начинаются с ширины в 1240 пикселей (40 отданы полосе прокрутки);
— Минимальные популярные разрешения в этом случае: 1366×768 (16%) и 1280×720 (6%). Стандартное разрешение 13-дюймового макбука с 2013 года: 1280×800, но нижний Док занимает больше пространства;
— Все эти панели занимают пространство по вертикали и уменьшают рабочее пространство. В массе пользователь работает с настройками операционных систем и браузеров по умолчанию, то есть не перемещает Док или панель задач Виндоус налево;
— Для разрешения 1366×768 с Edge и Chrome рабочая область по высоте будет 657 пикселей. В разных версиях и с дополнительной панелью (вроде Избранного) рабочая область может начинаться с 550 пикселей;
— Почему это редко учитывают: нет правильных пресетов для создания макетов и предпросмотра, приукрашивание макетов в портфолио, слишком хорошая техника у творцов.

#adaptive