Iconography Assignment Notebook

They are Everywhere — Icons & Symbols

The Subconscious Language

History

Symbols and pictograms have been used since the beginning of history, to help visually communicate the meaning of concepts, words, and sounds. Eventually, these symbols evolved into spoken languages and alphabet characters we use for everyday reading and writing.

Difference between Icons and Symbols

Many people interchange the term ‘icon’ and ‘symbol’ — however be advised, they are not the same. While there are formal definitions for each of these terms, let me quickly explain with minimal jargon:

Symbols are arbitrarily assigned to an object/concept and socially accepted; the symbol must be learned and our minds must be trained to associate an object/concept with the symbol — it is not intuitive. This can include religious symbols, national flags, and company logos.

On the other hand, icons, imitate the object they are portraying — they look like the item, but in a graphic form.

When Icons Become Symbols

As technology has changed, some icons have become outdated. What use to be an icon (because it ‘looked’ like the object), is now a symbol because it no longer looks like the image but it has been inferred.

For example, the ‘Save’ button on a computer is universally depicted as a floppy disk. In the 80’s and 90’s, that icon made sense, since floppy disks were used for saving documents. However, most people under the age of 30 have never seen or used a floppy disk — they have socially accepted this symbol to mean ‘save’.

Similarly, the phone and video recording icons are very outdated — unless you were around in the 90’s, you are probably wondering what those images below are…Does anyone have a phone or video camcorder like that anymore…anyone….anyone….Bueller?

Icons and Symbols are Everywhere….Literally Everywhere!

I took a break during the day to run some errands and one thing I noticed was that symbols and icons are everywhere — in the stores, on the roads, in airports, basically anywhere I looked.

I took a couple pictures of some icons and symbols I saw. Part of my assignment was to draw these in a notebook and then recreate them in Sketch. Let’s see how I did:

I’ll be the first to say, I’m not a graphic artist — although I was pleasantly happy with my image re-creation of: ‘No Parking’, ‘Play/Pause’, and Mercedes. It’s probably best for everyone if I leave the high-fidelity graphics to the professionals!

Closing Remarks

I find symbols and icons quite interesting. Perhaps its because I like to think that I’m Indiana Jones or Robert Langdon (from Dan Brown’s The DaVinci Code)…reviewing historic relics and understanding symbolism to see how they relate to situations.

Although symbols and icons are all around us, they don’t distract us from everyday activities; there job is to supplement us with information.

I encourage you to go out and take notice of some symbols and icons that are around you — that you probably pass everyday. Go ahead, enjoy a break and appreciate some iconography. Permission granted.

Choose the available icon you need and use the icon in your product using the steps below.

Interface Icons

  • &#;

    add-point
  • &#;

    add-to-builder
  • &#;

    arrow-down
  • &#;

    arrow-left
  • &#;

    arrow-right
  • &#;

    arrow-up
  • &#;

    assign
  • &#;

    attachment
  • &#;

    badge-correct
  • &#;

    badge-incorrect
  • &#;

    book
  • &#;

    bookmark
  • &#;

    calendar
  • &#;

    caret-down
  • &#;

    caret-left
  • &#;

    caret-right
  • &#;

    caret-up
  • &#;

    check-complete
  • &#;

    check-incomplete
  • &#;

    check
  • &#;

    classroom
  • &#;

    clock-reverse
  • &#;

    clock
  • &#;

    collapse-all
  • &#;

    comment
  • &#;

    contain-image
  • &#;

    copy
  • &#;

    create
  • &#;

    crop-image
  • &#;

    dashboard
  • &#;

    definition
  • &#;

    delete
  • &#;

    device-rotate
  • &#;

    did-you-know
  • &#;

    display
  • &#;

    document-pdf
  • &#;

    document
  • &#;

    download
  • &#;

    edit-profile
  • &#;

    edit
  • &#;

    ellipsis
  • &#;

    erase
  • &#;

    evaluation-criteria
  • &#;

    exclamation
  • &#;

    expand-all
  • &#;

    expand
  • &#;

    eye
  • &#;

    facebook
  • &#;

    flip-x
  • &#;

    flip-y
  • &#;

    fullscreen
  • &#;

    gear
  • &#;

    google-plus
  • &#;

    graphing
  • &#;

    grip
  • &#;

    heart
  • &#;

    help
  • &#;

    home
  • &#;

    honeycomb
  • &#;

    icon-placeholder
  • &#;

    layout-horizontal
  • &#;

    layout-thumbnail
  • &#;

    layout-vertical
  • &#;

    link
  • &#;

    live-chat-available
  • &#;

    live-chat-unavailable
  • &#;

    live-chat
  • &#;

    lock
  • &#;

    map
  • &#;

    menu
  • &#;

    message-error
  • &#;

    message-information
  • &#;

    message-warning
  • &#;

    messaging
  • &#;

    microphone
  • &#;

    minus-point
  • &#;

    minus
  • &#;

    misconception
  • &#;

    notification
  • &#;

    play
  • &#;

    plus
  • &#;

    print
  • &#;

    profile
  • &#;

    quicklist-remove
  • &#;

    quicklist
  • &#;

    refresh
  • &#;

    reset
  • &#;

    rotate-left
  • &#;

    rotate-right
  • &#;

    search
  • &#;

    send
  • &#;

    share
  • &#;

    sortable-asc
  • &#;

    sortable-desc
  • &#;

    sortable
  • &#;

    star
  • &#;

    stash
  • &#;

    stop-impersonating
  • &#;

    submit
  • &#;

    teacher-note
  • &#;

    tool-box
  • &#;

    transcript
  • &#;

    triangle-down
  • &#;

    triangle-up
  • &#;

    twitter
  • &#;

    unlocked
  • &#;

    upper-right-arrow
  • &#;

    user-add
  • &#;

    whiteboard
  • &#;

    wizard-active
  • &#;

    wizard-passive
  • &#;

    x
  • &#;

    youtube

Assets Icons

  • &#;

    asset-activity
  • &#;

    asset-animation
  • &#;

    asset-article
  • &#;

    asset-assessment-question
  • &#;

    asset-assessment
  • &#;

    asset-assignment
  • &#;

    asset-audio-cd
  • &#;

    asset-audio
  • &#;

    asset-bcr-constructed-response
  • &#;

    asset-board
  • &#;

    asset-book
  • &#;

    asset-brain-game
  • &#;

    asset-clip-art
  • &#;

    asset-constructed-response
  • &#;

    asset-content-collection
  • &#;

    asset-core-interactive-text
  • &#;

    asset-definition-glossary-term
  • &#;

    asset-definition
  • &#;

    asset-document
  • &#;

    asset-ebook
  • &#;

    asset-encyclopedia-article
  • &#;

    asset-event
  • &#;

    asset-exploration
  • &#;

    asset-five-minute-prep
  • &#;

    asset-flash
  • &#;

    asset-folder
  • &#;

    asset-full-video
  • &#;

    asset-fun-damental
  • &#;

    asset-game
  • &#;

    asset-general-graphic-organizer
  • &#;

    asset-glossary-term
  • &#;

    asset-graphic-organizer
  • &#;

    asset-higher-ed-course
  • &#;

0 thoughts on “Iconography Assignment Notebook

Leave a Reply

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