Am I the only one who gets a headache trying to decipher tile layouts like this? My eyes bounce back and forth and I still have no idea how the information is structured or what's important.
I appreciate that Google is sharing all of this though.
I've had Androids since way back, and while the UI has continuously gotten prettier, it has gotten harder and harder to use.
I can 'feel' these new concepts as they roll them out, and then just get frustrated by them. It feels like they come up with certain standards/rules, and then have to adapt their UIs to it. So buttons are put in confusing places, with weird icons.
Take the phone dialer for instance. I press the phone icon. How do I get to a dial pad? Why didn't it just give me a damn dialpad to begin with? The dialpad button is a little blue square with dots in some kind of matrix that sort of looks like a dialpad. Every time - every time - I make a call, I have to go through this ritual again of figuring out where the dialpad is. Even though I know where it is, it doesn't look or feel right. And that's just the beginning. The whole dialing process, finding contacts, etc. has been totally broken. Just so the UI is pretty and meshes well with itself. And this is a phone!
Haha. I remember that. The hardest feature for me to figure out after getting my phone was how to actually call somebody. Also after installing skype I started getting popups when I would call about "Do you want to use your phone or skype to call?". Why do I have to click so much to make a call I kept asking myself?
Then I figured out the double tap on the home key and "Hi Galaxy" and my life changed forever. I use it waaaayyy more than I've seen anyone I know using Siri. The only annoying thing now is when I disable gps and then try to use maps from voice while driving things get wonky because I'm driving, trying to enable GPS, and trying to deal with maps popups telling me gps isn't on and whatnot. I just forget to re-enable it before I drive somewhere so it happens quite a bit.
I also actually sat down and read the manual for the phone and looked up tips and tricks online. Really studied it as opposed to just expecting to "get it out of the box". I know the whole "It just works" mantra is great, but if you're willing to spend a little time reading and researching you can have a great mobile experience instead of just blindly ignoring things that don't appear to immediately work/make sense.
In a nutshell, they really are little computers now, and putting in the time to learn it well will open up doors for you.
On the other hand, a dialpad takes up a lot of room, and for many cell users, the common case is calling a contact, not dialing a number. The only time I ever use the dialpad is for "press N to Do a Thing" interfaces, such as my voicemail (which automatically opens the dialpad for exactly that reason) or my employer's conference-call system.
gosh, i could go on and on about the phone dialer.
What is the most frustrating thing about it is the "hang-up" button is a gigantic red button and right below it are the really minute buttons to fire up the dialpad, mute, conference, contacts, etc. Yep, what are the chances you will accidentally hang up while trying to find the dialpad or quickly mute your conversation.
So true. People seem to forget that the reason we went with fake 3d UI in the first place was because people were having trouble with the previously-obtaining flat design. For a while, there was a nice simple visual grammar that told you what was editable, what was functional, and what was structural. Now I feel like we're falling back in the days of early Sierra videogames where some puzzles just required you to keep clicking around the screen until you found the invisible path. Skeumorphism was out of control but the trend has gone too far in the opposite direction, to the point where 'beautiful' has been turned into an empty marketing buzzword - it's now a synonym for obscurantists minimalism.
The new Azure portal looks very similar and it's borderline unusable. Unless I'm just resistant to change and will eventually warm up to it but it seems to violate a lot of fundamental design principles.
Kinda of topic but from the PoV of a third-party developper who had to test a lot of workflows in this new Azure portal: it's indeed a nightmare.
Why do I have to click so many times and watch so many panel opening/closing animations before getting to basic features?
Also closing 5 panels before opening a new one feels like a huge waste of time.
I can assure you, it's not just you. To me, this is more of an artistic style than a design. A designer needs to communicate usability to the user. You need to know what's a button and what's not. You need to know the borders. And you need to be able to look at the interface without it causing undue strain (this is the part that google got wrong- bright colors are an easy way to make something look fresh but they increase eye strain.)
The impact isn't so bad, though because once you get past this style into an app you're looking at a mostly white screen with color for the buttons and the buttons are well placed in standard places most of the time so you can know they are buttons.
Exactly. This style just screams Windows 8 MS Surface design, and it's popping up all over. I think designers are having trouble blending "touchable" with "informative". The emphasis seems to be on touchable from the ground up now.
Also material design is not a safe guard for implementing crap user interfaces. In this case, if you decide to have moving tiles that disorientate the user and think 'well its material design', no that's actually just poor design.
I actually like that homepage. It seems like a nice alternative to tabs, especially if they put useful information in the collapsed tiles (essentially becoming Windows Live Tiles or whatever they're called).
It might look kind of cool at first, but it puts additional barriers in between the user and actually doing something useful like entering data in a form, booking a flight, etc.
For example, if I haven't been to the site before, I might have to explore the interface a bit before I get to the part of the interface I want. Clicking on those tiles makes things shift and bounce around, the content portion of the screen constantly moves left to right.
Way too much difficulty for doing something so simple.
Designs should be visually appeasing, but not at the expense of ease of use or ease of understanding.
Do you have a link to that guideline? I know there are a bunch about allowing users to override whatever the webdesigner specifies, and about having sensible contrast.
WCAG 2.0 level AA requires a contrast ratio of 4.5:1 for normal text (14 point and bold or larger) and 3:1 for large text (18 point or larger). Level AAA requires a contrast ratio of 7:1 for normal text and 4.5:1 for large text.
There is something about the search form I can't put my finger on - not enough contrast or dimensionality? Anyway, it didn't jump out as a "put your details here and press search" action, and my eyes kinda glossed over it while looking over the page.
Back button doesn't work right on that site. It gets you back to the top of previous page, it doesn't take you down where you were on the page. I love modern web UX.
Middle clicks on links are also pretty broken. Sometimes they do open the link in a new tab, something they open the link in the same tab, sometimes they do nothing.
As someone who use mainly workstations with a at-least-three-buttons mouse, I feel web browsing is getting increasingly annoying.
Agreed, I'm not sure why Google is assuming everyone browsing their site will do so on mobile devices. Overriding the right/middle-click is hardly ever good UX design, and I'm wondering how they even managed to make it so inconsistent across tiles.
It's not just the layout, the terminology is based on presumed knowledge.
The second panel of information is a video covering "color theory" and goes off almost straight away talking about using "the 500s" and moving to "the 700s". I've no clue what this means. What is a 700?
Strangely a google search yields no results as to what this means, but the video takes it as fact I should know what it's on about.
They're referring to Pantone series 500 and 700 colors.[1] Obviously, you're expected to understand the Pantone Color System.
There's a whole color industry, and a trade organization for it, the Color Association of the United States. They're not as influential as they used to be, but they still orchestrate, among other things, the cycle of consumer electronics from white to black to off-white to grey and back to white again.
(You thought that just happened by accident?) The Material Design people are trying to promote that concept for web sites, so last year's web sites will look dated as the recommended colors change.
Extensive user testing has shown that the "headache" you're experiencing is actually from a rush of incredible clarity and intuitiveness with this new design! :-P
That's exactly what people said with their "Designed for IE" websites back during 2000 to 2004.
Whatever happened to coding according to web standards? This isn't a small boutique shop that cannot afford testing, this is a huge multinational company.
Yes, but that is based on Chromium, so it really isn't Opera. I assumed you meant "classic" Opera, since I would assume that the Chromium-based product would render sites equivalently to Chromium.
Its probably designed for a phone/tablet audience, and that's where material design shines. Porting it to the desktop web doesn't produce the same results because you're not 'touching' the screen.
I have an older version of FF and I only got to see a (britghish) blue screen, with nothing on it. I guess that's what they call minimal design nowadays.
The design gives no indication of what's clickable. Reminds me of those Flash games where you frantically click on things trying to find out what does something. Except now, everything is a flat-shaded rectangle.
The input side seems confused. In their guidelines, they talk about buttons having a drop shadow, and less shadow when depressed.[1] Fine. But not all buttons have a shadow, and not all objects with a shadow are clickable. On interaction, they write "What will happen if I touch this screen? And then this icon?"[2] That's a game-like interface. It might be tolerable if there was an standard, easy way to undo whatever you just did. There's no sign of that in the guidelines.
There are 84 standard input icons.[3] But no icon dictionary. Help text is so last-cen. You're supposed to know.
When they finally get to "Buttons"[4], they have a reasonable set of controls. However, one of them is plain text, with no indication that it is clickable. That contradicts their principles of material design. If they're going to have all this pseudo-3D, it ought to be used for all things which behave differently from their surroundings. But no. Google does suggest the use of a distinctive floating action button for "promoted actions" (i.e. "Buy").
The output effects are pretty, but that's all this is. Pretty. It's all output-side. There's no innovation on the input side. It's what you get when you put graphic designers in charge of a user interface.
> It's what you get when you put graphic designers in charge of a user interface.
You're wrong. That's what you get when engineering-companies start to care about design: they think design means decoration and don't focus on how it works, just on how it looks. A real graphic designer would know better than to fiddle around rippling effects when real issues are at stake.
Yes, all these people talking as if there was a UI revolution going on. Nothing in this video convinces me that materials design solves any problem. Heck, they do not even identify a problem that it could solve. All we get is dropshadows (which were already lame in the 90ies) and fluffy designer bla bla.
- When Apple talks about design, they do talk about design;
- When Google talks about design, they talk about swishing, swirling, rippling effects and all that jazz. Not design, basically.
Again, this is mistaking design for decoration. And this is something that engineering-driven companies typically do, when they try to say out loud that they care about design (or, in reality, when they try to look cool and fashionable/hip/whatever).
It seemed worse to me. At least after watching Jony Ive talk about the "genius" of his design, I feel like I know what problem they're trying to solve and what they're doing to solve it. This video just seemed like a joke and the only real takeaway I have is that drop shadows are back for some reason.
I can't tell if it's a 'grass is greener' thing, but after buying a Moto G in order to enjoy Lollipop/Material thinking the iOS flat redesign was lame. After a year of usage, I think lollipop isn't an improvement over KitKat, and worse than iOS (I do believe Apple knows some dark magic when it comes to user interfaces desktop or mobile).
More and more I'm thinking there are 3 levels of usage for a mobile device.
- Fixed and instant: calling/answering/taking a picture
- Semi instant: finding directions (often less urgent than the previous)
- Complex: browsing, reading
the ~iPhone displaced the first level, which was the norm of dumbphone, fixed hardware interfaces. More and more OSes are aiming at making everything as the third. I can't get the lollipop phone interface in my mind, I'm even jealous of my mother's Bada based samsung.
The most iconic feature of "material design" to me is the "create" button in the lower right-hand corner. Except if you're in landscape in, say, Gmail, it's in the center bottom since it's a part of the message list.
Can someone explain why a create button is given this privileged and inconsistent position instead of being in a menubar like every other button in every app ever?
This thing is infuriating, I never remember how to create a new file in Google Drive now (it's the bottom right FAB located at a place yet unexplored in every desktop UI ever).
as you can see, "new" is in the same place its always been. No FAB.
EDIT: in retrospect, you might be talking about the docs site. (docs.google.com rather then drive.google.com) I spose the only thing I have to say about that is that no design guidelines are a magic bullet, and that I have no idea why they even have that separate docs site.
I always go into a previously created sheet or document and press create new. I really could not find it until I complained to a colleague and he told me
I'm also wondering the same thing. This new trend of putting a create button in the bottom right of the screen seems counter intuitive and annoying. Fortunately, both the Mint and Reddit apps allow it to be turned off, but I'm not looking forward to seeing this spread to other applications.
The Floating Action Button or FAB is supposed to be more than just a single action, usually it's a menu of the most used actions (in Google Inbox for example it allows you to compose an email, invite others, add a reminder and lists your most recent contacts.)
Its probably in the same group because A) they want people to invite others and keeping it there helps people remember they can and B) its pretty much the same class of action as sending an email.
the yellow button at the very bottom is invite. Its hardly obnoxious, I can just continue to click and I don't have to think about it at all most of the time. (the top three are my three most frequent contacts)
Material design doesn't scale up very well. On desktop we end up with huge flat areas or chunky images stretched beyond their size.
Massive scaled chunks. Even on mobile it's just a stack of coloured boxes.
I like some aspects of material design like the paper philosophy, the fine shadows, buttons, and other things that do well on mobile. But more work is needed to improve the desktop interface.
Remember seeing iPhone apps scaled up to iPad screen size? That's how a lot of websites look now on desktop screens.
It doesn't scale down well either, on mobile everything is too spaced out so the information density is terrible. The calendar app on android is a farce.
They've also released the 'improved' notes app, you now have to press buttons twice just to add a note, it's frustrating and totally idiotic. A hard to use notes app, great job Material.
Could be just poor implementation for those apps of material design - which you'd hope is fundamentally good at heart.
It does seem fairly casual. Even the Google designers in the video weren't unified in a definition, so it sounds open and unconstrained. Although I wouldn't put it past Google to hide an on-brand agenda right there in the colour theories. One thing I'd move away from is the obsession/requirement of bright colours. Muted earthy colours would work well too in the right combinations for maximum emotional effect on unsuspecting visitors!
Not really, like mentioned elsewhere in the thread the add button in the bottom right is supposed to be a menu instead of an action.
That means in Material there is no way to do the most common actions if you use that as designed. Like the mail app I am using at the moment has made that button both "reply" and "fwd" when you're in an email, which is frustrating as hell when 95% of the time I want to reply.
But if they just made it reply, where do they put fwd?
EDIT: Ahh, you're talking about the transition from the homepage to the video page. I spent most of my time watching on the individual video pages, so I didn't really notice this interaction TBH.
For strange reasons I am getting the same vibe I got when I was viewing Google's Wave promotion, as if Google had uncovered the best thing ever. Everyone at Google seems super excited about their new things. I suppose when they're in their own little silo universe everything seems exciting and right.
Again I am only speaking about the feeling I got after watching the promotion video.
You are totally right. I would just add that the meme "designers are rockstars and vital to the information age" doesn't originate from Google. It originated from designers themselves. The designers have now fully infected Google... None of these problems are new. People have now contemplated them for an entire generation in science fiction books and movies, video game interfaces, CAD interfaces, music instrument interfaces, art, Xerox, Media Lab, etc.
Really though, animated interfaces are a short-term fad which is subject to boom and bust cycles just like 90s icons graduated to high-res icons and then back to microsoft tile icons. When peoples' hardware can no longer handle the animations and they learn to associate animation with skipped frames, impeded workflow, etc., the cycle will revert itself.
Visual feedback from user actions is a good idea, provided that 1) it happens every time, and 2) it happens right now every time, even if it takes time for the action to complete. Not seeing that mandated.
Our design team is trying to use Material guidelines in an upcoming app. I needed to remind them that while there are good elements in the guidelines, there is a lot that isn't good and they need to leave those parts behind. This certainly reinforces that feeling for me.
lol, downvoted for expressing anti-Material sentiment.
Google design guidelines as put in place by Google are hit-or-miss. Just look at switching between accounts on say, Google Analytics. Multiple view refreshes and double the user actions to do what once could be done from the same view with a click to logout and a click to login followed by typing your credentials.
Idk but I'm not the biggest an of the implementation of Material Design. I like the principles but some of the elements are just really ugly–i.e. the huge heroes.
The first time I saw material design, I thought it's a cool concept. I liked it. I also liked applications built with this concept. At first, those apps looked...different. After several months, today, when I see anything designed with a material design idea behind it, I have a strange feeling. All the material applications/websites look like they were designed by the same designer. Imagine there are 10 websites and only one of them is designed with material concept. How hard would it be to find this 1 out of 10? It seems a fairly simple task to me. I'm not a designer, but I never had exactly the same feeling before (i.e. surfing through thousands of flat web sites). I'm not sure if I want to see thousands of material websites. Does anyone else experience the same?
I think that's the point of material design. It's the design equivalent of egoless programming. You should not be able to tell who wrote/designed something if it is done properly.
It's also hugely beneficial for Google if all apps/sites get sucked into looking the same, so their platform becomes a platform, rather than a gateway to individual companies.
Beneficial for them, and dangerous for others I fear.
My own jazzy interpretation of this is that it means something like responsive design by constraint. Think struts and springs and juicy animations sensitive to user-controlled context and the viewport. So an edit button may rarely be in exactly the same place at the same time, given scrolling and device and window size differences, but rather appears, animates, and settles according to a script.
No fixed / hard-coded information; everything reacts adapts, is fluid, interacts with other parts. Compared to how things were done in the past it seems improvised and free. Not far from jazz.
My objection is the conflation of [sloppy <---> precise] with [improvised <---> specified]. In reality they're more or less orthogonal qualities; Elvin Jones, for example, is about as close to a musical equivalent of "controlling every pixel" as I can imagine.
I guess jazz is too fuzzy, I heard Miles Davis never played the same note twice, not sure if conscious or not. Roy Haynes says he's not a metronome and everything flows with almost no structure.
All in all, it's hard to say if it's controlled or not. These guys have highly refined skills, even when they change course almost randomly, they know how to bend time and harmony, nothing is random.
Is this the Design world's equivalent of the Engineering world's 'over-engineered' syndrom? I appreciate that these people are trying to innovate, but it`s almost like they are Designing as for design's sake ... Hope I don't come off as too negative.
I preferred the iOS1-6 Design and the Win95-Win7 Design. Though Material Design as in Android 5 is very nice. One cannot compare it to Metro of Win8 with its distasteful colors.
Wow that's bad. That's like microsoft bad. Which, is actually fairly insightful; is that what happens when an organization gets too big, they lose sight of what's actually good anymore and just do design by committee?
Also, it's as if... there is only one design. Like, they figured everything out for you and you should just use that. Bootstrap is not so different in this, but i get the vibe that this isn't so meant to be tweaked; that's the air I get about it at least. That what's there is what you should use. Which, is really arrogant, because it googlfies the web, and by no means for the better.
But really, I don't know what they're thinking, and I hope this doesn't become more of a thing; but they only seem to keep pedaling it.
It's not even design by committee, it's design by clique. It's the Project Runway of UI design.
At least in the video, nobody is talking about metrics or testing or any practical consideration. In fact one of the designers says they "are used to working more practically. This is the first time where we're being pushed and told, 'don't worry about that'". Yes, don't worry about practicality...
Another says it "is a way for designers to get what they want. [laugh]"
Google and Apple have both been trolled by the critics of so called skeuomorphism.
While leather binders and bookshelves are excessive, Apple's pre-flat iOS design was really good, and all the criticism that lead to flat/material design was unjustified.
I hate how the little 'action dot' or whatever they call it moves around. On their colour palette video[1] you can see it sliding all over the place depending on the screen size. Why can't it just go in the top right like it always has been, instead of playing a game of 'hunt the dot'? I always have to remember to look at the bottom of my diary on my phone to add a new entry now which is pretty unintuitive for me :-(
It seems to be rendering at 60 fps without dropping frames on my old laptop, using Chrome.
It's still not worth seeing, though, other than as a warning about what can happen if you think adding graphical features is more important than solving problems.
Scolling is smooth in IE on a Surface Pro 3, but not in Firefox. That's pretty typical.
What's unusual is that it's visibly janky in Firefox on this desktop with an i7 and a Quadro FX 580. Sure, it's not a brand new workstation, but it should be able to scroll a webpage...
Unfortunately, since the w3c standards don't include any constraints for performance, it's entirely possible Google's code is optimized for Chrome and iOS and not (yet?) Firefox.
You sound just like all of my feature-creepy enterprise customers. Yeah dude, looks nice, but it's not snappy. Make it so it's snappy. Or no money for you.
It's more that if you have a site that's designed to showcase how good your company is at designing websites, and the site doesn't run well on a high end laptop, then it doesn't say much for your design, as it suggests you emphasise form over functionality.
Yes! Of course that's your point and I agree because the whole idea of this design concept was for Google to show us how much they care about usability and they somewhat failed at that if you had that experience. It was more of a joke from a grumpy old man who had flashbacks from scary moments where deals where made with much money involved and where the specifications changed daily.
I'm using the HTC One (M7 a few years old) with Android 5.0. I am a lover of Android and material design. Unlike a lot of people here, I've found the overall UX / usability to be very intuitive and easy to use.
One aspect of the new design I really like is native sharing. With as little as two taps, I can share any photo, video, selected text or other media to almost any other app (text, gmail etc) with ease.
I am not a huge fan of 'tiled layouts' but I also don't feel as though it is as tiled focused as Microsoft or others.
I appreciate material's approach to replicating real world physics look. I'm curious though what other designs could be very productive even if they aren't intuitive out of the box and require some training to use them. Interfaces like the command line, APIs, text and even human languages require significant time to learn but they are worth the effort as they allow us to express an incredible range of concepts succinctly.
IMO Material Design is going to have the same problem as Bootstrap. There will be so many apps and websites with that look and feel that the spec will become boring in no time.
For a serious app I'd never use plain MD, the same way I never use plain bootstrap. Each web/app experience should have its own identity. When everything looks and feels the same way, the "wow factor" disappears.
I enjoy material design a lot on my Android phone and in the Inbox web app.
Other than that, I find that it can be really overwhelming, as is the case here. I think it's a problem of constraint. The animations are just so heavy. And everything feels large, including the drop shadows. I actually experience some minor sense of "claustrophobia" on pages like this.
It can be learned, by the same techniques you use to learn system internals: You can first do a quick scout for the big items (e.g. grid systems, typography instead of data structures, algorithms) so that you get the big picture, and then study designs that you like for the details of how they used these items together (like how you study frameworks, libraries or OSs)
But ultimately the pixels are colored, are they not? To me this reads as a way to acceptably talk about degrading designers...
"Well we aren't employing those pesky 'Pixel Pushers' anymore. No. We are moving towards a jazz inspired design, it's more important and sophisticated than just coloring pixels"
Please. Give it a rest.
(^ In case it needs to be pointed out that's not an actual quote from anything anyone said.)
There's no better case for Google putting zero thought into design than this new website.
Hover the search icon and you have the grid you wish.
I would also do the same thing, isn't because a thing is hidden or need a gesture/action (in this case, the hover status), that the thing doesn't need to be in the grid.
That's not a very graceful way of handling that though. I'm not saying it's not ok to break the grid, but at least make it logical. The element isn't even visible without interaction.
Did Google fire their UI and UX team? Wow. Is this Web 3.0 - the final chukkah for full-on awful craptastic interfaces that finally drive us back to lean text sites?
Isn't 'Google Design' a bit of an oxymoron to begin with?
I mean isn't their entire hiring process designed to weed out people whose strength is design, to the point where now when they need to compete on design they go out and spend $20 million to acquihire a team ala Sparrow or get a big name like Duarte.
People laughed at Marissa choosing fonts at Yahoo but forget that she was the only person holding down the design fort at Google and was undervalued and passed over.
Google's only design philosophy is to arrange content in a way that maximizes the profit. If on top of that you can make it look good, cool. If not... ¯\_(ツ)_/¯
Your opinion is a data point, I'm not arguing against you below, because that would be futile- your opinion is a fact of how things are from your perspective.
Amazing to have gone from the one and only minimalist design company, standing out dramatically as a result to "pretty generic" in the perception of someone I'm guessing is under 30?
The interesting thing is, nobody, nowhere seems to be doing things as purely as Apple in terms of design, including their website...yet from your perspective you it seems generic, which means you feel like you see it everywhere.
Don't be so hard on them, they've done a fantastic job. Material design is a purely graphic framework, not a way to decide which feature is going where (which googles still desesperately sucks at).
The guys that created material design should be put in charge much more, because they're obviously the only one that have a true vision for that company. To me, that reflection should have been made on the very first iteration of android. Much like microsoft went with tiles, and ios initialy went with skueumorphics ui.
Exactly! And, as such, they should advertise it as it is. Merely graphical stuff, not an UI revolution, not better usability nor UX (where are the tests saying so?). I wish they just admit that they're trying to make something which looks cool (nothing wrong with that), not necessarily better UX-wise.
I appreciate that Google is sharing all of this though.