
Neumorphism in User Interfaces - amake
https://uxdesign.cc/neumorphism-in-user-interfaces-b47cef3bf3a6
======
thatsenough
> _This shot by Dribbble user alexplyuto gained over 3000 likes and pushed the
> trend forward._ [1]

That mockup is aesthetically pleasing, but from a usability perspective it's
terrible: every UI element looks like a button. The progress bar (?) looks
like a slider. How do users know which elements they're supposed to interact
with? Why do we make the same mistakes over and over?

[1]
[https://miro.medium.com/max/3200/1*gza8htfpZ-5eDabA7_kTJw.pn...](https://miro.medium.com/max/3200/1*gza8htfpZ-5eDabA7_kTJw.png)

~~~
fragsworth
That progress bar doesn't even make sense. For "cash available"? What kind of
progress bar makes sense for that? Having available cash in some shitty
company's account is not a goal you want to reach.

It is unfortunate that people focus on such superficial aspects of design,
especially in UI design. When there's some trend showing up, you'll see
countless people talking bullshit about aesthetics and how pleasing things
look, and people get so wrapped up in it that they ignore any sense of
usability.

~~~
viraptor
> That progress bar doesn't even make sense. For "cash available"? What kind
> of progress bar makes sense for that?

Savings goal. Credit limit. Mortgage.

It would be badly named, but it's not completely stupid.

~~~
delusional
I interpret the credit limit label right below to be the label if the progress
bar.

~~~
Izkata
That's exactly what it is; off to the right it says "$220 / $1000", about
1/5th, which is where the bar is.

------
_bxg1
I'm one of those weird people who's missed skeuomorphism ever since it fell
out of favor. It had so much more charm than the soulless, flat interfaces we
get these days. And honestly it was more intuitive too. The accessibility
issues with this new style definitely need addressing, but given that I'd be
excited to see things move back the other way some.

~~~
virtualritz
Indeed.

But there is another aspect besides the aesthetics.

I regularly witness that especially seniors using contemporary smartphone apps
or websites have real difficulty telling information apart from interface
because of everything being flat.

"Oh, this is actually a button – ...? – how do you know this?"

When my ma asks me this I don't have a good answer other than: "I just know.".
Which is terribly telling from a UX perspective.

I studied UX at uni, many moons ago, when it was still called 'HCI' (human-
computer interfaces).

Interestingly, how an interface was rendered was never of any consideration or
part of the curriculum at the time. I wonder if it is today when people study
UX?

In the 90's/early 2ks, when I was at uni, all interfaces elements on all OSs
where somehow 3D. Except for menus. I guess that's why. It was accepted that
mirroring a physical element, even if highly stylized, was the way to go.

But then there were also style guides for every platform.

While this is not related to the topic it is somehow connected. Best practices
for any OS are regularly ignored for unified platform experience between the
different incarnations of an app these days.

And so I often wonder wtf. happened to all the knowledge we accumulated in
this field when I see contemporary apps or websites.

As for 'skeuomorphism' \-- it still exists in it's best from (imho) from the
early 2000s, in some modern apps. For example the Soundbrenner one comes to
mind [1].

[1]
[https://www.soundbrenner.com/themetronome/](https://www.soundbrenner.com/themetronome/)

[edited for typos]

~~~
tomc1985
> And so I often wonder wtf. happened to all the knowledge we accumulated in
> this field when I see contemporary apps or websites.

Why not ask the graphic "designers" responsible for all these contemporary UI
atrocities?

They'll tell you think you want skeumorphism, but really don't, so accept what
they deign to build for you and be quiet

------
egypturnash
A few years down the line we'll see people experimenting with bringing in more
textures and decorative details and then, hey, here we are back in the world
of faux leather-bound planners and music players made out of jeans and
whatnot.

And I, for one, will be delighted, because I've been tired of everything
having to be flat shapes on bright white backgrounds for at _least_ half the
past decade.

~~~
overcast
The problem with all these crazy textures, drop shadows, and chunky buttons,
is that they get tacky very quickly. While plain simple layouts are timeless.

~~~
alxlaz
People are going to misuse any design guideline -- that doesn't say anything
about the guidelines themselves. Plain, simple layouts lend themselves to
abuse just like textures, shadows and chunky buttons. The results are equally
silly -- your average super-flat, plain, simple layout with flat, simple icons
is as annoying to interact with as the tackiest Winamp skin you can remember.

Skeumomorphism has become this mythical beast that supposedly meant every
interface was hard to use, cluttered and unintuitive. But we actually had a
lot of very good, very useful interfaces back when it was a thing. In fact
_most_ programs written after GUIs became common enough had pretty good
interfaces. Outrageous skins and things like Kai Power Tools were exceptions,
not the norm.

~~~
baddox
> People are going to misuse any design guideline -- that doesn't say anything
> about the guidelines themselves.

I think it says a lot. Just like with diet plans, compliance rates are
important in design guidelines. It’s not good enough to say “my guidelines are
great if followed strictly” when no one seems to follow them strictly.

------
foresto
I don't want or need my UI to pretend it's a Nordic modern art museum. Seeing
all that screen space wasted on huge margins, drop shadows, and glow effects
makes me want to cry.

I would rather see more of the information I frequently need, or the controls
I frequently use, without having to dig through page stacks and submenus to
find them.

In cases where there isn't any more commonly-used stuff to display, I'd rather
have text that can be easily read without squinting/glasses/giant phone
screen, and controls that can be easily operated while riding in a vehicle.

~~~
core-questions
This is why every actually-productive program ends up looking "ugly" \- think
Blender or any other 3D tool, or Emacs, or a well fleshed-out IDE, or a
professional engineering tool. The screen is cluttered with dialogues and
toolboxes, many of which can be customized and rearranged into precisely the
tool you have in mind.

Consider, for example, that Word 6 for Windows 3.1 let you do more to
customize toolbars and menus than the latest Office 365 does inside the
browser. The market was for a professional, to some extent, before; Microsoft
Works was the dumbed-down version for more casual needs. Now, it seems like
that professional set of functionality is an afterthought for a lot of UX
designers.

Then again, you only really need pro UX when your goal is to actually get your
product working well for people that aren't good at discovering interfaces
themselves. If your target market is used to hammering their way through ugly
UIs and CLIs out of necessity, pro UX focused on the 99% might not be the best
investment; being consistent in your choices to at least make results
predictable is probably the best lesson to apply in its stead.

------
matsz
Full-on skeuomorphism and full-on flat design are extremes of the UI design
spectrum, the real beauty lies between the two.

For more business-oriented applications I would personally still go for flat
design, since it will always look more neutral and professional than the
potential "let's have fun" skeuomorphic version.

------
dgellow
Don't forget to also read from the same author "Neumorphism will NOT be a huge
trend in 2020" [https://uxdesign.cc/neumorphism-will-not-be-a-huge-trend-
in-...](https://uxdesign.cc/neumorphism-will-not-be-a-huge-trend-
in-2020-67a8c35e52cc)

------
Noumenon72
This article uses the spellings "neuomorphic" and "Neuomorphism" in places,
which just highlights the fact that dropping the "o" was a mistake and
obscures the origins of the word.

~~~
nerfhammer
I thought for a second it was some sort of portmanteau of the German 'neu' and
Greek 'neo'

------
psweber
FWIW there is already some push back on this trend in design circles. I just
want buttons and form elements to look like you can interact with them again.

~~~
laserDinosaur
My personal pet-peeve is designers removing hyperlink underlines from
everything. You can never tell what is a link and what it just plain text,
sometimes hovering over it doesn't even activate any response. Links have
underlines for a reason dammit.

Even right now above this edit text box, all the links at the top of hacker
news (" psweber 8 minutes ago | parent | on: Neumorphism in User Interfaces ")
have their underlines removed. Some of that text is links, some of it is not.
How do you know which is which? Well you have to hover over them, one by one,
to figure it out. It's a weird design trend that became such an annoying
default rule.

~~~
a1369209993
> designers removing hyperlink underlines from everything

That's like getting mad at a high school student for sending a open letter to
parliament asking to made dictator and them saying yes. Designers shouldn't
even be in a position to make that decision in the first place and browsers
shouldn't listen if they do.

------
fit2rule
The designs in this article are elegant, and functional. I think the most
important lesson to be learned here is that you must think carefully about how
your GUI presents itself to the user, and service the needs of the user as
they go through the OOBE (i.e. first time user) stages ..

It is interesting to note also, that the rules exposed in this dialog are not
exclusive to the web and DOM ideology, nor also to native UI
abstraction/conformance. One could just as easily apply these principles to a
real-mode UI framework such as plain ol' SDL.

If neuomorphism persists, will it become platform independent, and thus erode
market-framework domination?

------
Zigurd
If you have safety, discoverability, and direct manipulation you have less of
a need to turn a small flat piece of glass into a simulation of a physical
control panel. Mobile device screens are a new medium. Do the things that free
you from pre-smartphone thinking. "Flat" isn't a goal. Neither is realism. You
can't wireframe direct manipulation (or even long-press, or multi-finger
touch). So it is underutilized.

