Ergonomics. Cursors

Fiddle.Digital
4 min readMay 25, 2020

--

Let’s talk about quite a mature feature — custom cursors.

Studio Job website

In general, we’ll stay focused on the topic “Useful or useless”.

For the beginning, let’s recollect that function is the the number one thing in design. And decorations are secondary. This is perfectly obvious for engineers. Historically, these guys appeared to become the first designers. That was a task for them to solve, creating a mechanism / construction which certainly functioned. The magic is that the deeper aesthetics of engineer solution is — the deeper visual aesthetic comes out.

Cursor of evil

Anyway, let’s come back to our cursors taking a closer look at the example of the custom little bastard:

A tiny white dot is the mouse move coordinate, and a big white circle — all show no go, just a follower after the mouse.

The truth is that the real functional element becomes invisible as opposed to the big white circle. And what is we imagine texts and interfaces on the canvas? As a result, two cursor elements, which live in different time zones, switch their roles. A user takes this big white circle for the real coordinates. Herein, its delay sort of hints at “braking”. And it turns out, there are two cursors on the page arguing with each other.

It happens so, that a function is dragged out between the truth and falsehood.

Emil Ruder in his book “Typographie” writes:

…Thinking in contrast categories isn’t incoherent thinking because opposites can reconcile to a harmonious whole. There are concepts that lose their meaning without an antithesis, for example, “up” without comparison with “down” … A person of our time thinks with opposites … for him, there is no longer either “or — or” …

page 132, chapter “Contrasts” (free translation)

— the third element, — circle with a delay, — interferes into this harmony, breaks it, killing the contrast.

The groups

Everything depends into which functional groups the interative is gathered. Right above, we reviewed the variant: “cursor(function)” + cursor (false function)”.

Here is another one:

from tympanus.net

The background image interacts with a user, “following” the cursor, but at the same time it belongs to the group of menu links, and, most importantly, doesn’t affect cursor main function. So, I as a user, completely own this cursor situation and nothing misleads me. Wonderful!

Cursor without delay

Sometimes it happens that a custom cursor is, if not half, then a significant part of the extensive emotion conveyed by the authors of the interface / website. For example, like the Yob studio website mentioned in the gif. The cursor has no delay, which means there are no false cursor coordinates, therefore the function is saved.

Let’s repeat:

Conclusion

Custom cursors are useful, but remember:

The function is primary. Ergonomics is the key to the function. It’s cool when the interface doesn’t interfere with the implementation of what it was created for. Even if it seems like a cool feature.

Custom cursors are cool! If they do not hit like a ton of bricks, then, on the contrary, they add fun and coolness. 👌

Dmytro Troshchylo / fiddle.digital

--

--