Thinking Out of the Box

Posts Tagged ‘Icon Design’

Eight steps to create an app icon

Olga Poliakova
Olga Poliakova
December 22nd, 2016

BeforeAfter

The Icon – it is a small element, yet it is the first thing that users see when meeting an application – and a first impression can last for a long time. So, it is very important for a product to have an attractive, clear and explanative icon. But how to reach that? I would like to share my knowledge in passing through these steps using pen and paper as well as Adobe Illustrator. I worked as an Icon Designer for many years, and I still create icons from time to time, so maybe you will find my experience useful and can use some of my tips for your work.

Just as an example, I will create an Icon for a hypothetical insurance oriented application “Weather Event”, which warns about dangerous weather conditions (such as storm or hurricane) and suggests to insure a property depending on a situation. I will take you through the necessary steps. So, let’s start! read more…

Not Lost in Translation – About Icons and Interpreters

David Patrizi

Icon design is my day-to-day business, ranging from universally applicable Home icons to very special icons for the wiring of electric relays in substations. Recently I learned that interpreters also use symbols to be able to “sketch” the meaning of spoken words quickly and recall them later. I used this occasion to take a step back and look at other helpful uses for symbols.
read more…

Pictograms – The New Sliced Bread in Icon Design

Jenny Gemmell

After the introduction of Microsoft’s new approach to user interface design with its current mobile device Windows Phone and upcoming operating system Windows 8, user interface designers and clients alongside them are beginning to “think Metro style”. Based on Swiss Graphic Design principles (established in the 1950’s) and focusing on clean typography, not only interaction, navigation and information architecture have changed, but the understanding of and thereby design process for icons has, too.

As discussed in one of our blog articles about UI guidelines for mobile devices, the concept of Metro style icons is inspired by the idea of quick wayfinding, using pictographic signs found in metropolitan areas, airports or train stations. These simple-shaped icons are not only reduced in both color and detail, but especially shall strive for understandability across cultures and languages. This requirement is by no means new, nor is the Metro icons’ attire. Designed along the lines of traffic signs using the most generic and salient mental model available, Metro icons are in fact pictograms, which against the background of spreading globalization have been standardized in many areas of deployment. Not only for reasons of maximizing their recognition and thereby their value was standardization a good idea, but also because a lot can go amiss in designing a pictogram.

To understand the significance of pictograms and their design one must first of all engage in the characteristics of pictographic and symbolic language and discern these from usual interface icon metaphors, speech and appearance. When this is accomplished five points should be taken into consideration while designing intuitive, understandable and aesthetic pictograms.

read more…

Regarding Color Vision Deficiency in the Icon Design Process

David Patrizi
David Patrizi
December 7th, 2009

Red is not always red, green is not always green. For quite a large amount of people it is not easy to distinguish between red and green hues. About 6% of all males have the same difficulties to tell orange from olive-green as unaffected people have to distinguish between burgundy and ruby-red – oftentimes, it is impossible. This most common kind of color vision deficiency is called Deuteranomaly, also known as “green weakness”. The following article will deal with the question of how this wide-spread impairment impacts the production process of high quality icons.

read more…

Resolution Independent Icon Design – Part 4: Modern Tool Support

Thomas Immich

The previous part of this series outlined why it is not possible to just create one single vector-based instance of an icon to scale it to any desired size. This part raises the question, on the one hand, what tool support would need to exist in the future in order to serve an icon designer’s everyday work adequately and, on the other hand, what tool support already exists to make his life at least a bit easier in the present times.
read more…

Resolution Independent Icon Design – Part 1: Introduction to Resolution Independence

Thomas Immich
Thomas Immich
August 29th, 2008

About two years ago there have been some lively discussions on resolution independent user interfaces in the context of icon design. An interesting start page for past discussions is Sven Porst’s blog article. At that time, resolution-independent UI-related products such as Mac OS X Leopard, Windows Vista or Silverlight were either yet to come or have been used solely by a small bunch of insiders. Now, almost two years later, these are established brands – reason enough to shed some light on this topic again and to see if something has changed during this time, and if so what.

read more…

Want to know more about our services, products or our UX process?
We are looking forward to hearing from you.

Luzie Seeliger

Corporate Experience Manager

+49 681 959 3110

Contact form

Before sending your request, please confirm that we may contact you by clicking in the checkbox above.
  • Saarbrücken

    Science Park Saar, Saarbrücken

    South West Location

    Headquarter Saarbrücken
    Centigrade GmbH
    Science Park 2
    66123 Saarbrücken
    Germany
    Saarland
    On the map

    +49 681 959 3110

    +49 681 959 3119

  • Mülheim an der Ruhr

    Games Factory Mülheim an der Ruhr

    North West Location

    Office Mülheim
    Centigrade GmbH
    Kreuzstraße 1-3
    45468 Mülheim an der Ruhr
    Germany
    North Rhine-Westphalia
    On the map

    +49 208 883 672 89

    +49 681 959 3119

  • Haar · Munich

    Haar / München

    South Location

    Office Munich
    Centigrade GmbH
    Bahnhofstraße 18
    85540 Haar · Munich
    Germany
    Bavaria
    On the map

    +49 89 20 96 95 94

    +49 681 959 3119

  • Frankfurt am Main

    Frankfurt am Main

    Central Location

    Office Frankfurt
    Centigrade GmbH
    Kaiserstraße 61
    60329 Frankfurt am Main
    Germany
    Hesse
    On the map

    +49 69 241 827 91

    +49 681 959 3119

Cookies help us in providing our services. By using our services, you agree that we save Cookies. Learn more.

Close