Office 2010: Visuals and Branding


Hello, I’m Keri Vandeberghe and I work in Microsoft’s Office Design Group (ODG) as a User Experience Designer. I would like to share the story behind the visual approach and brand integration for Office 2010. I’ll give you a behind the scenes look at the philosophy that led us to the current design direction.


Philosophy


Office 2010 is not a complete makeover but a visual refresh to refine surfaces and remove unnecessary visual elements so the focus is on users’ content and less on the borders and widgets that frame the content part of a window (this frame is also known as the “chrome”). In order to achieve this we’ve reduced the number of borders, boxes, and horizontal banding which gave 6 extra pixels of vertical space back to the content area. By adding more white space, and carefully placed visual elements, we strove to create an interface that appears less intrusive, lightweight, and leaves more room for the self-expression of those using it.


For Office 2007 the Ribbon was a new UI paradigm and the visual styling was emphasized to expose features, show the relationship of controls, and bring forth functionality that was buried in menus and dialogs. Boxes and borders around each control and Ribbon group acted as “visual cues” to guide the user. The Office 2007 Ribbon used a high gloss glass surface, which aligned with the Windows Vista aesthetic, and added an additional “WOW” to a new interface.


RibbonCompare 
Comparison of Office 2007 and Office 2010 Ribbon


In Office 2010 we feel the UI has matured and taken on a more refined appearance without sacrificing the overall structure of the Ribbon and its functionality. A major change for Office 2010 visuals is that the default theme is no longer blue. We chose a neutral palette to minimize sensorial overload when creating documents and we also made a departure from flashy finishes. The Ribbon is still the most prominent UI piece and sets the pace for all that follows. The user interface below the Ribbon is more subdued. The soft gradients and the use of light and color are meant to call attention to or draw the users’ eye to a specific area. There is a visual rhythm defined by white space and a few highly contrasted elements like the Office brand orange to indicate selection and the individual product colors in the File tab.


Office2007_2010compareLarge


We’ve continued the tradition of shipping three UI themes; Silver, Blue, and Black. All of the text in the Silver theme now has a 5:1 contrast ratio (the perceived difference in a color that occurs when it is surrounded by another color) with its background. This is a common request from our users with low vision and we’ve found that most users also benefit from the enhanced readability and improvements.


image

You’ll find the control for switching themes by clicking on the File tab > Options > General > Color Scheme.


optionsDialog


Consistency across Platforms


Consistency in the overall visual styling across Office applications, SharePoint, and Web Applications was a major goal this release. We wanted the experience to feel familiar and consistent when moving from one product to the other. The neutral color palette in SharePoint provides a platform for individual company branding to shine with much less effort. Carrying over the neutral color palette to the Web Apps pairs well with a variety of host chromes and ties the experience back to the full service Office applications.


 platform_compare


Alignment with Brand Strategy


The Office Design Group worked closely with Microsoft’s brand team to evaluate, refine and identify the in-product branding opportunities. This collaboration ensured that the brand was infused in the product in a relevant and distinctive way.


With Office 2010 we’ve unveiled a new Office brand system. The logo has evolved, moving from the original four colors that signified Word, Excel, PowerPoint and Outlook to a mark that fully embraces the Office orange brand. The logo also completes the evolution from the puzzle pieces last seen in Office XP to a mark that conveys energy, impact, and connection.


OfficeBrand_compare


The application icons have been re-designed for the release of Office 2010. The new icon designs respond to research that informs us that users can more easily associate icons by letter and color than by abstract design. We’ve adopted an alphabet system to bring a more uniform approach to the wide variety of Office family products.


ProductIcons


We’ve also chosen to play up the individual application colors this release and have updated the spectrum of colors to use a more vibrant and pure color palette. We’ve added the product color to the File tab and a few select elements in the Backstage view to make it easier to quickly identify the Office application you are working in. Think of the application colored File tab as a sneak peek into the Backstage view.


FileTabCoreSet


Backstage_all


The new Microsoft Office brand gesture and updated orange color palette is showcased in the animated splash screen. The animation adds energy, expressiveness, and an element of delight to the product launch experience.


 splashsequence


It’s not just a pretty picture
Designing and implementing the visuals for Microsoft Office goes beyond the icons and the age old desire simply to “make it look pretty”. It’s about bridging the gap between the familiar and the unknown, conveying and building on a brand, and helping users complete their daily tasks without getting in the way. Hopefully this quick overview has given you a better understanding of the visual refresh you’ll see in Microsoft Office 2010.

