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.htm...
[1] https://material.io/design/interaction/states.html#pressed
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.
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.
I don't think material design is very pretty either and I'm very interested in alternatives, if only I knew what they were!
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.
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.
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.
So, star count isn't a good measure.
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.)
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 :).
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.
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-...
They don't. 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.
It was...something special. Everything was just sort of cobbled together with zero creativity about it.
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.
Now the desktop browser web apps...
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.
I like Home Assistant and don't hate the Google Cloud Console.
Actions shouldn't wait on animations ever.
I have the feeling mostly Google employees are running around telling the world how slow their pages are.
Once I've got decent form styles and a navbar I find that most of the rest is either very simple, or very application specific.
Widgets are cool, but mostly we need tables and forms.
This (though I agree with sibling comment about a few more being useful).
I reviewed 20 popular admin themes last month for our startup, and was v disappointed with them. Either due to code quality, or throwing in loads of useless widgets which are more consumer rather than business oriented.
There's a gap for a theme that's more like Stripe's dashboard, not these heavy-left-hand-menu dashboard themes. Or something like VMWare's Clarity Design System (https://vmware.github.io/clarity/)
Something corporate.
We're currently using Looper[0], but even that is a little too opinionated and visually "heavy" for business apps where productivity and clarity are paramount.
[0] https://themes.getbootstrap.com/product/looper-responsive-ad...
The segments and categories sections have a more sane design for an Admin.
Information density suffers, scannability goes out the door!
I'm just trying to use the smart people on Hacker News to help me with my issue! :-P
Big shout out to Ngx-Admin as well. https://github.com/akveo/ngx-admin
Probably easy to fix. Otherwise this is pretty cool looking.
I noticed when tabbing through the dashboard that many of the elements have disabled focus styles. This can make the dashboard less accessible to users who need visual indication of what element is focused. Would you consider including focus styles on the non-form elements?
1. Acknowledge the positives.
2. Acknowledge the effort/work put in.
3. Introduce your idea as something to consider, with the knowledge that they may have already considered it, and have a good reason for going a different direction.
Kudos!
* colors are too bright and saturated
* Low text-vs-background contrast: white letters on bright yellow-orange for example
* Font strokes are way too thin which is especially bad compounded with dark-ish gray on light-ish gray low contrast (see above)
I would prefer something like [1] (not ideal, but found this just after 5 seconds of googling)
[1] https://p.w3layouts.com/demos_new/template_demo/06-01-2018/g...
Someone really needs to make a search engine for components -- React, Vue, Mithril and a few other frameworks out there are making it so easy to build and share small isolated pieces of functionality but I still don't know of a site where I can easily search for components.
I thought it's due to React, but after Googling "react material UI slow" I found that it's the problem with the UI framework. Don't get me wrong, I like the design, I just regretful of not testing it on my phone much earlier.
Maybe it's semantics, but I see the "feel" of admin pop up on many / most evolved consumer applications (e.g. GMail, Kayak, Reddit, Feedly, etc.).
https://en.wikipedia.org/wiki/Principle_of_least_astonishmen...
And I would not be so quick to pat Apple on the back, as I feel they have on gone backwards vis a vis the above principle when they largely abandonded skeuomorphism.
1: https://demos.creative-tim.com/material-dashboard/examples/i...
Are they easy to work with? Adjust to your own circumstances?
I ask because, while easy on the eyes, they strike me as somewhat complicated and you wonder if you'd be better off starting from scratch or something simpler.
-design is inheriently unique. You want your brand and your site to standout from the rest. A one size fits all design methology actually goes against design. A design framework for the web is like saying all stores should look the same. Even restaurants dont look the same and they are in the same usecase. Design matters and cannont be churned out like a factory product (or good design at least). There are 2 80/20 rules here. You can get 80% of your good design by adhering to 20% of the standards, yet its the last 20% of good design that makes your site stand out and the first 80% is just basic usability.
-dashboards are purely functional and not user facing (at least the admin dashboards I hope this framework is talking about). This is a great place to use a standard framework and get all the reuse out of it so you can focus on making your user facing site unique
On the Material-UI website it shows CreativeTim (the creators of Material Dashboard) as being a major contributor, additionally there is a Material Dashboard "Premium Theme" for Material-UI that's created by CreativeTim. In the MaterialUI site's thumbnail comments it says created with MaterialUI, but on the MaterialDashboard site it does not say this.
Very confusing. did CreativeTim move away from MaterialUI to a bootstrap4 foundation? or something else?
not a fan of Material tho, victim of Google's success really.