Эргономичное. Курсоры

Fiddle.Digital
3 min readMay 23, 2020

--

Сегодня поговорим об уже взрослой фишечке — кастомные курсоры.

Studio Job website

В принципе, разговор пойдёт на тему «Полезно или не полезно».

В самом начале вспомним, что главное в дизайне — функция. А красóты и декор — это выплывающее из функции. Это, кстати, очень понятно инженерам. Исторически эти ребята и были первыми дизайнерами. Ставилась задача, инженеры решали её, создавая механизм / конструкцию, который(ая) выполняет функцию. Магия заключалась в том, что чем глубже эстетика инженерного решения — тем глубже эстетика визуальная.

Курсор зла

Энивей, вернёмся к нашим курсорам. Давайте посмотрим на пример кастомного мерзавца:

Маленькая белая точка — это координаты курсора мыши, а большой белый кружочек — самозванец, фолловер за мышкой.

Правда заключается в том, что реальный функциональный элемент стал невидимым на контрасте с большим белым кругом. А если ещё представить, что на полотне тексты и интерфейсы? В итоге два элемента курсора, которые живут в разном времени меняются местами. Пользователь принимает большой белый круг за реальные координаты. При том его отставание как бы намекает на «затормаживание». И получается, что курсоров как бы два на странице. И они между собой спорят. 🤯

Выходит, что функция размазывается между истинным и ложным.

Эмиль Рудер в той самой «Типографике» пишет:

…Мышление в контрастных категориях — не путаное мышление, поскольку противоположности могут смириться в гармоническом целом. Есть понятия, теряющие смысл без антитезы, например, «верх» без сравнения с «низом»… Человек нашего времени мыслит противоположностями… для него уже не существует «или — или»…

стр. 132, раздел «Контрасты»

— третий элемент, — круг с задержкой, — вмешивается в эту гармонию и рушит её, убивает контраст.

Группы

Всё зависит от того, в какие функциональные группы собирается интерактив. Выше мы рассмотрели вариант «курсор(функция) + курсор(ложная функция)».

Теперь — другой:

с сайта tympanus.net

Фоновая картинка взаимодействует с пользователем, «следя» за курсором, но при этом относиться к группе ссылок меню и, что самое главное, никак не влияет на функцию курсора. Значит, я как пользователь полностью владею ситуацией с курсором, и ничто не вводит меня в заблуждение. Чудно!

Курсор без задержки

Иногда так бывает, что кастомный курсор — это, если не половина, то значительная часть от общей эмоции, которую передают авторы интерфейса / сайта. Например, как вышеупомянутый в гифке сайт студии «Йоб». У курсора нет задержки, а значит нет ложных координат курсора — функция сохраняется.

Повторимся:

Вывод

Кастомные курсоры это полезно, но помни:

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

Кастомные курсоры — это круто! Если они не заставляют наш чайник кипеть, тогда, вопреки, они добавляют позитива и крутости. 👌

Дмитрий Трощило / fiddle.digital

--

--