The new developer experience in Visual Studio 11

I'm sure several of you have formed opinions on the new look & feel of the Visual Studio 11 Beta, whether you've installed it on your existing OS or have tried it on one of the preview versions of Windows 8 (or perhaps you've just seen screenshots on the web). I've been using it now for a couple of weeks – on and off, admittedly – and have mixed feelings about the new monochrome styling. A lot of people have stronger views (which is basically a polite way of saying it's fairly universally hated, judging from the feedback).

I do like the modern look of the UI, even if it's not Metro-based… I'm someone who's quite influenced by aesthetics, although not to the extent of form over function. The logic behind the new design is to reduce the use of colour in order to more effectively draw attention to colour when it's used. Colour is now being dedicated to presenting notifications and status updates to the user.

Fair enough, I suppose, although I admit I'm having trouble differentiating the icons on the debugging toolbar, and am constantly having to check the tooltips to work out how to step over a function rather than into it. I suspect it works better at lower resolutions – as it does in the below video.

</p> </div> </div> </div> </div> </div> </div> </div> </div> </div> </div> <p><script src="https://keanw.com/wp-includes/js/jquery/jquery.min.js?ver=3.7.1" id="jquery-core-js"></script><script type='text/javascript' src='https://keanw.com/wp-content/boost-cache/static/1872df43da.min.js'></script><script id="nfd-wonder-blocks-utilities-js-after"> (()=>{var l=class{constructor({clientId:e,...n}={}){this.options={activeClass:"nfd-wb-animated-in",root:null,rootMargin:"0px",threshold:0,...n}}observeElements(e,n=null,t=!1){if(!("IntersectionObserver"in window)||!e?.length||document.documentElement.classList.contains("block-editor-block-preview__content-iframe"))return;function o(c,s){this._mutationCallback(c,s,n)}let i=new IntersectionObserver(this._handleIntersection.bind(this),this.options),r=new MutationObserver(o.bind(this)),b=new MutationObserver(this._handleClassMutation.bind(this));e.forEach(c=>{let s=c;c.classList.contains("nfd-wb-reveal-right")&&(s=c.parentElement),i.observe(s),t&&(b.observe(s,{attributes:!0,attributeFilter:["class"]}),r.observe(s,{attributes:!0,attributeFilter:["class"]}))})}_handleIntersection(e,n){e.forEach(t=>{t.isIntersecting&&(t.target.classList.add(this.options.activeClass),t.target.querySelectorAll(".nfd-wb-animate").forEach(o=>{o.classList.add(this.options.activeClass)}),n.unobserve(t.target))})}_handleClassMutation(e){e.forEach(n=>{if(n?.type==="attributes"){let t=n.target;t.classList.contains("nfd-wb-animated-in")||t.classList.add("nfd-wb-animated-in")}})}_mutationCallback(e,n,t=null){e.forEach(o=>{if(o?.type==="attributes"){let i=o.target;t&&t===i.getAttribute("data-block")&&(i.getAttribute("data-replay-animation")===null&&(i.setAttribute("data-replay-animation",!0),requestAnimationFrame(()=>{i.removeAttribute("data-replay-animation")})),n.disconnect())}})}};document.addEventListener("DOMContentLoaded",()=>{d()});document.addEventListener("wonder-blocks/toolbar-button-added",()=>{d()});document.addEventListener("wonder-blocks/animation-changed",a=>{let e=a?.detail?.clientId;d(e)});document.addEventListener("wonder-blocks/block-order-changed",()=>{d()});window.onload=function(){d()};function d(a=null){let e=document.body?.classList.contains("block-editor-page")||!!a||document.body?.classList.contains("block-editor-iframe__body"),n=e?document.querySelector(".interface-interface-skeleton__content"):null,t=new l({root:n,threshold:0});requestAnimationFrame(()=>{let o=Array.from(document.getElementsByClassName("nfd-wb-animate"));t.observeElements(o,a,e)})}function u(a){(a||document).querySelectorAll(".wp-block-group.nfd-is-linked-group:not(.group-linked), .wp-block-cover.nfd-is-linked-group:not(.group-linked)").forEach(t=>{var o=t.getAttribute("data-link-url")||t.dataset.linkUrl;if(!o||!t.parentNode)return;let i=o.trim();o=/^(https?:)\/\//i.test(i)?i:"http://"+i;let r=document.createElement("a");r.href=o,(t.getAttribute("data-link-blank")==="1"||t.dataset.linkBlank==="1")&&(r.target="_blank",r.rel="noopener"),t.classList.add("group-linked"),[...t.attributes].map(({name:c,value:s})=>{r.setAttribute(c,s)}),r.innerHTML=t.innerHTML,t.parentNode.replaceChild(r,t)}),p()}function p(){document.addEventListener("click",a=>{a.target.closest(".block-editor-page .wp-block-group.nfd-is-linked-group, .block-editor-page .wp-block-cover.nfd-is-linked-group")&&a.preventDefault()},{capture:!0,passive:!1})}document.readyState==="loading"?document.addEventListener("DOMContentLoaded",()=>u(document)):u(document);document.addEventListener("wonder-blocks/group-links-apply",a=>{u(a?.detail?.ctx||document)});})(); //# sourceURL=nfd-wonder-blocks-utilities-js-after </script><script type="text/javascript" src="//tags.tiqcdn.com/utag/autodesk/micro-basic/prod/utag.js"></script><script> document.addEventListener("DOMContentLoaded", function() { var copyLinks = document.querySelectorAll("a[data-platform='copy-link']"); copyLinks.forEach(function(link) { if (link.hasAttribute("data-listener-added")) return; link.setAttribute("data-listener-added", "true"); link.addEventListener("click", function(e) { e.preventDefault(); var tempInput = document.createElement("input"); tempInput.value = window.location.href; document.body.appendChild(tempInput); tempInput.select(); document.execCommand("copy"); document.body.removeChild(tempInput); var originalText = this.querySelector(".social-sharing-icon-label")?.textContent || ""; var originalTitle = this.getAttribute("title"); var originalIcon = this.querySelector("svg").outerHTML; // Show success feedback this.setAttribute("title", "Copied!"); this.classList.add("copied"); if (this.querySelector(".social-sharing-icon-label")) { this.querySelector(".social-sharing-icon-label").textContent = "Copied!"; } else { this.querySelector("svg").outerHTML = '<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" width="20" height="20" style="fill:#ffffff;" aria-hidden="true" focusable="false"><path d="M9 16.17L4.83 12l-1.42 1.41L9 19 21 7l-1.41-1.41L9 16.17z" /></svg>'; } var self = this; setTimeout(function() { self.setAttribute("title", originalTitle); self.classList.remove("copied"); if (self.querySelector(".social-sharing-icon-label")) { self.querySelector(".social-sharing-icon-label").textContent = originalText; } else { self.querySelector("svg").outerHTML = originalIcon; } }, 2000); }); }); }); </script><script> document.addEventListener("DOMContentLoaded", function() { var copyLinks = document.querySelectorAll("a[data-platform='copy-link']"); copyLinks.forEach(function(link) { if (link.hasAttribute("data-listener-added")) return; link.setAttribute("data-listener-added", "true"); link.addEventListener("click", function(e) { e.preventDefault(); var tempInput = document.createElement("input"); tempInput.value = window.location.href; document.body.appendChild(tempInput); tempInput.select(); document.execCommand("copy"); document.body.removeChild(tempInput); var originalText = this.querySelector(".social-sharing-icon-label")?.textContent || ""; var originalTitle = this.getAttribute("title"); var originalIcon = this.querySelector("svg").outerHTML; // Show success feedback this.setAttribute("title", "Copied!"); this.classList.add("copied"); if (this.querySelector(".social-sharing-icon-label")) { this.querySelector(".social-sharing-icon-label").textContent = "Copied!"; } else { this.querySelector("svg").outerHTML = '<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" width="20" height="20" style="fill:#ffffff;" aria-hidden="true" focusable="false"><path d="M9 16.17L4.83 12l-1.42 1.41L9 19 21 7l-1.41-1.41L9 16.17z" /></svg>'; } var self = this; setTimeout(function() { self.setAttribute("title", originalTitle); self.classList.remove("copied"); if (self.querySelector(".social-sharing-icon-label")) { self.querySelector(".social-sharing-icon-label").textContent = originalText; } else { self.querySelector("svg").outerHTML = originalIcon; } }, 2000); }); }); }); </script><script data-noptimize>document.getElementById("comment").setAttribute( "id", "a0befbf5797b55ca57c9cf9713989cb8" );document.getElementById("d0edacb01d").setAttribute( "id", "comment" );</script><script>document.getElementById( "ak_js_1" ).setAttribute( "value", ( new Date() ).getTime() );</script><script type="speculationrules"> {"prefetch":[{"source":"document","where":{"and":[{"href_matches":"/*"},{"not":{"href_matches":["/wp-*.php","/wp-admin/*","/wp-content/uploads/*","/wp-content/*","/wp-content/plugins/*","/wp-content/themes/hey-wpcom/*","/*\\?(.+)"]}},{"not":{"selector_matches":"a[rel~=\"nofollow\"]"}},{"not":{"selector_matches":".no-prefetch, .no-prefetch a"}}]},"eagerness":"conservative"}]} </script><script type="text/javascript"> var inboxs = new Array(); inboxs['hidezeronumberitem'] = "yes"; inboxs['selectors'] = '.tooltips_list > span'; inboxs['navitemdefaultsize'] = '12px'; inboxs['navitemselectedsize'] = '14px'; inboxs['number'] = "no"; jQuery(document).ready(function () { jQuery('.member_directory_table').directory(inboxs); jQuery('.navitem').css('font-size','12px'); }) </script><script type="text/javascript"> jQuery(document).ready(function () { jQuery('.tooltips_table_items .tooltips_table_title .tooltipsall').each (function() { disabletooltipforclassandidSinglei = jQuery(this).text(); jQuery(this).replaceWith(disabletooltipforclassandidSinglei); }) }) </script><script type="text/javascript"> jQuery(document).ready(function () { jQuery('.tooltips_table_items .tooltips_table_content .tooltipsall').each (function() { disabletooltipforclassandidSinglei = jQuery(this).html(); jQuery(this).replaceWith(disabletooltipforclassandidSinglei); }) }) </script><script type="text/javascript"> jQuery(document).ready(function () { jQuery('.tooltips_table_items .tooltips_table_title .tooltipsall').each (function() { disabletooltipforclassandidSinglei = jQuery(this).text(); jQuery(this).replaceWith(disabletooltipforclassandidSinglei); }) }) </script><script type="text/javascript"> jQuery(document).ready(function () { jQuery('.tooltips_table_items .tooltips_table_content .tooltipsall').each (function() { disabletooltipforclassandidSinglei = jQuery(this).html(); jQuery(this).replaceWith(disabletooltipforclassandidSinglei); }) }) </script><script type="text/javascript"> if(typeof jQuery=='undefined') { document.write('<'+'script src="https://keanw.com/wp-content/plugins//wordpress-tooltips/js/qtip/jquery.js" type="text/javascript"></'+'script>'); } </script><script type="text/javascript"> function toolTips(whichID,theTipContent) { theTipContent = theTipContent.replace('[[[[[',''); theTipContent = theTipContent.replace(']]]]]',''); theTipContent = theTipContent.replace('@@@@',''); theTipContent = theTipContent.replace('####',''); theTipContent = theTipContent.replace('%%%%',''); theTipContent = theTipContent.replace('//##',''); theTipContent = theTipContent.replace('##]]',''); jQuery(whichID).qtip ( { content: { text:theTipContent, }, style: { classes:' qtip-dark wordpress-tooltip-free qtip-rounded qtip-shadow ' }, position: { viewport: jQuery(window), my: 'bottom center', at: 'top center' }, show:'mouseover', hide: { fixed: true, delay: 200 } } ) } </script><script type="text/javascript"> jQuery("document").ready(function() { jQuery("body img").each(function() { if ((jQuery(this).parent("a").attr('title') != '' ) && (jQuery(this).parent("a").attr('title') != undefined )) { toolTips(jQuery(this).parent("a"),jQuery(this).parent("a").attr('title')); } else { var tempAlt = jQuery(this).attr('alt'); if (typeof(tempAlt) !== "undefined") { tempAlt = tempAlt.replace(' ', ''); if (tempAlt == '') { } else { toolTips(jQuery(this),jQuery(this).attr('alt')); } } } } ); }) </script><script type="text/javascript"> var inboxs = new Array(); inboxs['language'] = "en"; inboxs['hidezeronumberitem'] = "no"; inboxs['navitemselectedsize'] = '18px'; inboxs['selectors'] = '.tooltips_list > span'; inboxs['navitemdefaultsize'] = '12px'; inboxs['number'] = "yes"; jQuery(document).ready(function () { jQuery('.tooltips_directory').directory(inboxs); jQuery('.navitem').css('font-size','12px'); }) </script><script type="text/javascript"> jQuery(document).ready(function () { jQuery('.tooltips_table_items .tooltips_table_title .tooltipsall').each (function() { disabletooltipforclassandidSinglei = jQuery(this).text(); jQuery(this).replaceWith(disabletooltipforclassandidSinglei); }) }) </script><script type="text/javascript"> jQuery(document).ready(function () { jQuery('.tooltips_table_items .tooltips_table_content .tooltipsall').each (function() { disabletooltipforclassandidSinglei = jQuery(this).html(); jQuery(this).replaceWith(disabletooltipforclassandidSinglei); }) }) </script><script>window.addEventListener( 'load', function() { document.querySelectorAll( 'link' ).forEach( function( e ) {'not all' === e.media && e.dataset.media && ( e.media = e.dataset.media, delete e.dataset.media );} ); var e = document.getElementById( 'jetpack-boost-critical-css' ); e && ( e.media = 'not all' ); } );</script><script type='text/javascript' src='https://keanw.com/wp-content/boost-cache/static/30ad04232f.min.js'></script><script id="wp-block-template-skip-link-js-after"> ( function() { var skipLinkTarget = document.querySelector( 'main' ), sibling, skipLinkTargetID, skipLink; // Early exit if a skip-link target can't be located. if ( ! skipLinkTarget ) { return; } /* * Get the site wrapper. * The skip-link will be injected in the beginning of it. */ sibling = document.querySelector( '.wp-site-blocks' ); // Early exit if the root element was not found. if ( ! sibling ) { return; } // Get the skip-link target's ID, and generate one if it doesn't exist. skipLinkTargetID = skipLinkTarget.id; if ( ! skipLinkTargetID ) { skipLinkTargetID = 'wp--skip-link--target'; skipLinkTarget.id = skipLinkTargetID; } // Create the skip link. skipLink = document.createElement( 'a' ); skipLink.classList.add( 'skip-link', 'screen-reader-text' ); skipLink.id = 'wp-skip-link'; skipLink.href = '#' + skipLinkTargetID; skipLink.innerText = 'Skip to content'; // Inject the skip link. sibling.parentElement.insertBefore( skipLink, sibling ); }() ); //# sourceURL=wp-block-template-skip-link-js-after </script><script id="nfd-performance-lazy-loader-js-before"> window.nfdPerformance = window.nfdPerformance || {}; window.nfdPerformance.imageOptimization = window.nfdPerformance.imageOptimization || {}; window.nfdPerformance.imageOptimization.lazyLoading = {"classes":["nfd-performance-not-lazy","a3-notlazy","disable-lazyload","no-lazy","no-lazyload","skip-lazy"],"attributes":["data-lazy-src","data-crazy-lazy=\"exclude\"","data-no-lazy","data-no-lazy=\"1\""]}; //# sourceURL=nfd-performance-lazy-loader-js-before </script><script src="https://keanw.com/wp-content/plugins/bluehost-wordpress-plugin/vendor/newfold-labs/wp-module-performance/build/assets/image-lazy-loader.min.js?ver=1772668822" id="nfd-performance-lazy-loader-js"></script><script id="linkprefetcher-js-before"> window.LP_CONFIG = {"activeOnDesktop":true,"behavior":"mouseHover","hoverDelay":60,"instantClick":false,"activeOnMobile":true,"mobileBehavior":"viewport","ignoreKeywords":"#,?","isMobile":false} //# sourceURL=linkprefetcher-js-before </script><script src="https://keanw.com/wp-content/plugins/bluehost-wordpress-plugin/vendor/newfold-labs/wp-module-performance/build/assets/link-prefetch.min.js?ver=4.14.0" id="linkprefetcher-js" defer></script><script type='text/javascript' src='https://keanw.com/wp-content/plugins/social-icons-widget-by-wpzoom/assets/js/social-icons-widget-frontend.js?m=1771286448'></script><script id="jetpack-stats-js-before"> _stq = window._stq || []; _stq.push([ "view", {"v":"ext","blog":"104786606","post":"6307","tz":"0","srv":"keanw.com","j":"1:15.6"} ]); _stq.push([ "clickTrackerInit", "104786606", "6307" ]); //# sourceURL=jetpack-stats-js-before </script><script src="https://stats.wp.com/e-202610.js" id="jetpack-stats-js" defer data-wp-strategy="defer"></script><script type="module"> /*! This file is auto-generated */ const a=JSON.parse(document.getElementById("wp-emoji-settings").textContent),o=(window._wpemojiSettings=a,"wpEmojiSettingsSupports"),s=["flag","emoji"];function i(e){try{var t={supportTests:e,timestamp:(new Date).valueOf()};sessionStorage.setItem(o,JSON.stringify(t))}catch(e){}}function c(e,t,n){e.clearRect(0,0,e.canvas.width,e.canvas.height),e.fillText(t,0,0);t=new Uint32Array(e.getImageData(0,0,e.canvas.width,e.canvas.height).data);e.clearRect(0,0,e.canvas.width,e.canvas.height),e.fillText(n,0,0);const a=new Uint32Array(e.getImageData(0,0,e.canvas.width,e.canvas.height).data);return t.every((e,t)=>e===a[t])}function p(e,t){e.clearRect(0,0,e.canvas.width,e.canvas.height),e.fillText(t,0,0);var n=e.getImageData(16,16,1,1);for(let e=0;e<n.data.length;e++)if(0!==n.data[e])return!1;return!0}function u(e,t,n,a){switch(t){case"flag":return n(e,"\ud83c\udff3\ufe0f\u200d\u26a7\ufe0f","\ud83c\udff3\ufe0f\u200b\u26a7\ufe0f")?!1:!n(e,"\ud83c\udde8\ud83c\uddf6","\ud83c\udde8\u200b\ud83c\uddf6")&&!n(e,"\ud83c\udff4\udb40\udc67\udb40\udc62\udb40\udc65\udb40\udc6e\udb40\udc67\udb40\udc7f","\ud83c\udff4\u200b\udb40\udc67\u200b\udb40\udc62\u200b\udb40\udc65\u200b\udb40\udc6e\u200b\udb40\udc67\u200b\udb40\udc7f");case"emoji":return!a(e,"\ud83e\u1fac8")}return!1}function f(e,t,n,a){let r;const o=(r="undefined"!=typeof WorkerGlobalScope&&self instanceof WorkerGlobalScope?new OffscreenCanvas(300,150):document.createElement("canvas")).getContext("2d",{willReadFrequently:!0}),s=(o.textBaseline="top",o.font="600 32px Arial",{});return e.forEach(e=>{s[e]=t(o,e,n,a)}),s}function r(e){var t=document.createElement("script");t.src=e,t.defer=!0,document.head.appendChild(t)}a.supports={everything:!0,everythingExceptFlag:!0},new Promise(t=>{let n=function(){try{var e=JSON.parse(sessionStorage.getItem(o));if("object"==typeof e&&"number"==typeof e.timestamp&&(new Date).valueOf()<e.timestamp+604800&&"object"==typeof e.supportTests)return e.supportTests}catch(e){}return null}();if(!n){if("undefined"!=typeof Worker&&"undefined"!=typeof OffscreenCanvas&&"undefined"!=typeof URL&&URL.createObjectURL&&"undefined"!=typeof Blob)try{var e="postMessage("+f.toString()+"("+[JSON.stringify(s),u.toString(),c.toString(),p.toString()].join(",")+"));",a=new Blob([e],{type:"text/javascript"});const r=new Worker(URL.createObjectURL(a),{name:"wpTestEmojiSupports"});return void(r.onmessage=e=>{i(n=e.data),r.terminate(),t(n)})}catch(e){}i(n=f(s,u,c,p))}t(n)}).then(e=>{for(const n in e)a.supports[n]=e[n],a.supports.everything=a.supports.everything&&a.supports[n],"flag"!==n&&(a.supports.everythingExceptFlag=a.supports.everythingExceptFlag&&a.supports[n]);var t;a.supports.everythingExceptFlag=a.supports.everythingExceptFlag&&!a.supports.flag,a.supports.everything||((t=a.source||{}).concatemoji?r(t.concatemoji):t.wpemoji&&t.twemoji&&(r(t.twemoji),r(t.wpemoji)))}); //# sourceURL=https://keanw.com/wp-includes/js/wp-emoji-loader.min.js </script></body></html>

I tend not to watch "user experience" videos as a rule, preferring to spend my video-watching time on coding technologies or industry strategy. But it was very interesting to see some of the time-saving features in Visual Studio 11.

For instance, I'm thrilled that I can search the properties and methods in the Solution Explorer using Ctrl-; and then navigate using arrow keys through the results, previewing the various documents prior to opening them for editing – very cool. And the ability to peel off new instances of the Solution Explorer for specific classes, attaching document preview pages to them, is just fantastic.

Another useful point of which I'd previously been unaware is the availability of Productivity Power Tools for Visual Studio 2010, which seem to include at least some of the new VS11 functionality. As I'm still likely to be using Visual Studio 2010 alongside VS11 for some time to come, this looks well worth taking for a spin.

One response to “The new developer experience in Visual Studio 11”

David Osborne

May 25, 2012 at 2:52 am

Hi Kean.
I just thought I'd mention that I installed the Productivity Power Tools, because I liked the Solution Navigator, the Auto Brace Completion, and rhe Organize Imports features (the Enhanced scrollbar was kind of nice, too, but there are other add-ins that provide that). However, since installing the Tools, I have experienced some rather strange and very annoying problems that have now caused me to disable the Tools altogether.

Through the Interface

The new developer experience in Visual Studio 11

One response to “The new developer experience in Visual Studio 11”

Leave a Reply Cancel reply