Prior to the summer of 2011, no one would have accused Google web products of having the most pleasing visual interface. We attended a deeply insightful SXSW session on their historic redesign. This is what we learned.
Prior to the summer of 2011, no one would have accused Google web products of having the cleanest or most pleasing visual interface. Several of us from Flightpath listened to a deeply insightful SXSW session about the historic summer 2011 redesign that affected nearly all of Google’s web products. We heard insight directly from the design leads from Search, Mail, Maps, and so on.
Here are the insights and takeaways that we found the most fascinating:
- For the very first time anywhere, Google presented comps to the public of an ill-fated, unknown major redesign from 2007
- The 2011 redesign effort was jumpstarted by a simple IM early that year from Larry Page to the Creative Labs group in New York City, asking them to take stab at redesigning all of Google
- That request netted a fast design effort, where the designers in New York were left on their own to develop a “concept car” of a unified visual language for all of Google’s web products
- Interestingly enough, the ultimate finished redesign looked very similar to this very first “concept car”
- In contrast to the 2007 redesign effort, where the deliverable was a long presentation with exposition and process explanation, the initial first creative in 2011 consisted solely of 10-12 “before and after comps” on 11×17 color printouts. The lesson here is not that every design presentation can solely be done through large printouts, but that you have to recognize and think through how best to present to a given stakeholder. In this case, large printouts laid out on a table worked better when presenting to the top Google troika of Eric Schmitt, Larry Page and Sergey Brin
- In April 2011, Larry Page gave the go-ahead for the redesign with a ridiculous goal of end-of-summer launch. So audacious was the goal that the project was likened internally to the “moonshot” in the sixties, and the project was given the code name “Kennedy”
- The project was given #1 priority and trumped all new feature development across all affected products
- Dropping support for older browsers was critical in successfully launching the redesign on time
- While many design standards such as use of a consistent grid system were codified, elements like fonts have yet to be standardized for various reasons (latency of web fonts, unsupported foreign character sets, etc.)
- An HTML/CSS Prototype was critical to collaborate with development. In fact, code would be culled from these prototypes to create an online, living style guide through which internal development teams could see interfaces and steal/grab CSS code. The individual product teams would in turn contribute additional elements back to this style guide
- Through the help of this style guide, teams were able to give even internal tools the redesign treatment as well
- It should come to no surprise to anyone that Google likes data. But interestingly, they started much of the testing of the redesign with more qualitative tests. 80 trusted internal Google participants would be surveyed after seeing each comp for 10 seconds
- Of course there was also plenty of quantitative research, much based around using, not shockingly, search data. The well-documented “test for the right blue link color” typified this
- The redesigned Gmail was tested by way of “dog-fooding”: A forced launch for all company employees. The backlash was considerable, especially to the increased line spacing implemented, and was coined “Gmailageddon.” The Google design team chose to be patient and acknowledge that much of initial resistance to the new design was due “change aversion”. Over time, users eventually found more favor with the new design, though some design concessions were made regarding line spacing by way of introducing a line-spacing setting option
- Given that the new design language made its mass introduction with the Google+ launch in June 2011, many mistakenly attribute the redesign as originating from the Google+ product. In fact, by April 2011, Google+ was nearly complete with an entirely different visual design and the Google+ team had to scramble to successfully integrate the new redesign language in time for their launch
It was not too long ago when the feeling about Google web products was that they work great, but look like sh!t. Both as a Google user (and who isn’t one?) and a designer, I am both appreciative and impressed by how the Google design team has elevated design to the forefront of Google web products.