Differences Between Logos and Icons
At first glance, some may think there is not that much difference between a logo and an icon. After all, both are used to represent something. Most consider them one and the same.
So under which category does your design project fall?
Posting a project under the right category attracts the attention of the right designers/specialists, which is why it is important to know whether you are looking for a logo or simply an icon.
Let's define icons and logos, and identify their basic uses.
An icon directly represents (or shows us) an idea, concept, operation or action. Icons simplify or summarize an operation through a graphical representation, and relays this to the user.
Icons are commonly used in applications (or apps), to represent what the app does, and are a key element in UI/UX interface.
They are used more often for actions in responsive web design, and help the user navigate around the site - think how a house icon directs you to the homepage.
Let's take a look at what famous icons can tell us about the typical characteristics of an icon, which makes it different to a logo.
Although the icon above does not have 'iTunes' written on it, first time users will have an idea that the icon represents a program that has something to do with music.
The icon is made of closed fist holding a thumb up, or literally a 'thumbs up'. The gesture is usually used as a sign of approval.
In the social networking site, this icon is clicked when a user wishes to relay a message of agreement to a post or a comment, or simply 'liking' it without having to say anything. (If it were in real life, everyone would be sticking their thumbs up all the time).
To make it more recognizable, it utilizes only two colors: blue and white which are also found on Facebook's logo.
If you have DropBox installed on your computer, this is the icon you need to look for and click to access your files. The icon is integrated in the DropBox logo.
It replaces the typical navigation bar due to the space requirements, and is one of the trends for 2016.
Google
So under which category does your design project fall?
Posting a project under the right category attracts the attention of the right designers/specialists, which is why it is important to know whether you are looking for a logo or simply an icon.
Let's define icons and logos, and identify their basic uses.
Icons
An icon directly represents (or shows us) an idea, concept, operation or action. Icons simplify or summarize an operation through a graphical representation, and relays this to the user.Icons are commonly used in applications (or apps), to represent what the app does, and are a key element in UI/UX interface.
They are used more often for actions in responsive web design, and help the user navigate around the site - think how a house icon directs you to the homepage.
Let's take a look at what famous icons can tell us about the typical characteristics of an icon, which makes it different to a logo.
iTunes
A music note icon, for example, conveys an idea that the use of the application it represents is music related. Take for example the icon used to launch iTunes:Although the icon above does not have 'iTunes' written on it, first time users will have an idea that the icon represents a program that has something to do with music.
Facebook Like
This icon is easily recognized is the Facebook 'Like' icon.The icon is made of closed fist holding a thumb up, or literally a 'thumbs up'. The gesture is usually used as a sign of approval.
In the social networking site, this icon is clicked when a user wishes to relay a message of agreement to a post or a comment, or simply 'liking' it without having to say anything. (If it were in real life, everyone would be sticking their thumbs up all the time).
To make it more recognizable, it utilizes only two colors: blue and white which are also found on Facebook's logo.
Dropbox
Another great example is the icon for the file hosting service, DropBox. The icon is basically an open box, in light blue which basically entices the user to just drop their files in the box and they can carry and access it from anywhere.If you have DropBox installed on your computer, this is the icon you need to look for and click to access your files. The icon is integrated in the DropBox logo.
Hamburger menu
The hamburger is an icon that is popularly used for the navigation bar on a website. It's mostly used in responsive design, where websites cater to smaller devices and screen sizes.It replaces the typical navigation bar due to the space requirements, and is one of the trends for 2016.
Icons on websites
An icons don't always need to be an active button for webdesign, it can also be a design element that explains what a brand is promoting.
Icons work on websites to illustrate what the company is about. For example, mixpanel highlights its business areas of navigation, search, mail, media, and analytics, through the use of recognizable icons.
Icons used in Mixpanel
Key Points
Icons are visual descriptors of function. The best icons find a visual metaphor - thumbs up, empty open box or a musical note to convey the primary function of the application or the object.
Logos
A logo is a recognizable symbol primarily used to represent a business or an organization. Its representation of the organization may be direct, hidden, or abstract. A logo must be immediately associated with the organization it represents. It taps into the organisation's mind set and public image, its values, and is a graphical summary of the company 'brand'.
According to justcreative.com, an effective logo should be simple, memorable, timeless, versatile, and appropriate.
Logos can be a logomark, a logotype, or a combination.
Let's kick off with some examples.
Mastercard
MasterCard's logo represents the brand through the use of colors and the logomark. It wouldn't work as an icon, as the combination of two circles tells the audience nothing about the company's service as a money card system.
Coca-Cola
The Coca-Cola logo is timeless and memorable. How good is this logo? People would associate the typeface, the strokes and the color with the company, even if the name is changed. It carries with it brand heritage as it has been the company's logo since 1885.
Although this logo has evolved over the years, it is still instantly recognizable. People associate with the unique, branded colors, and stylistic elements of the typography. It can stand alone to represent so much about the brand.
Apple
A timeless silhouette logo, the design has evolved to remove the wording underneath the mark. Despite its simple appearance, it is not an icon, as it does not speak to the brand's service or actions.
McDonalds
The goldern arches are iconic of the brand, but are not an icon. The logomark is timeless and instantly illustrative of the brand, but not the actions it performs.
