UX-патруль, выпуск первый: YouTube
В 2014 году впервые окунулся в веб-сферу, начал изучать сайты и всё, что с ними связано. Разбирался: как они устроены, какие принципы, правила, где удобно, где нет. Настолько заинтересовался этой темой, что из контент-менеджера, наполняющего сайтики новостями и товарами, перерос в менеджера проектов, который попутно проектирует интерфейсы.
Помню как сейчас: запускаю впервые простенький Balsamiq Mockups — и уже не смотрю, а творю первые интерфейсы. Ох… с тех пор меня было не остановить. Открыл для себя Axure RP, смотрел обучающие видео, когда ел, ходил в туалет и перед сном. Проектировал сайты, мобильные приложения, сервисы и практиковался в использовании различных функций. Так и влюбился в интерфейсы.
Привела эта любовь к тому, что в апреле 2018 года я открыл собственную студию интерфейсов — UXART.
О чём статья
К сожалению, даже на очень крупных сайтах есть проблемы, усложняющие взаимодействие. Мы с командой решили выйти в UX-патруль: анализировать сайты, приложения, программы, указывать на проблемные места и предлагать решения.
Возможно, представители этих сайтов обратят внимание и внесут корректировки. Это будет победа.
Сегодня разбираем YouTube — погнали!
1. Фильтр в поиске
При поиске роликов на YouTube пользователи сталкиваются с проблемами. Самая ощутимая — после применения или отмены параметра фильтр закрывается.
Если пользователь хочет посмотреть выдачу: «Видео», «Короткие» (меньше 4 мин), «За последний год», «в HD качестве», отсортированные «По числу просмотров» — ему придётся сделать десять кликов. А при медленном интернете будет ещё веселей.
После применения этих фильтров захотелось вернуться к изначальной выдаче? Повтори ещё раз десять кликов, бро!
Как сделать удобнее
Проще всего — не сворачивать фильтр автоматически, если есть активные параметры. Но в таком случае пользователи с маленькой высотой экрана будут испытывать сложности, так как не увидят, изменился ли результат выдачи.
Предлагаем сделать боковой фильтр, потому что:
- При добавлении новых параметров фильтр не сдвинет контент, как это происходит сейчас.
- Выдача наглядно меняется при изменении параметров.
- Не нужно кликать, чтобы развернуть фильтр.
К тому же YouTube уже использует боковой фильтр в разделе «История».
Подготовили наглядный макет того, как можно реализовать боковой фильтр. И конечно же, добавили функцию «Сбросить фильтр» :)
Напишите в комментариях, что в текущем фильтре обозначает параметр «Место съёмки» и как работает сортировка «По рейтингу» — насколько мы поняли, по соотношению лайков и дизлайков. Но правильно ли это, когда самым «рейтинговым» выводится видео, где 100 просмотров и 9 лайков?
2. Поиск на канале
На детальной странице канала есть внутренний поиск. Реализован он в виде небольшой серой иконки возле пунктов меню. Чтобы воспользоваться им, необходимо:
- Кликнуть на иконку.
- Кликнуть на строку поиска, чтобы что-то вводить.
- Кликнуть на иконку, чтобы поиск начался.
- Расстроиться, потому что поиск не начнётся.
- Снова кликнуть на строку поиска.
- Нажать на клавиатуре Enter.
- Получить результат.
Как решить проблему
- Отображать строку поиска развёрнутой по умолчанию.
- При клике сразу позволять вводить запрос.
- Отправлять запрос не только по нажатию на Enter, но и при клике на кнопку или иконку поиска.
- Либо автоматически подгружать результаты при вводе.
3. Видео при скролле
При просмотре видео порой возникает желание написать комментарий. Либо когда в видео ничего динамичного не происходит, идёшь листать комментарии.
Но при прокрутке видео остаётся на месте. Из-за этого легко пропустить интересный момент — придётся листать вверх, перематывать назад, чтобы посмотреть, что же там было.
Как сделать удобнее
Сделать плавающее видео в уменьшенном формате.
Когда думал над этим пунктом, заметил, что у YouTube уже есть возможность сделать видео миниатюрой. Обрадовался, думал, что эту боль устранили. Но после клика сворачивается не только видео, но и детальная информация, включая комментарии.
Ну и совершать клик по не самой очевидной иконке, чтобы почитать комментарии, а потом вручную разворачивать ролик — неудобно.
Показали наглядно, как можно сделать лучше:
Последующие пункты незначительные, но всё же стоит обратить внимание.
4. Блок про фильм
Если открыть видеоролик, который имеет привязку к фильму, справа будет вот такой чудесный блок:
Видно полтора слова от названия, огромная кнопка, которая выходит за пределы блока, практически все лэйблы и значения написаны в одном стилевом оформлении. Нехорошо.
Как сделать удобнее
5. Видео из плейлистов
Бывает, сидишь на YouTube и натыкаешься на какое-то интересное шоу. После просмотра одного выпуска хочется посмотреть другие, а по рекомендации включается что-то совершенно иное.
А на канале просмотренное видео содержится в плейлисте, где собраны все выпуски.
Но чтобы туда попасть, тебе потребуется:
- Перейти на канал.
- Открыть вкладку «Плейлисты».
- Среди всех плейлистов найти нужный.
- В нём найти видеоролик, который ты посмотрел, и включить следующий.
Как сделать удобнее
Первый вариант — использовать блок с видео из плейлиста, а остальные рекомендации давать ниже.
Второй вариант — добавить точку входа «Перейти в плейлист». Сейчас YouTube порой предлагает некий «Микс». Собирается он по совершенно непонятным для меня правилам. Вместо него лучше добавить такую же плашку, которая будет вести в плейлист с роликом.
Мы любим YouTube. Я лично провожу на нём немало времени. Проблемы, которые мы описали, — мелочь относительно всего сайта. Но закрывать глаза на неудобства, учитывая масштабы или репутацию сервиса, — неправильно. Развитие и постепенные улучшения интерфейсов никому не навредят.
Пишите в комментарии, что ещё стоит изменить. Возможно мы сможем вместе сделать интернет немного удобнее :)
P.S. Укажите сайты, приложения, программы, которые вы бы хотели увидеть в следующих выпусках UX-патруля от команды UXART.
Всем мира!
Если бы ютьюб сделал просто банальные папки для каналов это бы уже победа
Комментарий недоступен
Очень интересно тебя читать. Структурировано и без воды. Продолжай 😉
А как вам две подряд кнопки "Сохранить" в мобильном приложении?
Это плохой перевод, исправить очень много, но пока это не делают.
Меня очень удивляют люди, которые думают, что они умнее огромного отдела разработки и гнобят то, в чем не особо разбираются. Да, косяки есть во всех продуктах. Но вы не работаете в Ютубе и не знаете их бизнес-задач, не знаете их метрики, не знаете ничего о причинах почему та, или иная функция сделана именно так.
- Что дизайнеры преследовали спрятав фильтр таким образом? Возможно потому что это не яндекс маркет и большинству достаточно всего одного клика.
- С иконкой поиска сомнительное замечаение. Очевидно, что это не кнопка. Достаточно частое явление переход по энтеру. Где вы вообще видели кнопку действия до поля ввода?
- Есть проблемы с переводом. Да это частая проблема у международных сервисов. У мультимедиа-системы Toyota Touch огрномное количество таких косяков.
Гораздо больше вопросов возникает к тому, что вы расхваливаете себя и трижды указываете ссылку на свой сайт, на котором ничего нет. И почему мы должны верить вам, не понятно.
Если уж вы взялись за такое благое дело (в чем я вас поддерживаю), то помогите небольшим компаниям, которым действительно нужна помощь хорошего дизайнера, и которые могут вас тут услышать. А ловить хайп на громких именах, мне кажется, бессмысленно.
Спасибо за комментарий
1. Мы никого не гнобим, а указываем на то, что по нашему субъективному мнению неудобно и предлагаем изменения, а не просто слепо критикуем. То что они не всё перевели из-за того что сервис большой, не означает, что проблемы для пользователей нет. И, как я указал в статье, это мелочь.
2. Яндекс Маркет — всего лишь пример боковой фильтрации, о которой мы написали, так как в комментарии автор ссылался на другой сервис Яндекса.
3. Сравнивать поисковую строку с простыми полями ввода некорректно. Я провел опрос среди своего круга общения и других дизайнеров и это неудобно для 90% из них. Если вам удобно и так — здорово. А мне нет.
4. Касательно нашего сайта — да, контента там немного, в силу особенностей субподрядной работы. Как минимум, там есть наши контакты для связи и кому интересно, что мы делаем, смогут спросить. Данная статья не несёт в себе цели показать, что мы лучше всех дизайнеров YouTube или что-то в этом ключе, мы лишь делимся мнением и собираем отклик.
5. Я не расхваливал себя или компанию. Разве то, что я рассказал о любви к интерфейсам, предложил решения и в упоминании названия компании привязал ссылку — это расхваливание себя?
6. Разбирать сайты другого уровня, для тех кому нужен дизайнер — это наша работа. А здесь мы пишем про крупные ресурсы, которые сами регулярно используем и испытываем боль в каких-то моментах. И судя по отклику, многие тоже сталкиваются с этими неудобствами.
Очень надеюсь, что представители данных ресурсов обратят внимание и если хотя бы один пункт реализуется — это будет победой для нас.