Щелчок вокруг: использование круглых курсоров мыши

Опубликовано: 2020-04-01

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

Кажется, что веб-дизайнеры имеют особую склонность играть с нашим единственным устройством для перемещения по экрану. Несомненно, курсоры набирают популярность в наши дни. Причины для этого могут быть разными: начиная от простого желания уйти от всего обыденного, и заканчивая жгучим стремлением сделать Сеть лучше.

Мы вступили в эпоху интерактивных интерфейсов. Курсор мыши — неотъемлемая часть всех этих грандиозных решений. Вполне логично, что он претерпевает некоторые изменения, чтобы соответствовать текущим требованиям и помочь создать бесшовный опыт.

Кажется, пришло время поэкспериментировать с его формой, отбросив скучную стрелку и выбрав что-то более элегантное и утонченное, например, круг. Круглая форма идеально вписывается в современные интерфейсы с интерактивными полотнами и анимацией. Это кажется естественным и грациозным. И всегда маячит вокруг – ненавязчиво привлекая внимание.

Последние художественные проекты / Марака

Возьмем Last Art Projects и Maraka, чьи команды используют этот крошечный тренд в своих интересах.

Last Art Projects имеет красивую двухцветную тему, наполненную иллюстрациями в стиле линий и полым декором. Здесь курсор идеально соответствует концепции. Он состоит из двух кругов. Кольцо спереди — это курсор, а сплошной темный круг сзади — хвост. Вместе они выглядят как мишень, которая естественным образом фокусирует внимание на экране.

Последние художественные проекты

Марака изменил форму курсора, но не только в декоративных целях. Здесь он используется как визуальная подсказка для онлайн-посетителей. Таким образом, он показывает стрелку влево или вправо, когда чувствует, что вы хотите просмотреть слайды. И он превращается в обычный сплошной круг (с относительно большим полупрозрачным второстепенным кругом), когда вы попадаете в целевую область, такую ​​как ссылки, подписи или навигация.

Марака

Оба примера показывают нам, как простая круглая форма может творить чудеса. Он настолько естественен и элегантен в своем поведении, что кажется идеальным партнером для всех этих современных экстравагантностей. Рассмотрим также некоторые другие фантастические примеры.

Квок Инь Мак

Kwok Yin Mak имеет просторный дизайн с традиционной черно-белой расцветкой и вертикальным ритмом. Японские иероглифы затмевают здесь всех. Атмосфера утонченная и аутентичная. Вы должны признать, что форма стрелки по умолчанию выглядела бы здесь примитивно, но круглая форма — другое дело. Он прекрасно сочетается со всеми деталями и чувствует себя как дома.

Квок Инь Мак

Сеансы Прайм Парка

Дизайн Prime Park Sessions отличается красивой геометрической эстетикой. Сложный полигональный слон, вертикальная навигация по бокам и куча пустого пространства. Здесь крошечная черная точка курсора подходит как влитая, умело отвечая теме.

Сеансы Прайм Парка

картезиам

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

картезиам

Юм Рэй

Портфолио Юм Рэй имеет определенный уровень индивидуальности. Художник стремится показать свою внутреннюю гениальность. Так что неудивительно, что здесь все продумано до мелочей. Даже курсор мыши выделяется из толпы своим полым стилем и круглой формой.

Юм Рэй

Игровая площадка

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

В команде Playground работают два круга. Маленький кружок используется как курсор, а большой — как «следящий». Вместе они делают движения по экрану более заметными. И это еще не все: указатель имеет два типа поведения. Когда курсор попадает на ползунок, кнопку-гамбургер или ссылку — он увеличивается, намекая на важность этих элементов. Когда он покидает эти области, он возвращается к обычному размеру, позволяя посетителям изучить интерфейс без особых хлопот.

Игровая площадка

Тапеццерия Новеченто

Tappezzeria Novecento имеет богатую контентом зону с большим изображением и большим количеством контента. Вполне естественно, что команда дизайнеров решила сделать курсор более заметным. Как и в случае с Playground, у него есть два круга: один — это сам курсор, а другой — его хвост. Он также имеет аналогичную окраску, что делает его идеальным завершающим штрихом.

Тапеццерия Новеченто

Маллард и Кларет

Mallard and Claret доказывает, что круглый курсор мыши может найти свое место даже на самых распространенных типах веб-сайтов. На самом деле вы найдете две круглые формы. Первый — это ссылка на нижний колонтитул, который также является своего рода логотипом. А другой - курсор мыши. Он маленький и бойкий. Это делает пользовательский опыт в этом блоге немного более интересным, чем обычно.

Маллард и Кларет

Подарок от Гуччи

Громкое имя здесь, но, к сожалению, не хороший пример для подражания. Gift by Gucci также имеет круглый курсор мыши. Это, безусловно, добавляет здесь своего очарования, и взаимодействие с динамическим холстом кажется более естественным. Однако плохой контраст между фоном и передним планом портит впечатление от просмотра. Золотой круг едва заметен на розовом фоне. Жаль.

Подарок от Гуччи

Бонусный инструмент: Курсомайзер

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

Курсомайзер

Есть кое-что о кругах

Всегда приятно видеть, как тривиальные вещи, которым мы иногда не придаем должного значения, обретают второе дыхание.

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