{"id":44535,"date":"2018-06-19T14:19:20","date_gmt":"2018-06-19T14:19:20","guid":{"rendered":"https:\/\/blogs.msdn.microsoft.com\/devops\/?p=44535"},"modified":"2019-02-14T15:49:53","modified_gmt":"2019-02-14T23:49:53","slug":"new-navigation","status":"publish","type":"post","link":"https:\/\/devblogs.microsoft.com\/devops\/new-navigation\/","title":{"rendered":"New Navigation for Visual Studio Team Services"},"content":{"rendered":"

I\u2019m excited to share the new navigation we\u2019re\u00a0working\u00a0on\u00a0for\u00a0<\/span>Visual Studio Team Services (VSTS)<\/span><\/a> to modernize the user experience\u00a0and\u00a0give you more flexibility<\/span>.\u00a0As\u00a0Lori mentioned in her blog post<\/a>, our goal to create an integrated suite that also gives the flexibly to pick and choose the services that work best for you.\u00a0That goal is\u00a0a common customer request and at the heart of this new design.\u00a0In\u00a0the next few weeks,\u00a0you\u2019ll see a \u201cNew Navigation Preview\u201d\u00a0message\u00a0pop up\u00a0in your VSTS account. Please give it a try, it only affects your view of your account and you can easily roll back if you need to. This is the beginning of the update to our design and so we are very keen to get your feedback at this early stage.<\/p>\n

A new design\u00a0<\/span><\/span><\/span>style<\/span><\/span>\u00a0<\/span><\/h3>\n

The new style is inspired by the Fluent design language<\/a> being adopted across Microsoft and will be rolled out over the next few months. We\u2019re starting with\u00a0<\/span><\/span><\/span>design improvements\u00a0<\/span><\/span><\/span>to the<\/span><\/span>\u00a0<\/span>navigation and\u00a0<\/span><\/span><\/span>then\u00a0<\/span><\/span><\/span>we’ll deliver updates to<\/span><\/span>\u00a0<\/span>the content of each page. The goals of the new design language are to be clear, to gracefully support high information density, and – of course – be fast. The result will be an emphasis on the content of your work while providing a consistent and predictable experience across all aspects of VSTS.<\/span><\/span><\/p>\n

\"new<\/p>\n

Project navigation<\/span><\/h3>\n

The project navigation was moved to the left so that there\u2019s a clear separation between the project and global spaces. To improve wayfinding, we’ve added service icons with color accents along with new section icons.<\/span><\/span><\/span><\/p>\n

\"new<\/p>\n

A new global\u00a0<\/span><\/span><\/span>header\u00a0<\/span><\/span>is present on every page of the product regardless of where you are.<\/span><\/span>\u00a0It shows location context along with providing quick access to global controls.<\/span><\/span>\u00a0<\/span><\/p>\n

\"header<\/p>\n

From left-to-right, the components of the header are:<\/span>\u00a0<\/span><\/p>\n