Я всегда испытываю чувство ненависти к разработчикам, которые мудряд со стандартным функционалом скролла. То спрячут, то покажут, то анимируют, то добавят сверху — ужас какой-то. Скроллинг — самая простая и отзывчивая часть многих интерфейсов, но почему-то дизайнеры думают, что над этой функцией можно издеваться. Так вот, заметка для тех, кто сильно выкомбениваются.
Скроллинг должен очень просто двигать содержимое страницы. К сожалению, время сейчас модное, зимой ходят в подворотах, две тысячи семнадцатый называют 2к17, а скроллинги делают контринтуитивными.
Все, что я знаю об интерфейсах — интерфейс должен быть интуитивно понятен, иметь обратную связь, быстро пониматься при беглом или новом взгляде и не путать пользователя. У интерфейсов вообще кучи всяких нюансов, но я буду говорить только о том, в чем понимаю толк — об обратной связи. Я терпеть не могу любой интерфейс, который плохо отзывается на мои действия. Думаю, любого раздражает сайт или приложение, которые тормозят или работают не так, как ты представляешь в голове. Особенно это касается скроллингов. Вот простой гайд, который поможет избавиться от ошибок при разработке нового, супер модного и контринтуитивного скроллинга:
Не усложняйте
Примеры плохого скроллинга на сайтах топовых студий России:
У первого примера ход скроллинга сначала слишком малый, а после — стандартный. Вернуться на главную уже нельзя, приходиться нажимать на логотип. Короче, сложно.
Не удаляйте, будет хуже
У Аик просто плохой сайт:
Медленные и «интересненькие» слайдеры должны были умереть с 2012 годом. Так бесконечно долго ждать загрузки невозможно. У слайдера на главной очень много лишней анимации. Скроллинг вообще отсутствует. Так можно, но не в случае с Аик.
Покажите хоть что-нибудь
Вот пример очень плохого скроллинга на рандомном сайте:
Скроллинг нельзя скрывать, а если уж скрываете — покажите хоть какой-то элемент обозначения скролла. Делайте его интуитивно понятным. На промо-странице Авито вообще непонятно как двигать содержимое страницы.
UPD 08.12
Оказывается, это спецпроект Авито, который стал интересен редактором как плохой «сторителлинг». Что-ж, из-за плохого скроллинга я даже не заметил, что это история какой-то там камеры. Делайте нормальный функционал, чтобы людям было не только интересно, но и удобно читать.
Пример хорошего скроллинга, но сомнительной навигации:
Ребята из ХангриБойс спрятали скроллинг, но сделали функционал интуитивно отзывчивым. Это очень хорошо и так можно. Но зря они спрятали логотип, я даже не понял как вернуться назад не скроллируя вверх страницу. Оставляйте логотип на виду.
Вот пример того, как можно сделать скроллинг, и вообще серфинг по сайту интересным:
В студия Чулакова постарались сделать хорошо. Однако стоит подтянуть анимацию, иногда она обращает на себя внимание, а это первый признак плохого скроллинга.
Скроллинг не должен обращать на себя внимание
Если скроллинг обращает на себя внимание и заставляет задуматься над тем, как правильно скроллить — скролллинг плохой или недоделанный. Пользователь не должен задумываться над тем, как скроллить содержимое страницы. У нас в интернетах и так полным-полно проблем с интерфейсами, давайте оставим в покое стандартную функцию любого браузера?
Может стоит обратить внимание на навигацию, или представление информации. Или подумать о верстке, или интерфейсных проблемах сайта. Скролл — не главная проблема, которую срочно надо решить. Вернее, проблемы со скроллами уже давно решили, не создавайте новых.
Перед тем как придумывать очередной «умный» скролл, задайте себе пару вопросов:
- Зачем?
- Какую задачу будет решать?
- Не хотите ли вы просто показать, какой вы классный?
Если адекватных ответов в пользу нового и модного скролла нет — не трогайте его.