To Design a Microsoft(.com)

October 2, 2012 7:04 PM

A first-hand account of the creation of the new Microsoft home page.
posted by gilrain (43 comments total)

What a bunch of hot air.
posted by scose at 7:14 PM on October 2, 2012 [4 favorites]

It's easy to dismiss this project by saying, "It's just a page. Big deal."

That's really all he needed to say.
posted by xmutex at 7:14 PM on October 2, 2012 [4 favorites]

I got about halfway through before I realized I did not give a fuck. I'm not sure what that says about me.
posted by nathancaswell at 7:15 PM on October 2, 2012 [2 favorites]

I think it looks nice.
posted by Redfield at 7:16 PM on October 2, 2012

The thing is, I kind of am. I just think I'm not interested in reading about meetings etc.
posted by nathancaswell at 7:19 PM on October 2, 2012 [4 favorites]

One of the secrets of success they don't cover in that tidy little book is that key to whatever you're doing/have done is the ability to goddamned endlessly blather on about it. This is especially true in the tech industry and the endless conferences and convention where this goddamned endless blathering about nothing goes on.
posted by xmutex at 7:19 PM on October 2, 2012 [9 favorites]

I'm very interested in web design, and their new front page looks like intensely homogeneous. Large banner-type image slideshow, basic navigation above, triptych of featured sections (with photos) below, comapny logo in the upper left.

