12 ms·
Claymorphism: Will it stick around?
- deleted 5y ago[deleted]
- emptyparadise 5y agoI miss iOS 6.
- brimble 5y agoSame. 7 was a huge step back. They've improved it somewhat since then, but it's still worse, and now there are like 100 new secret gestures that I'm always accidentally triggering.
- hulitu 5y ago"Flat design and its more popular successor, Material design, have been dominating the web UI for quite some time, featuring a minimalistic aesthetic that eliminates visual clutter and favors user experience." Yeah. Unfortunately not everyone is masochistic enough to enjoy the Flat or Material design.
- KaiserPro 5y agoGoogle's Material Design is such a hostile system. "lets create action buttons well away from the action" "modal dialogues _must_ take over as much area as possible, regardless of triviality" For all the noise about research lead UX, it doesn't seem that people actually performed research on users, only other UX people.
- rjh29 5y agoThe problem with UX is every single UX designer thinks they intuitively know what is best for users when studies show that to be completely false. So Google are right to listen to research instead. No UX design can please everyone.
- ilrwbwrkhv 5y agoGoogle also has some of the worst UX I have ever used. The only good one and the last one was google search homepage.
- brimble 5y agoThis was a while ago (years), but for a time, in gmail, if you tried to add a contact the form had an "add contact" button at the bottom that submitted your form and added the contact, and another identical button to the top right that... reset the form without submitting it, because it meant "start a form to add a new contact". I watched my grandma struggle with it, which was fun. But hey, at least they can solve leetcode hard. More recently, I can confirm that material UI, especially when Google does it, confuses the absolute shit out of my parents.
- formerly_proven 5y agoYou can't tell me that the major design features of Material design are based on user research. I've seen so many people completely confused by these, even the most basic aspects, like input fields.
- ushakov 5y agosame thing with the Floating Action Button, i think they are the worst
- dmitriid 5y agoThey ended up doing a study for their text fields. The result was something anyone with a shred of common sense would've said and has said from the beginning https://medium.com/google-design/the-evolution-of-material-designs-text-fields-603688b3fe03 https://medium.com/google-design/the-evolution-of-material-d...
- rjh29 5y agoThat is a fair point. They may be using research now but I guess they didn't use proper UX principles when they started. I've noticed the Google Docs floating action button was semi-replaced with a regular 'new document' section at the top of the page.
- tempodox 5y ago“favors user experience” is such complete and utter BS, I cannot trust who writes stuff like that.
- aaaaaaaaata 5y agoUntil the next era of "super serious and not enough contrast" shows up. and so on
- KaiserPro 5y agoSweet, I can dust off my "script-fu" knowledge from 1999 and automate gimp to produce reverse-embossed buttons So long as people move away from having buttons that you have to click to work out what state they are in (i'm looking at you, instagram you dick) I'll be happy. Even if its ugly as shit.
- productceo 5y agoI wonder if there is a similar way to fix the accessibility issues of glassmorphism (same ones as described in the article with respect to neumorphism).
- andybak 5y agoThis is a lot of ink to spill for a small tweak to shading - and one that has been fairly common on and off over the years too. This style was the go to tutorial when Photoshop first added bevel and emboss as a one-shot feature. And it was a common look even before that thanks to Kai's Power Tips: https://photoshopnews.com/2005/04/08/kais-power-tips/ https://photoshopnews.com/2005/04/08/kais-power-tips/ Then we got sick of it and it went the same way as lens flare and animated gifs of dancing babies. A sign that someone was a noob and too unsophisticated to spot an overdone visual cliche.
- a9h74j 5y agoYes these claymorphic UIs appear childish, but the buttons are large enough to not present a choking hazard.
- ahartmetz 5y agoI don't like it much either, aesthetically, but you can kind of see where you can expect a click to trigger an action, so it has that going for it.
- fuzzy2 5y agoThanks, I hate it. But about the burger example: Would I buy a burger from the shop with the… extreme site? You bet. Would I buy a burger from the shop with the “modern” site? Less likely! If I had to guess why that is, then maybe it’s about the effort that went into designing the page. The first site may have shit UX, but it at least they went all out with the design. The second site may have better UX, but its design is a soulless husk. No quirks or anything, just 100% boring. I often miss the old times. The frozen food delivery service I use also had a re-design recently. The catalogue now looks like generic magazine movie prop. At least the new website isn’t as terrible.
- woolion 5y agoThis is a fairly common reaction, very similar to the debate surrounding Elden Ring's "outdated UI" to the uninspired, bland, extremely generic UI coming from "best practices". What is interesting is all the angry critics saying to people "you are not supposed to like that, it is bad and you should follow my theory".
- hoseja 5y agoSounds like modern architecture.
- Gigachad 5y agoI have also noticed that anyone who says they didn’t enjoy the game just gets ridiculed and told they just suck at playing games. I tried elden ring for 3 hours and hardly worked out what I was meant to be doing. Basically no guidance, UI didn’t really explain anything, etc. Went back to playing Skyrim.
- michaelcampbell 5y agoI want to like it, but am about the same. Even after a walkthrough on youtube to a boss that I just don't have the skills to even come close to beating... not my thing.
- 5y ago
- 0dayz 5y agoThis style reminds me of late 90s early 2000th website style with those very overly round corners.
- captainmuon 5y agoNeumorphism is just a style, not a complete design philosophy like skeumorphism, or the rejection of skeumorphism. It wouldn't even be compared to the two if its inventor didn't give it a clever name. It does look nice though, when not overdone. But Claymorphism? Sorry but it looks like the kind of buttons I made with the emboss effect in Paint Shop Pro in the 90s :-D. But it does give me nostalgia. I think there is a lot of knowledge of how to make these effects that gets lost and rediscovered periodically. Both web designers and desktop theme designers had a lot of tricks. For example, you can make something look concave or convex with a subtle gradient (like in neumorphism). Or, you can make a button look more realistic with a 1px grey shadow around, grounding it to the background (like buildings in a RTS game might have. Or, you can use a gradient with a step in the middle to simulate glossyness and get an "aqua" style. It might be a fun and useful project to collect this kind of knowledge.
- ushakov 5y agoi don’t think the case is that gradient buttons are lost knowledge the problem is it’s not fashionable anymore
- captainmuon 5y agoIt's more like: It is lost knowledge that these kind of gradients look garish and went out of fashion when we figured out how to make more subtle gradients. This is basically "programmer art". I think the lost knowledge is also for example how to make the corners less harsh, and how to add a certain physicality to the buttons.
- gedy 5y agoYes, these all seem like variations on adding different shadows to controls vs flat style. Neat, but not some design manifesto.
- redisman 5y agoHah exactly! This looks like my Quake clans site I made with notepad and Paint Shop Pro but with a better color palette and typography.
- duskwuff 5y ago> On Apple’s iPhone OS 1, the YouTube app icon is a television instead of the iconic logo we know today! Because that logo didn't exist yet! YouTube didn't start using their modern logo until 2017 -- before then, they were using a wordmark logo which wouldn't have made for a good icon.
- rwmj 5y agoCtrl F "testing", "usability" "a/b" etc shows nothing. Why isn't there a discussion about what's best for users?
- marginalia_nu 5y agoTo be fair, most designers who engage in these things draw a blank when you Ctrl F "experimental design", "effect size" and "statistical significance", without which any pretenses toward science is just that. Pretenses.
- mano78 5y agoI use the rather excellent (IMHO) Axentix CSS framework, and it has a few (optional) *morphisms. Worth a try, they are quite different. https://useaxentix.com/docs/getting-started/ https://useaxentix.com/docs/getting-started/ and choose "Trends" in the menu.
- twic 5y agoWe need a total and complete shutdown of web designers until we can figure out what is going on.
- bee_rider 5y agoIt is quite straightforward, everything was going fine and then somebody invented the GUI.
- deleted 5y ago[deleted]
- eternityforest 5y agoI think they are having a contest to see who can do the least design. But that sometimes gets too boring even for them, so they invent new crap to get around the ban on skeuomorphism. I wish they would just go back to skeu as practiced in the 90s to 2000s, just updated for the modern high res. WinXP and Win7 were great. Win2000 was perfectly fine by period standards.
- codeptualize 5y agoIs this really a trend? I'm getting very strong neumorphism vibes from it: A contrived trend that never really worked, looked outdated from the start, and never got main stream. The real vs Dribbble ratio of the examples in this post points in the same direction. I do think the 3d graphics are a trend, which fair enough have often a sort of clayish aesthetic, but I am very skeptical that will become a popular all encompassing UI style.
- stupidcar 5y agoYeah, I can't think of a single real app or website I've seen that uses this style. It seems instead like a single designer doing some self-promotion by inventing these new "trends". And this one seems to be inspired by cheap DVD menu screens from the 2000s.
- agumonkey 5y agoI thought it was over already. It's funny cause it was a fad in early 2000s when photoshop added procedural filters (shadows, inset, etc) so people used near the same ideas. Done well enough, clay can make for some nice children like UIs but it seems limited.
- codeptualize 5y agoBevel and emboss!!
- dgellow 5y agoI don’t believe neumorphism was ever supposed to be serious. From what I understood it is just something someone played with on dribble that became popular by accident. I may be wrong here.
- sime2009 5y agoWindows XP is back?
- butz 5y agoGood showcase of how far web (specifically CSS) has come. Back in the day we had to use images to achieve this kind of effect on websites. Otherwise it probably won't stick too long.
- mmhd 5y agoCal me old fashioned but this is the default bevel and emboss effect from photoshop 6.0
- ChrisMarshallNY 5y agoLooks a hell of a lot like Windows XP. One of my employees once remarked about Windows XP (when it was first introduced) as "Fisher-Price for Windows."
- throwaway81523 5y agoSite is down. Claymorphism = "Oh no, Mr. Sluggo is going to be mean to me!"?
- woolion 5y agoThis seems like Corporate Memphis absorbing all facets of design. I'm surprised to not find any mention of how infantilizing this is -- childish is absolutely inappropriate. I have always not cared too much about aesthetics for any product where use is the primary factor -- especially since in most cases you can easily customize digital products -- but this trend is really putting me off to the point where I won't use products from companies pushing such designs. To mention some of the most awfully repulsive, having to interact with Travis and MailChimp are always sure to trigger a physical disgust response, and checking Sentry, I was greeted by a similarly awful cartoonish homepage. I can't not think of "cynical company that will sell you to the highest bidder if they can wants to be your BFF, they'll even give you candy!".
- giffarage 5y agoWe need much, much more childish things in life, not fewer.
- hwers 5y agoI feel completely opposite, but I'm curious where you come from here? Could you say some words to explain what you mean?
- happymellon 5y agoI'm fine with my bank not acting childish. It doesn't invoke a feeling of trust, which is important with some of these companies.
- Enjaami 5y agoPerhaps you mean childlike, not childish?
- xboxnolifes 5y agoCould you define the two? Because as far as I can tell, most people (even ITT) just use "childish" to mean "things I don't like".
- 5y ago
- ushakov 5y agois there any company using Claymorphism today? is there any UI framework that is based on Claymorphism? all i've seen so far were bunch of designer-made concepts that never made it to real world
- thatjoeoverthr 5y agoCorporate Memphis is why David Icke’s lizard man theory feels plausible.
- leetrout 5y agoThis reminds me of nintendos styling although theirs has traditionally been glossy like the early web 2.0 designs used everywhere. I dont like it as it seems too playful and wouldnt be appropriate everywhere.
- rvieira 5y agoTurns out what I've been calling "Pocoyo design"[0] is actually called "Claymorphism"... [0] https://www.pocoyo.com/ https://www.pocoyo.com/
- trabant00 5y agoMaterial design, flat design, next_shitty_design and whatever else doesn't have clearly defined buttons with text labels suck usability wise. We've all know it, we all said it. But they are everywhere and I cannot explain away with just the usual "the crazy pretentious wannabe artists cabal has taken over". There must be more than that or it would have not be so successful in the market. I personally think the superficial users - which are the majority - are to blame. They require things that look in accordance to the most recent fashion and are willing to sacrifice usability and efficiency to get it. You can see this everywhere, clothes, cars, homes. Fashionable design sells more than almost anything. So I think the designers have no choice but to produce what sells.
- arcturus17 5y ago> Material design, flat design, next_shitty_design and whatever else doesn't have clearly defined buttons with text labels suck usability wise 90% of buttons in material and flat design have buttons with text labels, I really don't have a clue what you're talking about... There are good use cases for buttons without text labels... As I type this in the single space of the browser window I see: * Upvote arrows and minimize buttons in the HN UI * Refresh, back, forward, home, share, star in the Chrome UI * Close, minimize, maximize in the Mac window The UI would be absolutely atrocious if many of these were "defined buttons with text labels". Also none of these use novel design systems or semantics.
- lou1306 5y agoActually the iOS1 home screen is... Not as skeuomorphic as it could have been? The Telephone, Mail, and SMS icons are all highly stylized. Plus, all icons have that rounded square frame that makes absolute sense for a touch-based UI, but is not skeuomophic at all. Maybe there's a lesson here, like "don't overdo it"? Also, this neumorphism/claymorphism thing gives off some strong Windows XP Luna [1] vibes, maybe it should have been mentioned somewhere. [1] https://en.wikipedia.org/wiki/Windows_XP_visual_styles https://en.wikipedia.org/wiki/Windows_XP_visual_styles
- Jaruzel 5y agoIn my opinion the XP Zune theme was the best of the bunch. I used to use it by default on all my XP machines back in the day. If I could make Windows 10 look like XP I would in a heartbeat.
- igorstellar 5y agoYep, still missing classic theme. But Metro apps takeover made everything obsolete.
- evrydayhustling 5y agoI don't like Claymorphism, but really appreciated this article in naming a bunch of visual design styles that I stumbled over before. Can anyone recommend a good "reference atlas" with a broader range of GUI design styles and techniques?
- theandrewbailey 5y agoCheck out CARI. It's not GUI-design specific, but they do categorize a number of industry design styles going back to the 1960s, some of which encompass GUIs. https://cari.institute/aesthetics https://cari.institute/aesthetics
- evrydayhustling 5y agoThanks!
- AlexandrB 5y ago> Realistic and elaborate UI elements weren’t a good fit for websites that thrived on simplicity, clean layout, and straightforward usability. Additionally, as responsive web design grew in popularity and mobile performance became a concern, the visually rich and detailed graphics were being slowly phased out. This passage is laughable. Mobile performance is a "concern" only on the most abstract sense. In reality, mobile sites are filled to the brim with JS, trackers, and other bloat. I hardly think loading a few hundred KB of button graphics would make much of a difference.
- datavirtue 5y agoAll of these are just arbitrary, naieve design decisions that have been given names and substance posthumously. I don't feel that any of it is honest. Monkeys playing with infinite color choices because they can. There is nothing special or dignified in any of these "designs." Claymorphism doesn't exist. It will go completeyly unnoticed by the average internet traveler unless specifically asked for their opinion upon which point you will be bored out of your mind with their reply. They will barely notice it and forget about it just as quickly. The product of some overemployed artists at a corporation.
- tiborsaas 5y agoClaymorphism feels a lot like web design from 2000's :) These shadows and bevel styles were the go-to tutorials for Photoshop. At the same time, I could never get them to look right. Lucky for me, I've discovered that MM_showHideLayers does something interesting and I went down the programming side of things instead :)
- DonHopkins 5y agoThe original "Claymorphic" video game from 1990: TROG in PLAYmation TM ! https://en.wikipedia.org/wiki/Trog_(video_game) https://en.wikipedia.org/wiki/Trog_(video_game) https://www.youtube.com/watch?v=wHPjU7TZ73A https://www.youtube.com/watch?v=wHPjU7TZ73A Other Clay Animation Video Games: https://en.wikipedia.org/wiki/Category:Clay_animation_video_games https://en.wikipedia.org/wiki/Category:Clay_animation_video_... Armikrog, BoomBots, ClayFighter, ClayFighter 2: Judgment Clay, ClayFighter 63⅓, Claymates, The Dream Machine, Harley's Humongous Adventure, Hylics, The Neverhood, Platypus, Skullmonkeys, Trog.
- Snoozus 5y agoCan we please have Claymoremorphism?
- roywiggins 5y agoSo my takeaway is that after nearly two decades slumbering, the ol' bevel and emboss filter is finally back. Let's bring back shiny buttons next! https://tdarb.org/blog/aqua-ui-buttons.html https://tdarb.org/blog/aqua-ui-buttons.html
- igorstellar 5y agoThat is so nostalgic. Aero Glass and Aqua fall in very special time in our lives when technology was rapidly improving and becoming widespread.
- SjorsVG 5y agoI don't care for claymorphism at all. It does not look professional or interesting to me. It reminds me of The Sims.
- kaetemi 5y agoYep. Someone must have discovered the bevel and emboss function in Photoshop again.
- aaaaaaaaata 5y ago> It does not look professional or interesting to me. But can the user make it through the UI with less clunks?
- kaetemi 5y ago"Flat design [...] favors user experience." Hahahahahaha. No.
- brimble 5y agoModern UI is optimized for PowerPoint and for marketing page screenshots.
- stuart78 5y agoEesh, we've found a way to recreate default Powerpoint styles on web. Or is it The Sims 2? A small but important detail that is always off to me in these views is the use of white and black to create shadow and highlight. Real color os much subtler than this and simply dropping pure white or black on top of the base color rarely creates a realistic or attractive mix. The yellow box example in the article is the best example of black shadowing at its worst. A more realistic (and attractive) shadow effect could be achieved by understanding how the material would actually reflect light differently - there would be richer, deeper oranges, not just "grey orange".
- Nickersf 5y agoFor anyone who has been involved with web UI design and development since the 1990's this is a throwback.
- xwdv 5y agoOne thing I wish would become a trend is mainframe inspired UIs that have terminal like look and feel but with modern conveniences of clicking and dragging etc. Focused on efficiency and maximum data on screen. Not playful at all.
- renewiltord 5y agoI think any article on design can have its entire HN comment thread written by bots. Not even GPT3, maybe GPT2.
- phendrenad2 5y agoWoah woah woah. Before asking "will it last" let's ask "is anyone actually using it?" The answer seems to be false.