UX Notes

Алексей Самохин рассказал о кросс-сейле и апсейле в интерфейсе.

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

#cart #upselling #cross_selling

Если вы ведёте канал, который может быть интересен читателям UX Notes, поделитесь им в комментариях. Напишите, чем он хорош и почему стоит на него подписаться. И ставьте лайки анонсам классных каналов, чтобы больше людей обратило на них внимание.

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

#media

DevCrowd выпустили новое исследование продуктовых дизайнеров. UX Notes снова на 3-м месте в списке русскоязычных источников информации по продуктовому дизайну.

2024 · 4-е место
2023 · 3-е место

Дарья Хуторянская написала, как защищать дизайн-решения перед командой.

— Вопрос о релевантности решения (почему именно так решаем задачу) обычно появляется задолго до презентации макетов команде. Но бывает всякое;
— Сошлитесь на результаты предыдущих этапов дизайн-процесса (генерация решений, оценка и выбор подходящего). Например: на результаты обсуждения диапазона возможных решений с командой. Да, имеет смысл это фиксировать;
— В идеале обосновывать конкретные дизайн-решения проведёнными исследованиями;
— Но если их не было, можно опираться на стандарты. Например: эвристики, гайдлайны Apple и Material Design, вашу дизайн-систему, стандарты доступности;
— Хорошо использовать их не только для защиты, но и для самопроверки перед презентацией решения команде;
— Также можно опираться на гештальт-принципы — психологические законы, описывающие, как люди воспринимают и группируют визуальную информацию;
— Ссылаясь на конкурентов, стоит включать критическое мышление. Мы не знаем, насколько конкретное дизайн-решение привело конкурента к успеху. Возможно, всё благодаря широкому ассортименту и быстрой доставке;
— В какой-то момент появится возможность ссылаться на собственную экспертизу. Но для этого нужно накопить опыт и в дизайне, и в сфере продукта.

#presentation

Эдвард Скотт написал о частых ошибках в дизайне страницы товара в интернет-магазинах.

— Люди часто не находят (27% респондентов) информацию о товаре, если она спрятана в горизонтальных вкладках. Лучше отображать её в секциях, одну под другой. Если секции сворачиваются, их не замечают всего 8%;
— Добавьте изображения, позволяющие визуально оценить размер товара. Например: фото предмета в руке;
— Добавьте изображения товара, опубликованные покупателями в соцсетях. Они покажут товар в деле и добавят социальных доказательств;
— Дайте возможность добавить товар в избранное без регистрации и входа. Люди могут использовать избранное для сохранения и последующего сравнения понравившихся товаров и могут не хотеть сразу делиться своим имейлом;
— Если товар можно купить в упаковках разного объёма, показывайте цену за единицу объёма (например, за кг). Человек может неправильно прикинуть стоимость при сравнении и отказаться от выгодного предложения;
— В блоке «Купить» показывайте общую стоимость заказа с налогами, доставкой, платой за негабаритный товар. Если есть варианты доставки, показывайте минимальную общую стоимость;
— Ссылку на политику возврата разместите на видном месте, так как возвраты — источник беспокойства при покупке в интернете;
— Отобразите возможность оформления покупки как подарка: накладная без цены, подарочная упаковка. Особенно, если в магазине часто заказывают что-то в подарок;
— Группируйте технические характеристики товаров, если их больше 20, снабжайте группы заголовками;
— Приводите параметры товаров от разных поставщиков к единому формату (например, все размеры в метрической системе);
— Объясняйте непонятные термины в характеристиках, например, в тултипе при наведении на термин;
— Позволяйте перемещаться по отзывам, пролистывая изображения в них. Отзывы с картинками дают более объективное и полное представление о товарах.

In English. #ecommerce #product_page

Тимур Габбасов написал, как ускорить дизайн-ревью.

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

#review

Михаил Малевич написал, как повысить конверсию первого экрана лендинга (hero section).

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

In English. #landing #conversion

Кейт Каплан написала об иконке бургера.

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

In English. #icon

Вика Лисицына написала, должен ли дизайнер ~~уметь кодить~~ быть немного продактом.

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

#product

Михаил Руденко написал о формулировании ценностного предложения.

