Blogography Logo
spacer

  Home  

Icon

Posted on Wednesday, December 22nd, 2004

Dave!This is a long, drawn-out entry which will probably not appeal to very many people (though, there are pretty pictures, so maybe that will entertain some?). In the text that follows, I feebly analyze icon images and come to the conclusion that Adobe sucks ass when it comes to crafting an icon that's worth a crap (I could say the same about their bug-ridden applications, but we'll save that for another time). I am not a computer interface expert. I am not a human useability analyst. I am not even remotely knowledgeable about how the human brain associated an image with an item. But lack of credentials has never stopped me from stating my opinion in the past, and I'm certainly not going to let it stop me now.

You've been warned. To continue reading, click on the link below...

Apple Icons

The reference standard for icons on the Macintosh come from, who else, Apple. The majority of icons they use are distinctive, attempt to indicate the function of the application, and look wonderful. The only problem is that they assume knowledge some people may not possess. Safari, Apple's web browser is a compass, which makes perfect sense when you consider a browser's function is to assist you in navigating the web, but assumes you know what a compass is (let's face it, in this day of GPS devices, MapQuest, and the decline of the Boy Scouts, this is old-school). Preview, allows you to view images (and even PDFs) so it's icon is great if you know what a photographer's magnifying loupe is. Sherlock, Apple's web search utility, is beautifully illustrated in icon and name, assuming you know who Sherlock Holmes is and the type of hat he wears (though the magnifying glass is pretty academic). Mail (email reader), iTunes (digital music manager and CD player), and iPhoto (digital photo and camera manager) are all a little more accessible because everybody who finds themselves using a computer probably is in a position to knows what a stamp, a CD, and a camera looks like. So, when it comes to icons, Apple is pretty much the cat's meow, though they are not entirely perfect...

Apple Icons

In some cases, Apple's presumption of knowledge goes a little too far (usually in their utility applications). For example, Disk Utility assumes you know what a hard drive looks like, which is odd because many, many users will never look inside their computer to find out (especially with a company like Apple, who works so hard to be sure you never have to look inside your machine). The only thing that saves them from total obscurity this time is that the default icon for a hard drive is the exact same, so most people should be able to put 2 and 2 together. They don't have such an excuse for System Profiler, which assumes you know what a computer chip looks like (probably not a very big leap) and then compounds it with an esoteric tool like a calliper. Things go down hill from there with ODBC Administrator but, in their defense, if you would actually need to use it, you are probably familiar with the universal symbol for a database. Not all implied references are technical. Apple's Backup software uses an umbrella, which relies entirely on a familiarity with the saying "into every life, a little rain must fall" and what is meant by it. Font Book is perfectly rendered and easily understood, but how many people in newer generations are going to know about the origins of moveable type and what those scattered letters mean? But "meaning" of an icon is subjective, and Microsoft weighs in with a widely used alternative...

MS Icons

Instead of attempting to reflect function or form, Microsoft simply provides a stylized icon from the first letter from the name of each product. While not my favorite method of identifying an app, it does have the benefit of immediate association. So, I suppose if your method of rendering the letter is distinct enough, you can get away with it. There's really no mistaking these bizarre renditions for Word, Entourage, Excel, and Powerpoint. Where you run into trouble is when you just slap some generic looking letter on your icon, like the kinda lame "O" for the Opera web browser, which is painfully easy to overlook or misinterpret. And here's where we get to the entire point of this entry. The icon travesty from Adobe...

Adobe Icons

What the f#@%?!?

Seriously, I defy you to show these icons to anybody not already familiar with Adobe's latest round of "CS" products and have them comprehend what the associated application does, what it's named, or even what it's supposed to be. Adobe, the premiere manufacturer of graphic design software has the absolute worst icons of any professional software I've ever seen. Here are my guesses as to what software these icons might actually be useful for:

  1. Flower planting and planning guide software? (No! It's a vector drawing app!)
  2. Astronomy software? (No! It's a web site design app!)
  3. Lepidoptera (butterfly) cataloguing software? (No! It's a publishing layout app!)
  4. Ornithology software for birdwatchers? (No! It's a photo manipulation app!)
  5. Native American Indian tribe historic migration software? (No! It's a web graphics app!)
  6. Who the f#@% knows?

It was that last one, the icon for Adobe's newly-released Adobe Reader (formerly known as Acrobat Reader) which I just downloaded that caused me to become enraged and write all of this. I can only guess that it is supposed to be a stylized version of the old "Acrobat" logo, but they've presented in a way which is impossible to know that, even if you've seen the logo before!! Adobe icons are stupid, stupid, stupid and, even though I've been using the programs for over a year now, I STILL get the icons mixed up on occasion. I wish I had a dollar for every time I accidentally confused the icons for InDesign and GoLive and opened the wrong program.

Whoever approved these icons should be shot. I'm sure they are supposed to be some kind of abstract artistic statement, but f#@% you, I just want to get to work and be able to launch the program I need without having to figure out what in the heck I am actually clicking on. Adobe is a multi-million dollar company, but it doesn't take that kind of money to make functional icons.

The following are all icons from developers who at least try to make an icon that is intuitive. Not all of them are perfect, but the effort in giving us something logical is much appreciated...

Icons

  1. Transmit, by Panic Software. A little moving truck probably doesn't really signify transmitting data via FTP (perhaps they confused transMit with transit?), but it is fairly unique and does give the impression that something is going to be moved. While not entirely intuitive, I have never once had to hunt for this icon or click on it and not get what I expected.
  2. Ecto, by Adriaan Tijsseling. This essential blogging software easily impresses that you are "writing to the world (wide web)" when you click the icon. On one hand, a globe of the earth has become synonymous with the internet and is easily understood... but, on the other, so many internet apps are using it that you end up with a lot of little earths all looking the same.
  3. MegaTrack, by rudis dot net. How could you interpret this icon as anything but hurricane tracking software? A brilliant icon for a donation-ware SourceForge program (as a critique, they might want to beef up that hurricane symbol so people don't overlook it).

Icons

  1. OmniGraffle, by Omni Group. All of the Omni icons are perfect, and this one (for their amazing diagramming and flow-charting software) is no exception. Unique, intuitive, functional, beautiful.
  2. Podworks, by SciFi HiFi. The best of the best of the best iPod transfer utilities has the best icon. Open's your iPod so you can get to the music inside. Enough said.
  3. Poisoned, by The Poisoned Project. Yet another earth-globe icon, but beautifully reinforcing the product name and function (Poisoned is a multi-peer-to-peer client which, I'm guessing, is gleefully poisoning the web by using it for all sorts of "illegal" file-sharing activities!).

Icons

  1. Fetch, by Fetch Softworks. This is another FTP utility (like Transmit) but one with a long, long history with the Mac. When they made the leap to OS X, a new icon was developed which even further bound the name with the icon. I like that the dog is still holding a floppy disk in his mouth (like the original MacOS Classic icon) even though floppies aren't used anymore, which spells out the program's heritage in a clever way.
  2. Firefox by Mozilla. It's only fitting that a revolutionary browser should have an icon to match. Sure they used the earth-globe that hundreds of other internet apps are using, but they found a way to make it entirely unique and reflect the name of the product! Brilliant.
  3. Circus Ponies Notebook by Circus Ponies Software. All too many datebooks, notebooks, word processors, etc. are using the pencil and paper icon, but at least Circus Ponies tried to be unique about it. The multi-color tabs to imply organization is what makes the product so great, and the fact that they worked it into the icon is gravy.

This is not an exhaustive list. There are plenty of other icons I think are brilliant, and a whole lot more I think are really, really bad (though nothing actually useable ever seems to sink to Adobe-level depths of crap). I guess the entire point of this entry is that icons matter. Having icons that are distinctive or relate to the program in some way is essential. Shame on Adobe for screwing up something so basic so very badly when even tiny freeware developers put forth more of an effort to get it right. If the new, even more confusing Adobe Reader icon is any indication of what we'll be seeing from the next CS Suite release, I'll be trashing them and designing my own.


Categories: Apple Stuff 2004Click To It: Permalink
   

Comments

  1. Patrick says:

    I couldn’t agree less. But you Macintoshians/Appleans are way more fortunate than us Windows users. The Adobe icons are as non-descriptive here too, but the overall lack of inventiveness in Windows icons are way bigger than that of Apple/OS X icons. I think it has to do with the color support and the fact that the icons are relatively small. Windows isn’t for the graphics buff, it’s for the hard core gamer…
    I use Adobe’s Creative Suite on a daily basis, but I would be totally lost if it weren’t for the fact that the application’s name is written just beside the icon in the Start menu.

    It would be rather interesting to have a “Native American Indian tribe historic migration software”. Really. I kid you not! :-D

  2. Dave2 says:

    I believe such software actually exists (at least, I saw it in use on a television documentary). The seasonal movement and tribal land claims of the Native American nations affords a fascinating insight into their culture, and reliance on migration routes of buffalo, whale, etc. To view such a simulation in in motion, over time from a historical perspective… along with their ever-shrinking territories as their land was taken or tribes wiped out… is both fascinating and heartbreaking.

  3. JustWondering says:

    How do you draw your clever pictures? Are they done with pre-set patterns/shapes or freehand…or maybe some of both? I enjoy them.

  4. Dave2 says:

    If you are talking about the “DaveToons” that are at the top of all my blog pages here, I draw them freehand in Adobe Illustrator. If you are talking about the icons shown in the above entry, those are not drawn by me but are created by the companies or individuals who develop the software they’re associated with.

  5. Ben says:

    Those ‘dobe icons are screwy, as you mentioned, they make no sense, and thus we can conclude they where made by aliens to confuse and bewilder us all.

    I think the average user becomes familiar with icons by familiarisation mostly, as opposed to recognising any intrinsic symbolism (“ohhh – blue e. Thar be my internet thing.”)

    On the whole though, you should think yourself lucky, Mac icons are mostly superior to windows icons, although XP (bless its heart) did improve things.

  6. Neil T. says:

    (Really digging the new site design, by the way – well done!)

    I totally agree with you on the Adobe Reader icon. I upgraded to version 7 for Windows yesterday and it uses the same icon on the Windows platform. The old icon was a bit more descriptive, that just looks just, well, stupid. They’re pretty but somewhat disfunctional.

  7. Thanks for the kind words about the PodWorks icon. It was actually done by Dave Brasgalla of IconFactory (who also did the Transmit icon, for example). Definitely one of the undisputed masters of OS X icon design.

  8. A little bit of history on that transit vs. transmit bit you are mentioning…

  9. Dave2 says:

    Buzz: Any praise for Podworks is well deserved… and not just the icon. I don’t think I’ve ever registered a program so fast after having downloaded it just minutes before! I completely agree that Icon Factory is the poster child for excellence in Icon Design. I have been a big fan since the Classic MacOS days, and still marvel at how they seem to so effortlessly communicate form and function in their works.

    Martin: Ah yes… The Coding Monkeys, home of the very impressive collaborative text editor: SubEthaEdit (which has a praise-worthy, intuitive, and brilliant icon as well). Thanks for the head’s-up on Transmit. I figured it was probably some kind of legal entanglement like that.

  10. ssp says:

    I think you’re not harsh enough.

    You should also judge the icons by their look at reduced sizes as those are the sizes you mostly see them in. Many of the ‘nice details’ will just look like blobs or swashes of colour then.

  11. Dave2 says:

    I use most of my icons at 48×48, which seems to preserve the detail level enough to keep them distinct. Any smaller, and you are correct, they start to fall apart as far as recognition goes. I suppose if you go really small, you could always switch to list view, where the icons are secondary?

  12. You know, I’ve always had a bit of bone to pick with the identity Adobe has chosen, but you really nailed it! What do feathers have to do with Photoshop? Or flowers with Illustrator? It’s random, and not Monte Python funny random, just random.

    One group you didn’t mention is Macromedia, circles with the stylized first letter of the app. It will be interesting to see where Adobe takes Macromedia’s icons…

  13. Dave2 says:

    Oh I’m sure that we’ll get honey bees for Dreamweaver, a water drop for Cold Fusion, a lizard for Flash, and everything else will be discontinued. If not that, then something equally obtuse and confusing!

  14. John says:

    Aww… no offense, but quit whining! ;) It’s sooooo easy to replace the icons with any of the many freely available replacement icons. Just google for ’em.

    An even better solution (for OS X anyway) is to just use the incredible QuickSilver and never have to rely on icons for launching apps again. You could even use Spotlight, which is similar but not quite as fast as QuickSilver.

  15. Dave2 says:

    Uhhhh… it’s my blog. Whining is what I DO here! :-)

    Seriously though, icons serve a purpose for those of us who don’t want to use QuickSilver… and I don’t think it’s whining to request that companies give us icons that don’t suck ass, and help to identify the application in question.

  16. I remember when Adobe’s icons were meaningful – a framed photo with glass for photoshop, vector drawing (if you looked closely) for illustrator… keeping them similar with just a minor gloss-tweak each version allowed us to imprint them in all the pre-CS versions.

    The total change to meaninglessness in CS was terrible. I still remind myself – photoshop – click the feather – every time I open it. They’ve made a slightly-too-big a change again in CS2, though the intuitive leap is more manageable this time.

    This guy seems to like them…
    http://www.stanleysy.com/blog/2005/04/07/adobe-cs2-iconography/

    His MetaDesign-guy quote about CS-icon reasoning and attempt to link them to the previous set is amusing out-of-touch designer-speak and worth repeating:
    “Nature provided a good metaphor for the role of design software… Feathers were one of the original drawing/illustrating tools. Stars were the original navigation technology. Flowers are present in the original Venus painting. Butterflies were already established in the InDesign packaging, so they already fit the scheme.”

    So… how come the feather is photoshop and not illustrator, then? Oh, because if you look real close at the earlier illustrator box, there are some flowers. The new set clearly do belong together in the suite, but they’re too meaningless. Change is OK once in a while (there really wan’t much more they could do to venus) – but icons need to connect to their application’s purpose.

  17. Dave2 says:

    Esoteric symbology may be pretty and meaningful in a round-about way… but they are crap for doing what an icon is supposed to do: easily identify the program. Flowers, feathers, butterflies, and starfish in absolutely NO way identify drawing, photography, layout, or web design. In this respect, Adobe’s icons fail totally.

    I’m not saying that the old icons were all that much better, but they had the benefit of growing with the program. The Illustrator icon came from early Illustrator packaging where “The Birth of Venus” was being converted into a vector drawing. As Illustrator’s tools got better, the drawing kept getting better. In the last iteration, a near-perfect rendering of Venus didn’t have anything to do with drawing, but for somebody like me who had grown with what the icon originally represented, it was okay.

    The simple fact is that Adobe had the perfect opportunity to fix their icons when they created CS, and completely blew it. Why they didn’t use the tools from each program as an easily-identifiable starting point for new icons I will never know.

  18. Will says:

    The feather for Photoshop is probably representing a quill (I DON’T know what a quill has to do with photo manipulation, but it connects in a sort of abstract way). Same with ImageReady, it probably is trying to show the connection to Photoshop. As for GoLive, the stars are showing the Web/internet (again, in a very absract manner). The Adobe reader icon is a flag with an abstract (again) A, for Adobe, or Acrobat. The InDesign logo still boggles me however…

    Anyway, I think the CS icons are OK, as long as you don’t put them under the microscope and examine them too closely. The point is to be artistic (remember, it IS the CREATIVE Suite). I think that Apple’s photoreallistic icons are superb. My two favorites are the Audio MIDI setup (a keyboard), and the Network (a radar screen) utilities.

  19. Kevin says:

    Sorry, just saw this post for the first time when a comment notification appeared for your site in Bloglines (yeah, so I subscribe to your comments feed… what of it?).

    There’s an icon I love for Palm OS for a little piece of embedded software that sends your files to your Palm the next time you sync up. The icon shows a little box with a music note and another below it that looks like a Polaroid image and a little curled arrow showing both moving towards an old Palm Pilot image. Very intuitive, very simple, very effective.

    I’m surprised you didn’t feature the Thunderbird icon. But, I guess it’s already pretty similar enough to the other Mozilla icon for Firefox that you lauded.

    Oh, and I had no idea that was a magnifying loupe on the Preview icon. I actually thought it was a thumbtack sticking a couple photos to a pinboard or somesuch. Now it makes even more sense. Thanks!

  20. Gm says:

    There just icons you associate them with there programs thats it, it only takes what?, 3 days to know all of your icons and what they open. I do agree that some of the icons are misrepresentative of the app they open but still thats nothing to get annoyed about.

  21. Dave2 says:

    Associate them how? THEY ALL LOOK THE SAME! And it’s not like you can tell what they do from their look… extremely poor design for all the reasons I listed above.

  22. Chaim Klar says:

    You forgot to write – an important point – about FireFox; the fire surrounding the globe is actually in shape of a FOX.

  23. daGUY says:

    I completely agree. The icons give NO indication as to what their programs’ functions are, AND they all look relatively similar. Furthermore, they all completely trash the icons that were used pre-CS, so you lose that familiarity.

    And to make matters worse, there’s CS2. Where they essentially made different icons for all the apps, in the same style as CS. So now you have a NEW batch of vague icons and you have to re-learn what each one is all over again.

  24. AP says:

    Thanks for validating one of my daily annoyances…those ridiculous Creative Suite icons (and what’s with that whole feather thing?). I’ve never verbalized it, but yes, it takes a moment to be sure I am opening the right app. Too bad Adobe doesn’t see the value in “branding” even at the most basic level.

    However, I strongly disagree with you that Apple’s “assumption of knowledge that people may not have” is a problem. Their references are quite clever and if you didn’t get it before, you get it now and just learned something. I find it unfortunate and sad that literacy has come to mean “only what applies to me now”…and really, who doesn’t know what kind of hat Sherlock wore?

    Love your page and this was fun…thanks!

  25. james says:

    the only thing you missed about adobe icons is that once you know them, they make sense. th feather for photoshop is bueatifully cropped to show both the feather outline and an iridecent flower thingy inside it. It shows what you can do in photoshop.

    illustrator has a flower which repersents the edges of vector art

    indesign has a butterfly to show the versatility and agility of the application, as well as the paper-thin wings

    golive has a star to show the internet, commonly repersented as an earth, and your website is a star

    the double feather thingy is like a mini-photoshop

    adobe reader has a symbol, and it’s stylized to show the newness of the new version.

    cs2 redesigned the icons so they’re even more… weird… but good-looking.

    james

  26. Dave2 says:

    Actually, as I explained, they make no sense at all to me.

    Illustrator is a flower? What’s a flower got to do with drawing? Why not play up the pen tool. Photoshop is a feather? What’s a feather got to do with photo manipulation? Why not play up the brush tool or something.

    The worst offense is not trying to attach meaning to the icons… it’s that they are too easily confused. I get them mixed up all the time, even though I know what apps they go to.

  27. Jean says:

    1. “a water drop for Cold Fusion” -> isn’t that kind of the idea? That would work, especially into a glass, with flames/steam coming out…

    2. You hated the new Acrobat icon most — that was the only one I recognized!! Granted, only b/c you’re talking about Adobe icons…

    3. Wow, how many years has this blog thread been running?? KUDOS!!

    4. No ranting about the word “kudos”

  28. sherry says:

    Lol. Imma design dabbler myself but I totally feel ya on the Adobe tip. I must admit that the only way for me to differentiate Photoshop from Illustrator is to put them at separate ends of my dock. Might I add that’s flower vs feather. And yes- the Fetch icon rocks out. Not only is the concept great, but it “runs” as well when you’re up/dl’ing files.

    Btw, can you recommend a good forum/meeting hall where more of this constructive crit for logos/icons takes place? Thanks!

    p.s. Ditto on the longest running thread EVER.

  29. sherry says:

    Lol. Imma design dabbler myself but I totally feel ya on the Adobe tip. I must admit that the only way for me to differentiate Photoshop from Illustrator is to put them at separate ends of my dock. Might I add that’s flower vs feather. And yes- the Fetch icon rocks out. Not only is the concept great, but it “runs” as well when you’re up/dl’ing files.

    Btw, can you recommend a good forum/meeting hall where more of this constructive crit for logos/icons takes place? Thanks!

    p.s. Ditto on the longest running thread EVER.

  30. MacEric says:

    Couldn’t agree with you more Dave. As someone who has been using Adobe software since Photoshop 2.5 shipped on floppies, the one thing lost over the years has been the symbolism of icons to their respective applications.

    For years the vector Venus meant illustrator, and the framed eye meant Photoshop. Now I try to remember what the feathers, flowers and butterflies are all about.

    Microsoft’s icons are only meaningful because of their dominance as known office applications. Otherwise, the first initials wouldn’t make any sense. Still, I personally would prefer more meaningful symbols, lest everything one day be reduced to first initial icons.

    I’m sure as a Mac user you’ve probably been there, but I’m a fan of iconfactory.com, which compliments your thoughts on this topic. I particularly like the various “Aqua Series” of icons that they created in the spirit of Apple’s original designs.

    Cool & original blog!

Add a Comment

Blankatar!

   
I love comments! However, all comments are moderated, and won't appear until approved. Are you an abusive troll with nothing to contribute? Don't bother. Selling something? Don't bother. Spam linking? Don't bother.
PLEASE NOTE: My comment-spam protection requires JavaScript... if you have it turned off or are using a mobile device without JavaScript, commenting won't work. Sorry.




   


   


   
   
   
Your personal information is optional. Email addresses are never shown, and are only used by me if a public reply would be too personal or inappropriate here. The URL link to your web site or blog will be provided, so only fill this in if you want people to visit!



   

  Home  

spacer
Welcome:
Blogography is a place to learn and grow by exposing yourself to the mind of David Simmer II, a brilliant commentator on world events and popular culture (or so he claims).
Dave FAQ:
Frequently Asked Questions
Dave Flickr Gallery:
Dave Contact:
dave@blogography.com
Blogography Webfeeds:
Entries Feed
Comments Feed
Dave Social:
Blogography Tumblr
Blogography Instagram
Blogography on Pinterest
translate me
lost & found
Search Blogography:
thrice fiction
Thrice Fiction Magazine - March, 2011 - THE END
I'm co-founder of Thrice Fiction magazine. Come check us out!
free iphone app
Ask Dave iPhone App
Put Dave in your pocket with this FREE app for iPhone and iPod Touch. All life's answers await you with the Ask Dave app!
hard rock moment
Visit DaveCafe for my Hard Rock Cafe travel journal!
travel picto-gram
Visit my travel map to see where I have been in this world!
badgemania
Blogography Badge
Atom Syndicate Badge
Comments Syndicate Badge
Apple Safari Badge
Pirate's Booty Badge
Macintosh Badge
license
All content copyright ©2003-2017
by David Simmer II
   
Creative Commons License
This weblog is licensed under
a Creative Commons License.
ssl security
Comodo SSL