The Meaning of Icons

The Meaning of Icons

Thoughts on cryptic ideograms and stylized squares.

Spring 2025

The Function of Icons

In 1981, Xerox launched their Star computer, with the very first commercially available graphical desktop metaphor. Since then, the world of computing has been full of icons.

Icons provide a larger clickable area than just a bit of text, add some visual flair to an otherwise bland GUI, and lets us associate a rather abstract collection of ones and zeros inside the computer with a sort-of tangible artifact. The ostensible function of the little images themselves is to act as clear visual pictograms for a file, program or program function, so that the user will know what they're dealing with from nothing but what's being depicted. This, however, is more wishful thinking than actual reality.

Icons are often metaphors or symbols, and despite a seemingly common notion that they should hold intrinsic conceptual meaning, the process of interpretation instead often happens in reverse: Once we've clicked an icon a few times, we gain context and can construct meaningful associations. Immediately recognizable icons are hard to achieve, and in many instances we have to make do with just a logotype, a confusing conceptual anachronism, or an otherwise imperfect pictogram.

Icons from an early 1990s UNIX desktop. There's only so much variation to be had when it comes to meaningful pictograms related to date, time, calendars and clocks.

Hence, icons - at least really good ones - can be seen as a best effort attempt at conveying meaning. What they really let us do is construct our own associations and workflows based on visual memory.

As long as they're not completely counterintuitive, and as long as we can tell them apart from each other, we will, with time, build meaning for each icon. That lets us tie certain associations to a particular kind of image, which in turn lets us construct more compact interfaces on spatially limited screens. Once this conditioning has happened - and if icons are kept reasonably standardized and recognizable - computer iconography turns into a concept of its own, transferable between different programs and computer systems.

Program icons in Windows 3.1 follow all the traditional patterns: depicting the office equipment they replace (filing cabinets, clipboards, pens), reflect new ones (a printer), use a well known logo (MS-DOS) or fail to convey much immediate meaning at all (Control Panel).

Many early icons reflected their analog counterparts: a typewriter or a paper and pen for a word processor, a paintbrush and palette for a graphics program, and so on. Other activities are more decidedly computer-y and lack a traditional counterpart, such as web browsing and system configuration. Early browser icons often incorporated a globe, whereas more primitive communications software, such as terminal programs for calling BBS:es, were typically represented by a desk phone. Neither globes nor phones are unambiguous: A phone can also represent, for example, a database for phone numbers. Luckily, such a database has an analog counterpart in the rolodex. Unluckily, rolodexes - like desk phones and many other objects used in traditional computer icons - have fallen out of fashion. The pool of reasonably representative images is inherently limited, and the desktop metaphor is crumbling, because the computer has become the desktop.

On Banker's Boxes and IRC Clients

A couple of years ago, I wrote a rant about the state of our current UI design paradigm. I complain about a lot of things in that text, one being the below icon toolbar from Microsoft Outlook. The icons used are both monochrome and extremely stylized, in accordance with current trends in interface design.

"What is the 'Archive' icon even supposed to depict?" I asked, and friendly readers answered: A banker's box. While I'm familiar with cardboard boxes for storage, I don't think I've ever seen an actual banker's box: they're not very common here in Sweden. The problem persists, however: after having searched the Internet for pictures of banker's boxes, I still don't think the extremely stylized icon looks very much like one - which is one of the dangers with excessive stylization. For one thing, the rather prevalent handle hole that seems to be a feature of all banker's boxes is missing from their Outlook counterpart.

One thing I do see in the icon is a printer with a halfway printed sheet of paper sticking out. Another is a sight that should be familiar to at least Swedish apartment dwellers: A letter stuck in the apartment door's mail slot.

Icon making is fraught with pitfalls, many of which are linked to culture and language. I remember an anecdote about how an early version of Gnome (or some related application) used actual wooden logs as icons for log files. This was swiftly changed in the following version: metaphors are easily lost across cultural and linguistic barriers, clever puns even more so.

A Better Toolbar?

In the previously mentioned text, I used the IRC client mIRC as an example of how GUI design was clearer and more consistent in days of old. mIRC isn't a pretty program by any standard, and many of its toolbar icons must appear cryptic to people not familiar with IRC or the program itself. Still, they've got something that our trendy contemporary ones often lack: easily distinguishable colours and shapes.

A toolbar from mIRC, circa 1999.

I consider the mIRC icons better than their modern counterparts not because they display immediately obvious representations of program functions, but because their less stylized appearance make them easier to identify and create a mental model around. I'd go so far as to say that this was the golden age of desktop icons: Colourful little works of pixel art that popped out of the UI and made a lasting impression. Easy to remember, easy to tell apart, easy to associate with something. The crayons, for example, is as much a bunch of colours as they are crayons.

Must Mention the Floppy

A common example of iconographic anachronisms is the floppy disk, still used to represent the "Save" action in many contemporary programs, including recent versions of Microsoft Word. Plenty of young computer users have never seen a floppy disk, much less used one - they just have to learn that clicking a strange, square object will store their document. Total boomer dominance: Achieved!

The text editor Notepad++ kept true to the colourful toolbar icon style long into the era of flat design and uses a floppy icon for saving. The icons for "save all" (stacked floppies) and "close all" (stacked documents) would be much less distinguishable if stylized and monochrome.

