There is only one Cloud Icon in the Entire Universe

http://www.hanselman.com/blog/ThereIsOnlyOneCloudIconInTheEntireUniverse.aspx

by shawndumas • 15 years ago

276 63 15 years ago

judofyr• 15 years ago

See also: "Misconceptions about the Golden Ratio" — http://laptops.maine.edu/GoldenRatio.pdf

rytis• 15 years ago

just one comment on that paper. "the most aesthetically pleasing rectangle" experiment I think is flawed. when you present someone with 4 figures it is easier to unconsciously pick the actually "most pleasing" because your brain is ok with validating all four for "aesthetics coefficient" so to say.

when you're presented with some 48 figures, you simply overload your brain and it fails to evaluate aesthetics of each rectangle, sort and pick the highest score. so in my opinion that experiment is flawed.

you brain can only operate on a limited set of objects especially when evaluating and comparing qualities. (7+-3 or thereabouts). pick any book about brain/psychology - it's there.

mkup• 15 years ago

a link to support your argument on Miller's law:

http://en.wikipedia.org/wiki/The_Magical_Number_Seven,_Plus_...

tripzilch4• 15 years ago

Yup.

I'll check the PDF, thanks. Also see:

http://www.lhup.edu/~dsimanek/pseudo/fibonacc.htm

http://plus.maths.org/content/os/issue22/features/golden/ind...

People do seem to like ratios of small integers, though. Which is why the supposed aesthetic elegance of 1.618 ((1+sqrt(5))/2) is most probably within statistical significance of 1.5 (3/2) or 1.666 (5/3), it's impossible to test whether people don't just enjoy ratios of small integers instead of the irrational number Phi.

Gormo• 15 years ago

If it's not white on a blue background, it looks like a frog with one eye open.

udp• 15 years ago

I don't see it.

stonemetal2• 15 years ago

So which is more likely: random multiple co-invention of identical cloud icons, or someone saw the first and copied it for their cloud icon.

jinushaun• 15 years ago

I think even without having seen those logos, I would draw a cloud the same way: one big bump with a smaller bump on the side. I wouldn't go as far as referencing the golden ratio, but something about it feels "right." It's hard to explain unless you're also artistically inclined.

stonemetal2• 15 years ago

True but if you consider that all those icons come from the Apple store, most(if not all) were created after Apple used it for the mobile me icon. Following the Golden ratio doesn't explain it all, why aren't any of the icons symmetric(another one of those things people find beautiful like the golden ratio), why do all the icons have flat bottoms. There is more similarity than can be explained by the golden ratio.

5hoom2• 15 years ago

This is true. The first thing I would think of would be a round 'cartoony' cloud like the ones shown.

You could do a more stretched or jagged looking cloud, but it could easily end up implying 'danger' or 'bad-weather'.

The rounded happy-cloud does seem the obvious first choice.

pg2• 15 years ago

The former.

jannes• 15 years ago

This makes me wonder if this type of cloud icons is going to replace the floppy disk as a metaphor for saving. It certainly is about time.

Raphael3• 15 years ago

I thought they were going to get rid of explicit saving. The current state is automatically saved, as well as some or all history.

brown9-2• 15 years ago

You seem to be referring to iCloud and OS X Lion's version history, while the parent is referring to "saving" as an action in all apps in general.

amccloud• 15 years ago

We've managed to change it up a bit. http://pixelcloud.com/

sjwright• 15 years ago

Only a bit. Still within the ballpark.

Raphael3• 15 years ago

Why is it flat on the bottom and bumpy on top? To answer my own question, to follow the baseline of the text and also to fit our preconceived notion of a cloud icon.

wavephorm• 15 years ago

Because clouds are flat on the bottom and bumpy on top.

Samuel_Michon3• 15 years ago

It puzzles me how the author of this article came to the conclusion that Apple borrrowed/stole its cloud icon from Pictos.

Apple's MobileMe was announced on June 6, 2008. From the start, it used the same cloud icon. [1]

According to the Pictos web site (and the Wayback Machine), the Pictos collection came into being in 2010. [2]

[1] http://web.archive.org/web/20080720090522/http://www.apple.c...

[2] http://wayback.archive.org/web/20100701000000*/http://pictos...

