Visual Studio 11 User Interface Updates Coming in RC

Visual Studio 11 User Interface Updates Coming in RC

Rate This

With the release of Visual Studio 11 Beta back in February of this year, we introduced changes to the user experience based on two core design principles, the first being to give you more space for your content and the second being to draw more focus to that content. Since the debut of these changes there’s been significant community response and feedback. We’ve taken this feedback and based on what we heard have made a number of changes planned for Visual Studio 11 RC. I want to thank you for your continued feedback through this blog, and also through the various other community channels - please keep it coming.

The purpose of this post is to provide you with an update on the changes we’ve made since beta. I’ve also included a brief summary of the beta feedback that we’ve leveraged in making these updates.

Beta Feedback

We have been fortunate in getting a lot of actionable user feedback relating to the Visual Studio 11 Beta release. In sorting through the feedback we found it to be primarily focused on three aspects of the new themes.

  • An overall desire for more visual “energy” and contrast
  • Calls for a more balanced application of Metro styling
  • A desire for greater icon clarity and differentiation through the use of color

Here is a quick glimpse at the changes we’ve made from beta to RC in keeping with what we heard from you. Each of the changes reflected in these screenshots is called out in detail within the remainder of this post.

Visual Studio 11 Beta

Visual Studio 11 RC

Increasing the Energy

For beta there has been a lot of feedback on the overall grayness of the experience. We heard your call for greater vitality in the user experience and have taken steps to both lighten and brighten the experience through the use of bolder theme accents and lighter background colors.

There are three main aspects of the design where we have increased the “energy” level of the Visual Studio 11 themes. The first is to lighten the grays used in the Visual Studio 11 light theme and window chrome to improve both the energy level and readability of the experience.

Visual Studio 11

Visual Studio 11

The second is to colorize the Status Bar. We are using the status bar color to add visual interest and functional value by communicating various IDE state changes such as when the IDE is in debug mode.

Visual Studio 11

Visual Studio 11

The third way in which we will be adding greater flavor to the themes in general is to make broader and slightly bolder use of our accent colors in areas like tool window headers and tab treatments.

Visual Studio 11

Visual Studio 11

Control Styling

The feedback relating to the fit of Metro style elements in the new experience has fallen into three main buckets. The use of all caps for tool window titling is an area where we’ve heard your concerns. In line with our overall design principles for the release we’ve made lightweight changes that give structure and emphasis to screen areas like tool window title bars, auto-hidden tabs, tab groups, and separators that doesn’t require uppercasing the titles. As is reflected in the screenshots below we’ve removed all caps for tool window titles, auto-hidden tabs, and tab group members.

Visual Studio 11

For RC the only UI area where we will be using All Caps titling is for top level menu titles.

Visual Studio 11

Another area of requested change relating to user interface controls/chrome has been for us to improve the overall sense of Metro styling within the themes by drawing our own window chrome. By drawing our own window chrome we have succeeded in both making more efficient use of space and in increasing the overall sense of Metro styling.

Visual Studio 11

The custom chrome and line work changes we’ve made together with reducing the number of default toolbars and toolbar icons combine to give you three extra visible lines of code in the editor compared to Visual Studio 10. As I noted at the beginning of the post the overall objective behind many of the Visual Studio 11 theme changes is to give you maximum real-estate for, and ability to focus on, your code.

Visual Studio 11

A final area highlighted within your feedback was the desire to see us theme scrollbars and other UI elements so that they have a stronger Metro style feel. We are continuing to look into these requests and will keep you posted if there will be any additional modifications or updates.

Addressing Icon Usability Concerns

From Visual Studio 11 Beta we heard a lot of concern about the removal of color from icons negatively affecting product usability, specifically where color icons helped quickly distinguish between similar items. We have addressed this concern by systematically adding color back to select commands, IntelliSense, and Solution hierarchy icons.

Post-beta we have employed a simple rule set that combines icon selection heuristics for common actions and content conventions with a basic five color palette. When taken in conjunction with the flatter and simpler glyph style shapes of our Visual Studio 11 icons these rules give us a recipe for applying color in a very straightforward and consistent manner.

The first area where we’ve systematically reintroduced color into the icons is to add color to common action types (e.g. create/new, add/remove, start/stop, search, move/direction/connect). This helps add greater distinction to common action icons and in turn helps to breakup or chunk menus and toolbars into smaller more scan-able subgroups.

