More than a pretty face

Along with the release of our new search experience, we’d like to give some background into the design team and process that went into all the changes you see. You might not immediately think of design as being a critical part of a search product, but we think it is, and we have a growing team of designers, researchers, and developers who believe it, too. We have a growing, pro-design community here at Microsoft as well (only fitting to plug Microsoft Design).

Simple and powerful. Human. Fast. These were our guiding principles for this latest version of Live Search.

Here’s the nickel tour:

  • Simple and powerful is about getting just enough, having information and tools when you need them, and revealing functionality without being overwhelmed.
  • Being human reminds us that all good products speak to people and we should always design for them.
  • Being fast has particular relevance to search where so much depends on rolling up the world of information to support people’s countless other activities and passions.

We wove these principles into our work on Live Search in a process that started with user research, customer feedback, and a myriad of other sources for data and learning. All disciplines got involved in sketching as a shared way to develop our ideas. With informed iteration, sketches turned into the interactions, layouts, and visual designs that fed directly into user testing, giving us a unique opportunity as designers and researchers to make truly “user-centered” decisions.

Here are some of the biggest changes you’ll notice that resulted from our product design process:

Image showing evolution of Live Search header

Search box near results  The new Live Search header and search box is slimmed down from a heavy piece of UI into sleeker, simpler elements. Bringing the search box into alignment with the results and into the body moves it closer to where users are looking and flattens out the visual bumps between it and the results.

Room to breathe on the page  Something else you’ll see on a large screen (lucky you!) is our centered, fixed-width page, allowing for a more thoughtful, predictable experience as richer search content and wider screens become the norm.

Crisp, clean type  We’ve also made changes to our color and typography. Our decision to use Arial and the new color palette was based not only on our desire to improve readability and consistency, but also on rounds of testing to find the right combination.

Intuitive video search  For our new video search experience, the team focused on activities and behaviors that make video search different. We focused on simplicity — cutting irrelevant pixels and text — and power — investing in enhanced preview for video — both of which contribute to the overall simple, yet powerful experience.

Health results integrated from many sources  You’ll see in health search that we’ve created a way for users to pull together health information from many different sources, digestible all in one place.

Ultimately, we think we’ve taken a step forward with this new product that we think will improve the overall Live Search experience. As with any design, it will evolve along with our design team, and we’ll tell you more as we go. We welcome hearing your thoughts, too.

Evan Malahy, Designer, Live Search

Join the conversation