Edit: I thought of one possible explanation. The author, a designer at Microsoft, explains his reason for writing the article is because people accused him of copying Apple's cloud icon for use on ASP.net's website. This made him search for earlier examples than Apple's, to somehow justify using the same cloud shape that so many lazy designers do now.

bruceboughton• 15 years ago

He's a developer at Microsoft, not a designer. Quite a well known one.

Samuel_Michon3• 15 years ago

My bad. From his article, it seemed as if he had something to do with choosing or making the icon:

"we used an icon from the Pictos collection. I have an email from March of 2010 where we selected that icon, in fact."

"we updated the old site's cloud icon"

"the icon isn't from Apple, it's straight from Pictos 1. I know, because we bought it from them for our site."

"it seems there is only one cloud icon in the universe and it's four circles with a flat base. I like it."

Nevertheless, though the author talks about the Pictos 1 icon set being around for years, he offers no proof for that. The Pictos website was made in 2010, years after Apple's MobileMe.

flyosity• 15 years ago

Not to mention that although the Pictos cloud glyph and the iCloud version share the same 4-cloud structure with similar shape proportions, they are definitely not the same icon. The Apple version's 2nd cloud on the left (the small one) has a decidedly flatter curve to it than the same cloud in Pictos which sticks out further. If you overlay these two icons (which should have been the first thing the author did in his entry, but chose not to) this difference and other very small differences would have been made obvious.

Having the same general shape and layout is one thing but being exactly, pixel-precise the same is quite another.

Raphael3• 15 years ago

Damn lazy Apple designers.

jeromeparadis• 15 years ago

Am I mistaken or they didn't used the golden ratio for the arrow in their icon? The arrow seems bulky and weirdly proportioned. I wonder how it would look like if they did.

tripzilch4• 15 years ago

As nobody ever checks and bothers to measure these things:

- the ratio of the bounding rectangle is indeed between about 1.60 and 1.64 depending on how you fudge the pixels. but only for the inner cloud shape, including the embossed highlights, not for any of the other four possible measuring points.

- the ratio of the two small circles might be 76:47 if you again fudge the pixels just right, but then it's 1.617, so that's really close.

- the ratio of the two larger circles on the right is way off. 106:71 is a ratio of 1.49 and that's not going to come anywhere near the golden ratio no matter how much you fudge it.

Hey if anyone got a much higher resolution version of this icon I could measure the ratios to within some precision, that might be nice.

Additionally the ratio between the biggest and the smallest circle is almost exactly 4:9. I bet that's really significant too. Because 9 - 4 = 5, and as the great Malaclypse the Younger already stated in his magnum opus Principia Discordia: "All things happen in fives, or are divisible by or are multiples of five, or are somehow directly or indirectly appropriate to 5. The Law of Fives is never wrong."

Quantum Eris Demonstrantum

tripzilch4• 15 years ago

One more addition, this is where the blogger is mistaken:

    Funny thing about the Golden Ratio, if you look for it, you'll find it everywhere.

He meant to say "five", not the golden ratio. 1.666 = 2/3 and 2+3=5. Because as Omar Khayyam Ravenhurst said to Malaclypse, "I find the Law of Fives to be more and more manifest the harder I look."

hippich• 15 years ago

2/3 ~ 0.666666667

william423• 15 years ago

Well, the Golden Ratio is one plus the square root of FIVE divided by two.

moioci• 15 years ago

"The amount you will to be proved?" No, it's Quod Erat Demonstrandum, "which was to be proved."

zerostar07• 15 years ago

I think he was being sarcastic, and i think it's because strlen(quantum)/strlen(eris) is much closer to the golden ratio than "quod erat". "Quantum electrodynamics" is another famous acronym that follows the golden ratio (+- 30%)

rcthompson• 15 years ago

Actually, in context, "the amount you will to be proved" actually fits at least as well as the traditional interpretation of QED. The amount in question is either the golden ratio or 5.

ryanlelek• 15 years ago

Funny to see all of these with similar ratios/circles. Glad to know ours is original: http://skyz.am/7xa

-- Ryan

mitjak• 15 years ago

That's how 5 year olds draw clouds.

SoftwareMaven• 15 years ago

That's how I draw clouds (and why I hire designers...not to imply they need a designer, but that I'm so horrible I do...I'll just shut up now...).

estel• 15 years ago