Visual Studio 11

The second area where we’ve reintroduced color in icons is the Solution Explorer. Feedback from users, instrumentation data, and observational research all tell us that next to your content (i.e., the editor), the Solution Explorer is where you spend the most time. The desire for us to use color to differentiate icons within the Solution Explorer was a key point of emphasis within the beta feedback. We have reintroduced color selectively to be an aid that helps you quickly scan/differentiate one type of item from the next. We anticipate continuing to add and refine the use of color to this class of icons in Visual Studio 11.

Visual Studio 11 Solution Explorer

A third area where we have reintroduced color to icons is to promote familiarity and differentiation within IntelliSense. The Beta feedback pointed out that using IntelliSense icons to guide selection happens both with minimal reflection and very frequently. For RC we have reintroduced familiar IntelliSense color cues to aid you in quickly getting back to your current efficiency levels and beyond.

Visual Studio 11

In addition to the feedback regarding icon color we also received feedback that within the light theme the icons did not appear clear or crisp due to subtle outline that appeared around them. The outline exists to allow the same icon to work in the light, dark, or high contrast themes. Words like fuzzy were sometimes used to describe the fact that the outline around the icons and the light gray fill color within certain icons was visible within the light theme. This resulted in a lack of crispness and impacted icon discernibility. To address this we have adjusted the grays within the icons to eliminate any fuzziness or halo effect that existed within the Beta.

Visual Studio 11

In addition to the above mentioned changes we will continue to evaluate the most critical and commonly used icons that the community identifies as needing to be more discernible. We welcome your feedback on this area, so please send any comments our way.

Bringing it All Together

As noted above the changes we’re introducing post-beta are designed to both address core areas of Beta feedback and to maintain alignment with our primary design objectives for the release. While I’ve talked about these changes primarily within the context of the lighter theme we are verifying that all changes also work well with the dark theme.

Now, I’m hoping you are all enthusiastic in wanting to share your feedback on these changes and if you feel these updates are ultimately steps in the right direction. We are eager to get these changes into your hands with RC. When RC is available please download the release, keep the comments coming, and let us know what you think.

Monty HammontreeMonty Hammontree – Director of User Experience, Microsoft Developer Tools Division
Short Bio: Monty has been at Microsoft for ten years focusing primarily on developer tool experiences. He and his team provide product design and user research direction for the Visual Studio product family. He has 25 years of industry experience in product design and user research management.