— Ценность — абстрактное понятие. Ценностное предложение — стратегия заключения сделки с клиентом;
— Также оно помогает продакту, продавцу, маркетологу и специалисту по клиентскому опыту договориться, синхронизироваться, заложить основу для своей работы и существенно повысить качество продуктовых гипотез;
— Может состоять из нескольких взаимосвязанных компонентов, перечисленных ниже;
— 1. Клиентский сегмент. Нет продукта, который потребляет каждый человек на земле с самого рождения до смерти. Более универсальным может быть базовый продукт (такие дорого не продать) или кастомизируемый (такие дорого создавать);
— Описание клиентского сегмента должно позволять выделять таких людей благодаря данным из открытых источников;
— 2. Ключевой мотивационный конфликт. Если человек относится к целевому сегменту, ему может быть не нужен продукт прямо сейчас. Надо выделить событие, вызывающее «поисковое поведение», осознание клиентом конфликта между драйвером и барьером;
— 3. Артефакт — за счёт какого набора товаров, услуг и информации может быть разрешён конфликт. Клиент должен понимать артефакт или его составляющие на уровне категорий;
— 4. Атрибуты артефакта — характеристики конкретного экземпляра артефакта, которые позволяют сравнивать его с другими;
— 5. Ценовые условия — цена (скидки, кешбеки и бонусы) или любой другой вклад покупателя (бесплатно в обмен на просмотр рекламы);
— 6. Условия обмена — как будет происходить процесс обмена («утром деньги, вечером стулья», скорость доставки) и гарантии (обратный обмен, расторжение сделки, «бесплатно, если не доставим за час»);
— 7. Атрибуты компании — свойства самого продавца (бренд, «50 лет на рынке»);
— 8. Ценность — символический смысл обмена: во имя власти, любви, комфорта, эстетики, превосходства и так далее;
— 9. Аргументы — сообщение о связи хотя бы двух компонентов ценностного предложения. Например: «Компания X производит матрасы с Y года» — артефакт и атрибут компании. «Зубная паста X для детей от 3 до 6 лет укрепляет зубы и снижает риск кариеса» — артефакт, сегмент и конфликт.

#product

Борис Юзефпольский поделился лайфхаками, как провести интервью и восстановиться после.

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

#research #interview

Александр Горчаков поделил команды на 4 типа по уровню стабильности и вызовов и написал, что делать лидерам таких команд.

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

#management

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

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

#industrial #research

Никита Самутин и Елизавета Демченко провели исследование рынка продуктового дизайна и поделились выводами.

— 33% дизайнеров утверждают, что встречи и переписки мешают сосредоточиться. Это не зависит от размера компании. Проблема не в коммуникации как таковой, а в её хаотичности;
— Задавайте правила общения. Даже простое «Если комментарий неясен — обсуждаем голосом» сделает процесс понятнее и снизит напряжение;
— Дизайнерам сложнее общаться не с разработчиками (как многие считают), а со стейкхолдерами и маркетингом. Для взаимодействия с разработчиками есть отлаженные ритуалы, помогающие налаживать контакт;
— Дизайнеры реже чувствуют перегрузку в больших командах, возможно, потому что у них чаще встречаются понятные процессы, чёткое разделение ролей и поддерживающая инфраструктура;
— 58% опрошенных не видят возможностей для карьерного роста. 81% называют нехватку обратной связи от руководства одним из главных препятствий для роста;
— Проводите сессии обратной связи, разрабатывайте понятные карьерные треки (включая горизонтальный, экспертный рост) и вовлекайте дизайнеров в работу над задачами, связанными с бизнес-целями;
— Главные причины выгорания: нереалистичные дедлайны, размытые ожидания и зоны ответственности, конфликты. Йога и психолог помогают справляться со стрессом, а не бороться с его причинами;
— Руководителям следует инвестировать в прозрачное планирование и адекватную оценку сроков;
— Вместо общих курсов по дизайну есть запрос на специализированные и глубокие форматы: разборы реальных задач, рабочих процессов, фидбек;
— 77% не видят в ИИ прямой угрозы для своей карьеры. При этом 49% ощутили его влияние и активно внедряют в процессы;
— Поиск работы стал дольше, но в России он занимает не так много времени, возможно, из-за более коротких процессов найма;
— Только 9% дизайнеров считают, что при поиске работы получили обратную связь в достаточном объёме. Недостаточная обратная связь или её отсутствие ухудшают мнение соискателей о работодателе.

