[HN Gopher] Show HN: Emoji to Scale
       ___________________________________________________________________
        
       Show HN: Emoji to Scale
        
       Author : javierbyte
       Score  : 672 points
       Date   : 2021-12-03 01:58 UTC (21 hours ago)
        
 (HTM) web link (javier.xyz)
 (TXT) w3m dump (javier.xyz)
        
       | [deleted]
        
       | fagnerbrack wrote:
       | Can someone please tell me why I was hypnotised by this? Do you
       | think this ethical to do to another human being looking for a
       | productive afternoon!???!?!?!
       | 
       | /s
        
       | ushakov wrote:
       | never knew i needed this until i tried
        
       | tshaddox wrote:
       | They missed this at the end:
       | 
       | https://emojipedia.org/milky-way/
        
         | joe5150 wrote:
         | and this at the other end:
         | 
         | https://emojipedia.org/microbe/
        
           | joe5150 wrote:
           | alas: https://github.com/javierbyte/emoji-to-
           | scale/commit/b7b54d7e...
        
             | Jyaif wrote:
             | It would be better to set the data anyway, and let the code
             | that shows the emojis determine whether to skip the emoji
             | or not.
        
               | joe5150 wrote:
               | agreed! they could just use an arbitrary scale.
        
             | jug wrote:
             | OK, I guess that's technically understandable and all, but
             | in this case I hope they understand their chart is
             | completely and utterly unusable now.
        
           | tshaddox wrote:
           | Not quite at the end.
           | 
           | https://emojipedia.org/atom-symbol/
        
             | joshxyz wrote:
             | Ah the ReactJS emoji!
        
               | colejohnson66 wrote:
               | So, is the emoji "tiny" like an atom, or "huge" like
               | React?
        
               | tshaddox wrote:
               | React is like 35 KB gzipped. Pretty huge in terms of
               | JavaScript bundle size, but still physically very very
               | small!
        
       | rosetremiere wrote:
       | Is japan the only country that has its own map as a unicode
       | symbol? If so, is there a story behind it? I would bet on
       | compatibility with some regional encoding that had it to begin
       | with.
        
         | createunderrate wrote:
         | Emoji were created in Japan.
        
         | tinus_hn wrote:
         | The original set of emoji was created by one Japanese person in
         | a weekend for a Japanese mobile operator. So these images, like
         | the blood types, the astrology signs and the cats and later the
         | rice ball and the pile of poo are images Japanese people would
         | want to use in their communication.
         | 
         | The Wikipedia page of the creator has some links to the origin
         | story:
         | 
         | https://en.wikipedia.org/wiki/Shigetaka_Kurita
        
         | wodenokoto wrote:
         | Emoji was basically created to add graphics to Japanese mobile
         | websites in the late nineties when people paid by the byte.
         | 
         | Back then the supplier of the websites also made the phones,
         | and you could only access specific mobile webs depending on
         | your carrier.
         | 
         | The original emoji were mostly create to facilitate online
         | shopping for train tickets for vacation and ringtones. So a lot
         | of these represent travel, food and landmarks.
         | 
         | Edit: this is for Japanese handsets and carriers. That was
         | pretty unclear before the edit
        
       | is-is-odd wrote:
       | Should put an eggplant at the end :)
        
       | pjerem wrote:
       | What a badass 12m cactus !
        
         | joe5150 wrote:
         | the emoji is usually depicted as a saguaro, which can easily be
         | that tall!
        
       | 1270018080 wrote:
       | It's really laggy by the time you get to Tokyo Tower. My computer
       | is hot.
        
         | x3ro wrote:
         | That's what I found too, in Firefox. I then switched to Safari
         | and it was buttery smooth everywhere (MBP 16", not M1). Haven't
         | tried in Chrome yet. I wonder why the performance varies so
         | wildly...
        
         | Gigachad wrote:
         | This page was running at about 3fps on my M1 macbook.
        
         | schmorptron wrote:
         | Huh? I was about to comment the exact opposite, I was super
         | impressed by how smooth it was! And that's running on a 3 year
         | old low-end ryzen 3 laptop processor, on firefox in fedora.
        
       | wartijn_ wrote:
       | Funny idea, but lot of these seem off.
       | 
       | - A chicken egg is taller than 5cm.
       | 
       | - I would say a tulip is bigger than a phone.
       | 
       | - The okay hand sign says it's 21 cm.My hands are larger than
       | average, but definitely smaller than 21cm.
       | 
       | - A duck isn't bigger than a goat.
       | 
       | - An elephant is smaller than a house.
        
         | hbn wrote:
         | I'm curious how he determined that fire is 40cm
        
         | adzm wrote:
         | I think some measurements are widths and some are heights.
        
           | fastball wrote:
           | I think they're actually all by height, and if you google
           | them the OP actually matches up. e.g. googling
           | 
           | "duck height": 20 - 30 in (51 - 76 cm)
           | 
           | "goat height": 16 - 23 in (40 - 58 cm)
           | 
           | Maybe it would be better to do them by mass.
        
             | d13 wrote:
             | Goats average 75cm https://www.dimensions.com/element/goats
             | Ducks average 12cm
             | https://targetstudy.com/nature/animals/duck.html
        
             | hanniabu wrote:
             | Is your mouth height 15cm/6in?
        
             | Nition wrote:
             | A little unfortunate if they just used the automatic Google
             | info results. The duck one is the Indian Runner duck - a
             | Mallard would make more sense per the emoji.
        
         | nkozyra wrote:
         | The one that most confused me was lips bigger than the heart
        
       | travisgriggs wrote:
       | Why is the mermaid so huge? The flamingo dancer and running male
       | are smaller. The mermaid is apparently an Amazonian Mermaid, able
       | to hurl the bison next to her to the ground with a flick of her
       | tail.
        
         | folli wrote:
         | Two meter mermaid incl. the tail seems reasonable to me,
         | however I have never met one in person.
        
           | mattowen_uk wrote:
           | Either way, a two metre Amazonian mermaid is kinda hot.
        
       | gungsukma2 wrote:
       | Should have "banana for scale" checkbox
        
       | orliesaurus wrote:
       | Is it rendering the Emojis using the local emoji set so for
       | example if I'm on an Android phone I will see the Android emojis
       | and if I'm on an iPhone I will see the iPhone emojis?
        
         | javierbyte wrote:
         | Yes! Author here, the emojis text with css transforms.
        
           | lopis wrote:
           | Unfortunately the side effect is that some emojis, live the
           | gorilla, are only a head in my font. Still, it's cute,
           | despite the weird scales (your mouth is 12cm??)
        
       | _han wrote:
       | Would be interesting to see this in a (log scaled?) histogram.
       | Probably a lot of things in the 1 metre order of magnitude.
        
       | reginold wrote:
       | This is fun!
       | 
       | What is the biggest size jump in this database by percentage
       | growth between one emoji and the next?
        
         | reginold wrote:
         | My guess is Mt Fuji (8 km) to map of Japan (1527 km).
         | 
         | Curiously, a map is not this size, Japan is. A map is closer to
         | 1m.
        
       | javierbyte wrote:
       | Visualize emojis to scale. The chicken is not bigger than the car
       | anymore!
        
       | tempestn wrote:
       | That was super fun. Best use of unconventional scrolling I've
       | ever seen, I think.
        
       | thom wrote:
       | Slightly tangential to the author's intent, but is there any way
       | in modern web front ends to discover accurate DPI info of the
       | screen you're on, and therefore at least attempt to create
       | correct physical sizes for UI elements?
        
       | mdoms wrote:
       | Great idea! Why vertical scrolling though?
        
       | trissylegs wrote:
       | Ok on my emoji set the Gorilla (Silverback) is just it's head. So
       | it seems to imply a Gorilla has a head the size of a Llama.
        
       | Vadoff wrote:
       | 4-leaf clover larger than a credit card?
        
         | croisillon wrote:
         | don't get it either
        
         | whylo wrote:
         | Measured from the base of the stalk, maybe? Rather than the
         | diameter of the leaves
        
       | cunthorpe wrote:
       | Goat: 45cm
       | 
       | Duck: 50cm
       | 
       | Might as well say "shuffled emojis with random data attached"
        
         | King-Aaron wrote:
         | Arm: 30cm. I think my arm is bigger than that. And fire: 40cm.
         | This seems somewhat arbitrary lol
        
           | xcambar wrote:
           | Let's play picky:
           | 
           | In anatomy, the arm is the part between the elbow and the
           | shoulder. Below the elbow is the forearm.
           | 
           | With that in mind, 30cm for the arm is definitively a sound
           | measure... and the name of the emoji is wrong. On every
           | phone, keyboard and app.
           | 
           | tl;dr; what is commonly called arm is in fact arm + forearm.
           | Don't blame the author for being correct.
        
             | wartijn_ wrote:
             | The emoji isn't called "arm" though, it's "flexed biceps".
             | Alternative names are: biceps | comic | flex | flexed
             | biceps | muscle. [0]
             | 
             | And every popular implementation shows arm + forearm +
             | fist. [1] Giving only one part of that as the length is
             | just wrong.
             | 
             | Even if it were called arm, I would argue that that should
             | be shoulder to wrist, since that's what commonly called an
             | arm. It's also the definition that Merriam Webster has. [2]
             | 
             | [0] https://unicode.org/emoji/charts/emoji-list.html#1f4aa
             | 
             | [1] https://emojipedia.org/flexed-biceps/
             | 
             | [2] https://www.merriam-webster.com/dictionary/arm
        
               | xcambar wrote:
               | Just so you know, I'm fine with calling "arm" what is
               | between shoulder and wrist.
               | 
               | I was just annoyed that GP seemed to diminish OP's
               | efforts in building their page by nitpicking chosen
               | lengths and terms, and I chose to enter the game rather
               | than nothing.
               | 
               | Your comments are welcome and informative, thank you for
               | that. Dictionaries are descriptive and not normative,
               | which confirms the common use of arm as "wrist to
               | shoulder".
        
         | hanniabu wrote:
         | Yeah my mouth isn't 15cm/6in wide, definitely around half that
        
         | cjohansson wrote:
         | Well it says "to scale" not "to realistic scale" so it could be
         | a made-up scale
        
         | rob74 wrote:
         | Also, the "running man" being bigger than a cow and about the
         | same size as a horse...
         | 
         | But what really bugs me is that it simply uses some font it
         | finds on your system, so on my slightly outdated Linux version
         | it only shows about 70% of the emojis. I mean, if there was
         | ever a perfect use case for webfonts, it would be this page...
        
           | mminer237 wrote:
           | The average man _is_ taller in height than the average cow
           | and shorter in total height than the average horse.
           | 
           | His cow is about the average total height of a cow at 160cm.
           | 
           | He has an oddly short man though at 165cm / 5'5".
           | 
           | And he says the horse is the same size, but that would be
           | only 16 hands. That would be the withers size of an average
           | horse, but the total height of only a pony.
        
         | dhritzkiv wrote:
         | I managed to force this data to sort-of work by using a pygmy
         | goat at 40-50cm tall, and a mallard deck at 50-65cm long (even
         | larger than the site suggests). So, sure.
         | 
         | But if you use a more typical domestic goat, like an Irish
         | Goat, you get a height of 80-90cm. The length is even longer.
        
           | lvturner wrote:
           | laden or unladen?
        
             | mattowen_uk wrote:
             | African or European?
        
       | Andrew_nenakhov wrote:
       | The other day I was running a web version of Townscapes on my
       | smartphone, and it worked beautifully and smooth. But this one is
       | so laggy and slow that I barely could scroll to Laptop (24cm),
       | and then just stopped.
       | 
       | How come a real-time 3D rendering is faster then just displaying
       | a few 2D pictures side by side on a screen? Tech these days is
       | weird.
        
         | bmicraft wrote:
         | It seems to run with native framerate in firefox while chromium
         | gets maybe 20fps on my laptop
        
         | [deleted]
        
         | tobyjsullivan wrote:
         | I had the opposite experience with both of those. Can't run
         | townscapes beyond the first frame render, but this site is
         | perfectly smooth on iOS.
        
         | mattigames wrote:
         | Because the page is mutating the CSS "left" property which is
         | known to be extremely slow (should have used translate), and
         | also creating/removing the dom elements, which is also slow.
         | That Townscapes you saw was probably running over WebGL, you
         | can use 2D over WebGL for the speed benefits with libraries
         | like PixiJS (or from scratch but that's not recommended)
        
       | moss2 wrote:
       | I didn't know goats were so tiny (45 cm)
        
         | can16358p wrote:
         | That's the new M1 Goat Mini.
        
       | AceJohnny2 wrote:
       | What is the yellow smiley face that's twice as large as Japan but
       | smaller than the earth and oh god I can see it in the sky it's
       | look--
        
         | AceJohnny2 wrote:
         | oh nm that's the moon
        
           | tim-- wrote:
           | Definitely had the same question, and the exact same
           | realisation. We must be Android users!
        
             | AceJohnny2 wrote:
             | I wrote the first comment before I realized what it was. I
             | thought it was a joke where the author intentionally mis-
             | sized an object.
             | 
             | Only after I submitted did it occur to me that the size
             | could be similar to the moon's
        
               | ljm wrote:
               | I'm tempted to submit the clownface emoji at twice the
               | scale of the sun, in reference to both the large clown
               | boss in Super Bomberman[0], and more loosely to
               | Sinistar[1]
               | 
               | [0]https://bomberman.fandom.com/wiki/Clown_Mask
               | 
               | [1] https://en.wikipedia.org/wiki/Sinistar
        
           | spiderice wrote:
           | It's the moon from Majora's Mask, clearly
        
       | revskill wrote:
       | The popularity of Emoji to me is not good for communication.
       | 
       | Instead of careful and clarity in writing, people choose Emoji to
       | respond to what needs to be more clarified.
       | 
       | So, if it's hard to express your thought, let's pick an Emoji!?
       | 
       | At work, this leads to more trouble in writing. Most of JIRA
       | tickets are mostly non-existent that it's badly written,
       | confusing to the developers and rest of the team.
       | 
       | Emoji might be just one reason for that. But anyway, it just
       | shows the trouble on how people have problem in writing
       | communication.
       | 
       | Do people overuse Emoji ? I don't think this is about overuse or
       | not, it's about people failed at expressing their thought through
       | writing.
        
         | halfmatthalfcat wrote:
         | Emojis are fast, easy and universally understood, especially
         | across language barriers.
         | 
         | Not all responses between humans need to be written in prose.
         | Using images has been and will continue to be a significant way
         | for humans to communicate with.
        
           | revskill wrote:
           | You missed the point here. Instead of a clear explanation in
           | written form, people think an emoji is enough, which is a
           | problem. As the author doesn't want to know how other 're
           | feeling , they want to know their thoughts instead.
        
             | hoten wrote:
             | Perhaps they missed whatever point you were making, but
             | your comment is largely offtopic.
        
         | skipnup wrote:
         | People also use gestures and facial expressions while talking
         | (see Italy for a frequently portrayed nation for this), why not
         | use the next best thing in (non-formal) communication?
        
       | 0x456 wrote:
       | Some of these don't show up for me (like Saturn). This might work
       | better with a web-font? Although then you'd lose the harmonious
       | platform emojis. I wonder if there's a way to check if a unicode
       | character exists in a font and dynamically substitute, without
       | using canvas.
        
         | can16358p wrote:
         | Quick and dirty idea: maybe try rendering it to an offscreen
         | span/div, get its size and compare it to a well known size of
         | what gets substituted for a generic symbol if it doesn't exist,
         | and if the size matches that, replace with something else.
        
       | bko wrote:
       | 12m Cactus
       | 
       | I thought this was a mistake but it checks out.
       | 
       | https://www.dimensions.com/collection/cactus-cacti
        
       | valleyer wrote:
       | Neat concept.
       | 
       | As someone not very up-to-date in Web UI techniques, I was
       | curious as to how the array was being advanced on scroll.
       | Unfortunately, it looks like the answer is basically polling. The
       | code constantly calls window.requestAnimationFrame(), checking
       | window.pageYOffset. This means that the page is constantly doing
       | work, even at idle.
       | 
       | Surely the more correct way is to install an onscroll handler or
       | something, right?
        
         | vincentriemer wrote:
         | The correct way would be a mix of those two strategies: an
         | onscroll handler that schedules an update through
         | requestAnimationFrame (ensuring that it only gets scheduled
         | once until the next frame update actually executes).
        
           | goatherders wrote:
           | The correct way is the way that works, which this does.
        
             | osrec wrote:
             | Well, perhaps, but it's unnecessarily inefficient.
        
               | tekromancr wrote:
               | I mean, it's inefficient as for the 120 seconds you play
               | with it. I don't think it's worth spending more time
               | trying to perfect something like this.
        
             | framecowbird wrote:
             | it barely works for me on mobile. very jittery
        
         | have_faith wrote:
         | Request animation frame exists specifically to avoid
         | 'traditional' polling. You're thinking more of setInterval()
         | which is the old way of doing it. The requestAnimationFrame
         | docs are a good read, there are lots of performance benefits.
        
       | [deleted]
        
       | noduerme wrote:
       | why couldn't this be done with SVG?
        
       | k_sze wrote:
       | How is a goat 45 cm?
        
       | Thorrez wrote:
       | The mosquito looks too small compared to the ant. I guess both
       | can vary in size, but mosquitos I've seen have been larger than
       | ants I've seen. Here's a video with a mosquito and an ant:
       | 
       | https://www.youtube.com/watch?v=aW_RUnjLv6c
        
         | traes wrote:
         | Likely just a regional thing. Ants where I live tend to be
         | slightly larger than our mosquitos, and they certainly have far
         | more volume.
        
           | onion2k wrote:
           | _Ants where I live tend to be far larger than our mosquitos._
           | 
           | When you say "far larger", is that twice as big? 10 times
           | bigger? 1000 times bigger? I might have to avoid where you
           | live.
        
             | vultour wrote:
             | The ladybug one must be way off, where do they have 1cm
             | large ladybugs? That sounds terrifying. I'd say our
             | mosquitos are closer to 1cm, although they're long but
             | thin.
             | 
             | There's more of these which are really weird, like the 12m
             | cactus.
        
               | scatters wrote:
               | It's probably a seven-spot ladybird; those average about
               | 10mm. I can assure you that they aren't terrifying at
               | all.
        
       | boondaburrah wrote:
       | Holy shit that's a really big clover
        
       | rigrassm wrote:
       | I want to know why the Astrodome has a soccer field instead of
       | baseball and more importantly, no dome!
       | 
       | They even have 6 flags on the stadium ( which I'm assuming is a
       | reference to Six Flags over Texas, could be wrong though) but no
       | baseball field?!?
       | 
       | Weekend ruined!
       | 
       | Awesome project OP!
        
       | authed wrote:
       | I didn't know that we could get a 5.5cm credit card...
        
         | fastball wrote:
         | Everything is by height.
         | 
         | V2 should try everything by mass.
        
       | redconfetti wrote:
       | I really wish they put a woman emoji at the end, labelled "Your
       | Mom"
        
       | dwohnitmok wrote:
       | I was half-expecting there to be a gigantic jump to the sun emoji
       | and then the galaxy emoji, but that might have presented rather
       | interesting engineering challenges at that point.
        
       | deepstack wrote:
       | Oh my Emoji feel like Chinese writing system!
        
       | leodriesch wrote:
       | I'm honestly impressed by how detailed most of the emojis are (on
       | iOS at least), even though they're mostly just shown at tiny
       | sizes. Nice attention to detail.
        
       | Scaevolus wrote:
       | Cute! Using SVG to render the emoji might make this look even
       | better, see https://smilecraft.net/emoji.html for a simple
       | example.
        
       | toqy wrote:
       | Reminds me of an old favorite
       | 
       | https://joshworth.com/dev/pixelspace/pixelspace_solarsystem....
        
         | mvexel wrote:
         | That, and OP, reminded me of the Eames "Powers of 10" film
         | https://www.youtube.com/watch?v=0fKBhvDjuy0
        
           | aasasd wrote:
           | A better way to enjoy that is with a soundtrack by Gas:
           | https://www.youtube.com/watch?v=NvG-jqGsWSk
        
       | qwerty456127 wrote:
       | The fact we still are using bitmap icons seems really weird to me
       | by the way. We should have switched to SVG as soon as screen
       | resolutions and DPIs (e.g. on handheld devices) started growing.
        
       | catern wrote:
       | I love the idea, but the algorithm for scaling seems a bit off.
       | For example, it shows the human as much larger than the car.
        
         | tracedddd wrote:
         | I think it's by height in which case it makes sense... maybe.
        
           | hanniabu wrote:
           | Some seem by height and some by width, and some make no sense
           | at all.
        
         | irrational wrote:
         | Maybe it's one of those tiny Smart Cars.
        
       | fnord77 wrote:
       | that was fun :)
        
       | franga2000 wrote:
       | Cool idea, but since one one dimension (height?) was considered,
       | you get some weird things like a cactus (12m) being way bigger
       | than a house (7m).
        
         | rob74 wrote:
         | According to Wikipedia, Saguaro cacti "can grow to be over 12
         | meters (40 feet) tall". So, a real old and real huge Saguaro
         | _can_ be bigger than your average house (or palm tree): https:/
         | /en.wikipedia.org/wiki/Saguaro#/media/File:Saguaro_wi.... But I
         | would say 99% of them aren't...
        
           | franga2000 wrote:
           | Oh yeah, I looked it up too and was really surprised, being
           | from Cetral Europe and having never seen a cactus outside of
           | a pot before :)
        
         | duiker101 wrote:
         | Not to mention the bigger than the Hippopotamus :D
         | 
         | Very cool project tho!
        
           | duiker101 wrote:
           | I meant to say the woman, forgot the word :D
        
         | wongarsu wrote:
         | Even more confusingly, it's not consistent about the measured
         | dimension. The car is 1.8m (wide), the firetruck is 2.3m
         | (wide), the tractor is 5m (long), the bus is 12m (long), the
         | statue of liberty is 46m (high), the astrodome is 66m (high).
         | 
         | It would have made more sense to stay with either height or the
         | largest dimension (but that would have been weird for
         | mountains, which often are far wider than high).
        
       | [deleted]
        
       | phailhaus wrote:
       | Projects like this remind me why I love the web. So cute!
       | 
       | This is an open source project, so everyone commenting with
       | suggestions can just open up a PR:
       | https://github.com/javierbyte/emoji-to-scale
        
       ___________________________________________________________________
       (page generated 2021-12-03 23:02 UTC)