I designed several cornerstone aspects of the user interface of Microsoft Visual Studio, including the dynamic menu system, dynamic help window, and the window tiling and autohide system that subsequently influenced Windows.

Prior to my changes in Visual Studio, Microsoft Windows apps that supported multiple documents being open at the same time, had a design pattern called “multiple document interface” (MDI).  In MDI apps, the child windows were contained within the parent window and they were unruly and made it difficult to manage the number of files that developers often had open. After watching developers, I realized that maximizing the document space and then making it easy for them to split and tile, to view a C++ file and it’s header file at the same time, for example, would be a much better approach.  So, I decided to toss out MDI and replace it with a tabbed document system.  Additionally, you can grab and move the tabs and dock them within the application frame using a visualization of drop zones.  At the time, this was all new and no one had done this before. Eventually, this design pattern was picked up by the Windows team, and then it’s also now appeared in the Adobe family of apps as well.

Then I also wanted to do something to maximize screen space for developers. In addition to document windows, we had the concept of “tool windows” which are permanently installed windows that operate upon the open documents. As the number of products inside Visual Studio increased, the number of tool windows that could be open became unmanageable. We had the concept of auto-hiding tool windows, but they would just disappear and you wouldn’t know which ones were open and where they were located. So I introduced the idea of a vertical channel where we could place the auto-hidden windows. By releasing the “pin” icon on a tool window, it would go into auto-hide mode and show up in the vertical channel.

Once a window is “unpinned” then the tool window tucks into the vertical channel, alongside the other tool windows with which it is docked.

The final state is a wide-open document space that maximizes working area for coding, even on smaller screens, such as laptops.