Comments (76)

  1. Anonymous says:

    Exactly Eric, that’s how I feel, too.

  2. Anonymous says:

    I doubt it would have any influence, but anyway:

    – Removing button and group borders is the worst change. All just looks like heap of icons, absolutely unorganized. I don’t know if it is some internal rule that all teams must make their software clearer (Windows and especially Live suite too), but removing lines as much as possible is lowering the usability. Like a supermarket without shells, just dump of bread here, dump of meat there.

    – Interesting how it actually made the Ribbon require more width (see your first image). Increasing space between dumps does improve the feeling that they are more of them instead of single one, but does not help you when you need something.

    – The logo. Visual Studio, now Office. What’s up? Why is everybody giving up the colors? Some other internal rule? Seems so unbalanced now. Or perhaps we are going to leave out the names in the future. It will just be the orange product, the blue one, etc.

    – File instead of the office logo: step back. A big one. Perhaps not for the < 2007 users, but what’s the point of returning to the obsolete elements? Should I expect menus and toolbars in the next version?

    – Also, moving it from the left right corner, to a bit down and bit left from the corner makes it unpossible to throw your mouse to the left right corner and click. Together with introducing “File” tab, this makes 2007 users just to click the application icon every time.

    – Backstage: will not comment on this one, except that I really hate that the file recent list is not available upon switching there. Slows down and there is so much space avaialable.

    – Icons: sorry, but terrible too. Oh, I forget we are going back in time, not only to one-color but also text-only world. Aren’t they Microsoft guidelines to not include letters there? They are so cluttered that the applications are hard to find in the start menu. But everybody is using start search, so why bother.

    – On the other side, I don’t mind having three applications begining on P. And if you actually didn’t put letters on the icons, nobody would complain either. Also interesting that you are changing things backward, likely to confuse users less, but introducing new product logos on the icons…

    – Splash sreen: this one looks good… …the pre-public beta one I mean, of course. Not sure why the saturated yellow-orange color needed to be change to this..one.

    As for the options as somebody mentioned, search would help much more than the ability to maximize. Just like you can search Control Panel.

    Why cannot be the colors or shading of ribbon be fully customized, like the aero?

    Seems the 2007 design was simply too good.

  3. Anonymous says:

    As Office 2007 was an interface disaster, this one is no better. I couldnt care less if the Microsoft identity is visible in my app. I want i to be utmost functional. Period. Which 2007 and 2010 definitely are not. On a minilaptop too much screen is taken up wih a huge strip of blue blubber where most functions i regularly used in 2003 are hidden in all new places. I de-installed 2007 after a few days, for it has more problems. Many documents which we worked hard to make were unreadable in 2007. Pictures got black, thousands of hours would be lost using 2007. The workarounds were hilarious. Money wasted, a brand damaged even more.

    I really hate new applications (and their developers) who think for me. You would help many users by adding an ‘old windows-view’ option. Users can think and choose for themselves. Microsoft tends to forget those things a few times too often.

  4. Anonymous says:

    Disappointed…I've been a user of MS Office suites since the very beginning.

    1. The framing looks like it was done in cheap water colors. Whoever thought of leaving out the thin-line borders needs to read this Blog and fix it.

    2. I'm retired military and the Office 2010 Military Appreciation edition doesn't have Outlook.  How can you say this is a home office suite without email?  

    3. I don't need a startup splash screen after first use.  I know what application I want to use and don't need a splash to remind me 2 seconds after I launched it.

  5. joesixgig says:

    Most of the interface work has definitely been an improvement. However on first glance the left side menu in the backstage view looks unrefined. The vertical spacing between the ‘iconized’ items is completely different than between the other ‘non-icon’ lines. The ‘options’ icon is narrower than the other icons, which adds to the feeling of ‘misplacement’. Have you tried using a fixed vertical spacing and left-aligning the text, rather than the icons?

    Another issue I recently ran into: on low-res displays, a long QuickAccess toolbar can make it uncomfortable to move the window: very little ‘grabbing area’ remains. Additionally the document title becomes largely obscured. Either allow users to click and drag a window even when grabbing on to toolbar icons (should be OK, right?), or choose a larger ‘minimum title width’ condition.

    Otherwise, nice work – cleaner is better!

  6. J.R. Raith says:

    I’ve always wondered why the ‘themes’ for Office can’t be changed on a per-program basis. Which is to say, why can’t I use the ‘black’ theme for Outlook whilst using the ‘Silver’ theme for Word and Excel?

    On the whole, I love the new visuals, though.

  7. PQ says:

    Good work…

    but…

    The icons don’t look good. They look too “American” (which is a real pity compared with the Expression Icons which have taken a similar approach). I really don’t like the font that those initials use…

    Also +1 for the Backstage view looking inconsistent within and between Office apps.

    Are you planning to do some usability work on some of the dialogs in the apps in the next version? some of them look *very* inconsistent and puzzling. I’m thinking of the drawing tools shape properties dialogs and paragraph/styles dialogs. They’re horrible. It seems like a lot of this work is all about the (admittedly 80% used) functionality, but the rest is being left to look a bit ugly…  

  8. Ross says:

    Agree, back stage is shocking, hate having to go there, sort that out fast – what’s the colour splash in the bottom right for?!

    Also amimated splash screens, please!

    Apart from that, improvements overall from 2007, well done.

    thanks

    Ross

  9. dbh says:

    I definately prefer the old icons and logos from Office 2003 or Office 2007.

    Infact I even prefer the Office 2000 icons to the new icons, they were extremely simple and high contrast.  The new ones have too much colour and emphasis on alphabetical letters as oppossed to program function.

    The new icons can look nice if your viewing them as larger icons, but since I usually see them from the quicklaunch as smaller versions (yes I put back my quicklaunch in Windows 7!)..I don’t really think they’re as attractive as the older versions.

    Having said that attractive icons do not make a good or bad application and can easily be changed.

    The coloured file menu button being specific is a nice touch.

  10. Jānis Dreimanis says:

    Thank you for the article. One thing I’d like to mention is, that using Office 2010 Public Beta it is problematic for me to see unread e-mail count in Outlook using the themes. In 2007 it was easier to spot. Is this something that will be worked on?

  11. dbh says:

    Yeah I think if I was redesigning the new Office 2010 logo it would have had a ribbon in it.

    I really liked the old Logo colours: red, blue, yellow and green, it makes you think of the Office suite as something creative.

    The new colour scheme just doesn’t stand out as much.

    I would either keep the new colour scheme and make the whole logo pattern shape a ribbon, or go with the old colour scheme and logo but add a subtle ribbon to it, perhaps in the same shade as the new Access or Infopath icons.

  12. uptokiss says:

    My 2 cents:

    • The lack of button outlines on the ribbon looks awful. This seems like change for the sake of change. Button outlines are useful to users because they show the hitzone for the button in question.

    • The removal of the orb in favour of a File tab is a mistake. I expected the Home tab to be leftmost and it is annoying that this is no longer the case. Please consider removing the file tab.

    • The color of the file button/tab is distracting. It should be the same as all the other tabs and not stick out so badly.

    • When mousing over the ribbon in 2007, the group would light up. This does not happen in 2010 and mouseovers only happen when you hover over a button. The old style was clearer in my opinion.

    • The groupings of buttons on the ribbon (clipboard, font, paragraph and styles on the home tab for instance) is a step back from 2007. In 2010 they are just dividers whilst in 2007 they were properly boxed off and metaphorically grouped. The new style means the groups “run in” to one another.

    • The contrast between active and non active tab is not sufficient to be clear.

    • The ribbon and colors of 2007 are far cleaner, better defined and more inviting than 2010 (color, button outlines, more rounded corners)

    • The buttons below “Customise the Ribbon” on the options screen are badly placed and need aligning. They look very haphazard at the moment.

    • You should be able to maximize the options window. There is no reason why this should be a set size

    • The exit button on the backstage view looks like it is used to exit backstage – not the application! This could be clearer

    • The help icon on the ribbon does not match

    the one on the help window that pops up! The one on the ribbon looks flat whilst the one on the dialogue is much better looking.

    The new colour scheme and look is truly anaemic, the lack of borders on the buttons on the ribbon is a pointless and backwards step and the fact you have not made any real enhancements is a shame.

  13. tino says:

    Interesting post, thank you!

    I agree with most of what you have done with the UI and see the improvements but to be honest I’m not as excited with this release as I was with the 2007 version.

    There are a few things I don’t get or didn’t like. For example that the user has to click on the items in the new backstage view instead of just hover over “New”, “Recent” and so on. Or the rendering of the new Ribbon Tabs is just too simple, the border is just a single grey line, I do miss a subtle soft shadow and a fade out when you change a Ribbon Tab, that really “feels” great on Office 2007! (Sometimes it is difficult to see which Tab is active on a bright background, see your screen shots)

    Some things that bother me:

    – the height of the Ribbon is still different than the Scenic Ribbon in Windows 7. Old menus and toolbars always had the same size in every app…

    – there is still this ugly gap between the Ribbon and the underlying “paper” in Word when you scroll down

    – 90 % of the different mouse pointers in Office are from the Word 1.0 ages without a shadow! Come on, please! That’s such a terrible experience!

    – the Dialog Box Launcher buttons on the bottom of the Ribbon are too small. Why can’t they be as wide as the whole group in the Ribbon?

    – the colored titles for Contextual Tabs are way too prominent!

    – the splash screen animation is pixelated and too long – or the apps do start too fast 😉 And the start of this animation looks terribly chaotic (see your first screenshot of it)

    – letting users customize every Ribbon Tab is a very bad idea. Really. It’s not necessary for home users and too risky in an enterprise environment! I was really shocked as I saw it the first time. Isn’t it a huge step back to the bloated monster that was 2003? I would prefer to have one single user Tab I can enable and fill with options I need (maybe even via drag&drop of buttons and groups onto it). That single user Tab would belong to the Windows user account.

    Just my 2 cents 😉

    And finally I’m curious about how “final” the UI and branding is in the beta? Maybe you can tell use if you plan to make some final changes to the look and feel? Thank you very much for the conversation!

  14. David Diskin says:

    Maybe now is the time to change the colors on a few of the applications, to avoid confusion.

    For example, both Word and Visio are blue.  Project and Excel are both green.  Etc.

    Also, users unfamiliar with the icons might easily  mistake Project, Publisher, and PowerPoint.  I think the illustrations need to be *very* different, or maybe it’s time to rename Publisher and Project to something that doesn’t start with a letter that’s already used.

    I’d also like to ask that more UI consistency be enforced between the Office apps and Expression (not to mention a lack of compatibility between Expression Design and Publisher).

  15. spain08MS says:

    Yes, all very cool. But the Box Art Office 2010 leaked weeks ago. When in Microsoft Presspass or Microsoft Store?

  16. Carlos says:

    Totally agree with the poster above:

    “• The lack of button outlines on the ribbon looks awful. This seems like change for the sake of change. Button outlines are useful to users because they show the hitzone for the button in question.”

    Button layouts give a visual structure for the “complete” ribbon that helps find individual buttons.

  17. bakjg says:

    Three “P” Icons? Two of which are slightly different shades of green. Wow that’s going to be confusing.

  18. cuz84d says:

    Even being a long time Office user, I had a hard time figuring out the difference between the three P icons also, the icon illustrations should be clearer.

    I don’t have a lot of gribs about it, and I think its refreshing after 10 years of the same thing.. I hated 2002-2003 icons..

    I think the backstage color tab is too bright, and the active tab color is not dark enough.  I would also try changing the 1 pt borders around the items to be 2 pt instead.

    I agree it would be nice if the individual panes the bottom dialog would be activated by clicking the any part of that footer area, not just the corner.

    I like the less stimulating themes, that is a much needed change, and very hard to develop or work with applications when they are hard on the eyes.  Its like when we switch to black monitors as the default standard, beign is just terribly hard on the eyes to stare at.  So kuddo’s for the switch to lighter theme colors!

    The backstage view, left menu should allow hover to switch panes and better layout consistency I agree.. much needed, right now just looks hacked together.

    The Save, Save as, Open Close don’t mesh with the rest of the items like Print, New, Recent..   Also, Exit is confusing, I want to exit backstage view or Close App.. not Exit App, it doesn’t let you know what your exiting but feels better if it was Quit.

    I too wonder if File Menu should be renamed to Home, and Home should be renamed to Style or something because File and Home feel like it should be the same thing.

    I’m also not sure Office Orange Star Logo fits yet.. maybe the Logo could be more ribbon like a garment, flowing, instead of like a flower look.. I would add a touch of the 4 office colors inside the middle to give it some pizazz.. Than it would look like a colorful flower..

    I didn’t like the Office Orb in 2007 just didn’t fit in with the rest of the UI design.. So I like backstage view, but fix the left hand menu to look clear and consistent, because it just doesn’t look right, and lessen the color brightness of the file tab and backstage color.. I know vibrant is nice, but too much color is not a good thing either when u have to stare at it.

    Also try making the Ribbon tab text darker so they stick out more.. since its hard for people to read, more black for the silver theme, then grey or washed out looking.

    Thanks.. over all good work, its coming along nicely, much more pleasant to use but needs some tweaks.  

  19. Khunna says:

    More themes please beside Black, Blue, and Silver.

  20. senthil says:

    Earlier in Office 2007, when I used to add the table icon( to add border on all sides to a table) to the quick access tool bar, if the theme selected is black, then i wont be able to see the icon unless I hover the mouse over that location. Reason being: black theme is not gradient based at the quick access toolbar and it merges with the icon. I believe with the office 2010 UI, the black theme is little gradient and will show the users the icons that are present in the quick access toolbar vividly.

  21. K4 Kaliazz says:

    What?? No, button borders? Come on! Saving 6 pixels for that beautiful ribbon of 2007?

    I always liked the idea of having groups, so giving more focus to them is needed… and i agree the buttons for dialog boxes could’ve been more prominent…. i almost forget that there’s more to fonts and character spacing, for example, than given on the ribbon…. so please, make it more prominent – bigger size, brighter shade etc.

    and i agree that too much customizing can add confusion. there should be an option of changing the home tab, add more tabs… but other default tabs should remain as it is.

    the icons are not at all great. the idea to use first letter is great but 3 P’s!! It’s too much… You can do it like creative suite 😉 Like Ps, Dw etc

    And I would suggest to either upgrade the Publisher app. It is useless. Either drop it or make it wortk it. The only thing it does is add another P to the array of office icons. Make it better and give it another name, my request.

  22. Christian Linnell says:

    Definitely agree – the ribbon must have button borders.

    And perhaps the default theme should be blue? It looks so washed out in grey.

  23. Mark Bower says:

    Agree with all the comments about Backstage view. It is a mess 🙁

    Inconsistent sizes of items on the menu are a problem scanning for the item I want. But worse than that. Everything is in the wrong order. Microsoft have conditioned us for years in the correct oder of the file menu. New first, then Open, then Save, then Print. I get confused everytime I go there.

  24. Raphael says:

    Backstage View is really annoying. Ouch! All always get lost when searching for what I want. And the difference between the tones of the pressed and unpressed buttons are very low, I’m almost unable to see it.

  25. I’m not at all liking these new icons… Personally, I see nothing wrong with the current ones.

    I think what should have been done is keep the current icons (it doesn’t take a genius to figure out that the little picture of the brochure might mean things like brochures) but change the colour of the ones that are similar in colour. I’m redgreen colourblind, so I am a bit biased, but Access, OneNote and Publisher look awfully similar to me on my Quicklaunch bar (This is Office 2007, by the way). Heck, even from a distance, Publisher and Word look similar!

  26. Ramón Alberto Villarreal Delgado says:

    buenas noches

  27. anony.muos says:

    Please MS make it easy for users to get OUT of backstage view once they get. I am shocked some of the Office apps open IN Backstage view!! In Office 2007, clicking anywhere out the menu produced by the Orb made it go away. Now you MUST click on the File button to come out of Backstage view. This is not right. It should go away if users click on the title bar or Taskbar. Also, provide a more accessible key like Backspace or Space bar instead of Esc to come OUT of Backstage view. Unlike Office 2007’s Orb, this File button doesn’t even support Fitt’s law (ideally it should be located at the topmost corner so coming OUT of backstage view is very annoying).

  28. anony.muos says:

    Two more usability and accessibility improvements you can make is:

    1. Allow the ribbon tabs to be activated by mouse hover instead of mouse click.

    2. Make the title of the application appear to the left like all Windows applications when the Quick access toolbar is shown below the ribbon because otherwise the Language bar overlaps the title.

  29. anony.muos says:

    Really forgot to reiterate what has been said in the comments:

    1. In Backstage view, clicking should not be necessary, hovering should be enough. Please make it at least an option.

    2. Huge UI regression: For commands on the Backstage view that bring up another dialog, they should say “Save As…” instead of “Save As” or “Options…” instead of “Options”. For those that extend into the right backstage view, there should be an arrow or indicator. Did you forget the basics of menus/UI?

  30. Fitt says:

    I dunno what stage Office 2010 is at for this for be accepted but before RTM, for goodness’ sake make it follow Fitt’s law! In 2010, MS is releasing its flagship application software that does not follow Fitt’s law (File tab?)? Seriously, I need to reconsider buying. Imagine the headache if the Start menu didn’t follow Fitt’s law!

  31. Tony S says:

    Is this branding and icon colour going to be the same as the upcoming Mac version of Office?

  32. Neil says:

    I much preferred the 2007 ribbon – 2010 makes it much harder to differentiate between icons.

    Also, highlighting the File tab in such a contrasting colour makes me think that my mouse pointer is hovering over it.

  33. Davyd McColl says:

    What I’d really like to know is why there isn’t a setting to just *disable* the Office interface themes? There are a lot of people out there who don’t want to have to use a High Contrast Windows Theme just to get Office to look and feel like the rest of the OS.

    Office doesn’t fit in with Aero-based themes properly and most definitely doesn’t fit in with the classic theme — why not just give the user the option to turn off theming? It’s not like it’s impossible: the themes will be disabled for high contrast user themes (and using a program like 3d color changer, you can almost get your system to feel like a classically-themed one, with the exception that a few apps behave oddly with the “high contrast bit” set in a theme (firefox, the login screen, to name a few).

    Seriously, this is the ONLY reason I’m now uninstalling office 2007 to put 2003 back on again — it just looks awful to have bright white scrollbars and buttons when I’ve selected slightly darker colors for standard chrome elements.

    Then again, perhaps this is just in keeping with the Microsoft tradition of not creating proper theming engines. XP, Vista, and now 7 all show that windows “themes” are hackey-hacks, not properly thought out or actually available to the user for customisation.

  34. faramond says:

    Why not make the group labels in on the ribbon buttons/links to the relevant dialogs? The tiny southeast-pointing arrow buttons that currently perform that function are far too easy to fail to see and hard to hit with the mouse.

    One of the objectives of the ribbon was to make the functionality of Office more “discoverable.” Well, tiny, inscrutable buttons don’t make the dialogs tucked behind them very discoverable. Nor does clicking on words like “Font,” “Paragraph,” and “Styles,” as clicking there has no effect at all.

  35. Raphael says:

    I believe that changing the default blue theme to a gray one was a great loss. The idea of focusing on the users work (for example, the document “paper” in word) is really wrong. By using a gray backgroung, I have the impression that this backgroung is almost part of the document, as it has a very light color and doesn’t contrast with the paper, making the entire “thing” a gray and white screen.

  36. will says:

    I have read many of the comments and have my point where I agree, but the biggest of all is the icons.

    Many people have said that they seem like rip off of Adobe,qould be fine, if they looked good while doing it. These icons are really hideous.

    I have recently replaced the icons with 2007 ones just so I can open the application. Its really that bad.

    Please consider changing them back, because clearly your “reserach” into abstract icons and what we apparently want is WAY off.

    I just hope that you can fix this as otherwise the suite has been great for me.

  37. Nathan says:

    I hunted this blog down, I knew this would be discussed somewhere.

    The new icons are awful. They look like they are something from when we could only have 16 color icons. Whoever decided it would be a god idea to use these icons, needs to look at the kinds of icons being produced elsewhere. They are not imaginative, stylish or well designed.  

  38. keri k says:

    To answer Tony’s question above – our blog post covers WinOffice only and the MacOffice plans will be coming from MacBU at a later date.

  39. Andy Fitzsimon says:

    I wont even waste my time saying in detail how bad this design is…  its the worst possible result from a company with the most resources.  truly insulting design

  40. shotfuse says:

    Love everything but the icons… im sure there is a way to get them back to the current version once installed. Otherwise- excellent release!

  41. Kevin says:

    You often see this kind of write up in undergraduate art schools, a lot of bull trying to back up not very good design choices. It’s impressive that Microsoft actually employs designers, but for whatever reason it appears they are forced into bad practices and poor directions. The UI for Office applications isn’t refined, it’s not exciting, there’s no “WOW” factor anywhere. It’s confusing and rather unrefined, as it always has been. While the effort to remove many of the unnecessary visual cues and banding is admirable, it’s useless without a concerned effort to better organize the remaining elements and buttons.

    That said, the new branding for the applications is absolutely abysmal. The icons have gone from bad to worse in an effort to respond to user feedback. Icon design is a difficult task to get right so I’m not surprised there have been stumbles, but to make these mistakes the final drafts is a signifier of truly bad practices. Take a moment to consider the rather cryptic illustrations for each of these icons. What are they trying to say? I can barely discern Word, Powerpoint, and Outlook. Excel I get because of the X. Other than that, I can’t tell which is which. Add to that the very confused nature of the typography and it’s a full on disaster. The spacing isn’t consistent, the letterforms are just plain ugly, and the gradients and strokes are unnecessary visual information.

    A better idea for Microsoft here would be to start over, from scratch, and come back to us with a new and more useful UI and consistent branding across the suite of applications.

  42. C Jones says:

    Everything Microsoft has done from the begging has been an insult to design. From creating a bootleg version of Helvetica – Arial – in stead of paying the proper creative right for it, to trying to ruin apple, a company who truly understands the power of design.

    Microsoft has so much money to put behind fixing this, but it makes no difference, because they are too unsophisticated to understand the problem. That is why apple is constantly gaining market share.

    PS Microsoft is supposedly bootlegging another font – i believe it is frutiger – in this release.

  43. iconmaster says:

    Three icons prominently featuring the letter “P,” distinguishable almost entirely only by color?

    I award you no points, and may God have mercy on your soul

  44. M Frind says:

    I, too, lament the loss of the clean, efficient, dependable functionality.  A number of months ago, I was so frustrated with Office 2007 running on Windows 7 (with a new Intel Core 2 Quad machine with all the bells and whistles) that I simply returned the entire computer for a refund (after trying a second one to confirm that my problems were due to software and not hardware issues).  Then, I immediately went back to my old machine: a dual Pentium III Xeon running Windows 2000 Advanced Server, running Office 2003.  

    Several days ago, while away from my desk, I needed to touch up a Word document on a friend’s brand-new computer.  My document was created on Office 2003, but opening it in Office 2010 brought a steady stream of nightmares.  Somehow, a font was substituted (without my permission), and the entire documented was reformatted (again without my permission).  And, some figures were screwed up.  It would actually have been more efficient for me to hop into my car and drive 90 minutes back to the computer where I created the original document!

    Interestingly, my old dual P3 Xeon machine running Windows 2000 runs my Excel spreadsheets and Access databases FASTER than the shiny-new Windows 7 Core 2 Quad machine did!  And, the old machine is much more reliable than the Windows 7 one.  Friends of mine familiar with Windows 7 (and also Vista) agree that Windows 7 and Vista are inefficient and unreliable, especially when compared to Windows 2000.

    My old machine (Windows 2000) runs 3-4 years without rebooting…and when I do reboot it, it’s only because I need to replace the batteries on the backup power supply (UPS).  In contrast, the aforementioned Windows 7 machine experienced 12 crashes (while I was using Office) in the brief period of time that I used it.  (After the 12th incident, I packed it up and immediately took it back for a refund.  They gave me another machine, also high-end and with the same software, and I had the same nightmares.  All the problems were software crashes…there were no hardware issues.)

    Keri, your write-up about how why Microsoft Office 2010 was redesigned (as 2007 was) with a new UI (user interface) completely ignores the fact that there are many people out there who have learned to use the existing versions of the software and who like things just the way they are.  While you do raise some good points, and while there will indeed be some people out there who fall in love with the new UI, you fail to make a cogent argument in favour of handcuffing every user to the new UI ribbon-based concept.  Why on earth can there not be an option for the user to simply switch back to the old user interface?  If such an option were given at the beginning (i.e. at installation or at first use), then the overhead dedicated to the new UI could be permanently deleted at that point.

    Another concern is the issue of efficiency.  It seems that each new iteration of software coming from that hallowed complex near Seattle makes greater and greater demands on the computer hardware.  Presumeably this is to induce the user to “upgrade” his/her hardware too.  What bothers me here is that the newest software versions seem to be wasting ever-increasing numbers of processor cycles.  In other words, for a given task (say, reformatting a given page of text in a given document), the number of calculations that need to be done by the CPU on a computer running Office 2007 on Windows 7 seems to be far greater than what would be needed if the exact same task were done on a machine running Office 2003 on Windows 2000.

    As someone who uses computers to model natural processes (groundwater flow), I demand maximum efficiency out of my computers.  That means I want the operating system (as well as all software loaded on the machine) to waste as few processor cycles as possible.  The fact that modern chips are faster than old ones does not make me any more willing to waste processor cycles.  Furthermore, wasted processor cycles equate to wasted electricity.

    Windows Vista was noted for its slowness.  Apparently, one reason for this slowness was the continual background execution of nebulous calculations for the sole purpose of guarding against the user making illegal copies of DVDs on the computer.  As someone who does not watch movies and has no interest in copying DVDs, I find such a waste of computing resources to be absolutely disgusting.  Given how Microsoft appears to be strongly motivated to bury “hidden calculations” in all its software, I guess it’s not surprising that all of its newest software packages bog down so much.  What unwanted behind-the-scenes calculations is Office 2007/2010 doing while the user is anxiously awaiting a response to his/her command?

    And, of course, more-complex software means more opportunities for bugs to crop up.  For people like myself, who only use a portion of the features in Office 2003, why should I buy Office 2007 (whose added features would probably never be useful to me anyway)?  One thing is for sure: I deeply resent it when computers are sold packaged with Windows Vista or Windows 7.  Microsoft should be forced to continue indefinitely selling Windows XP (which was very good, especially when compared to Vista and 7), as well as supporting both Windows XP and Windows 2000 indefinitely.  For people who need maximum reliability, the only Microsoft OS that provided server-grade reliability and efficiency was the Windows 2000 Server Family.  Microsoft’s announcement of discontinuance of Windows 2000 support really irks me.

    I think it’s high time that the user interface and internal workings of widely-used computer software be standardized.  The auto industry has been doing this for many years: not only are the user interfaces of all cars essentially identical, but the mechanical workings (and thus the troubleshooting when problems arise) are generally quite similar across the various makes and models.  Can you imagine how a car would sell if the manufacturer arbitrarily decided to use a dashboard lever as a substitute for a gas pedal, a button on the rear bumper for the gearshift, and a knob on the windshield as an “improved” brake pedal?  And, can you imagine how such a car would handle, since it would have the engine on the roof, and it would have six wheels.  Computer software is no less indispensable than transportation, but for some unfathomable reason, such strange-car design absurdity is considered acceptable in the software realm.

    Could it be that Microsoft’s impetus for continually launching reworked versions of its products is simply to keep its out-of-touch employees busy (and so a department head can have a nice project to add to his/her resume), and so that the firm can use planned obsolescence to get us to buy “upgrades” we really don’t need?  Let’s face it: software does not wear out.  Software is just a set of instructions for a computer to follow.  So, once you have a nicely-honed (and bug-free) piece of software that does everything the user needs, you theoretically could just keep selling it as it is.  (Of course, then “user experience designers” such as yourself might end up having too much free time.  Herein lies my point: I don’t need my user experience to be designed by someone who poorly understands my priorities.  Microsoft needs to devote more staff to designing reliability and efficiency into its products, not interfaces.)  

    In my opinion, all the new software versions should run efficiently on all the computers dating back 10 years.  A good performance benchmark would be the standard Pentium III chip running at 1GHz.

    Maybe we need Google to come up with its own operating system and office-software suite.  Google already has its Linux-based operating system (which runs its millions of servers) and its online GoogleDocs.  All we need is this kind of functionality on an offline basis (so that I can use my computer to work on documents without any Internet connection, such as when I am gathering field data in a remote location with no Internet access).  In any case, I will probably be able to find what I want in the Linux, open-source realm.  Come to think of it, maybe the only thing that will make Microsoft listen is a mass migration to Linux.  And then, Microsoft’s fancy Seattle headquarters could be converted into something useful, like a research university.

  45. Chuck Spidell says:

    You need to tighten up the kerning between the “i” and the “c.” Too much space in there.

    http://blogs.technet.com/blogfiles/office2010/WindowsLiveWriter/Office2010VisualsandBranding_BEDE/OfficeBrand_compare_2.png

  46. Eric says:

    Wow… I love Microsoft and I love Office.  But this is bad.  Truly.  It just looks like it was changed so the design department could look like it was doing something.

    I think the main logo is nice, but it seems kind of strange to get rid of the familiar, instantly-recognizable rainbow.  That doesn’t affect me everyday though, so I don’t much care.  But the application icons… horrible.  The 16×16 versions look better, but are still bad.  Don’t ask me how color blind people will differentiate between the 16×16 “P” icons though (of which there are three) which seem to only differ by color.

    The biggest problem though are the changes to the ribbon.  In Office 2007, the ribbon is absolutely brilliant.  It think it’s one of the most creative, innovative, well-thought out designs by Microsoft in a long time.  After getting used to it, it most definitely DOES increase productivity.  I can’t say enough good about it.  This new version is a step backwards.  The biggest sub-problem within the ribbon is you’ve removed minor button grouping.  Look at the bold/italic/underline buttons in the old version for instance; they’re very clearly grouped.  In the new version, they have a barely-visible divider.  For less obvious buttons, that’s a HUGE drawback because that was a visual cue as to which buttons relate.  It’s also less obvious which tab is currently selected (due to lack of contrast).  I also prefer the big, circular Office button to the “File” menu, but I don’t think that change will negatively affect my productivity like my other gripes (in other words, I don’t like it, but I’ll get used to it).

    Is there any chance these changes can be reconsidered?  Or, are they set in stone?

  47. Keri [MSFT] says:

    @ross

    The color splash in the bottom right of the Backstage view is the Office brand graphic which has been colorized with the application color to add interest to the Backstage view and also reinforces the application you are currently working in.

  48. Keri [MSFT] says:

    Thanks for your feedback about button outlines in the ribbon. At first the absence of button outlines might be a shock, but as you continue to use Office 2010 I’m curious if your opinion changes? There are a lot of applications and web sites that no longer draw borders and lines around buttons and controls until you mouse over them. We’ll continue to gather usability research on this change and keep it in mind for future releases. We hope your opinion changes, but please leave us feedback over time.

  49. Keri [MSFT] says:

    @Noname

    When you mouse over the ribbon in 2010 the group still lights up. It’s much more subtle than 2007 but it’s still there.

  50. Keri [MSFT] says:

    @joesixgig @cuz84d @Mark Bower

    We are currently working on ways to add more flexibility to the Backstage view and I’m confident we can solve some of the spacing issues in the left navigation area in the next release.

  51. Jen says:

    Wow…y’all must be so embarrassed about those icons. What a hot mess. Design by committee never works, and these are proof. They are unintelligible, generic, ugly, and boring. I like the Office brand redesign. But those logos look fresh from 1998.

  52. anony.muos says:

    most of the post here are negative. dissatisfaction here and there. you people are never contented. so please stop using microsoft products.

    some say vista and windows 7 is slow. well have a refund and stop complaining. and also stop posting about windows 7 and vista here. you should be aware that this is about office 2010.

  53. Gary Voth says:

    I agree strongly with many of the comments here. I would particularly emphasize these:

    – The loss of the borders around the ribbon elements actually detracts from the ability to discern and quickly find individual commands. Everything seems to run together at a glance and you must work harder visually to separate elements.  Keeping the visual seapration while making boders and icons more subtle and “quiet” would be better achieved using tone-on-tone effects.

    – Surfacing the ability to hide the Ribbon is nice–but it would be MUCH nicer if an option was provided to make it work like a traditional menu system, responding to hover rather than clicking

    – When the Ribbon is open, by far the biggest usability issue in my experience is that the Ribbon changes unexpectedly due to context-awareness.  Too frequently, clicking on a command that opens some document or form causes the Ribbon to switch to a different default group for that document. Often this behavior is unwanted, and it is work to switch back to your previous place.  It can also cause confusion as new icons and commands appear seemingly at random and it is not always immediately clear what happened (“where did my commands go?”).  This behavior is particularly common in Access 2010.

    – The functionality of Backstage View is welcome and the overal concept is nice, but I strongly dislike how the File menu has been effectively overloaded by this feature.  The problem is there is this huge and jarring context switch into… someplace else, with your work no longer visible, when you just want to save or create a new document. I realize that I can customize the Quick Access Toolbar to surface common commands, but really, 99% of users will never do this. Making File an actual Ribbon group or a menu as in Office 2007, having New, Open, Close, Save, Print, etc. along with the ability to ckick into Backstage View for more options would be better, IMHO.

    Thanks for listening

  54. Josh says:

    Good job guys!

    The ribbon is clearer, which makes it easier to see things.  All the bulky borders from 2007 are gone!

    again great job!

  55. Langbein says:

    On Windows XP the contrast between Windows (in Outlook click on “New mail”) is bad, because there are no shadows on the windows like on Windows Vista/7.

  56. joakim2 says:

    Don’t mess the great layout of 2007 up. It looks like you are going to make 2010 Flat and ugly, and that doesn’t make sense since you really did a great job on 2007?

  57. Marc says:

    I do like the new visual design and I think the backstage is a good idea. It is just not thought out well enough.

    Please do away with all this different pop-up dialog boxes! You now have a fresh backstage view to populate. The current way is much too visually noisy. Sample: Save As

    1. Click the File Menu (hard to hit, why not Fits Law upper corner? Large step back backward)

    2. The whole screen changes to the back stage view

    3. Click on Save As

    4. Again the whole screen changes back to the document view

    5. The Save As dialog appears just as it ways “years ago”. This is just sooo last century 😉

    Why not allow the following flow:

    1. Click & Hold on File Menu Square (double height to utilize Fits corner)

    2. The Backstage appears

    3. Release over Save As, the right part of the backstage shows the Save As area.

    4. Change Filename & Path at will & click on the save button.

    Alternative way (both ways should be supported):

    1. Click on File Menu Square

    2. The Backstage appears

    3. Click Save as

    4. Same as above

    Other dialogs to be incorporated into the backstage are Help and Options (currently a little less awful than before, but still crazy). The New section needs to be changed to give direct access to the users own templates (and the organizations’).

    Additional improvements:

    1. Make a drag source in the Information section of the backstage allowing to drag the current document to a new location (like mail attachment or similar).

    2. The Save As backstage area should contain links into sharepoint.

    3. All document properties should be accessible from the Information view, incl. cust. properties.

    4. LRU list should be accessible with one click. Click & hold on file, hover Recently Used and release above selected file.

    5. Could the LRU list contain Email locations? Would be great.

    6. Windows 7 Jump List should include links to New documents with selected template.

    7. Searchable option dialog. Allow a search field to find all that obscure settings that you can never group in a global understandable logic.

    Best regards,

    Marc

  58. Marc says:

    @ Keri: The group may light up, but my eyes do not pick that up on a laptop screen. But I do not miss that much. You should continue the path to less clutter, distracting display changes and others (animated splash screens???).

    Marc

  59. Keri [MSFT] says:

    @Marc: Are you asking to see a video of the animated splash screen? Unfortunately we are not able to post a video to the blog at this time.

  60. Mike Maxwell says:

    “We’ve continued the tradition of shipping three UI themes; Silver, Blue, and Black. All of the text in the Silver theme now has a 5:1 contrast ratio…”  I agree with Davyd McColl that I would like the capability of disabling the Office themes, partly because they’re different from the themes that all my other programs use, and therefore confusing; and partly because they’re too pastel, and I can’t tell at a glance whether that window has the focus or not.

  61. C.M. says:

    I completely agree with the post by Noname. This is a huge step backward. The spacing between icons and other elements seem all completely off. And I mean horrendously so. Things don’t align… different spacing in different elements… it’s all jarring.

    Case-in-point? Try minimizing the navigation pane in Outlook. Mouse over the Mail, Calendar, Contacts icons. Who designed this? Is it me or does all this look like it was design by entry-level programmers and not graphic artists or UI experts?

    The blue theme (which matches Windows 7 nicely) is OK and should probably be the default.

    For years I have wished that that the marketing dept had less of a hand in Office. I mean, animated splash screen? Office 2007 loads in almost a millisecond when cached… instantly!!! But now no matter how many times I launch an Office 2010 app, it takes at least a couple of heartbeats to show up because of the needless animated splash screen. Come on folks. Please!

  62. C.M. says:

    I agree with a previous poster. The logos look like they’re from Windows 3.1

  63. Robert Foster says:

    I have tried every suggestion I found and I’m unable to set the default line spacing to single on any PC using the 2010 Beta. I was not having this problem until recently and I assume there has been an update that has caused the problem. If I set it to single and 0 for before and after and save as default for future docs it still goes back to the 1.5 spacing on the next new doc.

    Any ideas?

  64. Dan_IT says:

    I have to agree with most of the comments here about the lack of boarders in Office 2010. I think 2007’s interface was a big change at first but in time I grew to love it. I don’t see why they removed the boarders around the icons. The icons now just look like random images on each tab on the ribbon.

    Also, why did they take away 2007’s beautiful high-gloss effect. I liked the way the ribbon used to almost shine. Now it looks flat and boring.

    The file orb was a horrendous change. I was shocked at how long it took me to figure out that that’s where I got to open, save and print a document. I’ve been using Office a long time as well as being a Microsoft Office Specialist so it should not have been that cryptic.

    That’s why I do like the idea of a file tab, however does it need to be such a vibrant blue? It makes the rest of the tabs on the ribbon look washed out. I also agree with what somebody said above about the home tab. Home and File mean very similar things to most users. Therefore they should keep the File view and backstage but rename the Home tab to Format as that’s what all the tools under taht tab are used for – formatting.

    Also I may be missing something but where is the Print Preview button gone. It’s not under print in backstage. I’m sure its lurking around somewhere but why move it? I did however feel that Print Preview should show up under the review tab but I’ll let that one slide 😉

    Overall I do think Office is advacing and there are many reasons to use 2010 over 2003.  I just feel that 7 years in computer terms is an eternity. We should have come on leaps and bounds.

    One more suggestion though. I think it’s been mentioned above. Why can’t we customize the theme of Office APplications Aero-Style. Enabling transparent glass effects, changing the colour and transparency. The look of Office certainly doesn’t fit with Windows 7 the way 2003 fit with XP. Just a suggestion.

  65. Dissapointed says:

    Your images show a clear step backwards in clarity and organization. Now office looks like something a rookie would have written. I am very dissapointed and will wait until the next release.

    How is it that you think a cluttered un-organized screen looks better or is easier to use? Did you loose some code and not wish to re-write it?

  66. Keri [MSFT] says:

    @Dan

    For Office 2010 we actually exposed more of the Aero and Win7 glass styling in our upper ribbon (window frame). If you have transparency enabled in the Control Panel > Appearance and Personalization > Window Color and Appearance it should be rendering the same way in the Office frame. If you are running XP you do not get the transparency and color choices.

  67. Keri [MSFT] says:

    @Robert Foster

    Try this:

    1. Click Home tab

    2. In the Styles section, click Change Styles

    3. Click Paragraph Spacing

    4. Click Custom Paragraph Spacing

    5. Select the Set Defaults tab and change the Line Spacing to your desired setting.

    6. Select New documents based on this template

    7. Click OK

  68. RibbonLESS says:

    Whatever happened to Microsoft “compliance” seal?

    O, that is right, the current Microsoft employees were not around then.

    Microsoft had a “STANDARD” that everyone had to follow to get the “Microsoft Approval Seal”!

    Now with Office 2007 and Vista Microsoft’s NEW management broke the “Standard that had been in place for over 15 years!!

    How STUPID can you be! Change the menus back!!!!!!!!!!!!!!!

  69. Dave W says:

    Why doesn’t Office 2010 use the Windows Color scheme as you set in Windows?  For instance I like my active window to be distinguished from the background windows.  When an email is open on top of Outlook you can’t easily determine the the right window.

    Still getting used to this, but I am sure I will like it if I could get it to use the right color scheme I choose.

  70. Vishal says:

    Everything is good with this another release of office 2010, but I thing that the themes can’t be limited to only three colors, it can be user friendy or can be in more colors.. Also with the effect that office 2007 have I think that was pretty good.  

  71. tony says:

    Well I agree with most of the points above:

    • The lack of button outlines on the ribbon looks awful. This seems like change for the sake of change. Button outlines are useful to users because they show the hitzone for the button in question.

    • The removal of the orb in favour of a File tab is a mistake. I expected the Home tab to be leftmost and it is annoying that this is no longer the case. Please consider removing the file tab.

    • The color of the file button/tab is VERY VERY distracting. It should be the same as all the other tabs and not stick out so badly.

    • When mousing over the ribbon in 2007, the group would light up. This does not happen in 2010 and mouseovers only happen when you hover over a button. The old style was clearer in my opinion.

    • The groupings of buttons on the ribbon (clipboard, font, paragraph and styles on the home tab for instance) is a step back from 2007. In 2010 they are just dividers whilst in 2007 they were properly boxed off and metaphorically grouped. The new style means the groups “run in” to one another.

    • The contrast between active and non active tab is not sufficient to be clear.

    • The ribbon and colors of 2007 are far cleaner, better defined and more inviting than 2010 (color, button outlines, more rounded corners)

    • The buttons below “Customise the Ribbon” on the options screen are badly placed and need aligning. They look very haphazard at the moment.

    • You should be able to maximize the options window. There is no reason why this should be a set size

    • The exit button on the backstage view looks like it is used to exit backstage – not the application! This could be clearer

    • The help icon on the ribbon does not match

    the one on the help window that pops up! The one on the ribbon looks flat whilst the one on the dialogue is much better looking.

    The new colour scheme and look is truly anaemic, the lack of borders on the buttons on the ribbon is a pointless and backwards step and the fact you have not made any real enhancements is a shame.

  72. HardinMan says:

    I have been using Outlook 2010 for the past few weeks. I uploaded all my contacts from Outlook 2008. The contact groups were transaferred correctly. However, when I start a new Email and type the contact group name in the to box it is not recognized and I need to go to my contacts list to select the required group. In 2008 all I had to do was type the first few letters of contact group and it appeared in my To list. How can I correct this problem. Thanks for any help

  73. Damien says:

    This is by far one of hardest to read softwares I've ever seen.  Why in the hell would you teach us to look for borders, and then remove them and replace them with whitespace surrounded by a much smaller font of text.  Hell, I'm only 30 years old and need a telescope to make out my email now.  This is the first time I've ever complained about software changes, including my silence over Win ME & Vista.  Please update this to allow for more visual representation, because my Microsoft allegiant ass will soon be shopping for a replacement forever, if not.

  74. Remmy says:

    I just started using Office 2010, and I think the color schemes are terrible! Little contrast, makes me think of the 2003 colors, I miss the 2007 'high contrast'. My calendar in Outlook 2010 is already annoying me: in the 'monthly' view (the one I always use), the days in the 'previous' and 'next' month have a blue background, which makes it very messy as a whole. I also have trouble seeing what day is 'today' and I don't know how to explain this but it's just one big muddle. A big 'booo' to Microsoft for this!!! (And for not including more ways for users to customize the colors!)

  75. Colum says:

    I found this thread whilst trying to find a way to change the appearance of Office 2010. I'm already beginning to fear that there is none and that, for the first time in my life, I am going to revert to a previous version of Office (2007). In work, we are were just about to upgrade to Office 2007. With the advent of Office 2010, we have been asking ourselves if we should bypass 2007 and go straight to 2010. I can tell you that that just isn't going to happen. 2007 it is – because it looks cheerful, whereas Office 2010 looks depressing! Microsoft, it seems, have hired some weavers of gold who have made them some splendid invisible garments that only those Microsoft executives who are worthy of their posts can see. Hmmm.