33 comments
  1. Anonymous

    I don’t know what type of debate there’s been on this in the Live Search Team, but I think that when you made the search results in a scrollable pane like the image search results, there was a good idea there.

    The problems with it are the same problems with the image search; that without pages its really easy to lose your place and know where you are and, it can be slow.

    I’d like to suggest the best solution for both types of search is a hybrid format, where scrolling through search results would be like scrolling through pages in a Word Document. Everything is divided into pages, and you can jump between pages, or navigate that way if you like, but you can also scroll between pages.

    The scrolling offers the advantage of skipping through more results at once instead of being frustrated by having to continuously go to the next page. But the page organization allows you to jump between pages.

    Thanks,.

  2. Anonymous

    Brian – that’s an interesting idea, combining the two models to address both user scenarios.

    You get at a couple of the biggest challenges – performance and the comfort/ability to jump to a specific spot.

    Thanks for the feedback and the ideas!

  3. Anonymous

    Hello,

    I have seen that Live Search has been shaped better and better recently. It is great to watch Microsoft starting to push forward in the realm of Web search. In person, I strongly believe that Microsoft could defeat Google at this realm. It is not only because of the great developers and researchers at Microsoft, but also because Microsoft has an unbeatable weapon on this realm that has rarely been thought to be a weapon—Windows.

    The marriage between Live Search and Windows OS to be a WebROM could be a Google Killer. I have recently written a post briefly introduced this vision.  The post is at:

    http://yihongs-research.blogspot.com/2008/04/microsoft-windows-more-than-operating.html

    Moreover, I will attend this week’s interview event at Redmond. Sincerely look forward to sharing deeper thoughts with you people at Live Search.

    Live Search will be the next glory of Microsoft.

    Yihong

  4. Anonymous

    I find many annoyances with Live Search which center around the fact that the interface across the Live sites is so inconsistent compared to say Google sites which are down to the minutest detail consistent, even in their Help system. Some ideas for you to improve and to understand finally that even the minute details do matter and that Google in contrust to you takes care of them:

    1. At the top of the new Search page you say: Live Search, MSN and Windows Live.

    Well, why these 3 links? Why do I need the MSN link? What is the difference between Live Search and Windows Live. Why do I need the Live Search link at the top anyway? Am I not already on the Live Search page, why do I need to go back to where I am? Do you mean to say Live Search Home perhaps? No idea.

    Compare to Google that has no such confusing links at the top.

    2. Below these links you say again: Live Search link.

    Why is that? Why do you need a second link again to the page I am currently on? Is it for me to go back to Live Search in case I want to clear my search results. But if so why should it appear on the Home page?

    3. Then you have search web, video, maps, etc (thanks God you didn’t put MSN again there) and then you say More. Well after you click More Academic, Books and who knows what else are not included. Why?

    4. What is Xrank. AAA, you mean Selebrity Rankings. Then why don’t you say so? Xrank makes no sense except if I know what it is from before hand. Use descriptive names and not code names. Google used to have Froogle which is now Shopping. They learned something. Didn’t you?

    5. When you get search results there is a place that says: "See also: Video, Maps, etc". Why do you need to say see also? Just leave the interface as before no need to clutter it with yet another section which I need to skip over when going to results with my screen reader. It takes me another second just to go passed this stupid "See also". Please remove it and put the options "video, maps, etc" as they were on the Search home page.

    6. Generally your sites are designed like by many different companies. Microsoft.com different from MSN, different from Live Search and Windows Live is yet different. Why? Please make a consistent interface!!!!!!!!!!! Now!

    Every link has to be accounted for. Go to Spaces or is it Live Spaces or is it Windows Live Spaces. Agree on a name! Then check all the links there. Do they makes immediate sense? Every link needs to be accounted for. Remember that and you might succeed. And then remember "consistency" "consistency"! How many time. Don’t you understand? You place links and you throw them around and your design is not clean. Look a Blogger clean and understandable. Look at Spaces. What is the difference between the "Your Space" link (or should it be "My Space" better) and the Space Home link or the Go to my space link or simply the Home link. Tooooo confusing.

    Please your design across the Windows Live experience should be simple, predictable and cooooooooooooonsistent and did I say consistent!

  5. Anonymous

    This is all irrelevant unless you do some marketing on TV. Hardly anyone has heard of Live Search, or knows what it is – If you show all of its innovative features on TV, you’re bound to get more viewers. Microsoft’s got enough money in its kitty to pay for that I think.

  6. Anonymous

    I have checked garys example but I could not see this problem: "look below the same site with different domains come up #5,6,7,8,9"

    They were different…

  7. Anonymous

    First of all, the new UI is pretty.  I like it, and it’s much improved.

    *However*, what is with my.live.com – can we get an update to this (also, with the move in URL, the ‘mobile portal’ beta of live.com no longer works – has this been abandoned anyway??)?  The old UI, compared to the new UI, is ugly and out of place (and is still visible on other old live modules such as favourites and expo, but is glaringly obvious at my.live.com).

    I think you guys have done a great job, and splitting up the search (images, video, Q&A) from Windows Live is also a good idea (and the different designs – Live Search/Windows Live make the difference obvious), but certainly an update to my.live.com is long overdue.

  8. Anonymous

    It looks much more streamlined now. Much easier to use, almost like Google. Thank you!

  9. Anonymous

    Great starting point but I agree with another commenter – there is no consistency whatsoever.  It appears that each product team is competing for its own design.  My suggestion is to get a team together to create sketches of every single live page, utilizing a consistent simple theme and then implement that.  Also, try to do away with the ultra high tech blue orb theme – just make the pages appealing.

    One other point.  Please,  do not advertise for Live Search yet.  The product just isn’t there yet.  It really looks like a work in progress and will turn people off of it forever.  Design something beautiful (think Apple type experience) and people will get hooked.

  10. Anonymous

    Interesting, I posted a blog entry about this very same thing when I saw the new my.live.com.

    Aside from tech enthusiasts, nobody will know what Live Search is. Advertising really doesn’t help either. Live search requires consistency and it needs to be equated with one simple idea. Google represents simple searching, no-frills.

    Microsoft is just throwing random features at people without connecting them with some common idea, so nobody is going to know about Windows Live, or Live Mesh, or anything.

  11. Anonymous

    Thanks to everyone for the comments and the feedback.  I think y’all hit on some important challenges ahead for Live Search – continuing our already great strides in relevancy and rolling our new designs out across the site.

    # Yihong –

    Thanks for the encouraging words about Live Search.  I do think that a great asset of Microsoft is its wide range of software products, which definitely set us apart from some of the other search engines out there.

    # Anon, Ali, and David –

    Keep the feedback coming! I can see how some of those differences could be distracting and we in the Design team are definitely working on those kinds of challenges.  As you can see we’ve made a lot of changes lately, so there’s always going to be those bits that are just a wee bit behind–but they’re are catching up fast!

  12. Anonymous

    Wonderful news and thank you.  I have been trying to get in touch with the appropriate person at Live Search, as we have many clients feeding their product catalog data to you, but don’t have a tech rep to speak to to make sure we update things properly on an ongoing basis.

    Is there any one there we can contact to ensure that our clients are feeding properly to LiveSearch?

    Thank you,

    Chip Arndt

    Co-Founder, MerchantAdvantage.com

  13. Anonymous

    Why the Image search options such as ‘Refine By’, ‘SafeSearch Moderate’ not available for all markets?

    Refine By is one of the best options available to sort out images.

  14. Anonymous

    Evan, how about opening up Live QnA to us here in the UK, and Europe.  The revamp is fantastic, and I’ve found it very useful the last few days, but why not integrate it into the UK’s search scope too?  And perhaps, to promote the service, feature one or two "favoured pairings" for each search term down the right hand side, after the sponsored links.

    There’s a reason why Yahoo Answers is kicking ass in this area, and its not down to any design flaw at QnA or any lack of talent on your team – it’s simply that there’s next to no promotion (and none whatsoever outside the US).

    Great to hear that my.live.com might be getting a revamp, it’s long overdue (And also, did you know that the mobile my.live.com beta portal is broken since the URL moves??).

  15. Anonymous

    The image search options are great!  Much nicer than the goog IMO.  I actually preferred the link buttons on top image, easier to locate.

  16. Anonymous

    @Ali, Vasudev –

    We’re definitely working on rolling out our updates and features in different countries world-wide. You should see more and more things "light up" as we go, so keep checking back.

    Also, I’m glad the image search refinements are useful for everyone.  That certainly highlights what we mean by Simple and Powerful–giving users the tools they want or need without being too overwhelming.

    Thanks again to everyone for all the feedback.

  17. Anonymous

    That’s great.  Thanks Evan.

    Over the last few months, Live has become my primary search engine – the new video features, and image search, and instant answers are great, and, yes, standard searches are far more relevent than they used to be, and are on par with Google.

    So, good work.

  18. Anonymous

    I don’t like the separation into Windows Live, Live Search, Live Mesh and MSN. They should all be under one brand. Is Live the brand name? Well, no since Windows Live and Office Live show that Windows and Office, and not Live are the main brand names. On the other hand, is Windows the brand? No since Live Search and MSN and Live Mesh, do not have the word Windows in them. I am confused very very much!

    Why Windows Live? Is search in Windows Live? No. What does it contain? Hotmail and Spaces? Then why Windows Live? How does Hotmail or Spaces extend or tie into Windows? And what if I have a Mac? Are not these all online services?

    And what is Live Search? What does it contain and what is the difference from Windows Live? Live Maps and what else is groupped under Live Search? And why doesn’t Search and Maps extend Windows to be called Windows Live, whilst Spaces and Hotmail do and are called so? For me they are all online services, including Search and Maps.

    And what about Mesh? Why call it Live again? So Live now is the brand name? I thought that it was used just to indicate that a product such as Windows has an online extension. Then Live Mesh should be Windows Live since it truely extends Windows. So the only product that truely extends Windows you called it Live Mesh and not Windows Live and other unrelated online services that one can and should be able to access even from his Mac you called them Windows Live? Strange! Very strange!

    And what about Office Live? When I want my files I want them everywhere, I don’t think that these are my Office files so let’s put them on Office Live and these are my Windows files and so let me put them on Windows Live Skydrive. How strange!

    Who thought of all this mess or perhaps all this Mesh?

    Live this Live that Live the other Live yet the other I don’t get it. The next version of Windows and Office should be named Live Windows and Live Office I think. After all they would be made "live" as they would incorporate the Web as an integral part of their operations, increasing your productivity … bla, bla, bla. What? Live Windows? Yes, and through that new desktop OS called Live Windows you would be able to access a suite of integrated Windows Live services, although some of them might not be that integrated or even extensions of Live Windows itself, such as Hotmail but who cares! We will call it Live Windows anyway and you would be able to check your Windows Live Hotmail by clicking the Live Start button on the Live Desktop, opening a version of Live Internet Explorer under Live Silverlight after you have adjusted of course the right options under Live Control Pannel, or is it the right Live Options of the Live Windows Windows Live Desktop under the Live Windows Live Control Pannel? And did we say Live Live Homepage? Yes, the new Live Live Homepage, featuring Live Live Search, or is it the new Live Windows Live Search, since now it would be even more integrated with the Live Desktop on the new version of Live Windows, so it should be rightly called the new Live Windows Live Search?

    So people would tell their friends:

    I read on MSN (or is it Live MSN) which by the way is a contents site which differs from Windows Live since the latter are communication (or are they? since OneCare is part of them. Anyway.) … well I read on that page that Microsoft has released the new version of Windows Live Messenger and please download that.

    Windows Live what?

    Please change branding now!

    At the very most: Keep Office Live and use it for an online, web-based version of Office. Anything else is too much and a lot of nonsence which nobody will ever get.

    Hey see we have 3 brands now. They give so much more clarity. Live Search for um something, Windows Live for um something else and MSN for contents? But wait what content? Doesn’t Search give me content? Windows Live for extending Windows? But wait what Windows they are online. No I mean Windows Live for a set of personal communication and collaboration services. But wait then is OneCare a communications service or not? And what about Live Mesh, isn’t that a communications service? Why not then Windows Live Mesh?

    Remember the time that everything wanted to be .NET. Visual Studio .NET, Windows .NET, VB.NET, .NET Passport, .NET this and .NET that? Haven’t you learnt anything?

  19. Anonymous

    Greetings,

    I’ve read through out these posts and other blogs related to the new Live Search design, and the phrase the stood out out of a few of them were "Have you learned anything, yet?".

    Indeed, there should be some kind of standard Live Search interface, and you’re able to pick different styles of the search if the web site may please. What they should really focus is how the users receive results. I’ve a lot of people turning back to Google for their results since Live Search gave them poor results.

    Not only do you have Google, but you have Ask.com, and Yahoo! search engines, so you have yourself some competion to win, and you’ll need to do it well BEFORE even thinking about publishing it well in the market with T.V. advertisments. Also, before broadcasting it to the general users, you should first allow the developers and designers be able to use your Windows Live services in their web site’s if they may choose to do so.

    The post before this, and also the "Wednesday, May 07, 2008 12:21 AM by Anon" post, stated well about the issue. The previous post did state "Please change branding now!", and that leads to how Microsoft’s teams are confusing us with these brand names. Try to draw us a map to what the heck are you doing, please.

  20. Anonymous

    When do you refresh the "My Windows Live", "Windows Live Favorites", and all other services with the old wave?

    Some of these services need a refresh!

    Thanks.

  21. Anonymous

    Yes the new updates are nice, but again same problem. Some features available in some market and some are not. Like xRank not shown for some regions. Some regions show Video search with beta tag. So to spread the word about such features, i feel the readers may find it difficult to find those features and which may annoy them. So please make it consistent among all markets. That’s one of my main concern.

  22. Anonymous

    I think this a great feature and will help a lot!! thanks

  23. Anonymous

    Arial, eh?  "Our decision to use Arial and the new color palette was based not only on our desire to improve readability and consistency, but also on rounds of testing to find the right combination."

    Arial is a miserable font, dating back to at least Windows 3.1.  It isn’t a font that one uses for readability — Microsoft has developed a number of fonts specifically for increased screen readability, such as Verdana and all the new ClearType-optimized "C" fonts that ship with Vista.  Those fonts should be used instead.

    The real reason Live Search is using Arial is because Google uses it — the mindset that anything that makes users’ experience with Live closer to Google’s experience must be a good thing.

  24. Anonymous

    I have Live Search for mobile users and I love it but it does not allow me to use the SMS Texting to send search results to friends although I have text messenger on my phone and it is an option in the menu.  what do I need to access this menu option?

  25. Anonymous

    I have Live Search for mobile users and I love it but it does not allow me to use the SMS Texting to send search results to friends although I have text messenger on my phone and it is an option in the menu.  what do I need to access this menu option?

  26. Anonymous

    Do I need to get an update to Live Search 2.5?  If so, where?

  27. Anonymous

    Do I need to get an update to Live Search 2.5?  If so, where?

  28. Anonymous

    Healthcare BiWeekly, the leading magazine for the independent care sector, has exposed the flaws in the care home rating system developed by the regulator, Commission for Social Care Inspection (CSCI).

  29. Anonymous

    Live is now better then ever, use it on my phone as well

  30. Anonymous

    I appreciate the efforts and I like it a lot to get a glance from the design team. One thing that bothers me, and forgive me for being so nitty gritty, is that little square box around the selected page (e.g. ‘Web’). I see your problem in informing users that this particular category is selected but it just darn ugly. You can make users also aware of this with other means (darker colour for instance).

    Another thing, I like that the options ‘web’ ‘images’ ‘video’ etc have moved to the top, this gives a lot more rest.

    One last thing, what would happen if you would lose the whole topbar (blue gradient bar) and move the icon in the bar with options (like web, images, video etc.)? In my opinion it would make it a lot more restful and more space for the results and adds.

  31. Anonymous

    Hii.. gud job Live Search team…

    I just want 2 knw is ths Live Search version 2.5 or 3.0..

    I need some more improvement in search result..& other option ..and when will indian users gt a chance to have Live maps and Live Local..

Comments are closed.