Hacker News new | past | comments | ask | show | jobs | submit

Show HN: I built the most over-engineered Deal With It emoji generator

https://emoji.build/deal-with-it-generator/
659klimeryk | | 126 | HN
zamadatix | parent | next
This is 100% the kind of thing I was hoping for when daydreaming "what will the internet be like 20 years from now" growing up. Cool design, hilariously overpowered backend to do something basic (but do it so well), and 0 of the corporate feeling or ad apocalypse. Awesome stuff!
klimeryk | parent
Hahah, so true! One clarification, though: while I'm sure the backend is overpowered (Cloudflare Pages, easily handling the Hug of Death from HN), but in this case it's only serving static resources. All the hard work is done by the hilariously overpowered devices we carry in our pockets or use for everything but serious work ;)
loading story #41850702
kjaer | parent | next
This made me smile :)

  if (looping.mode === "off") {
    // If you waited for a day, you deserve to see this workaround...
    // Since there is no way to not loop a gif using gifwrap,
    // let's just put a reeeeaaaaallly long delay after the last frame.
    return 8640000;
  }
loading story #41855981
klimeryk | parent | next
Hahaha, achievement unlocked! Congratulations!
loading story #41855055
andybak | parent | next
I love it: https://s1.gifyu.com/images/SB5A9.gif
pieter_mj | parent
Isn't that a child eating creature?
loading story #41850165
loading story #41854456
loading story #41856773
airstrike | parent | next
> Unfortunately, they were not impressed and ultimately did not offer me the job :(

Sorry to hear that. No recruiting process is perfect. They often get it wrong, as they clearly did here!

com2kid | parent | next
I interviewed a developer once who was super junior on paper but had a side project of a fully featured desktop anime episode to watch/watched tracker with lots of library feature features.

Hire.

Interviewed another Dev who made arcade sticks as a side project.

Hired.

You can't teach passion. Hire all that passionate people you can. Tech stacks are irrelevant compared to the love of building things.

loading story #41851844
loading story #41854196
Aeolun | parent | next
The only thing I can imagine is that they were up against someone making a partyparrot generator.
loading story #41849514
klimeryk | root | parent
Hahaha, genuinely laughed out loud, thank you! (also, big fan of partyparrot, of course)
klimeryk | parent | next
Thank you! Yeah, I totally understand and not taking it against them. It's impossible to always get the right impression and fit for the candidate (even if it was based on a few interviews and trial, like here). So I figured I'd make the best of the situation and share the project with others! Hoping to make some new connections this way, and maybe find an even better opportunity!
loading story #41852857
loading story #41852389
aio2 | parent
Yeah, this is pretty cool and they can fuck off.
ChrisArchitect | parent | next
Thank you Slack? For the confusing use of "emoji" instead "animated GIF" or sticker.
loading story #41853051
loading story #41853672
loading story #41852860
asdfman123 | parent | next
I'm a Google employee. After looking at this demo I can tell you're spiritually a Googler in ways I can't quite articulate.
loading story #41852354
loading story #41855666
loading story #41852114
underlines | parent | next
The company who didn't hire you will soon use your tool because they feel remorse for not hiring you, and now they have to "deal with it"
klimeryk | parent
Well, I'm using their tool in mine (hint is in one of the Easter Eggs... or just look at what's powering the product analytics ;)). So it's an ouroboros of open-source :D
bewuethr | parent | next
A rudimentary version of this used to be integrated into Giphy[1], but it seems to be broken now, meaning the market is wide open for this! ;)

[1]: https://giphy.medium.com/the-secret-giphy-slack-commands-9cb...

steve_adams_86 | parent | next
Thanks for sharing this. I love tiny projects like this, especially if they’re over engineered.

The job market is rough. I have no doubt you were considered, and they were interested, but everyone is giving their all right now. Someone likely submitted something even cooler, somehow.

yieldcrv | parent
> somehow

yeah by recycling their project from a previous interview and adding more to it

I just don't engage in that kind of assessment anymore, the job market isn’t thaaaat tough to need to compromise

or, put another way, jumping through that hoop will not solve your interview progress as its just far too subjective. other hoops are just as fine

loading story #41853028
klimeryk | root | parent | next
To clarify - I wrote this tool as my own initiative. On top of the "normal" process (that involved multiple interviews and a day paid trial). I was really excited about the opportunity and wanted to go the extra mile.
loading story #41851045
ks2048 | parent | next
Nice job. Although I disagree with the adjective "over-engineered". I think it means using too much machinery to accomplish a simple task (bad), where here it seems to mean having lots of options (good).
m2fkxy | parent | next
it's useless thence I love it.

I lied, in fact I just used it to create a couple Slack emojis.

klimeryk | parent
> it's useless thence I love it.

That's what kept me going while adding more features :D Just the joy of creating something so useless, but still capable of bringing smile to my (and hopefully your too!) faces. Glad you love it!

TZubiri | parent | next
This is useless, I can't make the glasses come from below, in addition to coming from above.

Also, glasses can only be black? We demand a color palette for glass colour.

EDIT: wait, I managed to make the glasses come from below

