68
As per the official Google announcement, the reasoning behind this change is to try out methods which would complement new password authentication methods. To quote the post
Today, you sign in to Google on a page that includes both the ‘email’
and ‘password’ fields on the same page. We’ll be gradually splitting
those two fields into separate pages in ...
62
Good observation.
In my experience this happens for a number of reasons, some intentional and some unintentional.
Intentional reasons to trim whitespace:
Users often cut and paste passwords (yes, use of Notepad as a password manager really happens) and the paste operation for some clients adds a whitespace.
Phrase (multi word) passwords are ...
34
They arrange the items depending on what you search for.
I.E. searching for 'Tax' is likely to return many News results, so that is shown alongside 'web':
Searching for 'Mexico Flag' is likely to return lots of images, so they set 'Images' as the next tab:
Whereas searching for 'Bristol' (A city in England) returns 'maps' as the next tab:
So ...
28
Official google explanation aside (as mentioned in the other answer), there is probably another work at play which goes unmentioned - using UX as stick/carrot method to promote desired behavior.
Note that if you at any time previously checked the "stay signed in" checkbox, even after logging out of the Gmail the google will remember your username (via ...
19
These are called 'Dark patterns' and these can be used in many different ways to influence users behaviour.
Social networks as you mentioned put the logout button in a separate menu, Facebook in particular hide the 'deactivate' option very deeply in a settings structure. Some people also believe that you can never delete your Facebook account, when in ...
14
Responsive design is best practice, except for the most high-end websites
Responsive, mobile-first design gets you the most “bang for the buck” for most web sites or applications. Effectively you can design your web property once, get a good experience anywhere.
But responsive design has its drawbacks, and is arguably a compromise solution that works best ...
13
Google actually removes autosuggestions for specific searches.
In which cases?
Searchengineland writes:
Were things being removed?
Yes, and for these specific reasons, Google says:
Hate or violence related suggestions
Personally identifiable information in suggestions
Porn & adult-content related suggestions
Legally mandated ...
11
This is a bug with the Google UI, and not intentional.
You were right to notice the distinction, but it shouldn't be used as any kind of example of good design.
As of now (March 2015), Google is in the middle of a long process of migrating its apps and platforms to Material Design, and it will take a while before most apps are compliant.
Material Design ...
8
What's it called?
I'm not sure if a canonical name exists. But here are some terms that help describe it...
It is a type of menu. (Google Material Design: Menus)
In iOS and Bootstrap parlance it is a type of Popover. (iOS Developer Library: Popovers)
Google specifically calls it an App Launcher. (Google Support: Use the Google Bar)
How do I implement it?
...
7
The Google home page is simple and uncluttered.
But, once you search for something - you can filter:
Are we missing something - or are you?
7
Google is using 'Material Design' to give their vast number of different services a unified look and feel – so for google designers using Roboto is mandatory because it's part of their design by definition.
IMHO if you want to build a material design 'inspired' website, you are of course free to quote any design patterns as you like – so using Roboto could ...
7
Not mandatory. But highly recommended.
Roboto was introduced and standardized by Google for supporting devices of different dpi to have readability and legibility of fonts.
You can see that many apps have their own custom fonts which are either unique to their brand or to match their site. So Google cannot make it mandatory.
It's highly recommended ...
7
Getting in the trap of scrolling map area instead of page scrolling is definitely bad experience. Still current solution looks overcomplicated and provides a barrier to interaction.
The design looks a bit contradictory: large map area assumes reach user interaction with map content (primary task), but scrolling beyond map control looks like users don't need ...
7
As a matter of fact I'm quite sure that between the wrench and the kebab icon there was a hamburger.
Either way, the most likely reason for the icon is consistency . This kebab menu icon is the same they're using in Material Design, so they're basically following their own guidelines, see Menus section in MD
A menu is a temporary piece of material that ...
7
As mentioned by @locationunknown in the comments, the vertical position doesn't change when the window is resized.
But to answer your question. I believe it is because Google doesn't want you to travel visually far from the top of the screen.
Most of the important information is in the top of the screen (highlighted with red). Tabs, address bar, profile ...
6
Bells have been used for signaling forever, really.
On that premise, it's easy to go for a bell when it comes to notifications, as they are just that; signals that something is happening.
A bell requires - maybe even demands - your attention, and so does a notification!
As to whether it's industry standard or not, it currently doesn't pass a quick Google ...
6
I'm pretty sure it's because Drive is developped by another team than the team who's working on the Google account canvas. More a question of schedule/production rather than UX/UI thought I guess.
6
Well, I tried to get the answer from the design team (UENO. Created the interface, the renaming part is as it is since then), They simply can't answer it.
I believe that renaming in a modal doesn't have any specific advantage over inline renaming (they must have a better word for that, which I don't know) renaming inside a modal provide clear context and ...
6
Based on the Layout & Technology section of the Accessibility page, the tap area continues to be, at minimum, 48x48dp, thanks to padding:
Touch targets are the parts of the screen that respond to user input. They extend beyond the visual bounds of an element. For example, an icon may appear to be 24 x 24 dp, but the padding surrounding it comprises ...
5
Questions I aks myself when choosing the right pagination solution:
Will users be addressing a particular page? If no - then don't do numbers, just prev/next or infinite scroll.
How often items will be published to the feed. If often, then if I give page number to somebody it will become not correct in an hour - he/she will not found the item on that page. ...
5
Google doesn't just do stuff for the sake of doing it
Highlighting what I typed over and over again doesn't really add any value while highlighting the differences helps a user quickly find what they are looking for...
☻
If I had to pick just one then I would go with Option 2 (Google way) since they do a lot of usability testing based on successful ...
5
It seems like you're asking two things:
Why was the ← used instead of ×?
Why is this search bar z-indexed above the other content?
RE: Question 1
In Material Design, × represents "clear" in text fields, and "close" elsewhere. If the header maintains the search functionality (as indicated by the 🔍), then you can't have 2 × to mean two different things.
...
5
This is well discussed in a brilliant book: Marissa Mayer and the fight to save Yahoo! by Nicholas Carlson.
Google won over Yahoo in Search because Yahoo's majority of income came from their Advertising, which made their homepage cluttered with several ads which might not even be relevant.
Marissa Mayer was the Product Manager for Google Search and the ...
5
This has been around for quite some time now and I can think of one app that does this very well. Word Online accessible through OneDrive looks like the following. You get a saving notification and a saved to OneDrive when done. But that is desktop, looking like the following:
On mobile Word, you have the same text, but you enter an editing mode and have ...
5
There's an interview about this redesign published on the Google Chrome Blog.
Alex Ainslie, Chrome's lead designer states:
We’re introducing a major refresh on Chrome across all platforms, which aligns with Google’s new Material Theme. This update involved changing our approaches to shape, color, iconography, and typography. And why right now? You only ...
4
Unless there are performance issues, let the user chose between pagination, infinite scroll, filtering and sorting of content. One way to think of it is letting the server decide what to deliver depending on load. At high traffic only 10 items will be delivered on each request delivered by Pagination/infinite scroll and allow for filtering. It would be sort ...
4
What a great question, Niklas. I'm a huge fan of minimalism so I took a chance to write an elaborate answer.
First, I beg to differ: the art movement and the design style are not the same thing.
“Minimalism” as an eponymous art movement has formed in 60s, after the WWII, taking it’s roots in various precessing art movements such as Constructivism, ...
4
The title is an important identifier for a web page. It is used in various places by various user-agents, not only by browsers and search engines.
Think, for example, about bookmarking (i.e. a list of linked titles). The title "About" wouldn’t be very helpful. Instead, "About – ACME Inc." would work much better.
HTML5 defines (bold by me):
Authors ...
4
Coming from a cartography background, I agree with you in a sense. Some of those maps are useless, however some are quite useful. Let's take a look at a couple examples.
The first is something like you describe like on the Yelp website when you search. The link provided takes you to a search I did searching for Taco places in NYC and as you can see, this ...
4
I suspect it largely has something to do with the fact that those special operators are used for specific Google query purposes, and take precedence over code notation. From Google's own documentation:
Also, this thread offers a variety of workarounds to this issue, in case you were curious.
Only top voted, non community-wiki answers of a minimum length are eligible