Innovative caret

Bike Outliner, a rich text editor for macOS (sadly only macOS 😔) has just received an update that includes a neat feature I’ve not seen before.

Something genuinely innovative with UI is an unusual find for me. Having used and built enough software now, not much is surprising.

UI these days is less-complex than classical desktop UI of the past - this is not something I mean in a good way. So many interfaces these days require many clicks to get anything done, typically with most functionality hidden beneath hamburgers and pencil icons. It feels like we’ve dumbed-down UI design to the point that it actually hinders usage, but I digress.

In Hog Bay Software’s latest post, an innovative feature is showcased - ‘typing affinity’. This feature modifies the caret within text areas to show which ‘side’ of the caret you’re operating on.

At each formatting boundary (including start and end of line) Bike’s text caret shows a tail. Use the arrow keys to point the tail at the formatting you want.

This is highly useful when working on documents with links inline. It removes the guesswork when inserting new words or characters.

See the demo video for a great example of this feature in action.

I’m curious if this could be implemented in the browser using a normal textarea with a custom caret?