Leave a Comment
  • Please add 1 and 5 and type the answer here:
  • Post
  • this ui SUX!    i mean I HATE IT.  it is hard to look at for any extended period of time for me.  

    did i mention i HATE it?   i dont use that word very often, but in this case, i F*CKING HATE it.

    Why couldn't they offer a "classic" theme as well?  Why black and white icons?  this is a step back to ...um....maybe a black and white mac?

    i am boycotting this release and not upgrading my apps until they give me an option for a decent UI that i have to look at for 8 to 9 hours a day.

  • this ui SUX!    i mean I HATE IT.  it is hard to look at for any extended period of time for me.  

    did i mention i HATE it?   i dont use that word very often, but in this case, i F*CKING HATE it.

    Why couldn't they offer a "classic" theme as well?  Why black and white icons?  this is a step back to ...um....maybe a black and white mac?

    i am boycotting this release and not upgrading my apps until they give me an option for a decent UI that i have to look at for 8 to 9 hours a day.

  • @George - We have a "Blue" theme available in the Visual Studio 2012 Color Theme Editor that one of our dev's recently released. This theme is similar to a classic theme. Please try that theme out!

    visualstudiogallery.msdn.microsoft.com/366ad100-0003-4c9a-81a8-337d4e7ace05

    Thanks,

    Cathy Sullivan

  • guess what: by making these kind of CRAP DECISIONS, you encourage distrust in people's hearts even more, and will alienate yourself from your own userbase, and let Apple & Google win... mark my words: in 10 to 15 years time, MS will be reduced to nothing if it continues like this, just like IBM has phased itself out of its dominant role in the computer market... it shriveled up to a dwarf, in comparison to what it could have been.  MS is going the same road.

    Open your eyes before we - your users - shut them and simply decide to spend our money elsewhere.

    Consider this mail a last wake-up-call from me, because my patience with MS is running out quickly.

    As a matter of fact, I am so pissed off that I just installed SharpDevelop, to see what these guys have to offer instead.

    I was not even planning to do this, but you just forced me to reconsider, just by CRAPIFYING the VS IDE so much, not only making it ugly, but also reducing text editing abilities one bridge too far.  This is more than I want to accept on an average day of development.  I'd rather go elsehwere and teach you a lesson, because seemingly, MS is not listening to its userbase, but stubbornly and reluctantly 'giving in' with crap excuses like 'We didn't want to give you back your colors, but decided to go all fancy on you and fiddle a bit with energy, but keep it gray anyway'.

    Yeah right, pull the ****** other one and get lost, you morons.

  • The visual studio 2010 was great, there is no need to change it.

    Why change looks on evry release?

    Please brin a 'Vs 2010 look' that would be great!

  • Sorry, I hate the new look, I hate Windows 8 Metro too. YUCK!

  • After using .net since 2002, and buying each new version, I have to say MS were doing better in 2002.  What is the matter with you guys, can you not make a sensible decision.

    I went into an Apple store for the first time, and I was so impressed with everything I saw ( screen resolutions, fonts and icons ) and got so depressed at the rubbish that MS are now producing.  

    If you don't start listening to your users, - as you obviously can't make your own sensible decisions anymore - you are going down the Blackberry road faster than you think. One bad mistake after another.  You simple cannot surround youselves with "YES MEN" you need to listen to the users.

    Actually I give you some free advise that represent 90% of your users  -  NO ONE LIKES BLACK AND WHITE SCRIBBLES AS ICONS AND YOU SHOULD STICK TO THE ENGLISH LANGUAGE GUIDELINES AND STOP USING ALL CAPITALS. - Ask Apple.  ( What a waste of good money, I think you should offer a refund. )

  • Vs 2010 style is the best

    we need option to retrieve the VS 2010 style

  • Overall, after using Vs.NET 2012 for over a month now, I have to say that I just plain HATE the IDE now.  Nice Job MS - ruin VS.NET and Windows - WHAT is going on in Redmond these days?

    @KevinFan:  Wonderful, you can HAVE Metro. I find it USELESS on a desktop PC where my primary means of getting things done is via mouse and keyboard.

    The current trend at MS needs to change direction and fast - I'm about to move to Linux after having been a Windows man since Windows 1.0 and yes, I still have my floppy disks.

  • Things I absolutely HATE:

    1.  The Metro look — not just in Visual Studio, but Windows-wide

    2.  Microsoft's unwillingness to support themes/skins to allow users to keep familiar color schemes and icon sets.

    3.  All-caps menus (who actually LIKES these?)

    4.  The assumption that all application UIs should be dumbed down/crippled to support a UI that only makes sense on smartphones/tablets.  (I don't know many devs who program on tablets or phones, for the record...)

  • I love this blog more than anything. I now have a handy place to visit whenever I need to feel utterly enraged and helpless at the baffling idiocy of a corporate entity that uses marketing alone to steer its ship. Imagine if hammers and screwdrivers were produced in this manner. We'd have crazy, unusable tools that don't fit in your hand anymore and flash ads for every 50 nails hammered.

  • Who cares if my code window is a little bigger I have a huge monitor!  I much prefer the more distinctive Icons.  If I want less space in the tool bar I put less on it...

    I find this much harder to use.

  • Please, make us focus on good and positive sides of Visual Studio, bring back good colors and remove caps lock.

  • CAPS in menu is insane.. Could you , fix it , please?

  • As far as vs 2012 features are concerned its great. However, when it comes to UX, i do believe that typographic interfaces are well suited for touch based app, where more importance should be given to 'CONTENT' rather than 'CHROME'. thus, the digitally authentic WP easily wins overs iOS.

    However, when it comes to non touch enterprise LOB app, we need or generally have too many cockpit like toolbar, button etc, thus importance is, how quickly & easily we can operate, Thus, here importance is not only on 'CONTENT' but also on the 'CHROME' too, thus here OS X easily wins over Windows Desktop mode. where in Xcode 5 we have many visual or photo-realistic icons & at times wherever required, skeuomorphic interfaces.

    Thus, importance should be given for 'CHROME' also, for non touch ENTERPRISE ONLY apps like Visual Studio, Office, Expression Studio etc.

Page 79 of 80 (1,190 items) «7677787980