by mikestew on 8/29/22, 6:15 PM
I'll start with, wow, that's pretty cool and entertaining. As another commenter said, a reminder of the whimsicalness of the 90s internet.
sigh, then along came Comet Cursor to remind us why we can't have nice things:
https://en.wikipedia.org/wiki/Comet_Cursor
The "can't have nice things" part comes from the tracking that came along with it. Comet Cursor was a pioneer of what would become the modern web!
by nluken on 8/29/22, 6:17 PM
Fashion trends are currently rebelling against the understated 2010s by bringing the late 90s/early 2000s aesthetic back in the form of wider fits and louder colors. Makes me wonder if/when we might see a similar change in web design, or even furniture. I might be biased as a younger person without many memories from that era, but I'm all for some change (barring impacts to accessibility) if it breaks up the monotony of the corporate-lite graphic design trends of the mid 2010s.
by autoexec on 8/29/22, 8:11 PM
One thing I loved about the internet back when these types of effects were popular was how collaborative and innovative web design was. People would see something they liked on someone else's website and just add it to their own. It might be an animated gif, a cursor effect, a background image, or a site's entire layout. Everything was fair game.
You'd see something cool on one site and suddenly it'd be all over the place and then it'd eventually get edited until it became something new that got spread around again.
Even though everyone was shamelessly copying everyone else the effect was that websites were very diverse yet familiar. Then people started using social media where they didn't even have to learn to copy/paste HTML and everything slowly became very bland and generic.
by churnedgodotdev on 8/29/22, 11:49 PM
The cursor lag is really bad, particularly on Windows, but there are at least 2 ways the lag could be much lower:
1. Use 'desynchronized', e.g. canvas.getContext("2d", { desynchronized: true });
2. Instead of using requestAnimationFrame(), draw as soon as a move event is received.
Here's a paint app that uses techniques 1 and 2 to achieve much lower input lag drawing the pen strokes that chase the cursor:
https://paint.js.org/
Two other tricks to be aware of:
3. [Chromium only.] Use 'pointerrawmove' to get move events as soon as they happen instead of waiting for a big bunch of coalesced moves to all arrive after a delay.
4. Drawing where the cursor is predicted to be in order to compensate for lag works well during smooth cursor/pen motion. For example, the Windows Snip & Sketch tool actually renders the line you are drawing in front of the direction your pen tip is detected traveling because when using, say, a Microsoft Surface Pen on a physical Surface Pro screen the line being drawn would otherwise noticeably lag behind the physical pen tip (especially on a 60Hz screen) unless this predictive trick is used.
Finally, be aware of open Chromium issue #992954. When the devtools are open [F12], coalesced events aren't used so you get lower input lag but more events to pump (like 'pointerrawmove'). This bug is maddening because it depends on whether or not you have the debugger open!
https://bugs.chromium.org/p/chromium/issues/detail?id=992954
by noobermin on 8/30/22, 1:10 AM
I remember when everyone switched from myspace to facebook. At the time, I wondered why people like fb more because the pages were more boring and standardized. At the end of the day, whoever claimed "we got tired of the flashy effects" were just themselves tired of the flashy effects. Somehow the boring people convinced designers that boring was more "professional" or something like that and the designers just changed everything and forced that change on most users. It's just another example of how I don't really believe everything is "market driven" but suppliers (in this case, designers) really can force changes of habit and consumption on users unilaterally if they have enough market share.
by filmgirlcw on 8/29/22, 8:56 PM
This brings me back to my childhood and building web pages when JavaScript elements to add whimsy and whatnot to the page.
Was it particularly attractive? No. Was there much function (except for a few screen types and maybe cursor styles, not really). Was it fun and did it make the internet feel exciting and like a truly new and unique medium? Hell yes.
Love seeing this stuff preserved.
And add me to the list of people that now misses skeuomorphism from the aughts and the Delicious Generation of Mac apps. Lickable icons and interfaces. I still love them, mostly because it reminds me of when software had personality.
That’s the thing about the late-90s to early 2000s web aesthetic: it had personality.
I love stark and clean Swiss-influenced designs as much any anyone else. But software, websites, and hardware was always best when it had personality.
by neilv on 8/29/22, 5:47 PM
Also, xneko and oneko. (Cartoon cat chases your "mouse" cursor, catches it, goes to sleep on it, you move the cursor, cat is alerted, repeat.)
http://www.daidouji.com/oneko/
by dustractor on 8/29/22, 10:31 PM
I did web design back when it was called webmaster, and every time we finished a site my boss would ask me to 'make it sparkle' and this is what she meant, every time. I would explain why I thought it was a bad idea but then I would add the js snippet and show her. She would clap her hands and jump with glee. I would deploy it. The customers loved it. Invariably, the next day I would remove it because what mattered is whether the customer's customers liked it, and half the time they would think it was a virus and the other half were using IE 1.0 so they couldn't see it.
by WorldMaker on 8/29/22, 6:12 PM
I particularly like the ESM examples in the README of this project for feeling like an interesting modern take for how some of the old 90s JS libraries used to feel. Many of the 90s libraries often weren't distributed as JS files to add to a SCRIPT SRC but as SCRIPT blocks to copy and paste with big comments denoting things you might want to tweak, giving more of that feel of "ownership" of the JS and that "everything is tweakable", not just JS lives on remote CDNs and is imported all or nothing and nowhere near as tweakable. ESM feels like it starts to bring some of that back and head towards a best of both worlds: composable pieces imported from remote URLs and tweakable script blocks to copy, paste, and then make your own.
I'm probably biased from my position of already knowing ESM well at this point having pushed a lot of my own modern tech stacks towards it, but I'd like to imagine 90s teen me would have found ESM blocks exciting.
by kitsunesoba on 8/29/22, 8:32 PM
I miss Classic Mac OS extensions which added whimsical things like this.
As I remember there were a few cursor trail extensions, as well as an extension that added physics to dragged icons (you could even throw them!), an extension that turned all on-screen text upside-down, etc. Not the least bit useful but fun.
The Classic Mac OS extension model was a security and stability disaster but it was unparalleled in terms of how it let third party devs tweak the OS. Even modern Linux desktops can't compare.
by toastal on 8/29/22, 6:40 PM
I appreciate that the Hacker News title is “90s” correcting the author’s typo of “90's” (though more pedantically I suppose “’90s” could be preferred)
by xnx on 8/29/22, 6:43 PM
The "Ghost" effect brought back strong memories of passive LCD screens circa ~1996.
by raveren on 8/30/22, 7:25 AM
by slobiwan on 8/29/22, 5:56 PM
The clock one is really cool, and I don't recall ever seeing it implemented on a website. Who used this?
by lefstathiou on 8/29/22, 6:10 PM
Long live the creativity, originality and whimsicalness of the internet of the 90s...
by woevdbz on 8/29/22, 8:53 PM
The last website I saw with a perfect mouse cursor:
https://thekebabshop.com/. See if you can resist slicing the logo with that big knife.
by dexwiz on 8/29/22, 6:16 PM
The trailing and ghost were effects I commonly saw but never selected. Just open four programs at once and try to load a webpage, viola!
by rikroots on 8/29/22, 7:26 PM
I love these - a fantastic piece of retro coding!
My only criticism would be that the code uses `element.appendChild(canvas);` - if the element already contains child elements then the generated canvas is going to go over them, blocking any user interaction associated with them - for example, links. I think `element.prepend(canvas)` would give a better UX?
by arriu on 8/29/22, 5:51 PM
I can't believe these actually used to be popular but they were. I wonder if their over-the-top nature made learning how to use a computer mouse a little more fun.
by ess3 on 8/30/22, 6:18 AM
by omoikane on 8/29/22, 7:47 PM
Is there a way for HTML+CSS to capture what the user's cursor actually looks like, in case if a website wants to perfect the "ghost" effect without replacing the cursor image?
by dec0dedab0de on 8/29/22, 6:42 PM
To be truly nostalgic they would have to take longer to load, and slow down my whole computer. If I trusted the page enough to enable javascript, which was so rare to begin with in the 90s. Heck, I rarely enabled images until at least 2000 when I got a cable modem.
That said, this is fun and impressive. I wouldn't even know where to start with something like this, I just bookmarked with the intention of reading through the code later but I probably never will.
by aacook on 8/29/22, 11:09 PM
This is hilarious and beautiful and I love it.
I just launched a 90s app called Later Cam:
https://latercam.com
It turns your phone into an old-school disposable camera that mails you real printed photos.
Last week Apple decided to feature it #1 on New & Noteworthy and now hundreds of people are visiting the home page every day. And thanks to you, now it feels a bit more magical!
by nameoda on 8/29/22, 11:41 PM
Brings back memories! dynamicdrive.com and another site that I can't quite remember the URL of (it was something like pruitt.com) provided amazing examples of what can be done with JavaScript and DHTML. Inspired me to add these sorts of whimsical effects on my personal website hosted on memebot.com in the early 2000s. Sadly, the interesting sites of that era are mostly gone now.
by fortran77 on 8/29/22, 10:35 PM
There was a whole startup, "Comet Cursor" whose goal was to get people to install a plugin (that spied on you, of course) to get enhanced cursors. I was working for a Big Media company in the early 2000s when the Comet Cursor execs managed to convince our execs that it would be a good idea to accept money from Comet Cursor in exchange for forcing downloads on our customers.
by smm11 on 8/29/22, 8:36 PM
Very early OS X versions had a fairly simple way to revert the GUI back to a NeXT or Win look. Reason being, OS X was Openstep, which was NeXT, and part of Openstep was integration with NT at the time, hence the GUI toolkit.
Neither of the non-OS X interfaces were very functional at all. I always wondered why those throwaway parts will still lying around.
by z9znz on 8/30/22, 9:54 AM
I love it! I had forgotten about the fun we used to have with simple things like this.
Another thing I miss is the vast array of really awesome graphic visualizations for WinAMP MP3 player.
iTunes never had a fraction of the visual goodness that was available for WinAMP - the visualizations especially, but also the skins.
by wmab on 8/29/22, 6:29 PM
Takes me back to the Geocities days!
by bhupy on 8/29/22, 9:15 PM
These used to be so popular, that my circa 2003-2005 public school district's official website where we could find our homework assignments, social calendars, teacher phone numbers, etc had a cursor effect for cougar paws (honoring the school mascot).
by kalupa on 8/29/22, 8:31 PM
Ah, the whimsy. I do miss the 90s era of the internet. so full of promise and silly fun
by justinlloyd on 8/30/22, 10:43 AM
I use the mouse trails and a desktop app for the "laggy following dot" on my workstation because, well because four 32" 4K monitors, you lose the darn cursor even with the "find my cursor" key.
by fny on 8/30/22, 1:54 AM
Real life use case: we had a super user mode for support that looked just like what the end user would see, so we add cursor sparkles to distinguish it from a standard login.
Before then we had to roll back a ton of accidental changes.
by Veedrac on 8/31/22, 3:34 AM
Sort of off topic but also sort of relevant, pixel-accurate mouse motion blur should really be a thing by now. The lack of it makes mouse movements significantly less smooth than need be.
by p4bl0 on 8/29/22, 10:36 PM
So much memories of DHTML and JS tips sharing websites come back to my mind when using this page ! It immediately reminded me of frames with customized scrollbars and marquee text too =).
by reitanqild on 8/30/22, 7:43 AM
> Comet Cursor was a pioneer of what would become the modern web!
In more ways than one.
In hindsight what they did was almost innocent compared to what Google and Microsoft do now and Apple tried to do a year ago.
by Raziarazzi on 8/30/22, 4:11 AM
It's very nice, especially the dot and smiles; it looks like you're playing with a mouse. You did an amazing job; it's very entertaining and funny.
by kungfufrog on 8/29/22, 10:51 PM
I would pay money for a MacOS native rainbow cursor.
by mdrzn on 8/30/22, 11:14 AM
Damn the nostalgia, this actually made me change my cursor on Windows after browsing some packs on DeviantArt
by kinduff on 8/30/22, 8:06 AM
This brought me back! I used to copy scripts from Dynamic Drive to add to my websites when I was a kid.
by kator on 8/29/22, 6:52 PM
When can we get these added to iTerm2?
by racl101 on 8/29/22, 8:38 PM
I like the idea of adding the ghost effect one and making our clients think they are tripping balls.
by msla on 8/30/22, 6:52 AM
They're all well done, except the snow is exceptionally hard to see on a white background.
by jbaczuk on 8/29/22, 9:16 PM
These might still be popular if you have a user base for whom the 90s is nostalgic!
by shmerl on 8/29/22, 10:27 PM
Very cool, but snowflakes don't work for some reason.
by greggman3 on 8/30/22, 7:26 AM
Be aware, the code is not framerate independent. Maybe that was intentional? Put up a PR to make it framerate independent but also just wanted to pass it on, if you have code using requestAnimationFrame and you want your effects/animations to run at the same speed across browsers you need to compute a deltaTime between frames and use that to calculation your animations. Otherwise, people on different devices will get different effects/experiences.
In this case I'm on a M1 Mac and Chrome runs requestAnimationFrame at 120fps, at least on the built in display (external displays get whatever they're set to. I have one at 60 and one at 72)
by other_herbert on 8/30/22, 1:59 AM
Ooo I’m going to add some of these as Easter eggs
by ge96 on 8/29/22, 9:10 PM
That clock one is crazy, to implement it hmm
by voiper1 on 8/30/22, 7:18 AM
"Emoji Rain" made me feel good.
by stefanrows on 8/30/22, 6:48 PM
Thats awesome! Thanks for the share!
by worik on 8/29/22, 7:34 PM
I want these on my desktop...
by gumby on 8/29/22, 6:09 PM
oh god please no.
by mseepgood on 8/29/22, 8:20 PM
Emojis didn't exist back in the 90s. This is an anachronism.
by ogurechny on 8/29/22, 9:28 PM
> for your modern browser
I don't know which modern features might be required for that potentially breathtaking presentation, because for me it stops running at the first occurrence of optional chaining operator. According to caniuse.com, ?. has been supported for just two years, and is still only available for 92% of users. The Web is three decades old, but let's ignore that, because everything must not exist for more than a year before being replaced with Next Generation Thing. Lifespan of a butterfly is our true goal!
I guess self-promotion of web developers also requires them to compete in shouting at the top of their lungs “I don't give a fuuuuuuuuuuuuuuuck about people who have to deal with websites I make”. The boldest get hired.