The interesting thing about the floppy as a symbol for saving is that it gained widespread, standardized use toward the middle of the 1990s - a time when it had already started losing relevance as a storage medium. In 1995, people mostly saved their documents on a hard drive, software was starting to ship on CD-ROMs, and networked file servers with tape backup machines were already common in professional settings.

Most early GUI programs - from the time when it was common to either run a machine entirely from floppy, or save all your files on one - typically don't feature the floppy "save" icon. Perhaps a floppy disk icon would have been too ambiguous at that time: if all your programs and all your files were on floppies, and you had to format, duplicate and shuffle them in and out of the drive all day, what would a picture of one even mean? Then, when their ubiquity dwindled but everybody still had a couple of them kicking around, their meaning could be construed as a way of storing a document.

An early version of MacWrite features a sparse toolbar for setting margins, line height and text alignment - but no floppy for saving.

Microsoft Word 1.0 has a two-row toolbar for controlling text alignment, line height, font attributes and more - but no floppy for saving.

Iconfusing

Another example of a word processor lacking a floppy disk icon is TextCraft - the first word processor for the Amiga - pictured below. Apart from the missing save icon, it's also an example of how stylized and confusing icons are nothing new.

In the upper right icon bar we can see a pencil, a pair of scissors, a compact camera, a male reproductive organ (the manual refers to this as a "paste jar", but I'm not going to let that get in the way of a silly joke), a paint roller and a paintbrush. It's not exactly apparent what most of them do, but then again, TextCraft is from 1985, when the desktop metaphor was still in its infancy - especially on affordable home computers.

The real functions tied to the icons are, according to the manual: caret positioning, erase text, copy text, paste text, text alignment and, finally, text style. I've never actually used this version of TextCraft, but I think it's safe to say that its GUI workflow was what we'd consider fairly primitive.

Iconfabulation

Curious toolbars buttons are one thing, but there's an equal amount of peculiar and confusing program icons. Here are a few examples taken from my beloved Amiga 1200 - all of them standard programs shipped with the machine, using Commodore's own default icons.

ShowConfig is a program for listing hardware specifications and connected expansion cards on the system it's running on. If you know that, the icon makes sense - otherwise, it's quite a bit harder to parse.

Lacer is a program for intended for use with a genlock. It toggles the Amiga's display output between interlaced an non-interlaced mode to ensure compatibility with certain video devices. If privy to that information, the icon clearly depicts a screen with arrows indicating the sweep of an electron beam - but I think it's safe to say that both the artist and plenty of Amiga users have struggled with the meaning of this particular image.

Lastly, we have MEmacs, an Amiga port of the MicroEmacs text editor. The icon has absolutely nothing to do with text editing (suggestion: a pen and paper, perhaps?) - it just shows a program screen with an open pull-down menu. To further the confusion, it's not even a faithful depiction of the MEmacs program screen: the colours should be inverted, with a dark menu and dark text on a light background.

Nevertheless, the icons are etched into my memory and, as such, serve their purpose. I can quickly tell the different programs apart and, through decades of conditioning, even vaguely associate the MEmacs icon with the act of editing text.

The Old Masters

One GUI concept that's remained virtually unchanged since its first conception is the toolbar used in paint programs. One of the first paint applications, in Smalltalk-76, features the same basic toolbar we're familiar with today - one that's since been perpetuated by MacPaint, GEM Paint, PC Paintbrush, Deluxe Paint and on through almost every other similar program, including recent versions of Photoshop.

Above is a depiction of a portion of two such toolbars. To the left are icons from MacPaint, and to the right are icons from Deluxe Paint on Amiga. Some are fairly obvious: spray mode/airbrush, freehand drawing, straight lines, curves and so on. The flood fill icon in MacPaint - to the upper left - is a cute little paint bucket, pouring out paint. The same icon in Deluxe Paint - in the bottom middle - is, in fact, also a bucket pouring out paint. It's just much less obvious, because of the lower resolution and higher level of stylization.

When I started using Deluxe Paint, I hadn't seen any other paint programs and didn't make the connection between the flood fill icon and its real world counterpart. To me it was just "the flood fill icon". When I pressed it, the mouse pointer turned into the same symbol - "the flood fill pointer" - which let me flood fill an area of the screen. It would take several years before I saw a similar icon in another program and, in a small epiphany, made the correct visual association. A perfect example of ideogrammatic conditioning if there ever was one.

A Smiling Cyclops

Designing and picking meaningful icons is hard - really hard. Plenty of concepts don't lend themselves very well to being represented by a single, small, and often ambiguous picture. Despite this, icons are useful graphical objects to construct associative mental models around.

The current trend of stylized, monochrome icons is nothing new - that's how they started out, once upon a time. However, the examples featured above are mostly products of technical limitations, artistic inexperience and lack of conceptual evolution. Low resolution, low colour display modes and early experiments with graphical interfaces meant that things didn't always end up as intended. Today, designers are less constrained by resolution and colour than ever before, and decades of tuning the desktop metaphor have resulted in familiar, if sometimes anachronistic, ideograms.

Icons have always been flawed, but returning to monochrome and increasingly stylized icons means we risk losing what little meaning they actually once held. The harder they are to tell apart, the less useful they are for triggering our visual memory and acting as quick-access graphical abstractions for program functionality.

Eventually, we end up asking ourselves things like "is that the icon for my user account settings or is it, in fact, a smiling cyclops?"