9 ms·
Do people actually like Material for browsers on desktops? I tried it - as it would be great to have an opinionated design language with good framework implemen
by TimMurnaghan 8y ago
Do people actually like Material for browsers on desktops?
I tried it - as it would be great to have an opinionated design language with good framework implementations but it seems to make the same mistake as Windows 8 in trying to treat everything like a phone.
That really isn't nice on a desktop.
- cpburns2009 8y agoI, for one, do not. Material Design, and the other flat themes are horrible on the web because they ignore established conventions and disregard affordance. Even on mobile I don't know what's click... tappable.
- briandear 8y agoThat is my biggest complaint with Material Design. It’s great if you already know what all the icons mean and what you are supposed to click. Apple design, by contrast is generally very obvious and instantly understandable. Look at the Apple Music app on iOS: pretty much every icon is labeled. You don’t have to guess where “My Library” is or fumble around trying to figure it out. Google Hangouts on the other hand.. I have used that thousands of times and still have a cognitive interruption every time I try to share screen, see the sidebar chat or any other common tasks. I frankly don’t understand the appeal of Material Design. If it came from anyone but Google, it wouldn’t be a thing except in the back alleys of Dribble. However, this dashboard project — thanks to whomever made it. It does look very nice — just not a fan of the typical Google design language because of serious usability flaws. This dashboard does seem to mitigate some of my main complaints (ambiguity and uncertainty.)
- jrs95 8y agoIf Apple had something for the web I'd almost certainly be using that instead. But in my case, I'm just trying to write JavaScript and avoid the other stuff as much as possible -- I'm more of a backend dev who's doing frontend work out of necessity. Material libraries (Angular Material, Material-UI, Vuetify, etc) have been great for me in that use case.
- vincentriemer 8y agoThere's nothing really stopping anyone from implementing the human interface guidelines into a UI library. I wonder what's keeping people from building one.
- briandear 8y agoI suck at front end design, but I personally would pay money for a Bootstrap-type setup based on Apple HIG. In my (admittedly biased) opinion, Apple Human Interface Guidelines seem like common sense. I am speaking from the perspective of someone who has a web application that has “normal” people as their primary user and thus have spent countless hours providing support for simple things that might seem obvious to the more technically literate. Let’s not insult users, but let’s not assume they’re all web natives either.
- briandear 8y agoWhy the hell does this get downvoted? It seems like it was a very valid opinion. Does anyone out there actually think Google Hangouts is a good design? Has anyone ever had to click something in a Google product to figure out what it actually does? Put Hangouts or even Gmail in front of a normal, non-tech user and watch them use it. It isn’t intuitive. Skeuomorphism was definitely overused, but the metaphor made products vastly more intuitive.
- skolemtotem 8y agoGmail is by far the most popular email service in the world. I assure you that plenty of "non-tech users" have no trouble using it. But while I, too, am sad that skeuomorphic design has been abandoned, Apple has abandoned it too.
- josteink 8y ago> Apple design, by contrast is generally very obvious and instantly understandable That’s only true if you’re already accustomed to how Apple does things. Consider the iPhone a perfect example: 300 different ways to single-click, double-click, triple-click(!), 3D-touch (whatever that is) and use random swiping gestures from all screen directions outside the screen, and different swiping gestures within the screen. Absolutely madness and probably makes at least 80% of the phone’s functionality completely undiscoverable and inaccessible unless you already know it is there. How is anyone supposed to know about all that? It breaks every design book’s rules by providing zero affordances. Nothing about this is obvious or intuitive. It’s all 100% learned behavior. And I say that as an iPhone owner.
- jrochkind1 8y agoDo you find Android better? I think it may be that "affordances" are hard on small touch screens. I mean, the "affordance" is that you can touch it, that's about it. Really, even on desktop, we know how to use it cause we've spent years learning how to use it. The first GUI's had _much_ simpler UX's with many fewer interaction modalities, cause it was hard enough to get people to learn those. (I remember classes on how to use a mouse -- it was not obvious). They got more complicated as generalized "society" learned to use the simple ones.
- AlfeG 8y agoMany Apple users wish there were "back" button in iOS. Right now back button in top left corner looks alien and ridiculous.
- baddox 8y ago> Absolutely madness and probably makes at least 80% of the phone’s functionality completely undiscoverable and inaccessible unless you already know it is there. Well, that can't be strictly true, since no one is born knowing these things, yet people do learn about them. I don't think it's crazy to expect people to desire to read a quick guide or watch a quick video about UI paradigms/tricks/shortcuts for what is likely to be one of the most complex and most frequently used electronic devices in their lives. I do agree that 3d touch is a bad idea, because there's no pattern to learn other than very specific per-application places it can be used. If there was some visible UI hint that an element was 3d touchable, perhaps I would be more of a fan. As for the double-click and triple-click stuff, I can't really think of that many examples on iPhone. I believe triple-clicking a physical button can be used to enable accessibility features? I think it's pretty acceptable to have accessibility features that drastically transform the phone's user experience fairly hidden, as long as they're well documented for the people who need them.
- skolemtotem 8y ago> Apple design, by contrast is very obvious. Surely this is a joke? The million different gestures are just the tip of the iceberg when it comes to Apple and interface discoverability.
- FireBeyond 8y ago> Apple design, by contrast is generally very obvious Hand an iPhone X to someone who is familiar with other iPhones, but not it. Watch their first frustrated attempts. Talk more about obvious design.
- gdubs 8y agoJeff Raskin has a great essay on why “intuitive” usually means “familiar”, and while we think something like the mouse is intuitive, people were baffled by it when it was first employed. [1] It’s a good read — one of my favorites on human computer interaction. 1: https://www.asktog.com/papers/raskinintuit.html https://www.asktog.com/papers/raskinintuit.html
- Benjamin_Dobell 8y agoI don't understand where the idea came from that Material Design is flat. It's just about the only design language out there that includes official guidelines specifically regarding elevation. https://material.io/design/environment/elevation.html https://material.io/design/environment/elevation.html
- cpburns2009 8y agoI suppose it's not completely flat because some elements have subtle shadows, and some weirdly raise when pressed. It was strongly influenced by the flat themes from Microsoft (Metro/Modern) and Apple. It's more minimalist with low contrast and gratuitous spacing.
- jrs95 8y agoI do and the development experience of working with something like Angular Material is pretty great. If you're building relatively simple interfaces it's not that bad. Most of what I do is data tables and CRUD, I just want nice and relatively well styled components that are also well integrated with my framework.
- Mister_Snuggles 8y agoOne of the banks I used "updated" their iOS app and used Material Design. It's infuriating. The thing that bothers me the most is the "switches" (3rd example here[0]). My first thought upon updating the app was "Why did they reinvent the toggle switch when iOS has a perfectly good one built in?" Being bothered by this is irrational, yet I'm bothered by it all the same. I also find the ripple effect[1] when pressing things to be infuriating. Just do the action I've asked, don't do this animation and delay the action by half a second. Again, this is somewhat irrational, but it still bothers me. Perhaps the thing that bugs me the most is that it feels like I have a really well-designed Android app on my phone. The problem though is that I have an iPhone. If I wanted to use Android apps, I would have bought an Android phone. [0] https://material.io/design/components/selection-controls.html https://material.io/design/components/selection-controls.htm... [1] https://material.io/design/interaction/states.html#pressed https://material.io/design/interaction/states.html#pressed
- bhauer 8y ago> I also find the ripple effect[1] when pressing things to be infuriating. Just do the action I've asked, don't do this animation and delay the action by half a second. Again, this is somewhat irrational, but it still bothers me. It is not irrational to want your device and the software you use on it to be as high-performance as possible. In my opinion, unless we're talking about a game, software should always avoid wasting the user's time, no matter how briefly. Of course, if an animation is playing while something else is happening, that is acceptable. But in many cases, applications wait for the animations to complete (because it's "only" 300 milliseconds) before proceeding with the requested action. Disrespecting the user's time is disrespecting the user, full stop.
- themarkn 8y agoFor me I'm ok with this in certain situations. If the time taken increases the clarity about what is going on or what has just happened (in the case of the ripple effect confirming a button was clicked or tapped), I don't find it disrespectful. I'm more irritated by flashes of loaders or messages that disappears before we can evaluate whether they are relevant. Different strokes, I guess.
- GordonS 8y agoI don't even like it on mobile, but it really is horrible on a desktop - it's just so flat and dull that my eyes are constantly hunting round for whatever I need next.
- kabes 8y agoMaterial forms (with the floating labels) are so unreadable if not all fields are filled in, just look at this mess: https://codepen.io/sebakerckhof/pen/aKGMWv https://codepen.io/sebakerckhof/pen/aKGMWv
- pjmlp 8y agoWell, Google is forcing it on ChromeOS users though.
- mcrider 8y agoI think its a well thought out design language, but anyone who thinks its anything but Google branding is deceiving themselves. I couldn't imagine using it for anything other than a proof of concept or internal tool.
- reaperducer 8y ago>well thought out design language I see it as less "well thought out" and more "designed into meaningless oblivion." I don't know anything about how Material was put together, but from an outsider's view it looks like something that came out of a committee of committees of committees.
- dnomad 8y agoI think in technology circles people just love to complain. They think it makes themselves look smart for some reason. Personally I'm a fan of MD and other minimalist styles. But it doesn't matter what technies think. What matters are the users. Google did extensive usability testing on MD but just to be sure we did our own testing because we weren't sure how it would go over in Asia and Google is less focused on the Asian markets. Turns out the users fucking love it. We're talking about a hugely positive response across the board: men, women, children, poor, rich, artists and police officers. Three most common comments: (1) clean like Apple! (2) it's cute, not too serious (c) it's simple, easy. Yes this is subjective. It's not even clear how a design language can be "easy" but that's what the users feel. Given that kind of feedback and considering all the hardwork Goog has already done it'd be crazy not to leverage it.
- reaperducer 8y agoThanks for the great reply. This is exactly the sort of information that I was looking for. Do you have a page or document you can link to for more information, or is this just internal meeting stuff?
- Silhouette 8y agoWere your user tests measuring perception or performance?
- vanadium 8y agoA consulting company I worked at a few years ago had an "Interactive" team whose "UX" designers used exclusively Material Design for everything. It was...something special. Everything was just sort of cobbled together with zero creativity about it.
- tga 8y agoConsistency is what draws me to material design, despite its usability shortcomings. Unless the goal is to create art, consistency is a great thing for both users, who can eventually learn what's going on, no matter how bad the metaphors, as for developers, who can grow beyond checkbox-of-the-week towards well tested patterns.
- deltron3030 8y agoDepends on the UI density/layout. The design language itself is actually very nice.
- samirillian 8y agoI hear this critique a lot but I don't often see alternative paradigms/examples offered. I don't think material design is very pretty either and I'm very interested in alternatives, if only I knew what they were!
- tomelders 8y agoThe alternative is to start with basic HTML UI. Almost no styling. And build from there. Understandably, few people like that advice because it doesn't make life easier. It does make your product better though, which is really all that matters.
- wuliwong 8y agoThere are definitely alternatives to material design that is not just un-styled HTML.
- tomelders 8y agoBut there's not alternative to starting from first principles. Material UI and all other Ui libs are a premature optimisation that will paint you into a corner.
- EugeneOZ 8y agoOr because just few people can call untouched HTML elements design "beautiful".
- reaperducer 8y agoMaterial a little Playskool for my tastes. But then I still think the original iPhone icons were awesome. Even the little television for the YouTube app. Back then, icons communicated far more information than most icons today, which have become little more than bland corporate logos.
- tomelders 8y agoDesign is hard and the value of it is difficult for most peolpe to quantify. So Material, and all other UI component libs, claim to offer an easy solution to a difficult, expensive, and seemlingly aestethic problem. They don't. And when something like this has a connection to a company like Google, people simply don't question it.
- reaperducer 8y ago>And when something like this has a connection to a company like Google, people simply don't question it. Yep. It's the "Nobody ever got fired for buying IBM" mentality that pervades the modern IT industry. You get one so-called "thought leader" to scribble a blog post about how skeuomorphism is a bad thing, and the next thing you know every screen looks like pastel confetti. I was reading an old computer magazine last night and one of the ads was for a 6809 box that had a red keyboard. RED! With white function keys and blue action keys! If anyone tried to produce a computer like that today, they'd be laughed right out of HN, even if there were a dozen studies backing the color scheme's utility. Until one day someone from Facebook or Big G or some random blogger with the correct Twitter followers says it's good. Then suddenly, it's red keyboards all around. Working in the IT industry, and knowing people who work in the fashion industry, you'd be surprised how alike the two camps are.
- j45 8y agoThe majority of the world is mobile-first. Material's desktop experience definitely needs to continue improving. I'm trying to see Material's design as how desktop users of the future might work, who grew up mobile-first, unlike most of today's desktop users who grew up in a desktop first world. Material has a number of headstarts a headstart due to it's "card" lineage coming from the designer of Palm, and WebOS. https://www.surfacemag.com/articles/matias-duarte-google-is-designing-our-lives/ https://www.surfacemag.com/articles/matias-duarte-google-is-...
- balladeer 8y agoAs a long time Android developer I find material design to be actually good, esp. since Google offers a lot of it out of the box for us. What I find disappointing is the world jumping on it and then clinging to it as if this is it and that's it. I have noticed a lot of apps have kind of stopped (not universally though) going for new, unique and innovative designs. Now the desktop browser web apps...
- otterlicious 8y agoDo people actually like Material for browsers on desktops? I like Home Assistant and don't hate the Google Cloud Console.
- manigandham 8y agoIt is absolutely horrendous. The Windows 8 debacle should've proven conclusively that a single UI doesn't work across all usage modes and the big chunky buttons that are useful on mobile are terribly slow and inefficient on large screens. It's rather amazing how little information can fit on a screen with these designs even with modern high-res 4k retina displays. It's a failure of following trendy UI instead of focusing on true UX.
- WhitneyLand 8y agoYou've probably noticed artists develop thousands and thousands of themes/mockups/designs for every possible use including admin. For example, https://themeforest.net/category/site-templates/admin-templates?rating_min=4#content https://themeforest.net/category/site-templates/admin-templa.... Would there be any practical way to provide them with some simple markup that allowed marking up their designs such that some sort of scaffolding tool could be used to convert it into a starter project for various frameworks/languages/etc? Yes some of them come with bootstrap or whatever framework files, but if it were generalized it would be possible create a configurator/generator/scaffolder that would allow many more options and combinations. It seems like Wix and SquareSpace have some sort of proprietary version of this. Where you pick a template, customize it, and then directly use it for development, but of course only using their tools, which as has been discussed here quickly run into limitations for non-trivial sites/apps. This is all off the cuff thinking, I haven't put much though into what potential markup or a DSL would look like. However, maybe even a small set of options available as an open standard could provide a great deal of flexibility and be easy to use for artists and designer who are not that technical. Maybe it could also be possible a start for an ecosystem of tooling to make use of it across a variety of development environments, not just "bootstrap and gulp included". If it's plausible, hasn't been done, and has enough interest I'd be willing to take a pass at a draft spec that could at least help people realize what not to do :).
- Theodores 8y agoJust had to reboot my computer for the first time in weeks due to running Chrome's Lighthouse audit on one of those awful themes. I was guessing '7%' performance rating but did not expect to have to reboot! If you run the same audit tools on any Wix website you can expect the same sort of nonsense, maybe a megabyte of scripts at the top, CSS where it runs to 10000 lines of which 97% unused, images flagged for being bloated. The newer thinking that I find most making sense is to not use any framework at all and to also ignore people using Opera Mini/Internet Explorer. Clearly Google and organisations like the BBC cannot dismiss those people and have to make their websites work on the legacy browsers too. But, if making money matters more than pandering for people that shouldn't be online then the no-framework option makes a lot of sense. No-framework is also getting a name as 'intrinsic web design' and the idea is to use built in things such as CSS Grid, Progressive Web App, HTML5 form validation and vanilla javascript to hold it all together. With this way of working you can make the document pure content with semantic tags, e.g. 'Article', 'Section', 'Main/Aside/Header/Footer/Nav' and dispense with the many, many, many nested divs and spans with everything having a gazillion class tags. Going for the 'perfect outline' can be done too with a few hundred CSS lines instead of the tens of thousands you get if using some lame framework. Building this way and using native browser features instead of the old cruft ways results in sites that load 10x quicker as you don't have the megabyte of scripts/stylesheets that the likes of Wix bloat sites with. The thing is that to do frontend this way requires throwing out all knowledge of 'floats', 'margin/padding hacks' and even that tedious design process where someone that can't code designs something in a desktop publishing type of program for it to be handed off to frontend developers that tinker with the bloated theme their CMS comes with to make it look like whatever the designer got signed off with the client (without speaking to them first). Even 'Responsive Web Design' is old hat, with CSS grid there is no need to think in those ways, you can make everything content driven with fluid typography plus a few CSS grid rules making it work whatever the screen size. In summary - forget about frameworks and enjoy the web as it should be.
- _diyu 8y agoSo I was actually just about to write a cross-platform app using https://material-ui.com/ https://material-ui.com/ purely because it is the most comprehensively fully developed and React-first toolkit for React out there. Plus it has 11k (edit: oh it's 37k, wow) stars on Github, more than twice as much as the next most starred React toolkit. Semantic and Bootstrap have been "ported" to React and are missing features or do things non-idiomatically, whereas MUI was built with React in mind (twice if you count the rewrite). There are other React-first toolkits but none are nearly as comprehensive and "healthy". But I've been on the fence because it feels really weird to write a cross-platform app (mobile and desktop) using components that are clearly designed to look like just one platform (Android). Technically I could make a custom theme for it, but that looks extremely complex, and OP's linked theme is practically the only free one I could find. I'd love to just abandon toolkits like this and write my own React components specific to my app, but honestly I don't know how to make half the stuff that's in these toolkits. My JS/CSS is just not that strong.
- serguzest 8y agoRemind you, most of those stars gained while it was still horrifically bad engineered react framework. It was one of the early in the game and gained popularity solely because of that and its hefty existence hurt the react ecosystem a lot. They just recently rewrote it. So, star count isn't a good measure.