blob:https://emoji.build/50c07035-efb9-4341-9205-30adfd6b088e

I retract my indignation on the one half of my requests, but transfer it doubly so for the request of a colour palette

klimeryk | parent | next
Glasses can now be set to any color you want. Only applies to the "Classic" style, though. Unless I find the other glasses in SVG format as well. As a nice side-effect, the glasses can now also be set as semi-transparent!

All thanks to some clever (mis)use of SVG and canvas, see https://github.com/klimeryk/dealwithit/commit/d8f280b5f2e4bd.... Enjoy!

barryrandall | parent | next
That feature was removed because half the people who want black frames were offended that the app offered options that they didn't want to use.
loading story #41849581
loading story #41849508
klimeryk | parent | next
> We demand a color palette for glass colour.

You can choose different styles of glasses. But, yeah, they're all black-ish. Definitely open to different colors/styles! I've created a new issue with some possible solutions and will look into it: https://github.com/klimeryk/dealwithit/issues/33 (but PRs are welcome too!)

| parent
{"deleted":true,"id":41849491,"parent":41849296,"time":1729005357,"type":"comment"}
jitl | parent | next
I got an error after clicking the "Deal with it" button.

    Graph successfully started running.

    Uncaught (in promise) Error: Unsupported MIME type: application/xml
        at Et.a (gif.worker-WYu6DU4i.js:23:56331)
        at Et.zt (gif.worker-WYu6DU4i.js:23:78271)
This might be caused by my workplace enforcing the Okta chrome plugin :(
klabb3 | parent | next
Used in WhatsApp on iOS the last frame didn’t stay, it seems to stop instantly and/or loop back to too early. IIRC I used 20 frames, 250ms between frame and 2500ms for the last one. Seems to have a similar problem on Telegram.

Otherwise incredible. The customization options are much appreciated.

summermusic | parent
This is a known problem for Telegram at least. It cuts off the last frame regardless of that frame's duration. I work around this by adding a single identical frame for 1ms at the end of the GIF.

Source: I've made way too many GIFs for Telegram.

WolfCop | parent | next
Looks cool, but getting an error in Safari after clicking "Deal with it!".

Unhandled Promise Rejection: Error: Unsupported MIME type: application/xml

On this line:

Q = await getGlassesImages(p, D, O);

This is a 2020 M1, Safari 17.6.

jihadjihad | parent | next
It's great. I wish you could paste an image URL too, that would be slick.

Oh, and it would be cool to have an option for the meme text to go under the image too, and to appear in the final frame of motion for the glasses. For now, I can DEAL WITH IT!

klimeryk | parent
> It's great. I wish you could paste an image URL too, that would be slick.

Good suggestion - implemented in https://github.com/klimeryk/dealwithit/commit/12c2254e4a1e5f...

> Oh, and it would be cool to have an option for the meme text to go under the image too, and to appear in the final frame of motion for the glasses

Yup, on my radar! Upvote on GitHub: https://github.com/klimeryk/dealwithit/issues/31

ninju | parent | next
Found a bug

If *after* generating a gif you change the gif size (bigger in my case) the new gif has the sunglasses appear in the same place. But if I change the size first and then generate everything work fine.

Hope I explained it right

klimeryk | parent | next
I immediately knew what you meant, because I ran into the bug while testing earlier today and apparently forgot to file it. So thanks for reporting - I've filed it now properly and should have it fixed soon.
loading story #41850304
klimeryk | parent
Should be fixed by https://github.com/klimeryk/dealwithit/commit/7728d06c90c437... As the classic saying goes:

> There are only two hard things in Computer Science: cache invalidation and naming things.

eezing | parent | next
Great way to promote yourself. Well done!
teqsun | parent | next
That's fantastic stuff!

Minor UX notes: - clicking the header doesn't navigate back to the "home" screen - singular page history (so the back button doesn't take you back to the previous page state)

Combined it made it not intuitive for me how to "get rid" of the selection I'd created (I eventually figured it out, but the previous two points were what I intuitively tried first)

klimeryk | parent
> clicking the header doesn't navigate back to the "home" screen - singular page history (so the back button doesn't take you back to the previous page state)

Could you describe in more detail this? I'm not sure I agree that state changes should be pushed to browser history. In my experience this usually leads to confusing user experience. But that might be also just years of conditioning and I'm missing some best practices. So happy to learn more.

loading story #41852164
silisili | parent | next
This is actually really neat. I like the configurability. Is there an option to change glasses size that I missed? I think that's the only thing I noticed I couldn't do when playing around with it.

* Found it, there is a small indicator in bottom right of glasses that allows dragging out to resize. Thanks all!

