The Blog

Why iOS 7 didn't kill skeuomorphism - and why that's a good thing

Looking around our offices, aside from great style, fabulous shoes and a major minor addiction to fashion, we noticed every NET-A-PORTER GROUP employee carries a notebook. All communities are built around something...

Given the iPad and iPhone have four physical buttons and a switch, you would think changes to the way we use them would be limited. The introduction of iOS 7 completely disproved that. It came with all-new design guidelines, which created a style influencing the way people use their iOS devices.

Apple eschewed their skeuomorphic design philosophy in favour of a function-led, unobtrusive and minimal interface. The result is a flatter operating system, doing away with superfluous features. App icons have less texture, fonts are simpler and bars and box framing functions are done away with to reveal more information on-screen at all times.

Simultaneously, the colour palette has become more vibrant and features like the control panel have been added, whilst the Notifications Centre remains. At first, it might appear that the changes are purely visual, but the reality is that users not only now interact with their iOS devices differently but have different expectations of UX.

Why did we ever design skeuomorphically?

The dictionary definition of a skeuomorph is "an object or feature which imitates the design of a similar artefact made from another material. In computing, it refers to an element of a graphical user interface which mimics a physical object. For example note-taking apps offer skeuomorphs of yellow legal pads, squared paper, ring binders, etc."

Essentially skeuomorphic design is meant to make the function of something more obvious and easily understood. Famously, Steve Jobs once said that computers should be so simple to use that a complete novice could master them based on instinct alone. His approach championed digital elements resembling real world objects that were easily recognisable to anyone.

There are cases, however, especially in computing and IT, where striving for skeuomorphic design impacts functionality and UX.

When to go skeuomorphic

During the time of iOS 6, in keeping with Apple's design philosophy, many mobile designers tried to give their apps a style that replicated physical counterparts without considering how this would impact UX. iOS 7 has rightly prompted a U-turn in mobile design philosophy and now designers are becoming more concerned with making functionality on-screen obvious and easily accessible.

However, in many cases, apps are uncomplicated and by adhering prescriptively to iOS 7's new design guidelines, mobile developers run the risk of boring their users. It all comes back to the architectural principle of balancing form and function. The way THE NET-A-PORTER GROUP mobile team looks at it is as follows:

Think of a mobile device as a New York loft. It's small so the more stuff you try and fit into it, the more organised and less complicated the objects that occupy it need to appear. Contrastingly, you could try and fit less into the same amount of space, but with a more elaborate style in order to avoid it seeming bland and lifeless.

Our most recent launch was THE NETBOOK, a social shopping app. Designed pre-iOS 7, at the start it was a feed of products with features enabling users to perform various functions such as admire others users and love items. Although it largely performs the same functions now as it did when we first designed it, from a design perspective it was much closer to iOS 7 in its first few iterations.

However, for us and our target user something was missing; it lacked a personal touch and was uninviting. Moreover, with very few functions at launch, the features of the app seemed to get lost on the screen and there was no obvious way of navigating around the app for the uninitiated. We decided against creating tab navigation, which would have made it too similar to existing apps, and turned to the physical world for design inspiration, in particular our very own offices.

Finding the right inspiration for skeuomorphic design

Looking around our offices, aside from great style, fabulous shoes and a major minor addiction to fashion, we noticed every NET-A-PORTER GROUP employee carries a notebook. All communities are built around something and the sense of recognition these little black notebooks create amongst our employees fits perfectly with THE NETBOOK; essentially a social app for those who want to be part of and contribute to a community for the fashion devout.

THE NETBOOK app uses skeuomorphic elements including staples, snakeskin, paper and tabs.

Using the notebook as inspiration, we created something three dimensional from something flat; from the snake skin opening image, the page tabs on the edge of the screen and the clear logos provide visual cues. We feel this format suits the function perfectly and strengthens the concept behind the app.

The lesson here? You shouldn't design something skeuomorphically just for the sake of it. The design should complement the concept and assist the function.

Does skeuomorphic design work for all apps?

From our experience the simple answer is no. Some, such as the new MR PORTER app, naturally fit the iOS 7 design philosophy. By using a flat design with text commands and zero skeuomorphism we've achieved a sleek interface that is easy to use and has a masculine, unfussy appearance.

Today's reality makes skeuomorphs such as 3D buttons a thing of the past, even the shopping bag has been compressed and redrawn based on Apple's guidelines and it works. At launch, THE NETBOOK had some of these features but we found ways of taking elements from iOS 7 design and using them within a skeuomorphic environment to make it feel fresh and modern. For instance, you'll see the icons are flat, the admire call to action is in text, there are no 3D buttons and the overall layout uses collection view.

Is skeuomorphism dead?

Skeuomorphism reached a state of indulgence during the days of iOS 6, with many prioritising form over function. Designers must adapt their styles to suit the project at hand, so there is no need to scrap skeuomorphism altogether. At the end of the day our mantra is to lead not follow and if every app looked the same, what a boring place the app store would be.