8 ms·
Show HN: Something pointless I made
- ajslater 11y agoThis looks like something from the 19A0's https://boingboing.net/2011/10/11/mixtape-of-the-lost-decade.html https://boingboing.net/2011/10/11/mixtape-of-the-lost-decade... > Finally, evidence is mounting that points to a "lost decade" > between what we now remember as the 1970s and 1980s, a time > whose full cultural trauma and resulting suppression from > memory was so complete as to effect itself even on the living.
- dhotson 11y agoI made this demo using http://www.pixijs.com/ http://www.pixijs.com/ Something I'm really happy with is the psuedo-3d effect on the cat using a displacement map. I took the cat sprite (http://dn.ht/picklecat/mesmercat.png http://dn.ht/picklecat/mesmercat.png) and made a "depth map" (http://dn.ht/picklecat/mesmercatdisplacement.jpg http://dn.ht/picklecat/mesmercatdisplacement.jpg) where white is closest and black is furthest. This information is used to determine how far to move the underlying pixels. It's enough to give a subtle illusion of depth.
- cjslep 11y agoHow did you create the depth map?
- mbilker 11y agoHe did it in Illustrator. I find his work fascinating.
- prezjordan 11y agoWould love to hear more about how you generated the depth map - that's super cool.
- dhotson 11y agoI'm glad you asked! :) I created it in Adobe Illustrator using a gradient mesh: http://i.imgur.com/kuuFVO2.png http://i.imgur.com/kuuFVO2.png Illustrator's gradient mesh tool lets you create a grid of points where you can choose a colour for each point. I overlayed the grid onto the sprite and estimated the distance at each point.
- flashman 11y agoThat's a really clever solution!
- ekianjo 11y agoIs that something one can do with Inkscape as well ?
- voltagex_ 11y agoNope, wonder how much it would cost to get it implemented?
- simoncion 11y agoYou sure? http://wiki.inkscape.org/wiki/index.php/Mesh_Gradients http://wiki.inkscape.org/wiki/index.php/Mesh_Gradients http://www.shmoggo.com/inkscape-tutorials/how-to-unlock-the-gradient-mesh-tool-in-inkscape/ http://www.shmoggo.com/inkscape-tutorials/how-to-unlock-the-...
- voltagex_ 11y agoEvidently not! Nice find.
- stuaxo 11y agoThey have been building it, AFAICT looks like it's in the dev builds. http://wiki.inkscape.org/wiki/index.php/Mesh_Gradients http://wiki.inkscape.org/wiki/index.php/Mesh_Gradients
- sgrove 11y agoI was wondering how you did that, actually - well done!
- namuol 11y agoYeah I came here to ask how you did the faux-3d cat. It's very subtle, but effective as hell. I thought you were using some kind of fancy parallax shader, but I can see how a displacement map can approximate the same thing. Awesome!
- rl3 11y agoI'd like to congratulate you for the fact that this has higher production values than the majority of WebGL applications out there.
- _pmf_ 11y ago> I'd like to congratulate you for the fact that this has higher production values than the majority of WebGL applications out there. 1. Doesn't crash video card driver. 2. Doesn't crash browser. 3. Doesn't show empty tab. 4. Doesn't cause 100% CPU usage. 5. Doesn't hang browser forever.
- vonklaus 11y agoI am on mobile with a 3 year old iphone 5. Works.
- x0 11y agoWell, I know what I'm doing for the rest of the day. (if it wasn't obvious, playing around with pixijs!)
- jevgeni 11y agoI'll spend my day looking at pickles, thank you very much.
- morganvachon 11y agoGreat work, silly but ingenious. For some reason I find the "depth map" creepy to look at on its own.
- intjk 11y agoIt looks like a ghost, or a 'soul'--that which brings life to an object. :)
- swcoders 11y agoreally great. Please write blog about this
- ricklamers 11y ago+1 for Pixi.js. Pixi.js is awesome.
- yarper 11y agoLove it. Made me laugh.
- bliti 11y agoIt's not pointless. Demos like these help others discover libraries and frameworks. I did not know of pixiejs and it's something I need for work. Having the cat and pickles render in my cheap android device was proof enough to try it out. Thanks for posting!
- Sicp 11y agooh wow you weren't kidding
- szastupov 11y agoLazerhawk and tripping cat - perfect.
- yranadive 11y agoThat cat is definitely on something
- orliesaurus 11y agoUncaught Error: This browser does not support webGL. Try using the canvas renderer :( :( :( :( :(
- mrdrozdov 11y agoHeh, sourced the music from youtube. That's a slick strategy. PS. Perhaps it was intentional, but this is quite topical given the recent story of "cucumbers scaring cats". (https://www.youtube.com/watch?v=sc0mi0Ei1CQ https://www.youtube.com/watch?v=sc0mi0Ei1CQ)
- mbcrower 11y agoThat's the greatest cat video I've seen so far
- colejohnson66 11y agoIs it just me, or is the HTML file incomplete? I didn't see anything, so I looked at the source and there's no canvas tag and the file abruptly ends after the GA script tag: https://web.archive.org/web/20151130010039/http://i.imgur.com/tCB7x2Q.png https://web.archive.org/web/20151130010039/http://i.imgur.co...
- prezjordan 11y agoBrowsers will parse all kinds of edge cases. What browser are you using? Renders fine in Chrome 46 on OSX 10.10
- re 11y ago<html> and <body> end tags are explicitly optional in HTML5 -- as are the start tags. http://www.w3.org/TR/html5/sections.html#the-body-element http://www.w3.org/TR/html5/sections.html#the-body-element The canvas element is added to page by JavaScript.
- n0us 11y agoThe documentation for this project (pixi.js) is excellent. I look forward to working with pixijs and I hadn't heard of it before. http://pixijs.github.io/docs/index.html http://pixijs.github.io/docs/index.html
- beeboop 11y agoWhat's the music from? Cool site.
- prawn 11y agoOP, you should make a silly site where people can combine faces (with depth map) and a floating object. Let the internet hordes run with it from there.
- benwaffle 11y agousers should be able to paint a depth map
- niuzeta 11y agoI did not know my weekend hadn't completed until I saw this.
- auston 11y ago@dhotson - please be sure to auction this site for art basel :)
- Kortaggio 11y agoFor everyone wondering "What's the music in the background?" It's here: https://www.youtube.com/watch?v=UsMewmMTA_c https://www.youtube.com/watch?v=UsMewmMTA_c cleverly linked to via an autoplaying, hidden embedded iframe in the page.
- aakilfernandes 11y agoWell, this is just plain silly.
- pcunite 11y agoScrubbing my eyes with my toothbrush ... please don't down vote me ... the sting from close-up is painful enough.
- jhallenworld 11y agoMy 11 year old likes it, so I think you have succeeded in creating the next meme :-)
- deleted 11y ago[deleted]
- bovermyer 11y agoI just spent somewhere around five-ten minutes staring at this. I may have to rethink my life.
- Pitarou 11y agoMy 1 year old daughter loves it. I think you have a meme!
- jashmenn 11y agoFwiw this appears to be an awesome remix of (my cofounder) TJ Fuller's laser eyes cat shooting cucumbers gif, which can be found here: http://giphy.com/gifs/cat-lasers-cucumber-3oEduQAsYcJKQH2XsI http://giphy.com/gifs/cat-lasers-cucumber-3oEduQAsYcJKQH2XsI If you like this style of thing, check out the rest of TJs work at his website: http://www.tjfullerswebsite.com http://www.tjfullerswebsite.com
- dhotson 11y agoYup! Credit where credit is due—that is the gif that inspired this thing. Love it! I'm really curious how they made it in the first place.
- dan-silver 11y agoThat's an interesting way to get background music. Wastes bandwidth on the video though. <iframe src="https://www.youtube.com/embed/UsMewmMTA_c?autoplay=1"></iframe> https://www.youtube.com/embed/UsMewmMTA_c?autoplay=1"></ifra...
- eli 11y agoBut lets you sidestep all of the hosting costs and probably the majority of copyright issues.
- ada1981 11y agoI used something similar on http://AnthonyDavidAdams.com/memescope http://AnthonyDavidAdams.com/memescope
- kowdermeister 11y agoNot really, a youtube video with a static image is VERY close to an MP3's size.
- dan-silver 11y agoI'm seeing 3.9 MB for audio and 7.8 MB for the video.
- eugenekolo2 11y agoI wasn't sure HN was gonna deliver this year. But, now I know to continue reading for another year.
- iconjack 11y agoPointless? Hardly.
- latenightcoding 11y ago10/10 will print each frame and hang in fridge
- pnt12 11y agoSeemed silly at first (well, still does, but in a good way). But from the comments in this thread, I realized this is actually a pretty cool demo. Completely unrelated to WebGL, but you might want to have the music loop forever or use a long playlist. That'd be neat - I have it open in background because the music is really sweet.
- cachvico 11y agoGreat soundtrack!
- ozzmotik 11y agojust seeing this lightened up my day slightly, so it really isn't a waste if you ask me. prompted me to want to check out something new, and it was just awesome to look out. Very interesting back story to it too
- tnecniv 11y ago@dhotson This is not rendering for me in Chrome on OSX. Is this a known issue?
- lettergram 11y agoWorked for me.
- benjamincburns 11y agoI'm using Chrome on an older rMBP with Intel 4400 graphics, and it took a little while for the rendering to start for me. Once it got going it was nice and smooth, however.
- blobbers 11y agothis isn't pointless. this is really great.
- bigsteve78 11y agoWas hoping to see Ryan Gosling in a Scorpion jacket make an appearance.
- bigsteve78 11y agoWas hoping to see Ryan Gosling in a scorpion jacket make an appearance.
- bwha 11y agoIs the cat supposed to shoot lasers? Feels like it should but does not for me. Hitting the mouse and space, as well as other keys, doesn't do anything.
- HCIdivision17 11y agoMy, where history's path takes us. I'm not really sure how to describe this feeling; a clever hacker put a boggled cat and pickles on a star field and it's clearly missing lasers. Like, I get there's a source GIF that inspired it, and lazoring pickles with a cat has that sort of pseudo randomness like 'purple monkey dishwasher'. But I still think it's strange that it stands out as an omission over, say, talking wrenches. (I think the awestruck cat is fine just how it is; just flummoxed over how legitimate your quip was.)
- benjamincburns 11y agoI think you're on to something here. I hadn't seen the cat/laser/cucumber gif prior to reading this thread (after visiting the demo), and after I noticed the cat following my mouse I tried clicking pickles with the expectation that they would be attacked by laser vision. It's odd that I can say straight-faced "of course you would expect lasers to shoot from that cat's eyes and destroy the pickle," but that I can't describe why that assumption is so obvious.
- joe563323 11y agoAmazing. I just looked at it for about 5 seconds and was scared and freezed at the same time. What an Art!!!
- ageofwant 11y agoYou, Sir, have done well.
- djtriptych 11y agoIt'd be really cool to hack into an existing "3d-ish" capture tool, e.g. seene[1] [1]: http://seene.co/a/popular/ http://seene.co/a/popular/
- motyar 11y agoAdd a "fullscreen" button please
- tasnimreza 11y agoBig NO ! I can't say it is pointless, appreciate your effort. Didn't know pixijs has such great power, I've looked at the documentation, it is awesome :)
- mrucci 11y agoHey, I made something pointless too! http://mrucci.github.io/dumb-cat/ http://mrucci.github.io/dumb-cat/
- yummybear 11y agoInteresting. How do you plan on monetizing this? Are you accepting investors at this point?
- aagha 11y agoHe already has a market cap of around $6M. They're talking to Andreesen and Kleiner. The biggest issue right now is lack of adoption: Growing at 137% a day just isn't fast enough.
- ryan-allen 11y agoI am... yes.
- coderKen 11y agoReally cool, you could even make the cat sought of dance to the song by moving your cursor
- Mchl 11y agoOk, so it's awesome and stuff, but for me the most important thing is the discovery of the NewRetroWave music!
- ruiramos 11y agoLooks great, congrats!
- csvan 11y agoGetting a white page on Chrome 46, Fedora box.
- pinkunicorn 11y agoHow much does it cost to own a two letter domain name...?
- dhotson 11y agoI got it for $129 Try this list: https://catechgory.com/2-letter-domain-names/ https://catechgory.com/2-letter-domain-names/ I was pretty lucky to get one that matches my name. :)
- timothybone 11y agoI read the domain as: DoN't HaTe
- Shengbo 11y agoThis is now one of the best things on the internet. Second only to http://www.omfgdogs.com/ http://www.omfgdogs.com/
- DarkIye 11y agoFor when your pickle cat needs that special extra something: analogue synths
- boksiora 11y agoGenius!!!!
- amai 11y agoInbrowser demos like this should be a new category for the https://en.wikipedia.org/wiki/Demoscene https://en.wikipedia.org/wiki/Demoscene!
- SarahofGaia 11y agoGee, thanks a lot! The audio autoplay almost woke up everyone in the effing house! Seriously, I like the cat, but is this 1998?! Jesus, give us a dang warning at least!
- fringd 11y agoI registered pickle.cat and redirected it to you. Contact me if you want it.