Compare it to any number of corporate sites like Williams Sonoma and it looks quite similar, albeit it bit less cluttered. I guess the only noteworthy thing is that it's less "techy" and more "designer-y" than some similar companies' sites. (and yeah, it looks like they're going for that "flat style" that was being discussed the other day)
posted by ShutterBun at 7:24 PM on October 2, 2012 [1 favorite]

Yes, the images on the front page looked like bland stock photos. They "smell" of marketing BS.
posted by Brandon Blatcher at 7:27 PM on October 2, 2012 [3 favorites]

I found it interesting, although I'd love to hear a less diplomatic version some day over beers or something.

People who haven't tried to get a clean, simple design through the baroque politics of a large software company probably underestimate just how difficult it is. Being able to get it done is a rare skill, one separate (but necessary for) the ability to design the thing in the first place.
posted by feckless at 7:29 PM on October 2, 2012 [6 favorites]

Compare it to any number of corporate sites like Williams Sonoma...

Okay, but try resizing your browser window with the Microsoft site open. Now resize your browser window while looking at the Williams Sonoma site. See how the Microsoft site shifts around to accomodate your preferences? This is what people mean by responsive design. It adapts to different devices and user preferences, which is generally considered a good thing.

Design is not just about how something looks. It is how it works.
posted by oulipian at 7:46 PM on October 2, 2012 [20 favorites]

What other sites with high traffic do resizing/mobile as well as the new Microsoft design? Right now, I'm only aware of the Boston Globe and SBNation.

(As a corporate webdrone, it's nice to know that I can use a top-50 Alexa rank site to demonstrate responsive design to my boss.)
posted by suckerpunch at 7:47 PM on October 2, 2012 [2 favorites]

I'm sure it's difficult, but it seems like this particular set of design aesthetics seems to be getting approved by a lot of large companies.
posted by ShutterBun at 7:50 PM on October 2, 2012

That's a fair point (about the responsiveness, etc.)
posted by ShutterBun at 7:52 PM on October 2, 2012

They "smell" of marketing BS.

This is basically it. Visual Studio's bland stock photo promo is a mountaineering expedition? Yeah great work there, guys.

You take a look at apple.com. The only stock photography fills the photo galleries on screenshots. The rest is products. Microsoft's site is some hodgepodge crapshack of roughly related BUs forming a webring. None of the branding is consistent across any of their sites.

If I've learnt one thing working for a service organisation it's that people in general don't like to get shunted. That's why bundling services and triple play deals in inexplicably popular with regular people. If the shit breaks they call Comcast and say "fix it" rather than Comcast saying the problem is with Vonage and Vonage saying the fuckup is with Comcast.

Microsoft.com in its current state stinks of this. Once you leave the main site you're trapped in their own little world. They have no interest in helping you get to another of Microsoft's fine products or services. They only have an interest in helping you with what their BU is good at or who they're buddy-buddy with.

Going back to the overused but unappreciated example of apple.com, you go through and you look at iPods, iPhones, iPads, Macs. No matter where you go it's all Apple. It's not Apple then shunted to the mobile BU who doesn't have a damn thing about Macs in their navigation despite it being one of the signature products. Because that's how it would be in Microsoft's world. You click on Windows Phone in their Products section. Then try and get to the Windows subsite. You physically can't.

It's the web equivalent of veneer paneling. You peel it back and it's obvious that it's covering up a whole heap of shit. You can't deny it, but it looks good at a distance at least. But that's all the CEO is ever going to see so who gives a shit about doing it properly?

People who haven't tried to get a clean, simple design through the baroque politics of a large software company probably underestimate just how difficult it is.

I used to work for a hosting arm of an ISP. My boss once came to me one day and said "management are finally giving us the resources to update our website and our signup process!". Which was absolutely fantastic because our website was a pathetic piece of shit.

So I went home, fired up Photoshop, drew up some rough mockups of a clean, simple signup process that asked for a minimum of details to get started and sent them on their way. It was three pages in total with about 4 fields per page. Client details, domain and hosting details, payment details and done.

The finished design was seven pages of 15 or so fields each page and a fucking disaster of marketing fluff, reseller fluff and other miscellaneous crap we could have done without. And therein lies the crux.

Marketing can't help getting their whorish fingers all over any data wherever they can pull it from. Piss off the customer by giving them a heap of extraneous info to fill out? Whatever they're only fucking paying us. It's too valuable to them and if you don't the marketing VP will walk into the CEO's office and say "the web guys won't let us collect the data to let us sell shit". And unless you have a CEO that has the balls to stand up to marketing and go headlong into what is typically a dark abyss of sales you're going to have a hell of a time without marketing whoring your clean shit up.
posted by Talez at 7:53 PM on October 2, 2012 [28 favorites]

People who haven't tried to get a clean, simple design through the baroque politics of a large software company probably underestimate just how difficult it is.

Oh, hell yes. 400 mid-level execs and their favorite pet app or feature all have to be given real estate and then a bunch of useless slow crap has to be glommed on (let's do it all in Portlets! Yeah, and we should have a map, too!). Managing to tell all those people to eff off is a triumph all on its own.
posted by Ickster at 7:54 PM on October 2, 2012 [2 favorites]

Can we get that homepage in cornflower blue?
posted by Strange Interlude at 8:14 PM on October 2, 2012 [3 favorites]

Mountain Dew and Grey Goose Vodka both have decent responsive designs (speaking as someone with an appreciation for the mechanics, if not the products or aesthetics).
posted by jenkinsEar at 8:18 PM on October 2, 2012

Three things:

_{0) The author seems familiar for some reason. Could be two-degrees separated or something.}

1) His wife's name is "Kalpita", a Sanskrit word that is often translated as "fictitious", but can also be translated as "something or someone created". Quite an appropriate name for product-manager / planner etc. :)

2) MS's home-page has responsive design, sure, but the moment you click on any of the links, all that responsiveness vanishes.
posted by the cydonian at 8:27 PM on October 2, 2012 [4 favorites]

Using an iPad I visited the site. It looks nice. I clicked on one link (Bing vs Google challenge). It took me to completely different site, which thanked me for visiting and that the iPad version was coming soon. Nothing else. No return to previous site, no read more about the new tablet. Nothing. According to the article, my visit to microsoft.com was one of millions "driven by countless expectations". Mine were very low and were met.
posted by jontyjago at 8:37 PM on October 2, 2012 [9 favorites]

Incidentally, TechEd Australia's website has a different tack on responsive design. Not saying it's better or worse, merely that it's interesting.
posted by the cydonian at 8:53 PM on October 2, 2012

ShutterBun: "(and yeah, it looks like they're going for that "flat style" that was being discussed the other day)"

Didn't the 'flat style' pretty much originate at Microsoft?

And, yeah, it's a pretty nice site. However, I've got to wonder about the countless other terrible websites that were born out of the same exact process as was described in this article (they had lots of meetings and self-confidence). Design by committee only works well if you've got a really good committee, and even this author admits that that mostly comes down to a matter of pure luck.

The stock photos are 'meh,' but that's kind of hard to avoid when you're a software company. There are only so many screenshots that you can post. If Microsoft can extend this design language to the rest of their (fractured, gargantuan) site, it will be a very good thing. Jesus, the Office site is horrible, and the Windows site won't even load for me in Chrome.