------
thelazydogsback
I think WinAmp was the worst skeuomorphic offender - could look cool but
annoying to interact with. Apparent "WinAmp is back" is a thing...

~~~
Lammy
They might literally mean WinAmp is back in the sense that Radionomy acquired
it and restarted development.

------
drcongo
I recently bought a software synth [1] with a UI along these lines just
because I thought the UI was so pretty. It has a real Teenage Engineering [2]
look to it. I think a lot of the most interesting, useful and beautiful UI
work at the moment is happening in the iOS audio world, some of the soft
synths I use are stunning to look at and incredibly intuitive.

[1]
[https://klevgrand.se/products/hillman](https://klevgrand.se/products/hillman)
[2]
[https://teenage.engineering/products](https://teenage.engineering/products)

------
deltron3030
Biomorphism:
[https://en.wikipedia.org/wiki/Biomorphism](https://en.wikipedia.org/wiki/Biomorphism)

But yeah, why use an existing definition if you can reframe and score SEO
points..

~~~
jspash
1\. Biomorphism attempts to emulate nature. But "new"-morphism is just a
slight deviation from the existing trend that (some) people seem to like. In
my view it looks more like 70's sci-fi (or lo-fi if you're a hipster) which is
also quite trendy at the moment.

2\. There is no SEO benefit to a word that nobody is searching for. That is,
unless it catches on.

~~~
deltron3030
What makes 70's sci-fi stuff lo-fi are just the recording/production artifacts
of the time, the intention was hyper-modern, like you said, a deviation of the
mid century modern/flat UI trend.

Remove the lo-fi artifacts and the result is just hyper-modernism, created by
designers applying biomorphism while focusing more on shapes and depth.

Biomorphism is all about shapes and depth, and avoiding hard edges. It can
come in many forms, for example forms that stem from stones shaped by water
over millenia, caves that serve as inspiration for interiors, rounded
hexagonal patterns that are inspired honeycombs for example, like in the
Dribbble shot in the article.

Rectangular shapes in UI's are just a result of other shapes being unfeasible
at the moment, but it's still biomorph where possible.

------
m3kw9
This tells me Apple did a lot of research on usability edge cases before using
the flat look. This Neuomorphism thing needs some of that

------
mrhappyunhappy
So, bevel and emboss? What am I missing?

------
codesternews
Old is new again :D

------
buboard
oh cool, unfortunately in 6 years they ll be back to flat again

------
crimsonalucard
What about the older design flavors? Isomorphism use to be popular but was
replaced by epimorphism and a flavor of monomorphism. Bimorphism was sort of a
niche trend along with homomorphism and endomorphism. If you didn't notice all
these words are borrowed from concepts that already exist in math that are
over 3 decades old.

Maybe I should just stop making up garbage vocabulary for my design ideas.
Morphism is a well defined word in both math and computer science so if you
want to give a name to a new design follow your old trend of calling something
flat design or skeu design or neudesign rather then borrowing a word from a
field that has way more legitimacy then a design idea concocted up by some
designer last month.

~~~
stan_rogers
The Greek word for "shape" has had a longer history than computer science.
I'll grant you the use in mathematics, since it's difficult to talk about
geometry without talking about shape, so it's _highly_ likely that even people
like Thales were using it back in the day.

This is the same thing as people insisting that "theory" as used in science
has somehow been co-opted and misused by laypeople. The fact of the matter is
that a word that has had a common meaning for a very long time has been
narrowed and specialized in a specific field of endeavour, and that narrowed
meaning doesn't somehow invalidate the older meaning outside of the field.

~~~
crimsonalucard
Nobody uses the greek word anymore. It is therefore invalidated. Morphism is
currently used in things more fundamental than geometry, specifically category
theory. Look it up on wikipedia, it's official. This medium article is far
away from official.

What gets me is that some designer out of nowhere can repurpose the word
because it sounds cool. Seriously nuemorphism? This is the inception of a
buzzword, created literally for the purpose of "buzz."

I have a new word, it's called "buzzology." The science of stealing legitimate
words from academic fields and repurposing them to make your new "theory" or
"design" sound much cooler than just a drop shadow behind a box.

~~~
DonHopkins
Deepak Chopra's got you covered.

[https://rationalwiki.org/wiki/Quantum_woo](https://rationalwiki.org/wiki/Quantum_woo)

How about Quantumorphism? All of the buttons and labels have fuzzy blurry
edges, and you can't tell if something is a label or a button without touching
it, and the act of touching it changes it.