For those that aren't aware of it, Drew Wilson's Pictos icon set is generally a fantastic piece of art and brilliant tool for anyone designing for the web.

xelipe• 15 years ago

I wouldn't be surprised if some commission tries to standardize the cloud icon much like the power symbol.

sambeau• 15 years ago

Anyone who grew up in the 1970s/1980s UK will know this to be a nonsense:

http://newsimg.bbc.co.uk/media/images/41148000/jpg/_41148618...

DanBC• 15 years ago

Yes. I had thought the flat base was a distinct feature, but I was wrong. It's been used for years.

(http://hub.tv-ark.org.uk/images/weather/bbc_images/bbc_weath...)

Also, a simple Google image search of [cloud logo] gives many different varieties of cloud. Some have bumpy bases; some have more or less than three circles; etc.

pg2• 15 years ago

Cloudant and DotCloud managed to avoid this design gravity well.

hammock• 15 years ago

Thanks for the counterexamples keeping us honest pg!

tallanvor• 15 years ago

The cloud imagery is present in Cloudant's logo, although it doesn't really stand out. For dotCloud, though, I don't think a lot of people will notice the cloud image unless they're specifically looking for it.

gaetan• 15 years ago

oO

O__o

dreamdu5t• 15 years ago

As far as I know, there is no objective evidence that demonstrates an aesthetic preference for the golden ratio, or designs being any more successful with it.

According to studies done on the matter, nobody has demonstrated said preference: http://plus.maths.org/content/os/issue22/features/golden/ind...

enjalot• 15 years ago

☁ unicode cloud http://www.fileformat.info/info/unicode/char/2601/index.htm

gojomo• 15 years ago

Even the author's examples of asymmetric, 4-bulge, flat-bottomed cloud icons vary somewhat, though a good case is made that this is a very popular variant. At least one of the example App icons has 5 bulges, and the 'old weather map' example refutes rather than supports the case by being a distinctly different symmetric 3-bulge cloud.

I think the more interesting topic is why asymmetric, flat-bottomed, 4-bulged, 3-radiused, golden-aspect-ratio'ed is so popular in the icon format. Pretty sure it's due to the need to look good bounded in a small square – balanced but not perfectly (unnaturally) so, and simplified to minimal details but not cartoonish.

Samuel_Michon3• 15 years ago

Right, and of course most (if not all) of those app icons came after Apple announced MobileMe.

Apple released the first iPhone SDK beta on March 6, 2008. [1]

Apple announced MobileMe on June 9, 2008. Both MobileMe and the iPhone App Store launched on the same day, July 11, 2008. [2]

So there was a 3 month period in which some app developer could've independently come up with a cloud themed app icon identical to the one used in MobileMe. I doubt that happened, though.

[1] http://en.wikipedia.org/wiki/IPhone_SDK#SDK_release_history

[2] http://en.wikipedia.org/wiki/Mobileme#MobileMe

DavidSJ• 15 years ago

Hat tip to Ian Griffiths who points out that the BBC Weather Service beat all of us to the iCloud icon, kind of...over 30 years ago. ;)

Except that BBC cloud icon looks nothing like the iCloud icon.

samirahmed• 15 years ago

i am pretty sure that cloud9 ide has a symmetrical three bubble cloud that is different

jamesbritt• 15 years ago

Funny thing about the Golden Ratio, if you look for it, you'll find it everywhere.

Counter-argument to this:

http://www.lhup.edu/~dsimanek/pseudo/fibonacc.htm

tl;dr: It's everywhere only if you cherry-pick what you measure and occasionally squint.

william423• 15 years ago

To be fair, if you look for it, you'll find it everywhere, because of confirmation bias.

bitwize• 15 years ago

The clouds and the bushes are the same!

toddmorey• 15 years ago

I've worked on a few cloud icons and I can tell you it's a tough problem. The two things that most describe the concept of a cloud in an image are color (white on blue) and shading to suggest 3D form. Both of those are unavailable when working to create a simple b/w icon. You're left with describing the shape, something that's very fluid and doesn't have telling details like the ears, tail, and feet of a cat, for example. It's not surprising to me that we're working to agree on a common representation. Circles on top, flat bottom to suggest something above us.

Deviate too much from the agreed upon shape, and you're likely to get a lot of "What's that?"

There is only one Cloud Icon in the Entire Universe

Related Stories