iOS 7 Iconography

From skeuo to neue – Our designer, Neringa explains Apple’s move away from Skeuomorphic design. Memory Box will be one of the first applications built specifically for iOS 7.

From skeuo to neue – 

These have been two of the most difficult to pronounce words in our office since we started developing Memory Box app for iOS7. Still, from skeuo (for skeuomorphism) to neue (for Helvetica Neue) is my favourite way of explaining the shift from representational to a completely ‘flat’ user interface Apple is about to make at the end of this month.

For jargon clarification, I use ‘skeuo’  and ‘neue’ as captions for two phases in the history of user interface design by Apple.  It is a great opportunity to talk about it in more detail with the ‘neue’  phase officially starting at the end of September (see previous post by Rob – an introduction to Apple’s iOS 7).

In this post I will explain some of the reasons behind this transition and talk about the challenges involved in designing iconography for a ‘flat’ Memory Box interface.

 skeuo

Up until now, Apple have been continuously criticised for excesive use of skeuomorphic effects in their user interfaces.

‘Skeuomorphism’ (skeuos for ‘tool’, morph for ‘form’) is a design feature that uses anachronistic elements which tend to be arbitrary. In iconography, the represented object or feature doesn’t serve its original function or its function has become irrelevant. A good example of this would be the Windows’ ‘Save’ icon – in order to save a MS Word document you still search for a tiny image that represents a floppy disk.  The represented object not only does not serve its original function, it is simply no more.

The reason skeuomorphs are frequently found in user interface designs is the aim to make navigation easy for new users. We acquire new navigation patterns in digital media using the information we already gathered from the real world. Following this rule, when designing an icon for a homepage on a social network, a designer will normally make a safe bet with an archetypal image of a house. A pitched roof is recognized as shelter by most cultures and a gap for a door/window indicates human scale and inhabitance.

However, to clarify and at the same time defend skeuomorphism as an overall useful designers’ tool it is worth explaining that the problem critics found with iOS visual language was not the equivalent of  ‘a house’ for  ‘homepage’. It wasn’t even the chimney on the roof of the house (Facebook, for example, doesn’t like central heating). It was more smoke-coming-out-of -the-chimney kind of a problem. Critics found mimicking glass and wood textures in iOS digital environment was arbitrary and certainly did not contribute to the ease of navigation. It was the thorough reference to real life that did not make sense in a digital medium.  The idea that iconography should look as realistic as possible meant that designers used more technical skill than creative problem solving.

 neue

After seeing competitors successfully embracing  ‘flat’ design,  Apple decided to face the criticism and completely change their visual language.

‘Helvetica Neue’ is a system font for iOS 7. Being a light, subtle, sans-serif font it perfectly represents Apple’s brand new UI ideology of ‘less is more’.

The new interface is dominated by text after all the heavily rendered imagery is gone. Every  visual element of the interface  seems to have that same lightness of the font. However, it introduces a challenge for designers who now have to equip apps with all the appropriate iconography to fit the ‘neue’ interface. Iconography design for ‘flat’ interfaces requires a strategy.

Memory Box will be among the first applications built specifically for iOS 7. When designing the icons for the app I decided on a strategy and applied it to all icons: a grid, a repeating brand element and a spacing rule.  When it came to the content of the icon, the challenge was to provide just enough information (or reference to the real world) to allow users to understand what the icon means.

No matter how flat, if the icon has a reference to the real world, it is usually a reductionist version of what it actually represents.

However, I am glad that the design community (with Apple designers finally coming on board) is strongly supporting the thinking that it is much more worth embracing the simplicity of a symbol than trying to perfect it to match its meaning.

It would either never happen or would be called skeuomorphism.

–Neringa

 

Icons and graphics associated with the Memory Box applicatiion are protected by copyright law.