Icon design has come a long way from its humble beginnings. However, the more you look into the early history of computer icons, the more you might realise that things aren’t that different today. The game may have changed, but the rules have stayed more or less the same. There’s certainly a few things we can still learn from the work of the early icon designers.

Susan Kare is perhaps one of the most famous icon designers, and is still designing today. She designed the icons for Macintosh 1.0, one of the first GUI-based consumer PCs to be sold en masse. Sticking to a basic philosophy throughout her career, she says in her Design Biography: “I believe that good icons are more akin to road signs rather than illustrations, and ideally should present an idea in a clear, concise, and memorable way. I try to optimise for clarity and simplicity even as palette and resolution options have increased. I rely on common sense.”

Mac Icons Susan Kare’s Mac Icons – Image courtesy of www.tutsplus.com

This philosophy has clearly paid off, and had a massive impact on the future of icon design. We can see this in her work on the original Mac icons. She developed a basic iconography and visual language – just look at her use of the ‘trashcan’ icon, which we now know as the recycling bin (the culture around how we treat our waste has changed a bit since the 1980s), or the floppy disk icon to represent – you guessed it – the floppy disk! This design work laid the foundations for what’s to come, still influencing many of the ideas we have about icon design such as using real-word iconography and visual simplicity.

Use of colour

Early icon design also provides a good lesson for use of colour. Early computers were restricted to maybe a few basic colours, but icon designers at the time worked very well within these limits. They stuck to strict colour schemes to ensure their designs looked great and worked with the operating systems. We can see this in the icons on Windows 95. We might be able to use a million different colours in design today, but to make something look good, you should try and restrict yourself in the way these early designers once were. Imposing such limitations gives your designs clear boundaries, which is a good way of stopping you from going too crazy with all that inspiration. Work within your limits, even if you’ve set them for yourself.

downloadWindows 95 Icons – Image courtesy of www.tutsplus.com

Experience and lessons

Some things about early icon design were done very well, but failures of the past also provide lessons for the future. Many icon designers (admirably) tried to make very detailed icons despite playing with very low resolutions. We can look at the icons on early Atari or Apple computers, or Windows 1.0x to get an idea of this. The icons are often very busy and hard to understand, making them kind of incomprehensible. Although we might now have the resolutions available to design complex icons, that doesn’t always mean we should! Look at Microsoft – from Windows 1.0x to Windows 7, they struggled with overly complex icons. It took them nearly 30 years to work out something Susan Kare pointed out in the early 1980s: keep it simple, stupid!

Mac OS 8 Icons Mac OS 8 Icons – Image courtesy of www.tutsplus.com

Windows 1 Icons Windows 1 Icons – Image courtesy of www.tutsplus.com

Clear, simple and common-sense design has been with us from the very start. We only have to look at design guides produced today to see the echoes of Kare’s design philosophy. Although we should maybe not try to precisely emulate early icon design – it is very crude and basic – it’s obvious that the work of early icon designers laid a number of clear foundations for design work to come, and enabled us as designers to innovate with our icons.

Adam Parrish

Owner and creative director at Creative Freedom Ltd. Unbelievably cool icon design expert, husband, and father of two awesome girls. A proper decent chappy and thoroughly fab to work with. Ok, so I wrote my own bio…

Leave a Reply

Your email address will not be published. Required fields are marked *

This site uses Akismet to reduce spam. Learn how your comment data is processed.