#management

Анна Малинина написала об обработке ошибок при заполнении форм.

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

#form #error

Геннадий Мохов написал о регламентах в работе дизайн-команды.

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

#management

Новые материалы в @uxwork (кроме вакансий):

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

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

— Когда человек заводит электронную почту, его имя пользователя и домен почтового сервиса становятся уникальным адресом;
— Но его не обязательно указывать в точности, чтобы получать письма;
— Все почтовые сервисы игнорируют регистр букв. Gmail — точки в имени пользователя. Почти все игнорируют то, что в имени пользователя указано после «+»;
— Фишка с «+» описана в одном из стандартов работы электронной почты и может использоваться для борьбы со спамом и сортировки почты;
— Плюс тестировщики могут так зарегистрировать несколько аккаунтов в тестируемых продуктах, не заводя множества почтовых ящиков;
— Некоторые почтовики работают на нескольких доменах. Например, gmail.com и googlemail.com, yandex.ru и ya.ru;
— По хорошему, сделав исключение для тестировщиков, всё это стоит учитывать при регистрации, входе и восстановлении пароля (в статье в общих чертах описан механизм), чтобы пользователи не создавали несколько аккаунтов, фактически связанных с одним ящиком;
— Пользователь может забыть, с каким адресом регистрировался ранее, и по ошибке завести ещё один аккаунт;
— Если посмотреть на крупные и популярные сервисы вроде ChatGPT, Notion, Amazon, они отрабатывают только кейс с регистром букв.

#login #signup

Бо Кибза и Лёха Макаренко (дизайнеры дизайн-систем Альфа-Банка, Озона, Самоката и Почтатеха) рассказали о развитии системы цветов в ДС Туту.

— Легаси-ДС не дорабатывали, чтобы нигде ничего не отвалилось. Команды с большой автономностью локально допиливали компоненты под свои нужды;
— Хотели консистентности, единых стандартов и при этом пространства для свободы;
— Одним из требований к системе цветов была отзывчивость к изменениям, так как компания ребрендилась;
— В этом случае, если минимизировать возможность кастома, бардак накопится не в продукте, а в ДС, где его проще прибрать;
— Обычно делают слои токенов: палитра → семантика (подложки, обводки, текст) → компоненты (текст на кнопке);
— Ради скорости дизайна и разработки компонентов отказались от семантического слоя. Условие: не использовать цвета палитры напрямую, не оверрайдить цвета в покрашенных компонентах;
— Подход даёт очень много компонентных переменных, а также много мелких разночтений (вроде немного отличающихся подложек в чипе и лейбле);
— Зато дизайнеры успели попробовать компоненты в макетах и понять, что нужно единое решение для контрастных элементов и компоновки On white / On gray;
— On white больше подходит для коммуникационных экранов, On gray — для более интерфейсных, с формами и карточками;
— On gray экраны нельзя просто перевести в тёмную тему — бекграунд светится ярче, чем форграунд, и в интерфейсе появляются дыры;
— Можно завести в светлой теме 2 background и 2 panel цвета, которые в тёмной теме станут 1 background и 1 panel. Но как объяснить дизайнерам, какой из 2 цветов использовать?
— В итоге завели мод для переключения On white / On gray, и в светлой теме оставили 1 background и 1 panel;
— Мод On gray кроме цвета подложки может устанавливать, например, более тёмный цвет текста, чтобы сохранять контраст на более тёмном фоне;
— Также через мод Contrast (low, high) реализовали возможность делать отдельные элементы более контрастными;
— Таким образом, семантика построена на основе конкретных продуктовых запросов;
— Палитру всегда можно доделать потом;
— Удобно, когда семантические цвета в палитре находятся на одном уровне: можно сразу увидеть ошибку и в целом запомнить, что цвет текста — это 500;
— Также удобно иметь отдельную палитру для тёмной темы с интерпретированными цветами (можно оставить только те, что точно используются).

Статья на Хабре. #color #design_system

Станислав Хрусталёв прошёлся по ошибкам в отображении рейтинга товаров. Я переформулировал их в рекомендации.

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

#rating #ecommerce