I am tired of seeing the same circle revolving or the same bars sliding for more than a decade now. The only difference I feel is gifs have been replaced by CSS animations or SVGs. Whatever the purpose may be, these loaders are dumb and their only job is to notifiy the user that something is working behind the scenes to get something done. Fine! then there was a bunch of research, slow loaders make the entire application feel slow. Fast moving animations make the entire application feel faster, yada! yada! yada!. But that's how it is, background system will always take time and you need to notify users that they need to wait. It's simple, it works and it's easy, but does that mean it needs to be boring

This loader above, is an svg and fits as the image src parameter, my purpose was to use it on my CV redirect page. A little background, I have my CV written on Google Docs and in order to share it with people, I use the export feature to get a pdf of it, This way anyone downloading my CV always gets a fresh copy. Basically this, https://docs.google.com/document/d/1BTDWnNAOSMduVWzgxmUwxLAwVr5JTYDXcxusbM31MqM/export?format=pdf. To personalize it further I made a /CV relative page on my site and it redirects to this https://nishantarora.in/CV. Just a slight hiccup, export feature on Google Docs is not the fastest.

So, I added this stupid loader revolving circle to let the user know, just wait. I hated myself, but it looked awful. It was then a lightbulb turned on somewhere. How about I make this an interactive story. Imagine, I actually compile my CV everytime someone requests it? what would that look like?

[email protected]:/CV/build$ ./cv --new 'CV-NishantArora'
[email protected]:/CV/build$ ./cv --add 'exp.txt' 'edu.txt' 'proj.txt' 'cont.txt'
[email protected]:/CV/build$ ./cv --compile

Compiling Nishant's CV...

Writing PDF...

This was slow, but ¯\_(ツ)_/¯

[email protected]:/CV/build$ exit && redirect

Exiting, Byee...

I used this css console layout by Shak Daniel. It's a good start I think! For lulz and giggles, wrote the typing effect. A couple of minutes later I had this: https://codepen.io/whizzzkid/full/WzadpB/

So why can't we have a story around what is happening behing the scenes instead of static rotating images? I guess this is similar to the see-through dishwasher that myth-busters had. I'd totally pay for a see-through dishwasher, but no one makes it. Similarly I'd like a loader which tells a story, but usually people do not make it.

Lemme know what you think in the comments below.