Google Design
google.com
google.com
I appreciate that Google is sharing all of this though.
It it a button? Or a dialog box? Maybe it's an ad. Flip a coin!
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.
Also closing 5 panels before opening a new one feels like a huge waste of time.
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.
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.
For example: why is that credit card ad hanging off the center tile like that? Why isn't it shaped like the other tiles?
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.
Now, if it didn't work in Firefox or IE11, then that would be significantly more questionable.
Edit: I'm assuming we're talking about classic Opera, not the Chromium build that is currently called Opera but is actually Chromium.
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.
Hardly. Mozilla/Gecko may have been obscure at the time, but it was under active development. Opera is very definitely dead.
> Whatever happened to coding according to web standards?
So by "web standards" do you mean "older web standards supported by an outdated browser"?
Firefox had about 3% share at the end of 2004, even less before that.
>Opera is very definitely dead
Huh what? Opera is still under active development.
http://blogs.opera.com/desktop/
>So by "web standards" do you mean "older web standards supported by an outdated browser"?
No, I mean current web standards.
And this website reliably crashes Google's own Chrome[1] on iOS on an iPhone 4s. It's fucking stupid that we've gone so far backwards with web design.
(Firefox & Chromium. )
As someone who use mainly workstations with a at-least-three-buttons mouse, I feel web browsing is getting increasingly annoying.
I'm not a fan of Material design though, I just think it's tacky.
Polymer is just a library to help you make Web Components. They don't have to be Material Design.
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!
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.
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.
that in a nutshell, is how I feel about Microsoft Office.
I am not sure if its a side effect of designers getting carried away but I find most of the web animations useless.
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.
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.
[1] http://www.pantone.com/pages/pantone/color_xref.aspx [2] http://www.colorassociation.com
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.
[1] https://www.google.com/design/spec/what-is-material/elevatio... [2] https://www.google.com/design/spec/animation/responsive-inte... [3] https://www.google.com/design/spec/animation/icons.html# [4] https://www.google.com/design/spec/components/buttons.html
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.
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
- 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).
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?
here's a gif of me mousing over the FAB in my inbox: http://imgur.com/LuEZ57c
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)
Though I agree the whole thing is inconsistent.
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.
That's the one! Google's products are so confusing sometimes.
Put the tool up in the toolbar and stop blocking my content. The cynic in me assumes it's there because they like circles.
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.
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.
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!
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?
Not according to Google's Material Design "spec", it isn't: "A floating action button represents the primary action in an application." (http://www.google.com/design/spec/components/buttons-floatin...)
Additional actions should go on the action bar.
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.
Again I am only speaking about the feeling I got after watching the promotion video.
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.
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.
This solves an internal Google problem though, not a user problem.
There's a thin line between consistency and monotony and at the minute Material Design seems to be on the wrong side of that line.
Beneficial for them, and dangerous for others I fear.
Source? What does that mean?
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.
My browser window is 1350 pixels wide and the headline is still cut off: "Designing for Google Cardboar"
And I love that it's 100% free for any use.
Sure looks like it was improvised and not thoughtfully designed.
Material design is a good example for this.
A good test of an organization or person isnt how they are, but how they adapt. And the signs are promising here.
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.
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]"
Well put; and possible even worse!
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.
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.
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...
Not that I'm too excited to hear Google --Google-- go all Jonathan Ive and wistfully pontificate about design though...
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.
If design hinders usability, it's not good design.
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.
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.
But my design sense is awful. My sites never look as polished as I'd like them to. How can I get a design sense?
The changelog.... found it
Super interesting concept. The abstraction of design.
"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.
I mean what is this? http://i.imgur.com/dGCCLzx.png (my attempt at balancing the grid on the bottom.)
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.
(spoiler: page renders really poorly in chrome)
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.
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.