{"id":8685,"date":"2020-11-23T16:36:07","date_gmt":"2020-11-23T21:36:07","guid":{"rendered":"https:\/\/www.ceros.com\/inspire\/?p=8685"},"modified":"2021-03-30T10:37:14","modified_gmt":"2021-03-30T14:37:14","slug":"neumorphism-design-here-to-stay","status":"publish","type":"post","link":"https:\/\/www.ceros.com\/inspire\/originals\/neumorphism-design-here-to-stay\/","title":{"rendered":"Is “Neumorphism” Here to Stay?"},"content":{"rendered":"Reading Time: <\/span> 4<\/span> minutes<\/span><\/span>\n

UI and UX designers have been calling for the death of skeuomorphism\u2014the design concept under which objects in a graphical interface imitate the design of real-world objects\u2014for years. First, it was dead<\/a>, then it was risen from the dead<\/a>, then it was just out of fashion<\/a>. But this debate simplifies the influence that skeuomorphism has wielded over both interactive designers and users. It collapses a few complicated questions: Is skeuomorphism a useful design principle anymore? And if so, how? <\/p>\n\n\n\n

\"\"\/
Google results show that people are curious about the return of skeuomorphs.<\/figcaption><\/figure>\n\n\n\n

In the debate over its value, skeuomorphism and \u201cflat\u201d design often get pitted against each other\u2014even though they are not, actually, mutually exclusive. The former is a principle, the latter is a style.<\/p>\n\n\n\n

\"\"\/
Instagram\u2019s first logo is even more skeuomorphic than any of us remember. Source: iMore<\/a> <\/em><\/figcaption><\/figure>\n\n\n\n

Skeuomorphic design can often be hyper-realistic\u2014as seen in the earliest Instagram logos. (Remember that moment in 2010 when the logo was an actual Polaroid camera?) Realism doesn\u2019t matter to flat design, which can border on abstraction, taking its influence from the International Swiss Style of the 1920s. <\/p>\n\n\n\n

But the effectiveness of flat design in UI is still predicated upon \u201caffordances.\u201d In other words, users have to know the properties<\/em> of something to know what action to take. So while flat design isn\u2019t trying to adhere to the real world, it can certainly incorporate\u2014or even rely on\u2014skeuomorphic forms in order to be successful. <\/p>\n\n\n\n

\"\"
Side-by-side comparison of Apple’s iOS 6 and iOS 7. Source: Business Insider<\/a><\/figcaption><\/figure>\n\n\n\n

The theory has it that flat design took hold of the design world<\/a> (yet again) in September 2013, when Apple software update iOS 7 introduced a new app style: flat, matte, high contrast. Since then, flat design has proliferated, moving from one rebranded industry<\/a> to another\u2014though interestingly, Apple seems to be moving away from flat design already<\/a>. And as when any trend reaches saturation, speculators are bound to ask: when will flat reach its tipping point?<\/p>\n\n\n\n

Hello, Neumorphism<\/h3>\n\n\n\n

Enter New Skeuomorphism, a.k.a. \u201cNeumorphism.\u201d The term was coined by UX\/UI designer Jason Kelley, and then adapted by Michal Malewicz for his post \u201cNeumorphism in user interfaces<\/a>\u201d for the UX Collective. Malewicz describes Neumorphism as a specific style that basically lifts flat designs with dimension\u2014a 3D style that maintains a sort of \u201cflat\u201d effect through a minimalist palette. 
<\/p>\n\n\n\n

Malewicz gives the credit to this Dribbble post<\/a> by Alexander Plyuto for starting the trend. The post reads, \u201cLet’s imagine that we live in a dimension where skeuomorph is still alive and continued its evolution in mobile interfaces. What would applications look like then?\u201d <\/p>\n\n\n\n

\"\"\/
Source: Dribbble<\/a><\/figcaption><\/figure>\n\n\n\n

For Plyuto, apps would look like the millennial apartments that get featured in Architectural Digest<\/em>\u2014satin, minimal, white. What makes this style identifiably neuromorphic is how the 3D illusion is created by color. Plyuto has kept both the background and the foreground color the same, using a very light shadow to make each icon look like it\u2019s hovering. <\/p>\n\n\n\n

Some of the skeuomorphic toggles\u2014like that bright red button that reads \u201coff\u201d\u2014look like they were plucked from the side of an old flashlight, or a Walkman that has run out of batteries. Yet, those same toggles and switches seem to be sticking points\u2014there\u2019s text next to one, there\u2019s an arrow pointing in another. While the shapes are familiar, it doesn\u2019t seem as though their uses are intuitive. <\/p>\n\n\n\n

As Malewicz points out, neumorphic designs struggle with the same functional problems that all flat design does\u2014it\u2019s unclear what\u2019s clickable and what\u2019s not.  <\/p>\n\n\n\n

\"\"\/
Source: Dribbble<\/a><\/figcaption><\/figure>\n\n\n\n

For example, in this mobile app tracker designed by Outcrowd<\/a>, some visibility concerns begin to arise. In the dark mode, there isn\u2019t a lot of contrast between the cards and the buttons that rest on top of them. \u201c20 minutes\u201d is a button, right? If \u201c20 minutes\u201d is a button, does it mean that \u201cGoal 1\/12\u201d is, too? If you click on 20 minutes, does it turn orange to signify that it\u2019s been pushed, or do the shadows simply invert? You can imagine how hard that would be to see for someone who\u2019s visually impaired, or in a room with bad light.<\/p>\n\n\n\n

While the functionality might be questionable, there\u2019s something about how these subtle shadows and highlights interact with the flat aspects of the design\u2014like the periwinkle timer in the left rendering\u2014that speaks to a different relationship to flat design, one that seems new. This is why, even though this is just a trend, so many are promoting it<\/a> as a second coming, anyway.  <\/p>\n\n\n\n

\"\"\/
A neumorphic experiment from <\/em>Gavrisov Dmitri<\/em><\/a>: \u201cHere is a small tribute for these bizarre trends of last months. Tesla Cybertruck and Neomorphism, both loved and hated equally!\u201d <\/em><\/figcaption><\/figure>\n\n\n\n

Is neumorphism here to stay?<\/h3>\n\n\n\n

The most important tenet of modern design is that simpler is better. This might account for why flat icons, in their isomorphic distillation, have been so popular for so long. Neumorphs\u2014while perhaps a fun throwback to the plastics of your childhood\u2014make interaction complicated. They\u2019re context-specific, and, as Malewicz points out, they\u2019re not that easy to code<\/a>. But even with the difficulties neumorphism poses, it\u2019s delightful to look at. And often, that\u2019s enough.<\/p>\n\n\n\n

<\/p>\n\n\n\n