мои проекты
|
блог: вебразработка и SEO
|
блог: экономика и политика
|
блог: разное и интересное
|
портфолио: дизайн
|
пресса и выступления

главная > блог: вебразработка и SEO > UX и UI ошибки в примерах

Примеры ошибок UX (User Experience) и UI (User Interface)

User Experience - опыт взаимодействия пользователя с продуктом.



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

Facebook - ошибка UX - UI

Фейсбук спрашивает "отменить ли действие". И два варианта выбора "Отмена" или "Отменить"... что выбрать? И какое поведение в этом сценарии предполагал разработчик?

Сайт сервисного центра DR-Sound - программная или логическа ошибка UX

На сайте сервисного центра предполагается выбор вашего города (от него зависит цена услуги). Город определяется автоматически, ручного ввода нет. На экране сообщение, что "Город определен". По сценарию пользователю необходимо подтвердить правильность определения города. Попробуйте сделать свой выбор )))

Сайт Альфа-банка - ошибка (UX - UI)

По сценарию пользователь набирает пароль кликая на клавиши виртуальной клавиатуры. Но не протестировали верстку. Белые клавиши виртуальной клавиатуры пересекаются с белыми символами адреса-телефона. В результате клики попадают по символам вместо клавиш, делая ввод пароля увлекательным квестом.

  

Сайт BCS-банка - программная ошибка (UX)

Вероятно программная ошибка (видима по F12) - не отправляется форма заявки, зависает на отправке. Не дотестировали?

Очередные баги User Experience UX на сайте Билайна

Ищу подробности про включение-выключение переадресации.
И не только я - в разделе "Часто ищут - В билайне (кстати, почему со строчной буквы?)" - "Переадресация".
Но по столь популярному интересу юзеров поисковой системе Билайна, увы, сказать нечего... 



А теперь бага на стыке User Experience и User Interface:

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

Но форма чата с поддержкой работает.
Отправляю в чат скриншот. Благо, есть "скрепка" прикрепить файл.

Но бот - "doesn't accept attachments"! Так зачем на чате с этим ботом разместили навигацию для добавления аттачмента?

Сайт DNS магазина - программная ошибка (UX)

Программная ошибка. Форма регистрации не распознает формат номера телефона и не отправляет регистрационный код. Вероятно программисты не предусмотрели возможность ввода некоторого знака в номере: +, - или пробелов.

Сайт авиабилетов Expedia - программная ошибка (UX)

Программная ошибка на сайте туристического сервиса мирового уровня Expedia (агрегатор отелей и авиабилетов). Движок сайта "не видит", что данные городов вылета и прилета уже введены в форму. И требует их ввести. Чем ставит пользователя в тупи (проблема UX).

Непродуманный сценарий пользовательского поведения на сайте www.nat-geo.ru

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

видео:

Сайт компании Рольф Лахта: нарушение User Familiarity в UI

Кроме User Experience Design (UE - проектирование взаимодействия пользователя) и User Interface Design (UI - проектирование пользовательсткого интерфейса) есть близкое к ним по понятие User Familiarity (UF). Это элементы и методы взаимодействия с интерфейсом привычные или знакомые пользователю, которые ему интуитивно понятны.

В качестве примера нарушения UF - интерфейс выбора параметров ниже. Существует общепринятый и знакомый пользователям элемент выбора "поставить галочку в квадратике" или checkbox для фиксации выбора. Однако, в данном примере дизайнер поставил галочку около всех элементов для выбора, чем нарушил привычный и интуитивно понятный пользователям способ взаимодействия с интерфейсом выбора.

видео:

Сайт GeekBrains - программная или организационная ошибка (UX)

Видеоурок на сайте обучающего центра GeekBrains. Как минимум, первые 31 минута записи урока - просто заставка (больше проверять не выдержал). Никто в компании не тестировал?

Сайт SEO сервиса Serpstat - программная ошибка (UX)

При некоторых условиях (вероятно - таймаут на медленно соединении) не загружаются лейблы формы, что делает невозможным использование сервиса. Никто в компании не тестировал на соединениях на разной скорости?

Петербургская Недвижимость: кривое UX в рекламе

Проблема отсутствия внимания к пользовательскому поведению проявляется не только в рамках поведения на сайте, но и раньше - с момента рекламного контакта.

В примере ниже компания Петербуржская Недвижимость тратит деньги на рекламу ЖК Фортеция, однако рекламная ссылка ведет в никуда: не на страницу предложения по этому ЖК, а на страницу других ЖК, где данный проект не представлен. Более того, его не найти, даже если очень постараться...

видео:

UX gроблема проектирования поддержки на сайте Авито

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

User Experience - чат с техподдержкой банка

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

User Experience - Skillbox

Один из постоянных источников негативного UX - общение с сотрудниками техподдержки:
- сотрудники не знают сайты своих компаний, не ориентируются в них, и поэтому не могут помочь;
- или не умеют излагать свои мысли (возможно еще и тяготятся свой работой).
Пример чата с техподдержкой обучающего центра Skillbox, где менеджер просто исчезла - видимо, не зная, что ответить:

Сайт компании Рольф Лахта: программная бага UI

Проблема интерфейса UX-UI - не дает выбрать марку автомобиля в "калькуляторе услуг".
Минимум - посетители получают плохой опыт, максимум - компания теряет клиентов.
Варианты проблемы: Программная или логическая ошибка UI

видео:

Сайт издания Fontanka.ru - ошибка верстки (UX-UI)

На сайте популярного Питерского издания Фонтанка.ру криво сверстали и не проверили верстку спецпроекта. Верстка полностью разваливается при изменении размера окна браузера. Никто не тестировал на изменение размера окна?

Сайт компании Окна-Питер: баги UI мобильной версии

Тестирование на смартфонах, похоже, просто не проводилось. В мобильной версии:
1. Обрезается большая часть названия компании - полностью теряется идентификация, нанося ущерб репутации.
2. Расползается меню.
3. Полностью пропадает слоган с основными конкурентными преимуществами (сформулированными маркетологами компании) "Окно за 1 день! Гарантия 25 лет!"
И ведь никто не проверил - ни разработчики, ни сотрудники компании...

Сайт компании по веб-разработке

Сайт компании по разработке сайтов - "команда профессионалов". Однако, фотографии не подгружаются... Программная ошибка нарушает интерфейс и создает недоверие к компании. Вы хотите обратиться к этим "профессионалам" по разработке сайтов? 

2020-03-12

SEO: старые статьи
SEO: мои инструменты для поисковой оптимизации 2000
Маркетинг: Удаляем конкурентов из Яндекса 2005
SEO: Нелинейная выдача на Яндексе 2006
SEO: скрипт для перелинковки сайтов 2007
SEO: Уникальность изображений, как статический фактор 2007
SEO: сервис и скрипт проверки текста на уникальность 2007
UX: Поведение - смотрим глазами посетителя
SEO: Истинное ранжирование Яндекса
SEO: Оценка рисков поискового продвижения
UX: Яндекс повторил "тропинки"
UX: Гугловские тропинки по сайту
SEO: Закладки вместо ссылок
SEO: Качество текста по Яндексу
UX: быстродействие браузера
SEO: Конверсии поисковых запросов в лиды
SEO: Как бруазеры следят за пользователями
Веб-разработка: Заказчик и студия
UI: интерфейс и угол зрения
SEO: Атака ботов поведенческими
Маркетинг: Поведение на сайте и персональная реклама
SEO: сносим Аналитикс и Метрику
UX и UI ошибки в примерах
SEO: мой бесплатный курс обучения