tonymarks | parent | next
on a desktop you can click the glasses to resize them
klimeryk | root | parent
On mobile it should work too (at least when I tested on recent iPhones). The drag handle is a bit small, though. Just aim for bottom right corner of the glasses.
pelagicAustral | parent | next
I like it... faved for future fuckery. Can you add background photo rotation or shades rotation?
klimeryk | parent
Yup, shades rotation is on the roadmap: https://github.com/klimeryk/dealwithit/issues/30. Hope to get it done some time today/tomorrow. Most pieces are ready, just need to figure out a good UX for the rotate handle. Worst case scenario, it can be also an input field. Background photo rotation - could you share what would be the use case? The output would be a bit weird, since it has to be square, so either it needs to be cropped (so now there needs to be crop feature ;)) or there will be blank spaces. Honest question, I might be missing some interesting use case! But hopefully, rotating the shades would solve for most of these.
loading story #41849178
| parent | next
{"deleted":true,"id":41852075,"parent":41848150,"time":1729019684,"type":"comment"}
ryandrake | parent | next
Infinite spinner for me: Stuck at "Loading AI models for face detection..." forever. I'd want to fix that before sharing it with recruiters as an example project.

Desktop Safari 18.0.1 (18619.1.26.111.11, 18619)

loading story #41854472
klimeryk | parent | next
Any console errors?
loading story #41849994
DrammBA | parent
As another data point it works on my M1 with Safari 17.2
intelVISA | parent | next
Really nice, can't believe any good place would turn this down. You should be relieved, in a way.
yapyap | parent | next
My god this is so bad, I love it.

(bad in a taste way, not in the engineering way)

chiefrubberduck | parent | next
awesome tool :) thank you for making and sharing it!

https://s11.gifyu.com/images/SB5XB.gif

think_build | parent | next
I love over-built projects. Do not worry about the job offer, the current market is posting job offers that do not exist.
rralian | parent | next
Nice work klimeryk!
chankstein38 | parent | next
This is great! I always joke with my girlfriend about people in billboards or whatever needing deal with it glasses and will likely use this regularly haha Thank you!
stavros | parent | next
Oh man, this is amazing, I love it. Well done.
cabidaher | parent | next
Thank you for sharing this. Many laughs were had!

The company you were applying to sure missed out!

dsalaj | parent | next
Cool, thanks! It desperately needs the copping feature for the original image, so I don't need other tools.
morkalork | parent | next
Please please please add a blunt/joint option. I think my favorite ever use of this meme was in Colossal (2016).
Aardwolf | parent | next
It seems some memes just stick forever :)
i_am_a_squirrel | parent | next
Thank you OP. I needed this.
llampx | parent | next
This could be a reCAPTCHA test, to train the models to better detect eye position and face angle.
klimeryk | parent
It's already using https://ai.google.dev/edge/mediapipe/solutions/vision/face_d... for detecting the eye (and nose) position for the perfect fit ;) The face detection should be done locally, so hopefully Google is not fine-tuning their models based on this.
jammaloo | parent | next
Hell yeah, this is great. I made a similar, but much worse, thing a while back

https://jammaloo.com/DealWithIt/

It uses face-api.js to find the face, and then move the sunglasses over it. It's about a 5 meg model, so it's pretty slow to load. You can customize with a URL, or drag and drop an image on. Resizing the browser also moves the glasses around.

Very happy to see someone take the idea way way way further!

klimeryk | parent
Heck yeah! Love the touches like resize handling or rotation support! Contributions are more than welcome... hint hint ;)

> It uses face-api.js to find the face

Yeah, I'm using Google AI's Face Detector [1]. There's Tensorflow's Face Landmarks Detection [2] that looked most promising and accurate. But it had two bugs [3][4] that are blockers. The first one got fixed recently, but the other one is still pending.

[1] https://ai.google.dev/edge/mediapipe/solutions/vision/face_d...

[2] https://github.com/tensorflow/tfjs-models/tree/master/face-l...

[3] https://github.com/tensorflow/tfjs/issues/7905

[4] https://github.com/tensorflow/tfjs/issues/8290

agos | parent | next
this is great. feature request: DEAL WITH IT caption and relative options
klimeryk | parent
Thanks for checking it out! I have adding text on the roadmap: https://github.com/klimeryk/dealwithit/issues/31 :D Upvote on GitHub to show interest!
joshdavham | parent | next
I love the UI! Definitely gonna inspire from it for a future project
klimeryk | parent
Thank you! It was my first time using Tailwind CSS (and antd). Wanted to try them out for a while, so figured it's a nice opportunity.
vladde | parent | next
Love it. I'll definitely be using this!
navigate8310 | parent | next
Very clean, it just works!
devmor | parent | next
I adore it. I would love the ability to add frame delay (and maybe start/end position/rotation tweening?!) to each layer of glasses.
klimeryk | parent
I think we're thinking of the same thing here: https://github.com/klimeryk/dealwithit/issues/22 That's part of the reason I made the list of glasses draggable/sortable. Because I want to add the ability to specify which glasses should appear together and which ones should appear in a sequence. So many features to implement, so this one did not make it for the launch, but it's definitely on the roadmap!
b212 | parent | next
Great job, thanks for sharing.

Just noticed what company you did leave and I have even more respect for you.

Someone get this guy a job please.

howmayiannoyyou | parent | next
Thank you for this. Changed my life for the better.
tonymet | parent | next
yet the back button...
fHr | parent | next
Now this is amazing, well done.
jhickok | parent | next
Thanks I hate it. Seriously tho, I've already used this twice at work today.