5 ms·

Show HN: Turn a source image into an animated party emoji

63 points by scotchfield 9y ago

bennettfeely 9y ago
Idea recreated using CSS animations: https://codepen.io/bennettfeely/pen/MrLoMd https://codepen.io/bennettfeely/pen/MrLoMd
- alanfalcon 9y ago
  Thanks! Definitely using this in my current project. Sorry to my users in advance.
- kome 9y ago
  so good!
- bringtheaction 9y ago
  Could you make one that shakes like in the gif in the OP README?
- djsumdog 9y ago
  For some reason it's just black on black in Vivaldi. I had to change the background-color to something else to see the emoji.
Jyaif 9y ago
Uses node? What. the. fuck. This could be done with imagemagick in 4 lines of shell script.
- vortico 9y ago
  Post the script? I'm curious how one would do this. Something like: for i in $(seq 0 9); do # Offset by (cos 2pi*i/9, sin 2pi*i/9) and expand the canvas somehow convert "$1" ... frame-$i.gif done convert frame-*.gif -delay 1 -loop 0 final.gif rm frame-*.gif
- fao_ 9y ago
  Yeah. Gravislizard had a good thread on this and how it's intimidating to beginners because everything has to scale regardless of if it's just a one-shot project or an actual business: https://twitter.com/gravislizard/status/954262779304722432 https://twitter.com/gravislizard/status/954262779304722432
  - __s 9y ago
    .. & then they go on about how Game Maker doesn't "scale" I'm a fan of stream of consciousness, but that rant kind of just falls into a bunch of whining I started with Game Maker 5.3, threw together a maze game the same day, proceeded to fiddle around with GM for three years, learning from the manual. Thankfully I was offline so I didn't have the internet's shoulder to cry on
    - fao_ 9y ago
      > .. & then they go on about how Game Maker doesn't "scale" Do they? I didn't see them write anything about GM scaling. They did write about how other people seem to have success with Game Maker, but they have a problem using it because they find some things difficult to understand. But that has nothing at all to how Game Maker scales.
- frenchie4111 9y ago
  tbh I am more likely to have node installed than imagemagick nowadays
  - djsumdog 9y ago
    I think you'd be surprised. You probably have imagemagick installed if you're on a Linux system or use brew. A surprisingly amount of tools depend on it. It's like saying "I probably don't have ffmpeg/libav installed." You probably have like 5 copies of it installed.
    - scbrg 9y ago
      > You probably have like 5 copies of it installed. Did people stop using package managers while I wasn't looking? :-)
- mcphage 9y ago
  Use imagemagick? What. the. fuck. This could be done in node, which almost everyone already has installed, and whose dependencies aren’t a pain in the ass to get installed and running.
  - geofft 9y ago
    Also node is memory-safe and Imagemagick isn't. Somewhat surprisingly to me, the two dependencies (get-pixels for reading and gif-encoder for writing) are both written in pure JS, meaning that using this solution is vastly more responsible than using Imagemagick, if you're handing it untrusted input images.
    - franga2000 9y ago
      How is ImageMagick not memory-safe? An attacker could only do damage if they discovered a very bad bug in ImageMagick, but such a bug could also be discovered in Node.
      - fao_ 9y ago
        Not to mention the fact that npm is inherently insecure. https://ponyfoo.com/articles/npm-meltdown-security-concerns https://ponyfoo.com/articles/npm-meltdown-security-concerns https://www.bleepingcomputer.com/news/security/52-percent-of-all-javascript-npm-packages-could-have-been-hacked-via-weak-credentials/ https://www.bleepingcomputer.com/news/security/52-percent-of... https://github.com/joaojeronimo/rimrafall https://github.com/joaojeronimo/rimrafall https://github.com/npm/npm/issues/10999 https://github.com/npm/npm/issues/10999 https://twitter.com/o_cee/status/892306836199800836 https://twitter.com/o_cee/status/892306836199800836
      - djsumdog 9y ago
        There have been ImageMagick security bugs in the past, but it is an active project/community and they do get patched. I'd prefer using ImageMagick for something like this, but it's all about tradeoffs and what you're looking to do. There could be memory/security bugs in the future. There are also performance trade-offs if you created a microservice for this function in rmagic/ruby vs node (and you should do both and test them, because you might be surprised which one is actually faster). I agree it's best to use the right tool for the task, and there are valid reasons for using both in this case. I'd personally probably take the ruby/rmagick/ImageMagick approach myself in a container, but that's not to say that's the best approach.
- geofft 9y ago
  I believe that this project would also run in the browser (via browserify). Do Imagemagick and your shell work in wasm yet?