If we want to compare things to Apple, I'll say that while Apple does feature lots of photos of their products, they don't really showcase much else other than photos of their products. Apple are leaning a little too heavily on their brand's strength right now, because the current pitch of "Buy a mac....because we said so!" won't work forever. Sell the product on its strengths, not its looks.

That said, Apple's site is overall nicer and more consistent than Microsoft's. (Though Microsoft's business and product offerings are vastly more complex than Apple's, so this isn't exactly a fair comparison)

Also, the photos on Apple's site are actually even a bit too huge on my 13" Macbook's screen. The proportions are just ridiculous. I had to reach for my resize shortcut to shrink the page down to manageable proportions so that I could fit more than a few lines of text on my screen at a time.
posted by schmod at 9:05 PM on October 2, 2012

Though Microsoft's business and product offerings are vastly more complex than Apple's, so this isn't exactly a fair comparison

One could argue that it's quite fair to compare Apple's simplicity to Microsift's complexity.
posted by Brandon Blatcher at 9:10 PM on October 2, 2012

Alas, the new Home Page still leads to the same old Clueless Company.
posted by Twang at 9:30 PM on October 2, 2012

I'm very interested in web design, and their new front page looks like intensely homogeneous. Large banner-type image slideshow, basic navigation above, triptych of featured sections (with photos) below, comapny logo in the upper left.

It also looks a lot like Microsoft's other design aesthetics these days, windows 8 and so on with the big, flat boxes. Personally I think it looks... nice. Hardly any kind of mind-blowing. It's design you won't really think about much unless you're specifically looking for it. I personally find the win8 aesthetic really dull.

My theory is that Microsoft is actually intentionally trying to be boring. Their theme and message is that they are the bland standard that everything else sits on top of. So they don't want to be flashy or attention getting.

They certainly aren't getting a lot of attention, that's for sure. I think

You take a look at apple.com. The only stock photography fills the photo galleries on screenshots. The rest is products. Microsoft's site is some hodgepodge crapshack of roughly related BUs forming a webring. None of the branding is consistent across any of their sites.

That's because Microsoft and apple sell different things. Apple makes most of their money selling physical objects, along with retailing music and apps other people develop. So their website, obviously, is going to have pictures of their physical objects.

How is Microsoft supposed to show a picture of an internet download of visual studio? Or exchange server? Or their cloud computing services? Other than the Xbox (which has its own separate marketing identity) and I think a tablet Microsoft doesn't sell things that you can even take pictures of, really.

The products they're promoting 'above the fold' are Office, Windows 7 PCs (all of them), Visual Studio and Windows Server. What pictures would you use for those things?

Also, the idea that, well, Apple did one thing and Microsoft did something different, therefore Apple is right and Microsoft is wrong is a bit annoying. If Microsoft did copy apple, fanboys would be screaming about how Microsoft sucks because they have no ideas of their own and had to rip off apple. They do something different and fanboys say they suck because obviously doing anything different from apple is completely wrong and stupid.

One could argue that it's quite fair to compare Apple's simplicity to Microsift's complexity.

Right, because it's not like they sell different types of things or anything. There is some overlap, but apple doesn't sell anything like Microsoft's corporate IT stuff, which is probably one of the main reasons why people go to Microsoft's website. They certainly don't license software to other hardware manufacturers, another key demo for MS.

Apple sells two or three types of products a single 'type' of customer (a person buying hardware for themselves) - Microsoft has a huge product line of stuff it sells to lots of different customer roles, end users, IT people, developers, corporate decision makers, other hardware makers, etc. Obviously their website is going to be more complex. If you go to xbox.com the design is a lot simpler, because there is only one customer role being marketed too (gamers). Look at the stand alone site for Windows Azure and again, it's a pretty simple site designed for a particular customer role. The subsite for Visual studio is also quite simple and directed at people buying developer tools.

Not that it really matters, of course. As I said, some people just want to find any difference between something Microsoft does and then rag on Microsoft for sucking because obviously if Apple is doing it it must be better.

(Not that I actually give a crap about anything Microsoft does. Like I said, I find the win 8 UI pretty boring, and developing software on a closed source platform just ends up being a huge pain in the ass, IMO)
posted by delmoi at 9:36 PM on October 2, 2012 [5 favorites]

Hmm, I'm not sure why this guy is ragging on the Kindle Fire promo page. Yes, it's long. It's essentially a long pamphlet. Didn't we all decide that breaking shit up into multiple pages suck

Reading more of this guy's article, it's actually quite bizarre. He's not writing much about the design decisions at all, but it's more about, like, the inner strength it required to do what they did. It's all Malcom Gladwell esque pop psychology

The power of intuition was brought into the limelight in 2005 thanks to Malcolm Gladwell's national bestseller, Blink. What most people don't know is that Gladwell drew heavily from the research of a German psychologist, Gerd Gigerenzer
...
If there is one thing Gigerenzer's research confirms without the slightest doubt, it's that our gut is truly intelligent. In fact, it is the primary mode of intelligence required in solving a gamut of problems — driving a car, catching a ball, predicting stock prices, making decisions on the battlefield, and countless others. My contribution to the list: Design.

This bit is unintentionally hilarious:

<sub>"My favorite part of this project? Leadership. This project, more than any other I've been a part of, had leadership. Not management, but leadership," reflected Greg Bader, the Program Manager on Pita's team responsible for driving the execution and launch of the Microsoft.com home page project. Curiously, when I probed him about whom he considered the leader of this project, he said, "Well, Benson was a rockstar Product Manager. But we couldn't have done any of this without Tyson, who is the best developer I've ever worked with. But, Trent and crew brought such feeling and expertise to the project. I suppose none of this would have ever happened if Pita hadn't pushed for it and provided us air cover in the first place. I guess… everyone on the project was a leader."

This sentiment was echoed in my other informal conversations as well. "It wasn't about us vs. them. We were all in it together. It was very Gestalt," said Michael Ruggiero. "Never once did I feel that my own management was telling me what to do. My entire management chain just trusted us to go make the right calls," said Benson.</sub>

This project was fun to work on because LEADERSHIP. Who was he leader? WE WERE ALL LEADERS!!! I... don't quite think it works like that...

It's as if the accomplishment here isn't the design itself (which isn't exactly earth shattering) but rather the fact that they were actually able to get people to listen to each-other and coordinate their activities. But if you view that as a huge accomplishment it kind of implies some serious dysfunction most of the time.
posted by delmoi at 10:01 PM on October 2, 2012 [2 favorites]

People who haven't tried to get a clean, simple design through the baroque politics of a large software company probably underestimate just how difficult it is.

Quoted for truth. The office politics involved in getting this done at Microsoft, of all places, must have been mindblowing. (It's too bad the "first hand account" is a content-free puff piece, because there probably are some good stories to be told about this.)

Now if they'd managed to do more than just the one page, I'd be really impressed.
posted by ook at 10:24 PM on October 2, 2012

Delmoi: it's like they accidentally collaborated for real and completely misunderstood what exactly it was they did, so he grabbed whatever word he could think out of the bullshit bag of bold sentiments.

Which, thinking on it for a second kind of explains "Microsoft collaboration tools" pretty well.
posted by roboton666 at 10:30 PM on October 2, 2012

Well, the home page has only one smiling person on it, so according to my personal system of measuring a company's evil by its home page it's less evil than it was before. But it still has arctic explorers and playing kids among its slideshow.
posted by JHarris at 10:52 PM on October 2, 2012

I'm going to go even further out on a limb and say big fucking deal to the fact that they made a well-designed, responsive page. Call me when they can do that to ALL of the pages on their site. Any half-decent web dev can make one good-looking page. Shit, I'll bet I could take the top six execs from any company and have them sit down for one day to redesign their own website's homepage and end up with something just as nice. It wouldn't solve any of the other potential problems that their site might have, but the homepage would look nice.

Same thing here. How can this guy gush at all, given that apparently all they did was lay down a single page? Do they have style guides that are going to work across all the myriad other pages that can be found on microsoft's site? Have they considered streamlining task flows for users? Have they done any ethnography to figure out what users need microsoft.com for? Or what they'd LIKE to use it for? I doubt it.

This is like that guy who "redesigned" the American Airlines website. Except he didn't really. Because there's a gajillion edge cases that have to be considered when you're designing an entire site. It's more than just making the homepage clean.
posted by nushustu at 11:17 PM on October 2, 2012 [2 favorites]

I didn't like the article, as it's mostly back-slapping guff. It didn't really tell me anything, except perhaps that the project worked because it was done by a small team with a set purpose. But we already know that's usually a good thing.

Perhaps I don't know enough about design, or designers, to properly understand what he's saying. He might be talking in a language that only designers understand.

I bet an article by Apple's web designer would be equally tedious and meaningless. When you're designing by "gut" then how do meaningfully explain why you've done something? But if you design by metrics, that's boring too because numbers and case studies can be dry.

I do like the new Microsoft homepage, though. But then I like the look of Metro (or whatever it's called now) from a purely aesthetic view. I haven't needed to try Win8 at all and I've only played with a few WinPho7 phones, so I can't comment from a personal, practical point of view.
posted by milkb0at at 2:46 AM on October 3, 2012

Could someone translate the article from corporatespeak into English, please?
posted by notme at 5:18 AM on October 3, 2012

Could someone translate the article from corporatespeak into English, please?

Look at MEEEEEEEEEEEEEEEEEEEEEEEEEE!
posted by Brandon Blatcher at 5:20 AM on October 3, 2012 [8 favorites]

(Disclaimer: I’m the guy responsible for the “responsive design” thing. For whatever that’s worth.)

> What other sites with high traffic do resizing/mobile as well as the new Microsoft design? Right now, I'm only aware of the Boston Globe and SBNation.

Those, and Microsoft, are certainly a few of the bigger responsive sites. A few others off the top of my head:

- disney.com (Just launched, and I’m hearing the new design’s only visible in the US right now)
- starbucks.com
- us.illyissimo.com
- gov.uk
- AIDS.gov
- m.bbc.co.uk (This “mobile-only” responsive site is apparently going to become the default BBC News design at some point.)
- m.people.com

(There’re plenty more responsive sites out there, both large and small, but I haven’t had my coffee yet.)
posted by sidesh0w at 6:23 AM on October 3, 2012 [3 favorites]

So many words saying so little.
posted by Thorzdad at 6:24 AM on October 3, 2012 [1 favorite]

The thing I don't understand is it absolutely needs Javascript to work properly, as all the main heading links are dummies. I'd've thought they wouldn't have done that.
posted by urbanwhaleshark at 7:45 AM on October 3, 2012

The thing I don't understand is it absolutely needs Javascript to work properly, as all the main heading links are dummies. I'd've thought they wouldn't have done that.

Think of that as a step forward for Microsoft. Back in the day, they would have used Active-X everywhere.
posted by Thorzdad at 7:50 AM on October 3, 2012

Someone needs to send Nishant to a debuzzwordification conference. Not readable.
posted by mwhybark at 9:42 AM on October 3, 2012

I wonder what Jakob Nielson would say about this.
posted by Aquaman at 9:44 AM on October 3, 2012

Well, Benson was a rockstar Product Manager. But we couldn't have done any of this without Tyson, who is the best developer I've ever worked with.

GODDAMNIT THE ONLY PEOPLE WHO ARE ROCKSTAR-ANYTHINGS ARE ACTUAL ROCKSTARS.
posted by thsmchnekllsfascists at 10:53 AM on October 3, 2012 [3 favorites]

That was a rockstar comment thsmchnekllsfascists! We are looking for passionate Metafilter ninjas like yourself for a crack team to do grocery listing in the cloud. Send a resume and a link to your github profile.
posted by scose at 10:59 AM on October 3, 2012 [1 favorite]

GAH
posted by thsmchnekllsfascists at 2:03 PM on October 3, 2012

Benson was a rockstar Product Manager

He's edgy, he's "in your face." You've heard the expression "let's get busy?" Well, this is a product manager who gets "biz-zay!" Consistently and thoroughly.
posted by entropicamericana at 11:54 AM on October 4, 2012

I actually kind of like it. It's the kind of design that doesn't call attention to itself, but everything is just where you expect it - bland and boring, yes, but also very informative and intuitively laid out with a minimum of useless fluff.

It's like, you know when you go to a university website, and all you really want to know is how to apply and what the entrance requirements are and what classes are on offer and maybe a campus map ... but all they give you are alumni profiles and fancy pictures and This University's History, Let Me Tell You It? This is the opposite of that. I like it.
posted by Xany at 4:12 AM on October 8, 2012