Cursors and cursor effects are making quite a comeback in web design.
A slight change from the usual monochrome pointer is an easy way to grab attention, create intrigue and make your design more memorable.
But, how can we pull it off without our design appearing messy and overcrowded?
Long gone are the days when it was acceptable to have Sonic the Hedgehog follow you around on the screen.
The key to cracking cursors in 2019 is to strike the perfect balance between engaging and practical.
Keep reading to see some awesome cursor inspiration and our tips on how to get creative cursors right.
Less is more.
Minimal design has been trending for quite a while now and we don’t see it going anywhere soon.
As we’ve said, a change to the way your cursor behaves or appears can do the trick when creating an eye-catching digital space.
But, you want to avoid the cursor stealing the show or making your design look busy.
If you’ve got a lot going on already, have a cursor that is a bit different, whilst still letting the rest of your content do the talking.
Don’t let the cursor distract from the main call to action.
This Silicon Valley-based designer has paired a simple, circular cursor with clever animation to tell their story. The call-to-action is indicated on the cursor itself as the user is taken on a journey through the site.
But, don’t let blend in.
Minimal is a good starting point, but you still want to create an impact.
When a cursor is too small or basic it can get lost, making it difficult for users to navigate your site. This isn’t what you want – you want your user experience to be as frictionless as possible.
This design is a great example of how you can counteract this problem. The cursor itself is very understated, but as the user moves around the page, an elegant brushstroke follows.
Engage with the page.
Microinteractions are popping up all over as an increasing number of websites are allowing users to interact with different elements on the page.
Below is a brilliant example of how this can work well. The cursor distorts the background image as you move around.
In a very similar way, this cursor encourages the user to interact with the web page. It mimics a torch light that highlights parts of the page as the pointer shifts around.
We think this effect creates mystery and a sense of magic, which ties in with the website’s aim of advertising a creative arts festival.
Who says you can only have one?
A sense of familiarity is always good when trying to establish trust with your audience. However, when done right, you can have multiple cursors on one website.
As long as there’s some purpose behind it, the appearance of your pointer could change as the user proceeds through your site.
Here is a wonderful example of how the cursor changes depending on which element you’re hovering over. An eye appears when it’s a clickable link. There are even parts of the site that trigger the cursor to expand reveal more information.