vortico 9y ago
I believe computer science is a solved field now!
beeskneecaps 9y ago
Fantastic.

63 points by scotchfield 9y ago

Idea recreated using CSS animations: https://codepen.io/bennettfeely/pen/MrLoMd https://codepen.io/bennettfeely/pen/MrLoMd

alanfalcon 9y ago
Thanks! Definitely using this in my current project. Sorry to my users in advance.
kome 9y ago
so good!
bringtheaction 9y ago
Could you make one that shakes like in the gif in the OP README?
djsumdog 9y ago
For some reason it's just black on black in Vivaldi. I had to change the background-color to something else to see the emoji.

Jyaif 9y ago

Uses node? What. the. fuck. This could be done with imagemagick in 4 lines of shell script.

vortico 9y ago
Post the script? I'm curious how one would do this. Something like: for i in $(seq 0 9); do # Offset by (cos 2pi*i/9, sin 2pi*i/9) and expand the canvas somehow convert "$1" ... frame-$i.gif done convert frame-*.gif -delay 1 -loop 0 final.gif rm frame-*.gif
fao_ 9y ago
Yeah. Gravislizard had a good thread on this and how it's intimidating to beginners because everything has to scale regardless of if it's just a one-shot project or an actual business: https://twitter.com/gravislizard/status/954262779304722432 https://twitter.com/gravislizard/status/954262779304722432
- __s 9y ago
  .. & then they go on about how Game Maker doesn't "scale" I'm a fan of stream of consciousness, but that rant kind of just falls into a bunch of whining I started with Game Maker 5.3, threw together a maze game the same day, proceeded to fiddle around with GM for three years, learning from the manual. Thankfully I was offline so I didn't have the internet's shoulder to cry on
  - fao_ 9y ago
    > .. & then they go on about how Game Maker doesn't "scale" Do they? I didn't see them write anything about GM scaling. They did write about how other people seem to have success with Game Maker, but they have a problem using it because they find some things difficult to understand. But that has nothing at all to how Game Maker scales.
frenchie4111 9y ago
tbh I am more likely to have node installed than imagemagick nowadays
- djsumdog 9y ago
  I think you'd be surprised. You probably have imagemagick installed if you're on a Linux system or use brew. A surprisingly amount of tools depend on it. It's like saying "I probably don't have ffmpeg/libav installed." You probably have like 5 copies of it installed.
  - scbrg 9y ago
    > You probably have like 5 copies of it installed. Did people stop using package managers while I wasn't looking? :-)
mcphage 9y ago
Use imagemagick? What. the. fuck. This could be done in node, which almost everyone already has installed, and whose dependencies aren’t a pain in the ass to get installed and running.
- geofft 9y ago
  Also node is memory-safe and Imagemagick isn't. Somewhat surprisingly to me, the two dependencies (get-pixels for reading and gif-encoder for writing) are both written in pure JS, meaning that using this solution is vastly more responsible than using Imagemagick, if you're handing it untrusted input images.
  - franga2000 9y ago
    How is ImageMagick not memory-safe? An attacker could only do damage if they discovered a very bad bug in ImageMagick, but such a bug could also be discovered in Node.
    - fao_ 9y ago
      Not to mention the fact that npm is inherently insecure. https://ponyfoo.com/articles/npm-meltdown-security-concerns https://ponyfoo.com/articles/npm-meltdown-security-concerns https://www.bleepingcomputer.com/news/security/52-percent-of-all-javascript-npm-packages-could-have-been-hacked-via-weak-credentials/ https://www.bleepingcomputer.com/news/security/52-percent-of... https://github.com/joaojeronimo/rimrafall https://github.com/joaojeronimo/rimrafall https://github.com/npm/npm/issues/10999 https://github.com/npm/npm/issues/10999 https://twitter.com/o_cee/status/892306836199800836 https://twitter.com/o_cee/status/892306836199800836
    - djsumdog 9y ago
      There have been ImageMagick security bugs in the past, but it is an active project/community and they do get patched. I'd prefer using ImageMagick for something like this, but it's all about tradeoffs and what you're looking to do. There could be memory/security bugs in the future. There are also performance trade-offs if you created a microservice for this function in rmagic/ruby vs node (and you should do both and test them, because you might be surprised which one is actually faster). I agree it's best to use the right tool for the task, and there are valid reasons for using both in this case. I'd personally probably take the ruby/rmagick/ImageMagick approach myself in a container, but that's not to say that's the best approach.
geofft 9y ago
I believe that this project would also run in the browser (via browserify). Do Imagemagick and your shell work in wasm yet?

vortico 9y ago

I believe computer science is a solved field now!

beeskneecaps 9y ago

Fantastic.