198
Чат читателей @uxnotes · Редактор: @zGrav
А я всегда думала, что тоггл и свич отличаются тем, что тоггл это переключатель нескольких вариантов (от двух и более), а свич это два положения. Соответственно тоггл состоит из нескольких кнопок с текстом внутри и может выполнять функцию как фильтра, так и переключателя, и иногда даже табов. А у свича надпись снаружи, и он только переключает из одного варианта в другой (выкл/вкл).
Читать полностью…
Евгений Шпилевой написал о 40 основных элементах интерфейса: используемые названия, особенности применения, рекомендации по дизайну.
— Например, кто-то называет переключатель тогглом (toggle), а кто-то свитчем (switch). Нижнюю панель навигации в мобильных приложениях Material Design называет Nav bar (Navigation bar), а Human Interface Guidelines — Tab bar;
— Аккордеон отличается от коллапса (позволяет свернуть и развернуть часть контента) тем, что состоит сразу из нескольких блоков, которые можно разворачивать и сворачивать. Аккордеон часто используют для FAQ (часто задаваемых вопросов), а коллапс — для блока «Показать ещё»;
— Пагинация (pagination) позволяет перемещаться между разделённым на порции (страницы) контентом. Классический вид — перечень номеров страниц, но также есть вариант с кнопкой «Загрузить ещё» (нажатие приводит к загрузке следующей порции) и бесконечным скролом (следующая порция загружается автоматически при прокрутке страницы);
— Кроме бургерного меню есть ещё кебаб (3 вертикальные точки), фрикадельки (3 горизонтальные точки) и бенто (2×2 или 3×3 точек или квадратов). Кебаб (чаще в Android) и фрикадельки (iOS) обычно открывают меню с дополнительными действиями или настройками. Бенто — меню приложений или сервисов;
— Табы — элемент навигации, позволяющий переключаться между контентом, находясь на одной странице, не используются для ввода пользовательских данных;
— Выпадающий список (dropdown) — это панель, которая отображается после нажатия на селект, мультиселект или кнопку и включает список вариантов для выбора;
— Textarea правильно произносится «текстэреа»;
— В поле для ввода пароля текст по умолчанию скрыт и отображается иконка открытого глаза, нажатие на которую позволяет увидеть введённый текст;
— Если операция длится больше 3–5 секунд, вместо лоадера (показывает, что система выполняет какую-то операцию) лучше отображать прогресс-бар (показывает, насколько продвинулось выполнение какой-либо операции);
— Тост (toast notification) в отличие от уведомления (notification) должен исчезнуть спустя 3–5 секунд, поэтому в нём мало текста и нет кнопок для дополнительных действий.
В Rutube обновили дизайн веб-версии Студии для авторов. Обновление основных разделов доступно всем пользователям.
— Полностью обновили UI, он стал красивее и приятнее;
— Появилось больше воздуха, контент стал заметнее, а графики информативнее;
— Унифицировали расположение элементов интерфейса и функциональность;
— Загрузка и редактирование видео теперь доступны в модальном окне;
— При загрузке нескольких файлов отображается виджет со статусом их загрузки;
— Объединены и скрыты необязательные настройки (раздел «Расширенные настройки»);
— Сериалы в плейлистах вынесены в отдельную вкладку, чтобы более чётко структурировать контент;
— Сами плейлисты отображаются карточками, как на основной платформе;
— Появилась возможность редактировать их обложки, сортировать их по новизне, а внутри плейлиста — настроить порядок видео в списке;
— Статистика просмотров плейлиста стала ярче и нагляднее;
— Данные о подписчиках, просмотрах, общем времени просмотра, комментариях и зрителях представлены в виде графиков и собраны на одной странице;
— В разделе трансляций и донатов изменили форму настроек, убрали лишние элементы, увеличили плеер для авторов и вынесли чат сбоку от него;
— К вкладкам «В эфире», «Ожидают начала» и «Завершённые» добавили счётчики;
— Кнопку добавления новой трансляции перенесли в правый верхний угол;
— Список трансляций стал плотнее, сетка отображает до 24 обложек одновременно;
— В итоге улучшилась навигация и управление большим объёмом контента.
«По результатам нашего опроса новый дизайн воспринимается как более интересный, современный и удобный, а средняя оценка составила 6,5 из 7. Проделанная работа по редизайну сервиса позволит ускорить реализацию будущих обновлений и улучшений, так что Студия RUTUBE будет постоянно развиваться и обрастать новыми функциями», — директор по продукту Евгений Ильчук.
Интересный момент получает, усложнение ради "безопасности"... Я уже привык просто пропускать его при вводе, да и конечно многие сервисы отказались от лишнего поля.
Читать полностью…
Материалы в Лемане что надо, думаю и вебинар пойдет на ура
Читать полностью…
я учусь и мне не все из этого очевидно, и думаю, другим, кто только учится или работает первый год -- тоже
Читать полностью…
Кстати, да. Этот Энтони уже скорее блогер, чем эксперт по дизайну интерфейсов. Но иногда почему бы не сослаться на материалы, где он в одном месте перечисляет какие-то тезисы, уже ставшие базовыми
Читать полностью…
/channel/UXteddy
автор переводит статьи из знаменитого UX mouvment
Энтони лет на 10 припоздал, все нормальные ребята давно так делают, таких косяков уже не встретить нигде
Читать полностью…
«ИИстина» — митап Яндекса про ИИ, людей и то, что между ними
4 декабря в Москве и онлайн Яндекс собирает технокреативных людей — дизайнеров, продюсеров, маркетологов, контент-лидеров и арт-директоров. Те, кто задаёт тренды в своих командах и уже использует ИИ, но часто точечно и без системы.
На «ИИстине» мы вместе:
• Систематизируем знания и опыт с ИИ
• Посмотрим, что реально работает, а что нет
• Заберём проверенные инструменты и лайфхаки коллег
А потом расслабимся и отдохнём: технококтейли, ИИ-диджей и афтерпати — даже самые крутые алгоритмы точно не заменят живое общение.
📍 4 декабря, 17:00, Москва и онлайн
👾 Регистрируйтесь, если хотите понимать нейросети, а не просто их использовать.
Реклама. ООО "Яндекс". ИНН 7736207543
Оля Ходаковская написала об измерении успешности дизайна с помощью UX-бенчмаркинга.
— Иногда метрики вроде количества зарабатываемых денег не подходят. В B2B успехи сильно зависят от отдела продаж (выиграли тендер, привели хороших лидов). Да и продукты могут быть бесплатными;
— Ключевые метрики юзабилити: результативность (effectiveness), эффективность (efficiency), удовлетворённость (satisfaction);
— В технически сложных продуктах эффективность или time on task (время выполнения задачи) падает при добавлении новых фич. Они увеличивают путь пользователя (например, время конфигурации сервера), но привлекают клиентов;
— Результативность — task completion rate, насколько успешно пользователи справляются с задачей. Обычно задачи состоят из 2–5 шагов, на микрозадачи нет смысла смотреть из-за высокой конверсии;
— UX-бенчмаркинг — сравнительное количественное исследование. Можно сравнивать показатели продукта в этом и прошлом периоде (или до и после редизайна), разных продуктов компании, конкурирующих продуктов (сложно и дорого);
— Проводя его регулярно, надо выбрать период, который будет учитывать сезонные колебания и длину цикла разработки (чтобы успевали накопиться изменения в продукте);
— Показатели у разных задач могут отличаться. Базовые уровни в Селектеле: 48% для ключевых сервисов, 33% для базовых вспомогательных, 20% для сложных и тех, которые нужны только определённым сегментам клиентов;
— Для сбора данных используют self-hosted PostHog. UX-дизайнеры проектируют все события и единообразно по шаблону их называют: Источник события_Продуктовое направление_Продукт или фича_Объект и действие с ним;
— При сборе данных надо фильтровать внутренних и тестовых пользователей, учитывать только уникальных пользователей (2 раза прошёл сценарий = 1 справившийся с задачей пользователь);
— Также надо подобрать окно конверсии. Например, человек мог 2 недели заходить в форму и уходить подумать, что-то согласовать с коллегами, но в итоге выполнить задачу. Это тоже будет посчитано как 1 успешное прохождение сценария;
— Сравнивать показатели можно с первым замером, известными значениями у аналогичных продуктов, целевым значением, выбранным как OKR, например, которого хочется достичь после релиза нового дизайна;
— Зная значение метрики, можно на неё влиять, внося изменения в продукт и его интерфейс. Можно количественно оценивать эффективность своих решений;
— Промо метрики: ежеквартальные встречи для обсуждения итогов очередного бенча и шагов по оптимизации метрики, публикация итогов в корпоративном канале, рассказ о процессе и подключение к нему новых продуктов и сценариев, ссылки на метрику при обсуждении со стейкхолдерами.
#metrics
Потому что приложение не выдаёт чеки. А люди старой закалки привыкли к ним, к чему-то физическому что можно подержать в руках и показать какому-то мифическому контролёру если вдруг когда-то возникнет такая необходимость. Даже если после развала Союза такого ни разу не происходило.
Читать полностью…
Андрей Шапиро написал о вопросах, направляющих проектирование.
— Вопрос — коммуникационный инструмент направленного размышления;
— В проектировании чаще всего имеют дело с вопросами исследовательскими (определение области, которую надо изучить подробнее) и проблематизирующими (постановка задачи);
— В начале проекта, когда идёт снятие задачи, проектировщики иногда не понимают, куда двигаться дальше;
— Чтобы задать качественные вопросы, надо начать исследование и минимально погрузиться в предметную область;
— Основа мышления — создание в голове схем, отражающих модели реальности. Обнаружив отсутствие важных деталей или нарушение логики в построении схем, мы можем это исправить;
— Вопросы позволяют подсветить себе или проектной группе эти проблемные места. Белое пятно — полное отсутствие понимания (по аналогии с картами до великих географических открытий). Серая зона — место, где понимание туманно, и мы это знаем;
— Есть практики ненаправленного интуитивного творческого поиска (вроде поиска образа в каракулях), но в проектировании нужны более надёжные направляющие;
— Ими могут быть следующие артефакты, уточняющие устройство человеческой деятельности: структура потоков, процессы как цепочки последовательных действий и событий, типичные ситуации и способы принятия решений в них, структура внутреннего устройства объекта, структура взаимодействий объектов и так далее;
— Получив новую порцию знаний в диалоге с экспертами и представителями заказчика, проектировщик обновляет картину и подсвечивает вопросами новые моменты для уточнения;
— Беглость приходит с опытом. Не страшно, если новая пачка вопросов появляется между встречами;
— Шаблонные вопросы позволяют снизить неопределённость на старте. Всегда есть фаза предварительного анализа замысла, выяснения сути задачи, её границ и целей заказчика;
— Всегда важно, как будут построены отношения, каковы у сторон ожидания друг к другу, из чего будет строиться процесс, как будет достигаться результат;
— Примеры вопросов о бизнесе клиента: Как вы работаете? На чём зарабатываете? Где вы берёте клиентов? Какой канал продаж самый эффективный?
— Есть ещё вопросы, демонстрирующие проблемы, когда вы уже увидели проблему, а собеседник — нет;
— Большую часть времени проектировщик задаёт вопросы сам себе. Это проблематизирующие вопросы, в которых сформулирована задача. Например: «Как проверяющий узнает, что по портфелю заново запущена проверка?»;
— Шаблоны таких вопросов: Как сделать так, чтобы появился <отсутствующий пока желаемый эффект> или исчез <наблюдаемый нежелательный эффект>? Как или за счёт чего будет работать <отсутствующий пока механизм> с <таким-то результатом на выходе>? Что, где и как поменять в системе, чтобы удовлетворить <новому требованию>?
#analysis
Илья Безделев написал об одно- и двусторонних дверях при принятии продуктовых решений.
— В двустороннюю дверь можно войти, осмотреться и, если не понравилось, выйти обратно;
— В продукте это решения, которые не приведут к катастрофе и которые можно откатить назад;
— Односторонняя дверь, как турникет в метро, позволяет пройти только в одну сторону;
— Это решения, которые нельзя откатить вовсе, либо это слишком дорого с точки зрения ресурсов, PR, доверия пользователей и так далее;
— Аналогию с дверьми придумали в Амазоне, чтобы было понятно, когда можно быстро принимать решения, а когда важно внимание к деталям;
— Сотрудники, принимающие решения, должны понять, в какую дверь они собираются войти;
— Двусторонние решения принимают без консультации с руководством. Односторонние могут доходить до самого верха.
#prioritization
У нас это обязательное поле, и там обязательно должно быть такое же имя, как у владельца профиля. Имя владельца профиля во время KYC проверяется: надо фото паспорта загрузить и лицо показать в камеру
Читать полностью…
Мы получили фидбэк что без имени они испытывают недоверие. Чисто психологическая штука.
Читать полностью…
Илья Безделев написал, что делать с дизайн-долгом (papercuts).
— Дизайн-долг — места в интерфейсе, где что-то получилось криво по незнанию или неумению или где срезали углы, чтобы сделать быстрее;
— По отдельности проблемы вроде лишнего шага или немного кривой валидации формы не смертельны, как порез бумагой;
— Но если нанести слишком много порезов, может случиться «death by a thousand papercuts» — продукт перестанет приносить пользователям радость;
— В каждом цикле планирования выделяйте время на исправление мелких недочётов;
— Их можно закидывать в планы с низким приоритетом как бонусные задачи. Сделал большое дело, можно заняться мелочью;
— В командах с полноценными онколл-ротациями у разработчиков может быть свободное время онколла, когда не надо тушить пожары. Они могут заниматься papercuts;
— Хакатон-фиксатон — на неделю отложить работу над фичами и заняться фиксом дизайн-долга.
#design_debt
10 декабря в 19:00 мск UX Feedback и Лемана Про расскажут об опыте сбора и интерпретации фидбека.
— Ошибки в этом процессе приводят к тому, что продукт улучшили, а роста нет;
— Иногда исследователи приносят слишком общие данные, с которыми сложно принимать решения. Точечно и быстро собирать данные помогают ad-hoc опросы;
— Инструментов для исследования много. Чтобы не возникал хаос, надо уметь всех их поженить и распределить по этапам.
Кроме этого эксперты (менеджер по развитию бизнеса UX Feedback Артем Кардава и руководитель отдела онлайн-продуктов Лемана Про Ольга Сурда) расскажут:
— Как принимать решения о доработках на основе данных, а не предположений;
— Как точечные опросы помогли Лемана Про повысить конверсию на 5% без долгих и дорогих экспериментов;
— Как превратить фидбек в инструмент роста: какие изменения реально влияют на метрики и как их внедрять в процесс разработки;
— Как перевести работу с обратной связью в систему. Методология Voice of the Customer (VoC).
Зарегистрироваться на вебинар
Реклама ООО «ФИДБЕК». ИНН: 5030094661, erid: 2VtzqwnZWvu
Кристина Мруц написала, как снизить влияние когнитивных искажений на восприятие пользовательского фидбека.
— Перед релизом новой версии вы могли переживать, что пользователи её не примут, и негативные отзывы (даже если их несколько) подтвердят ваши сомнения;
— Чтобы уменьшить эффект подтверждения, когда мы принимаем только аргументы, подтверждающие нашу исходную позицию, перед чтением отзывов изучите объективные данные (например, продуктовые метрики);
— Можно привлечь независимого аналитика или автоматически кластеризовать отзывы по темам (BERTopic, GPT-based summarization), чтобы оценить тренды без влияния предположений команды;
— Чтобы уменьшить негативное искажение, делите отзывы на позитивные, негативные и нейтральные и смотрите на их баланс. Тональность отзывов помогают определять RoBERTa и BERT-based модели;
— Смотрите на частоту проблем: сколько пользователей пишет об одном и том же;
— Но учтите, так сложнее заметить отдельные отзывы, которые сами по себе могут стать проблемой. Например, негативные публикации инфлюенсеров;
— Стоит отделять отзывы о временных негативных или позитивных событиях. Если сервер лежал несколько часов, будет много негатива, но это проблема не продукта, а инфраструктуры;
— Один яркий запоминающийся кейс из саппорта может создать впечатление, что это значимая проблема (эвристика доступности);
— Систематизируйте отзывы по сценариям, чтобы не принимать редкие проблемы за типичные. С этим помогает LDA, BERTopic и GPT-топики. Полезно иметь базу типовых пользовательских сценариев, чтобы ссылаться на них и лучше понимать контекст отзыва;
— Чтобы снизить эффект авторитета, не указывайте статус автора;
— Но иногда полезно наоборот сегментировать отзывы по авторам: эксперты, инфлюенсеры, новички, обычные пользователи. При развитии продуктов для узких сегментов отзывы экспертов критически важны;
— Тон отзыва влияет на интерпретацию. Учитесь не вестись на манипулятивный, эмоциональный, экспертно-уверенный стиль высказываний.
#feedback
UX Movement заявляют непроверенные вещи, о чём я им написал на Медиуме, но они не ответили. У них была статья где они утверждали что флоатинг лэйбл (как в Материале) быстрее считывается пользователем чем статичный. При этом никаких ссылок на исследования не представлено. Просто голое утверждение.
Читать полностью…
Энтони Ценг написал uxteddy/0exvssIr2jF">о форме ввода данных банковской карты.
— До того, как пользователь откроет эту форму, покажите логотипы платёжных систем, карты которых принимаются;
— После ввода первых цифр номера карты отобразите логотип платёжной системы, чтобы показать, что пользователь вводит правильный номер;
— Группируйте вводимые цифры так же, как они отображаются на карте, чтобы легче было их сверять;
— Для ввода срока действия карты не используйте выпадающие списки, не давайте вводить номер месяца одной цифрой, а год четырьмя. Используйте маску MM/YY;
— Подпись для поля «Name on card (Имя на карте)» понятнее, чем «Cardholder name (Имя держателя карты)»;
— Подпись «Security code (Код безопасности)» для цифр с обратной стороны карты понятнее, чем аббревиатуры вроде CVV или CVC (встречаются и другие варианты);
— Порядок полей: Номер карты, Срок действия, Код безопасности, Имя на карте;
— Поля «Срок действия» и «Код безопасности» можно сделать уже, чтобы подчеркнуть, что в них можно ввести меньше символов;
— Валидируйте поле для ввода номера карты после того, как пользователь закончил ввод, чтобы не пугать его раньше времени;
— Отображайте сообщения об ошибках под соответствующими полями, чтобы была чёткая взаимосвязь;
— Кнопка в такой форме не всегда приводит к платежу. Пишите в кнопке, что произойдёт при нажатии. Например: «Continue to review order».
#form #payment
Александр Букин написал, как упростить поиск актуальных макетов и ответственных за них в большом продукте.
— Иногда работа дизайнера связана с экранами, за которые отвечает другая команда. К кому обратиться за актуальными макетами?
— Создали схему структуры департамента дизайна и исследований (меняется реже структуры продуктовых команд);
— Для каждого дизайнера показаны главные экраны фич, за которые он отвечает (для визуального ориентира), добавлены ссылки на макеты и даты скринов;
— Иногда дизайнеры переходят между командами, и тогда на схеме можно найти их лидов или руководителей направления, чтобы уточнить авторство и актуальность макетов;
— Если за экран отвечает несколько команд, на нём выделяют зоны ответственности разных дизайнеров;
— С ростом карты добавили оглавление со списком ссылок на самые популярные экраны: главный, каталог, корзина, чекаут и несколько других;
— Когда кто-то из дизайнеров переходит из команды в команду или меняет зону ответственности, лид сообщает оунеру карты, который правит схему. (Лид может и сам внести правки.)
#management
Казалось бы я вроде зумер но мне нравится этот вайб идти брать платёжку а потом оплачивать в банкинге, но думаю люди старшего поколения ценят это как некий квест взять платёжку, пойти прогуляться за оплатой, а по пути увидеть знакомых познакомиться, закупить продукты и так далее, + в ощущения бумажечек есть чтото необычное
Читать полностью…
Супер! Сейчас работаю над созданием приложения для оплаты ЖКХ и не могу толком понять почему до сих пор оплачивают на почте)
Читать полностью…
Дорогие UX- редакторы!
Я провожу исследование для диплома в университете, изучаю лингвистические особенности UX-текстов, написанных ИИ. Для сравнения мне необходимы тексты, написанные «живыми» UX-писателями и ИИ по одному и тому же заданию (промпту). Буду рада, если вы согласитесь помочь: нужно будет написать тексты для выдуманного приложения, например: приветственный экран, ситуация ошибки, форма регистрации, дашборд и т. п.
Текстов не очень много, но все-таки необходим материал, поэтому экранов будет 8. Задание вы получите, собственно, в виде джипегов и письменного задания. Пользоваться ИИ для написания, понятное дело, нельзя — иначе смысл исследования теряется.
Данные будут анонимизированы. Попрошу только опыт работы в годах указать. Напишите в личку, если готовы поучаствовать (если за деньги — за сколько).