Friends of S.A. Architect

Lesson learnt: When you ask a developer or dev lead which view class is stable and ready to be used as an example, think twice before you start documenting. Change is imminent, change is guaranteed … but, we are agile and tenacious :)

This post is an update for the Treasure Map under the bonnet (hood) #1 … Windows 8 Layout Controls post and explains what has changed and why.

Making sure things have changed

 

Using the Visual Studio Compare feature, gave me a high-altitude view of the seemingly massive changes when looking at the navigation bar on the right:

  Styling information has been moved out of the category.xaml file, which account for most of the red (deleted) navigation bar and changes. The ListView control now refers to style="{StaticResource heroDataTemplateSelector}" and in-line styling has been removed.

Robert MacLean, our dev lead, refer to the heroDataTemplateSelector as a "very smart piece of XAML". Each time the items control (in our case a ListView) is ready to render an item it calls the selector to get advice on which template too use for rendering.

If you peruse the codebase and look for the HeroDataTemplateSelector.SelectTemplateCore method you will find the fairly simple code that overrides the SelectTemplate() method and make a very powerful decision which template should be used to render the item. In our case, we have a selector that checks if the item has a name or not - if not, we use the HeroTemplate, otherwise we use the StandardTemplate.

Dev Lead question time …

Why are we defining the  TemplateSelector and ListView style in the view file and not in the TreasureMap.xaml ResourceDictionary?

   

Robert MacLean, our dev lead, replies …

The template selector is defined in the view as it is very much specific to the view - it is not something we would reuse elsewhere in exactly the same way.

 

Delving into the ListView and associated Template

heroDataTemplateSelector

The HeroDataTemplateSelector defines two templates, namely HeroTemplate and StandardTemplate, both of which are defined on the Category page within the <Page.Resources/> tag.

The standardItemTemplate defines a grid with three rows, the third of which has a grid with three rows, an Image and two TextBlocks. Remember that we use this template when an item has a name, in other words when it refers to a category item such as the TFS Planning Guide, within the Guidance category.

The heroItemTemplate defines a grid with three rows, an Image and a TextBlock. It is used to display a category item without a name. When we cover DataBinding in the next post we will get back to this phenomenal magic, which comes at a minimal tax for the developers.

ListView

When we get back to our ListView within the third row of the main grid, as documented in Treasure Map under the bonnet (hood) #1 … Windows 8 Layout Controls, we notice that the xaml has been simplified and reduced down to declaring the ItemTemplateSelector as discussed above.

Mapping it back to the UX

For the visual readers, like Willy, will conclude this post by marching the above magic to the actual category view as shown below.

  The left-most item was rendered using the heroItemTemplate. Rows 0, 1 and 2 are indicated, which matche the xaml: <Grid.RowDefinitions>                    
<RowDefinition Height="450"/>
<RowDefinition Height="10"/>
<RowDefinition Height="*"/>
</Grid.RowDefinitions>   The items to the right were rendered using the standardItemTemplate. Rows 10, 1 and two are indicated, which match the xaml: <Grid.RowDefinitions>
<RowDefinition Height="300"/>
<RowDefinition Height="5"/>
<RowDefinition Height="*"/> </Grid.RowDefinitions>
<Grid Grid.Row="2">
<Grid.RowDefinitions>
<RowDefinition Height="Auto"/>
<RowDefinition Height="5"/>
<RowDefinition Height="*"/>
</Grid.RowDefinitions>
</Grid>

NOTE: <RowDefinition Height="Auto"/> demonstrates the Auto sizing mode, which uses exactly enough of the space to display the content, in this case the project title.

We will return to the data binding in the next post, whereby I will trace the data from XML file to the UX, where the above changes will probably start making sense. 

Dev Lead final question time …

Running the Category View in the Simulator I am wondering how the user will scroll to the right without a touch screen. Is this functionality not yet baked in?

   

Robert MacLean, our dev lead, replies …

For non-touch scenarios it supports mouse wheel, click and drag or scroll bar. The reason you were not seeing the scrollbar is because we just needed to turn on the horizontal and turn off the vertical scroll bars. "Change is imminent, change is guaranteed" - change has happened and is checked in

 

Benefits?

Readability and maintainability has been improved. In fact we decreased from 364 lines of xaml code to 64. The DataTemplateSelector is one of the magic that the team sprinkled over this latest codebase, making it a lot more powerful, yet simplify the design as indicated.

References

• ALM Readiness Treasure Map (Table of Content) TOC Post
• ALM Readiness Treasure Map Windows Store App
• Previous posts:
• Treasure Map under the bonnet (hood) #1 … Windows 8 Layout Controls
• Treasure Map under the bonnet (hood) #2 … Windows 8 Styling

More Resources to Explore             

• Ranger Publications
• Ranger Quick Response Sample Solutions

      Solution information     Tooling Samples Guidance Service Mode, no further updates planned.

The following Visual Studio ALM Rangers solutions have been developed for the ALM community:

Operations Guidance for Team Foundation Server
You can manage your deployment of Microsoft Visual Studio 2005 Team Foundation Server more effectively if you create your own operations plan. As you create your plan, you should understand key elements of the architecture of Team Foundation Server and how your deployment topology affects operations. This white paper explains those elements in detail, so that you can avoid common problems with your deployment.  

Team Foundation Server 2010 Monitoring Management Pack
The Team Foundation Server 2010 Monitoring Management Pack delivers the capabilities for professional monitoring and management of Team Foundation Server 2010 infrastructure components.  
TFS Planning and DR Avoidance Guide
Practical guidance for the implementation and disaster recovery planning for Team Foundation Server. TFS Teams Tool | Quick Response Sample Solution
Command line utility, such as TFSSecurity.exe , to add Teams and Team members to a Team Project.   TFS Upgrade Guide
Upgrade scenarios and post-upgrade issues for Team Foundation Server and associated technologies.
ALM Assessment Guide
Use the Rangers ALM Assessment to find out pragmatically where your organization stands in case of ALM Best Practices by using the assessment questions and qualitative discussions. Based on the results, make an action plan for improvements. ALM Rangers Personas and Customer Types
Common definition of personas and scenarios used in Visual Studio ALM Rangers guidance ALM Readiness Treasure Map
Provides a master catalogue (treasure map) of the available ALM Readiness content to guide us through the process of becoming proficient in ALM practices. Get the paper based map and sample source code from CodePlex and the application from the Store:

See ALM Readiness Treasure Map v2 – Show what we have for Sprint 10 (April) for more information on the next version.   Practical Kanban Guide
Offers teams that are new to Kanban and teams that are using a manual, paper-based Kanban board, guidance and tool support for Kanban in Team Foundation Server 2010 and Team Foundation Server 2012.   
Practical Ruck Guide
The Visual Studio ALM Rangers Ruck process evolved and used by the geographically dispersed and virtual ALM Rangers project teams. Supporting Guidance and Whitepapers
Research whitepapers and practical guidance for Visual Studio and Team Foundation Server, which have and are being created as part and in support of ALM Ranger solutions.   Visual Studio Quick Reference Guide
An overview of Visual Studio and Team Foundation Server in the form of compact, quick reference sheets. Users who are unfamiliar with Visual Studio get a “quick” overview of features, value and associated Rangers guidance. Visual Studio Architecture Tooling Guide
Focuses on modeling tools and includes understanding and reverse engineering an existing application or starting a new application from scratch. ALM Rangers DevOps (coming)   BRDLite Reference Templates
The Build Release and Deploy (BRD) Lite is a set of build process reference templates that allows you to quickly setup a real-world build process in your environment. Also see Team Foundation Build Customization Guide for guidance.   Visual Studio Database Guide
Practical guidance for Visual Studio 2010 database projects. Project Server 2007 VSTS Connector
The Visual Studio Team System Project Server 2007 Connector is designed to integrate the project management capabilities of VSTS with Project Server 2007. It's been developed by the Visual Studio Team System Rangers in response to significant customer demand for a connector solution.  
SharePoint Server Custom Application Development: Document Workflow Management Project
Read about the real-world design, construction, and deployment of a custom SharePoint Server 2007 application to a mid-market enterprise customer using Team Foundation Server as an ALM platform.  
TFS Integration Platform | TFS Integration Tools
The TFS Integration Platform is a project that facilitates the development of tools that integrate TFS with other systems. Also see TOC blog.    
Using TFS to Develop Custom SharePoint Products and Technologies Applications
Use Microsoft Visual Studio 2008 Team Foundation Server to support SharePoint application development, and provide an integrated development environment and single source code repository for process activities, integrated progress reporting, and team role.  
Visual Studio Lab Management Guide
Practical guidance for Visual Studio Lab Management, backed by VM Factory Guide automation. Visual Studio and TFS VM Factory Guide
Guidance and a reference implementation of a software solution that automates the creation of Microsoft environments, in particular Visual Studio and Team Foundation Server.   VM Demo Quick Environment Setup (coming) TFS Word Add-In
The Team Foundation Server Word Add-in allows you to import work items from a Team Foundation Server Team Project and generate professional-looking Word document from TFS Work items. TFS Reporting Guidance (coming) Requirements Management
The 2008 version was about general requirements management best practices and the best you can do with our current tooling to support these best practices. The 2010 is part 2 of this Ranger guidance focusing on new features of 2010 and how these features deliver better support for our RM best practices. Test Release Management Guide
Guidance and tooling to support scenarios for test case and test plan release management, including reporting and base-lining: sprint to sprint, release to release, and moving a feature through the branching guidelines scenarios. Device Testing (coming)   SQL Load Test
This tool takes a SQL Profiler trace file and generates a unit test that replays the same sequence of database calls found in the trace file. The unit test is designed to be used in a Visual Studio Load Test. The code generated is easily modifiable so that data variation can be introduced for the purpose of doing performance testing. Test Release Management Guide
See above under “Requirements Management” for more information. Unit Test Generator (coming)
See Unit Test Generator under the bonnet (hood) … aka vsarUnitTestFx for more information. Visual Studio Coded UI Microsoft Word Add-in
Practical guidance and tooling for the Visual Studio Coded UI Microsoft Word Plug-in, which extends the Coded UI feature support to Microsoft Word documents.   Visual Studio Test Tooling Guide (MTM, CodedUI, Fakes)
A range of test tooling (Microsoft Test Manager, Coded UI, Fakes and IntelliTrace) practical and scenario based guidance.

• Better Unit Testing with Microsoft Fakes
• Coded UI Guide
• Microsoft Test Manager Guide
• IntelliTrace

WCF Load Test
This tool takes a WCF trace file and a WCF client proxy, or a WCF interface contract, and generates a unit test that replays the same sequence of calls found in the trace file. The code generated is easily modifiable so that data variation can be introduced for the purpose of doing performance testing. Branching and Merging Guide
Practical guidance for branching and merging strategies on Team Foundation Server. Also refer to the Ranger Quick Response Sample Solutions if you have a need to implement a consistent branching model as part of team project or team creation process, that complies with this guidance. TFS Branch Tool | Quick Response Solution
Implement a consistent branching model as part of team project or team creation process, that complies with the Branching and Merging Guide. TFS Word Add-In
See above under “Reporting” for more information. TFS Process Template Customisation Guide
Practical guidance for Work Item Tracking (WIT) and Process Template customizations.

We are continuing from Treasure Map under the bonnet (hood) #1 … Windows 8 Layout Controls and will delve into styling, before looking at data binding in the post thereafter. The first impression usually last and therefore is it imperative that the look & feel and the style of your solution is appealing, functional and contextual. For example, we chose the pirates and treasure hunt theme to emphasise the need to continuously explore and hunt for hidden jewels … in the case of this solution, ALM Readiness jewels.

Styling Recap

When we work with layout or other controls in XAML, we can control the colours, alignment, margins, width, size and other characteristics.

Style definitions are typically defined in Common/StandardStyles.xaml, or in separate resource files which are merged in App.xaml. Alternatively you could assign styling to each control implicitly, or include styling definitions in the separate view XAML file between the <Page.Resources/> tag … but, for the sake of maintainability we recommend that you minimise this scattered strategy.

Let’s take a quick peek at the default behaviour if we use the Windows Store App GridApp template in Visual Studio:

  App.xaml typically defines a resource dictionary which is a merger of separate resource dictionaries. Resource dictionaries are very useful for isolation localisation or feature specific content. In this example the standard styles are contained in  the default StandardStyles.xaml and merged in App.xaml. The controls, in this case the page title text block, can be decorated with styling attributes, or use a resource style from the resource dictionary. 

<TextBlock x:Name="pageTitle" Text="{Binding Title}" Style="{StaticResource PageHeaderTextStyle}" Grid.Column="1" IsHitTestVisible="false"/>
In this example the Style attribute instructs that we should be looking for a style declaration called PageHeaderTextStyle, which we find in StandardStyles.xaml:

My first and probably greatest mentor once frowned and looked at me with a grim look when I asked whether I could as a stupid question. He eventually mumbled through is huge and grey beard … “Willy, there is only one stupid question … the one you never asked”. From that day I always questioned and we now have questions for both our UX and Dev Lead gurus

UX question time …

Should we be fiddling with layout and styles in XAML or Blend? When is it the right time to use which tool?

   

Anisha Pindoria, our UX specialist, replies …

Blend allows both designers and developers to design styles and layout visually. The same result can be achieved writing XAML, however, all visual aspects would have to be written and this can be time consuming. When styling, it is usually done best in Blend, as the designer/developer can visually see what is being applied and can be achieved in a few clicks. Fiddling in XAML is usually done when small tweaks are needed, or if Blend cannot visually aid in this.

For example, to create a simple rectangle with a style coloured red and centered in the middle of a grid…

In Blend, you would draw a rectangle on the page, right-click on the new rectangle, create a new style and colour the rectangle red and finally change the horizontal and vertical alignments to Stretch.

In XAML you would create the following…
<Rectangle Height="394" Margin="0" Width="394" Style="{StaticResource RectangleStyle1}"/>

… then in the file where the styles are kept, the following needs to be added…
<Style x:Key="RectangleStyle1" TargetType="Rectangle">
   <Setter Property="Fill" Value="Red"/>
</Style>

Dev Lead question time …

When we have a gazillion styles, how do we quickly and easily find the definition of the style and how do we avoid contention by a style being defined in multiple style files?

   

Robert MacLean, our dev lead, replies …

Finding the style is really a matter of tooling and thankfully a lot of work was done to merge Blend & VS 2012 together so it is a lot easier to right click on an item and navigate to the current set option as well as have options for listing the other potential choices.

Contention is a real issue and something we make use of with the generic.xaml file which intentionally overrides some of the styles from standardsstyles.xaml to get the colouring right. At this point, it is still pretty manual to deal with bugs in this space.

Treasure Map Styling Styles Files

The ALM Readiness Treasure Map solution uses a strategy for referencing styles that is generally one of the better ways to share style definitions across your views and solution in general.

The separate View xaml files and the App.xaml file contain no style information.   The App.xaml file defines a resource dictionary that is merged from three style definition files, namely StandardStyles.xaml, TreasureMap.xaml and Generic.xaml.

The three style definition files, commonly referred to as ResourceDictionary, can be found in the Styles folder.

• The StandardStyles.xaml  contains the definitions for the Microsoft default styles.
• The Generic.xaml contains the default theme styles.
• The TreasureMap.xaml, as the name implies, contains the treasure map specific styles. You can either stare at the cryptic xaml and ARGB format, or fire up Blend and peek into these files.
  I personally prefer the Blend UI (below) compared to the xaml code, i.e. <Color x:Key="Highlight">#FFFFE400</Color>

    

Dev Lead question time …

Why are the StandardStyles and Generic styles not all in one ResourceDictionary? They appear to be MS defined and thus standard … in which case they could be combined?

   

Robert MacLean, our dev lead, replies …

StandardStyles.xaml - this is the one that comes with the project when you do a file -> new project. We do not fiddle here, or we try not to

Generic.xaml - This is a generated file (generated using Hammer.Pants - https://github.com/Code52/HAMMER) that takes the out of the box styles and applies our colours to it so we get a more consistent application of our colours. It doesn't cover all the styles just a subset.

Could they be combined? Yes - but if Microsoft ever updates either (in the template or in generic.xaml in the SDK) having them separate will mean it is easier to update them. 

 

Styles Examples

We peek into the first row <Grid.Row=”0”/> of our Control View in this example, which contains a Button and a TextBlock action control.

The Button uses the BackButtonStyle, which is defined in StandardStyle.xaml.   The TextBlock uses the PageHeaderTextStyle, which is also defined StandardStyle.xaml and thus based on the standard styles. The TextBlock font is based on TitleFont style, which is defined in TreasureMap.xaml and uses the exciting Windlass font.
The TextBlock further defines the Foreground as TitleBrush, which is also found in TreasureMap.xaml and is based on the Title colour  #FFFFCD09 , or for those more visual .

 

Last question for our Dev Lead …

Should we not add names x:Name="" to all controls for ease of Coded UI testing, when support is available for Windows Store Apps?

For Coded UI support info see http://msdn.microsoft.com/en-us/library/dd380742.aspx.

   

Robert MacLean, our dev lead, replies …

First we should only add properties to things that actually need it, and many of our controls do not need to be exposed to any sort of automation. Since we have followed MVVM we have a pretty good way of testing the logic without automation, so really what we need UI automation for is a small subset. Secondly, for Coded UI or any UI automation really there is a much better option: AutomationProperties (http://msdn.microsoft.com/en-us/library/windows/apps/br209081.aspx) 

 

Next?

We planned to cover data binding next, but check-in events have made me realise that changes to the layout may deserve a quick peek before we continue. In the next post we will “briefly” review the latest changes and ask the team to elaborate on the churn.

References

• ALM Readiness Treasure Map (Table of Content) TOC Post
• ALM Readiness Treasure Map Windows Store App
• Previous posts:
• Treasure Map under the bonnet (hood) #1 … Windows 8 Layout Controls

In this series we will lift the bonnet (most Commonwealth countries will understand) or hood (US/Canada) of the ALM Treasure Map Solution to (a) perform a code review, (b) review Windows 8 application programming concepts and (c) document the journey to ensure transparency for the team.

IMPORTANT
We are trying to be very transparent in these blog posts. This means that we may (are) sharing early (not final) bits, proposed (not implemented) features and may (will) change existing and new features without prior warning. In fact our Dev Lead has already tweaked some of the XAML code invalidating a few of the documented findings as I am typing this post.

Quick “Recap” Controls

Windows 8 has a comprehensive controls stack, which include the layout  and the action controls. The latter are used by the user to interact with, include controls such as TextBlock, TextBox, Button, Checkbox, HyperlinkButton,  ComboBox and RadioButton, and are out-of-scope for this journey.

Layout Controls

When we create a new Windows Store solution in Visual Studio we have the option of using a Blank, Grid and Split App template. Selecting the Blank App we get a blank page, similar to an artist getting a clean sheet of drawing paper, onto which we can add layout controls such as Grid, StackPanel or Canvas.

Grid Layout Control The Grid layout control offers a table-style layout approach, using columns and rows. Stack Layout Control The Stack layout control offers a “stack” layout approach, which can be vertical (as shown on the left) or horizontal. There are no columns or rows, just controls such as Buttons, which are stacked. Canvas Layout Control The Canvas layout control offers a landscape that can be used to position controls, i.e. Buttons, using absolute positioning.           Treasure Map “Category” View

We half expected the ALM Readiness Treasure map to use the Canvas layout control for the home page, but when we peruse the code we  notice that the Grid layout is dominant. Why?

   

Robert MacLean, our dev lead, replies …

The grid layout is the most common layout tool because it allows for a lot of flexibility and control. The ability to embed grid's within grid's allows them to be kept nice and simple. Canvas is great but really is more for drawing than layout.

Starting with the Category View Page

We will start our exploration by investigating the XAML code that defines the Category View as shown below.

The <Page/> encapsulates the content that can be navigated to within our Category view. It maps to the Category class, which inherits from the Page user control class as shown by the code behind:        namespace Microsoft.ALMRangers.VsarTreasureMap.WindowsStoreApp.Views { using Windows.UI.Xaml.Controls; /// <summary> /// A page that displays an overview of a single group, including a preview of the items /// within the group. /// </summary> public sealed partial class Category : Page { public Category() { this.InitializeComponent(); } } }   The <Grid/> XAML tag defines the Grid layout control, offering a flexible table-like, into which to add columns and rows. In this latest version of the Category View we have no Grid.ColumnDefinition tags, which means we have one default column using all space available. The Grid.RowDefinitions tags define an area that consists of 3 rows. The Height attribute defines that the first row is fixed at 120 pixels, the second at 20 pixels and the third using the remaining space available.
Robert MacLean, or dev lead, recommends that it may be good point to mention the "C silhouette" (see http://msdn.microsoft.com/en-us/library/windows/apps/hh464920.aspx) that Windows store apps should have, and that by using those rows we are doing the top stroke of the C.

The few lines of XAML code have defined a Grid that spans 2 columns by 3 rows as shown in the designer on the left. There are more attributes, for example Background, which we intentionally ignore in this post as we are focusing on layout.

In one of the interim screenshots we noticed a strange Grid.RowDefinition tag, which was cleaned up by Robert, but is worth mentioning and asking a question.

Are we correct in interpreting that the left column is 552/131 times as wide as the right column? Why would anyone use such weird weighting?

   

Robert MacLean, our dev lead, replies …

1. Correct
2. No idea. My gut says someone dragged it to that side by mistake.

Digging into the first Row As with any proper indexing scheme the first row is indexed by 0 (zero) using the attribute Grid.Row –>  <Grid Grid.Row="0">. The Grid.ColumnSpan attribute defines that the content will span 2 columns.
NOTE: If you are looking at the latest code this has vanished as part of the dev lead’s continuous tweaking.   The first row contains <Grid.RowDefinitions/> defines that we have two rows within the row. The Height attribute defines weighted widths which is clearly visible in the designer. The <Grid.ColumnDefinitions/> tag defines two columns within the row. The left column is 140 pixels wide and the right column using the remaining space available.

The first magic within the grid’s first row are the two embedded action controls.

• In the first column specified by Grid.Column=”0” we have a Button enabling the user to click or touch to force an action, which is centered and styled as the BackButtonStyle.
  
  <Button Command="{Binding GoBack}" Grid.Column="0" Style="{StaticResource BackButtonStyle}"
                 Margin="0,32,0,0" VerticalAlignment="Center" HorizontalAlignment="Center" />

• The second coloumn, Grid.Column=”1” contains a TextBlock control, which is the most basic control available in XAML and used to display text. Looking at the screenshot at the top of this post, realise that ths action control is used to display the “Tooling” text.
  
  <TextBlock Grid.Column="1" Style="{StaticResource PageHeaderTextStyle}" Text="{Binding CategoryTitle}"
                     Margin="0,0,0,20" FontFamily="{StaticResource TitleFont}" Foreground="{StaticResource TitleBrush}" />

Again we defer the rest of the styling, sizing and binding attributes to future posts. Watch the space

Ignoring the second Row

The second row, which would be <Grid Grid.Row=”1”/> is untraceable in the XAML code, which simply means that we are not defining any additional attributes to it. It still exists, occupying 20 pixels of the real estate as defined by the <Grid.RowDefinitions/> tags on the page.

Digging into the third Row

Lastly, for this adventure, we peek into the third and last row of the main page grid.

The third row is further divided into three columns.

The left is 450 pixels wide, the second is 20 pixels and the third uses the remaining width available, matching the 0,1 and 2 areas shown respectively.
 

The first column <Grid Grid.Row=”0”/> defines two controls which will inhabit the row:

1. The <Image/> control is used to display images that match the category item, i.e. Tooling.
2. The <TextBlock/> control is used to display basic text, which describes the category in more detail.

We will explore where the image and text comes from and how it is bound to these controls in one of the next posts.

The third column <Grid Grid.Row=”2”/> introduces one main occupant of type <ListView/>. The ListView allows a flexible presentation and customised view of information, which matches the category items such as the VM Factory and Word Add-In shown in screen snippets above. If we dig into the <ListView/> we notice that each item is split into three rows of height 300, 5 and remaining height within the grid cell. The top row contains the image associated with the category item and the bottom row two <TextBlock/> controls, one for the category item title and the other for the description .

Last questions for our Dev Lead for today …

Why are we using the ListView and not the ScrollViewer control?

   

Robert MacLean, our dev lead, replies …

Most important is because of ListItem.ItemTemplate - this allows us to style each item the same way. So we bind the data to the ListView and the items are (basically) handled. Secondly ListItem uses ScrollViewer internally, in fact in v1 we just had some standard styling but for v2 since we are panning horizontally it meant custom styling of the internal scroll view to pan horizontally.         

Why are we not using the GridView control? Is the ListView not intended for vertical layout, whereas the v2 treasure map goes horizontal?

   

Robert MacLean, our dev lead, replies …

The reason is the ListView.ItemTemplate gives us a lot of control of the individual items in the ListView. This allows us to have great control of the content. The ListView internally uses a VirtualisingStackPanel and so we can just change that through stying to get a horizontal list (instead of a verticle list). The GridView is more concerned with a different layout where we have tiles, like the start screen, which is not a good fit for our content.

 

Do we really have to fiddle with XAML in the visual world?

If you are a visual thinking person and dislike colour definitions such as #FFFFCD09 for the title text colour, you should fire up this tool:

We get a great IDE which displays a designer view we know from Visual Studio.   The page objects are displayed in a user friendly tree view. The colours used are displayed in their true colour, rather than the cryptic ARGB format, which is a set of hexadecimal values that define colour codes. See http://en.wikipedia.org/wiki/RGBA_color_space for more information on the RBGA colour space.

 

What’s Next?

Now that we have explored the most important concept of the user interface which is the Layout, we will dig deeper into the same XAML code and scratch the surface of styling and data binding, as used in the Treasure Map solution.

References

• Demo: ALM Readiness Treasure Map v2 – Show what we have for Sprint 10 (April)
• Handy cheat sheet: Win8-Kbd-CheatSheet.zip
  
• Our team home: TOC - ALM Readiness Treasure Map
   

We are nearing the end of the financial year FY13, which means we are starting calibrations, satisfaction surveys and the analysis of the good, the bad and the ugly. The intention is to learn from the past and continue our quest for continuous improvement and evolution, especially for our strategic and long-term projects.

Some of the highlights … none of the highlights would be possible without the competent and passionate ALM Rangers community, which ROCKS!

I am humbled amongst these champions and proud to be a member of the Rangers family!

http://en.wikipedia.org/wiki/Hoba_meteorite  ... a good example of a real 60 ton “rock”

 

What so much text to read?          
No need to panic. This is a summary of the phenomenal achievements by the ALM Rangers and you do not have to read this post word by word. Focus on the first column of each area to get an overview and optionally refer to the reference information included in subsequent columns.
Home Infrastructure

• Team Foundation Service became our operational and dog fooding home “of truth” for all new projects.

More info.

• Visual Studio UserVoice became our primary source of new project ideas and ranking thereof.

More info.

• ALM Rangers Portal was simplified to a common dashboard.

More info. Solutions

• We embraced strategic initiatives

• DevOps
• IntelliTrace, IntelliTrace, IntelliTrace making Larry Guger smile
• Device Testing
• Unit Testing idea with 934 votes on UserVoice
• The next generation of the VM Factory in the cloud

More info.

• We shipped a lot of valuable solutions

• Guidance for DevOps bug resolution using IntelliTrace
• Guidance for Microsoft Fakes, TFS Disaster Avoidance and updates
• ALM Readiness treasure map
• ALM Rangers ship update #1 for the TFS Word Add-in
• Quick Response Sample – TFS Branch Tool to complement the guidance
• New Branching and Merging Guide v2.1
• TFS Word Add-in and Update #1
• Visual Studio 2012 ALM Rangers Readiness “Wave”

 

• We will be shipping a lot more soon!

• Better Unit Testing with Test Code Generation
• Building a Release Pipeline with TFS - Collaboration series by Rangers & p&p
• Device dev and testing with Perfecto Mobile
• DevOps Tooling
• DevOps Practical Continuous Deployment Guide
• End to end guidance for DevOps bug resolution using IntelliTrace
• On-Time VM Factory
• Practical Team Foundation Service Reporting Guide
• Quick Response Project –> VM Demo Quick Environment Setup
• Upgrade -> ALM Readiness Treasure Map (arrrrrr…) v2

 

• We published (shared) a lot of information

• MSDN Magazine (printed)
• A Treasure Hunt Through ALM Readiness
• Version Control in the TFS Client Object Model
• Build Automation with Team Foundation Service Preview
• What's New in Microsoft Test Manager 2012
• Using the TFS Client Object Model
• MSDN Magazine (online)
• Simplifying the Configuration of Lab Management 2012
• Agile Project Management using TFS 2012
• Other Publications
• ALM Rangers dogfooding journal of the Team Foundation Service
• Channel 9
• Branching and Merging Guidance for TFS
• Quick tour of the TFS Branch Tool VS Extension
• Insight into the inner world of the Quick Response TFS Branch Tool

More info. Process

• We continuously evolve our Ruck Process

• Single Team Project Collection and Team Project model
• Rangers dogfooding journal of the Team Foundation Service
• How the ALM Rangers are using Visual Studio ALM
• Code Review and Build process
• Proving the new process and lifting the last confusions
• Dogfooding and the “Angst” Factor
• Bug management
• Dealing with bugs on tfs.visualstudio.com
• Visual, visual + visual transparency
• The age of the visual board
• Smaller teams, preferring <10 team sizes
• World-Wide Virtual Teams from the ALM Rangers perspective
• Project time boxing from 3-4 months … we can always do better next time!
• Simplified and fully documented, with training sessions at TechReady

More info.

• We aligned with product group quarterly cadence

• Quarterly ideas triage
• Triage #4 - What happened to your idea in UserVoice?
• Triage #3 - What happened to your idea in UserVoice?
• Triage #2 - What happened to your idea in UserVoice?
• Triage #1 - What happened to your idea in UserVoice?
• Quarterly nominations triage
• Quarterly opportunity to start a project

More info.

• We evolved the Rangers flash

• Weekly flash was cancelled as there as no value-add
• Monthly flash format and content evolves continuously

More info.

• We nominated champions annually

• Champions are announced just before MVP Summit and TechReady allowing us to personally congratulate winners and hand-out awards.
  

More info.

• We investigated and aligned with Program Management (PM)

• Eating the information overload wave bit by bit
• Are some of the ALM Rangers Symbiotic PM’s?‎
• Thinking about PM != PM and Visual Studio ALM Rangers
• Thinking about PM != PM and the PM role in Microsoft‎

           Some of the lowlights, which become opportunities for FY14

• Ruck training and certification not yet formalised and available.
• Ruck Master certification not yet formalises and available.
• Although we have aligned with quarterly cadence, we still have two major activity peak and wave trends, rather than four levelled waves (dotted lines) of projects.
  
• Still dealing with “dark” Rangers … albeit a lot less than in previous years, making bandwidth planning challenging.  
• We still have separate credentials for TFS and Dashboard infrastructure, resulting in password maintenance adventures.
• We still have not been able to produce Bijan’s accurate bandwidth utilisation reports.
• Watch the “Practical Team Foundation Service Reporting Guide solution” space.

Did I forget anything? Thoughts ?

Once you’ve moved to Visual Studio 2012, what’s a dev to do without the Create Unit Tests feature? Based on the high demand on User Voice for this feature to be restored, the Visual Studio ALM Rangers have introduced the vsarUnitTestFx Visual Studio Extension.

It is time that we talk about this exciting adventure focused on automating test project creation, adding references, generating stubs, and extensibility to add and target other test frameworks.

IMPORTANT
We are trying to be very transparent in these blog posts. This means that we may (are) sharing early (not final) bits, proposed (not implemented) features and may (will) change existing and new features without prior warning.

We embrace the following project principles for the extension:

• Achieves a moderate amount of restoration of Visual Studio 2010 feature functionality, but does not resurrect the old command.
• Replaces and does not resurrect the old command.
• Supports .NET MS-Test and generation of VB/C# test code.
• Presents a "reference implementation" of how to do this for a particular test framework.
• Provides a basic infrastructure and an extension point.
• It focuses on project and reference management and not on code generation.

We envision the following benefits for the Visual Studio community:

• Quickly get to writing test code, not having to worry about setting up projects and files.
• Customize the unit test code generation using a context menu, ensuring that generated tests better match your naming schemes.
• Generate unit test stubs against multiple frameworks so that you can use any framework you like.

As always we continuously dog-food our evolving infrastructure, Ruck process and tooling. We defined and shared our code quality learnings for sprint objectives, the definition of done, code reviews and project principles. These learnings are undergoing constant revision and are included in the latest Ruck Guide on CodePlex for possible re-use by other project solution teams. See ALM Rangers Dogfooding – Code Review and Build process for more information.

Who’s who?

When we refer to “we” and the “team” we refer to a team of competent and passionate ALM Rangers, as shown in the slide I extracted from the recent show-what-we-have presentation.

Visit http://aka.ms/vsarindex for more information on these ALM Rangers.

What is the status? One down, two milestones to go!

We shipped an ALPHA release to all ALM Rangers and the product group in April as planned, which addressed the first of three main Epics . In May we are planning to release a BETA to an as yet undefined early-adopter community. The BETA  introduces the functionality allowing user to customise the naming of generated code and prepares the foundation for the last Epic as described below.

We have a competent team of developers, testers, pedantic quality guardians and a champion product owner, which means we can all look forward to a phenomenal product. Once we have achieved our definition of DONE we will release version 1.0 on the Visual Studio Gallery.

Epics … our menu

Another slide extract from the recent show-what-we-have presentation show the list of Epics and their status:

  Peeking under the bonnet (hood)

Seeing is believing, so let’s switch to the world of Visual Studio and have a look at the extension. The main components of the solution (ALPHA release) are visible in the context diagram below. It is important to re-iterate that this is based on the ALPHA code and will be changing when we address the extensibility Epic.

Generating a dependency diagram of the solution (BETA candidate) gives us a different view of what is hiding within the VS extension:

Walking through some code scenarios

Once installed, you will find the extension under Extensions and Updates in the Tools menu. For this blog post I am using a code quality test project developed by Vladimir Gusarov, which we are using as an evolving playground for our manual test cases.

• As shown in the illustration below we are working in the WeirdFormatting class.
• First we right-click on the class definition.

• We select Generate Unit Test from the context menu.
  
• This generates a test project and a test class—if needed—then adds the references, the namespace, and the test methods.
• You can create additional test methods by repeating the same process within one or more method bodies, which would create additional instances of test methods.

Let’s investigate the resultant Unit Test dish:

1. A test project was created, named CSharpTestProjectTests.
2. References to the project being tested and the quality tools were added to the References.
3. A test method was created in CSharpTestProjectTests for each public method in the WeirdFormatting class in the CSharpTestProjectTests project.
4. The namespace containing the WeirdFormattingTests class is based on the namespace used in the WeirdFormatting class.
5. The test method body contains one statement: Assert.Fail(), which differs from the ALPHA release where the body was empty.

 

NOTE: There are no plans to support the rare scenario of generating tests against test methods or operators. REF: WI#5815 and #6166. Mock-ups … what’s next?

To understand what we are planning to include in the BETA, let us look at some of the mock-ups from our product owner. As before it is important to re-emphasise that these are visions, mock-ups and subject to change.

We start with the Create Unit Test Options item which will appear in the Test menu as shown …

The configuration option will allow us to change the behaviour of the Unit Test Generator, for example controlling the class and method name formatting.

Give the mock-up to Anisha Pindoria and the following proposed dialog starts evolving:

To summarise, the BETA will introduce the ability to influence the unit test generator and the last Epic, which will bring us to version 1.0 will allow you to generate unit test stubs against multiple frameworks so that you can utilize potentially any framework.

Thoughts?

We would appreciate your candid feedback, either by adding a comment to this post, or contacting me here.

Latest Releases

The following project(s) have shipped during April:

• DevOps bug resolution using IntelliTrace

Latest Updates

In addition to the new project(s) we have updated a number of the existing content on CodePlex to include latest in-the-field findings and align with the latest product updates.

• Practical Ruck Guide
• Team Foundation Service 2012 Learnings
• TFS Upgrade Guide

New Projects

The following public “show-what-we-have” videos have been published for Sprint 10/April:

• ALM Readiness Treasure Map (vsarTreasureMap) video

The following image shows a snapshot of the latest projects taken during the monthly retrospective:                  

Download update as of 1 April 2013 Average daily downloads since 2007 215 ( 5+4 ) Average daily downloads during recent period: 496 ( 6 -177) Total downloads since Jan1/2007 of tracked ALM Ranger projects 497,123( 5+14,867 since last flash ) TreasureMap http://aka.ms/vsartmapapp Downloads to date 573 Average rating 4.9/5 New publications

• MSDN Magazine article A Treasure Hunt Through ALM Readiness by Anisha, RobertB, RobertM, Dave and Willy.
• MSDN Online Magazine article Simplifying the Configuration of Lab Management 2012 by Micheal Learned.
• Supporting Guidance whitepaper ALM Rangers dogfooding journal of the Team Foundation Service by Willy.

Localisations

• Localised videos for Visual Studio 2012

New Associate Rangers

Please welcome the following new Associate ALM Rangers in our family: Doug Owens, Janice Choi, Josh Sommer, Kirushna Kumaar and Svetlana Kostinsky.

Tarun Arora comes out “tops” @ TechEd India

Tarun presented at TechEd India and his session “Modelling Agile using TFS 2012” topped the ALM track in TechEd 2013 India and was rated highest under the category “Quality of Session Presenter”. He enjoyed connecting with over 2000 people in just a week across Delhi (TechDays), Pune and Bangalore (TechEd) and representing the ALM Rangers. Well done Tarun!

Robert MacLean unrolls the treasure map @ TechEd Africa

Robert delivered a number of exceptional sessions at TechEd Africa, with a focus on the ALM Readiness Treasure Map Windows Store App (aka.ms/vsartmapapp). He also took the opportunity to deliver a student day talk to a few hundred varsity students brought to TechEd, again using the Rangers app, as well as the branching and merging guide, and sharing his experience what it was like to work with Microsoft.

The following talks were redelivered and recorded as RangerTalks:

• Windows Store Apps, Tips & Tricks from the field
• What’s new in .NET 4.5 & VS 2012
• What’s new in LightSwitch

Jim Szubryt’s absence explained … community^passion

Jim delivered a number of phenomenal community events this month, which explains his “stealth” mode and why the TFS Reporting Guide project is only now starting to gain momentum on the reporting rails

• Presenting @ Chicago Code Camp on Saturday April 27th and Links From This Week’s Presentations
• Presenting @ the Chicago ALM User Group Meeting on Source Controlling Databases
• Presenting at Software Development Community’s April Meeting

Remember the August SDC? If not, here is his video: www.tinyurl.com/tfs2012js.

TFS Administration Exam a la Portuguese

André Dias finished the MVA about TFS Administration Exam (70-496), producing 22 videos, 30 questions and a lot of references linking the exam subjects to MSDN Articles in Portuguese.

• https://www.microsoftvirtualacademy.com/training-courses/guia-de-estudo-certifica-o-tfs-2012-70-496-
• http://channel9.msdn.com/Tags/tfs         

He also coordinated the Azure Summit Brazil and MVP Virtual Summit (ALM Track) conferences; and gave a lot of talks for smaller events, universities and user groups. Wow!

Retrospective Quiz

We asked the ALM Rangers to identify the projects associated with the following collection of burn down patterns during Sprint 10 (April) … and we have a winner!

Congratulations to our WINNER: Esteban Garcia

Tell us about your success stories!

Are you aware of a success story in which the Visual Studio ALM Rangers and/or their solutions have accelerated the adoption of Visual Studio, unblocked an engagement and/or resulted in a   (happy) user?

• Willy's Reflections Blog
• Visual Studio TFS Team Blog
• ALM Rangers Team
• ALM Ranger Solutions
• ALM Ranger Publications
• ALM Readiness Treasure Map
• ALM Rangers Treasure Map App

• Brian Keller's VM
• Visual Studio marketing site
• Visual Studio downloads
• Visual Studio comparison charts
• ALM marketing content

When Larry Brader is late for an early morning p&p/Rangers meeting he is usually chasing horses or enjoying new arrivals Welcome to the gorgeous filly!

A beautiful photo from Jeff Beehler as proof that Spring has arrived for some.. Tulips at Keukenhof.

For more posts in this series, see the series index.

This post is both a development snack, i.e. something I think you should know to build better Windows Store apps, as well as being part of the Treasure Map transparency, which are meant to show you how we built a real Windows Store app.

Size Matters Lab Rat

In web development, there is often a concern to get the download size of the page down & there are plenty of tools to help with this (Visual Studio has a lot for CSS & JavaScript) but when we get to app development, size isn’t always as big a concern.

Windows Phone development made 20Mb an important limit, since that meant the download could go over 3G rather than requiring WiFi – this is why my Lab Rat comic book for Windows Phone is 17Mb in size. I made a very conscience choice to ensure it would fit under 20Mb.

Windows Store apps don’t have a similar limit to Windows Phone – so when I was recreating Lab Rat for Windows 8, I just went with the highest resolution images I could so it would look great. This resulted in the download being 225Mb!

Treasure Map

With version 1 of the treasure map, no one really thought of file size either rather focusing on making it look and feel great. Which resulted in it containing a lot of high resolution images and many of them in the JPEG format. When we shipped version 1, we shipped a 57Mb install!

Small is better

For version 2 of the treasure map, one piece of feedback we got (I believe the awesome Mike Fourie raised it) was that it was a big download. So I spent some time looking through our assets and doing some sneaky clean-up and in the process learnt a bit.

JPEG

It’s crap – use PNG. PNG is better quality and for most scenarios is smaller in file size. So in both Lab Rat & Treasure Map the first step was to replace all the JPEG images (including assets like store logo) with PNG.

If you want more info on the differences between JPEG and PNG see this amazing StackOverflow answer.

PNG 32, 24, 16, 8… oh my

A PNG isn’t PNG – in fact PNG’s can specify the bit depth of each of the channels they support which directly impacts how distinct colours they support. They can also allocate a specific bit in the colours to indicate transparency. However if you do not need transparency, which in the case for the bulk of Lab Rat & Treasure Map is true, you can save bit for a colour.

Very few images will have all 16 million colours that are needed, so if you identify how many unique colours there are, then you can shrink the bit depth which results in a smaller file. I did some work on this and found two pretty interesting tools:

• TinyPNG – a free website to do this. Only downside, one file at a time.
• PNGoo – a free Windows tool that can do bulk changes. Not as easy as the website to use though.

So I ran both Lab Rat & Treasure Map through that and we got a MASSIVE saving in disk.

• Treasure Map went from 57Mb to (approx.) 11Mb – so a saving of 80%. The 11Mb is just a test on my machine and also includes a lot of new resources, so it may change by release.
• Lab Rat went from 225Mb to 89Mb! So a saving of 60%!

Summary

So in summary, use PNG not JPG & make sure you compress your images before you release!

I ♥ JSinSA – it is easily on the best conferences in South Africa and every year I learn a lot at the event! The importance of JavaScript development has never been so high – this is the time to attend this event! So to help you get to the event, I am giving away one free ticket to the event!

All you need to do to enter, is simply tweet about this: Tweet !function(d,s,id){var js,fjs=d.getElementsByTagName(s)[0];if(!d.getElementById(id)){js=d.createElement(s);js.id=id;js.src="https://platform.twitter.com/widgets.js";fjs.parentNode.insertBefore(js,fjs);}}(document,"script","twitter-wjs");

Details:

• The tweet must include my Twitter name (@rmaclean) and the hash tag #jsinsa – to be valid
• The competition closes at midnight on 17th May 2013.
• I will contact the winner after the competition closes to arrange the delivery of the ticket.
• This is one free ticket – you have to get to the event yourself.
• This is a standard ticket – so you get everything a normal attendee to the event gets.
• I am using Beeliked to run this so any issues about draw or technical stuff, see their website.
• If I completely get this tech wrong, then I will pick a winner at random.
• Judges (aka me) decision is final.
• If you are making your own tweet, make sure the hashtag (#jsinsa) & the mention do not have characters following them, like a comma or full stop or the system seems not pick them up correctly. Easier - just hit the button above.

I was recently asked whether there are videos on Visual Studio 2012 for the Spanish community. After a quick “ping” to the ALM Rangers I managed to create the following list of localised videos for you to enjoy:

Localised guidance for 2012

• Rangers Guidance Localizations … Sprechen Sie Deutsch? … ¿Habla Español? 
  

Localised videos for 2012 Arabic

• http://www.youtube.com/user/MSMEAALMCommunity/videos?flow=grid&view=0

German

• http://www.microsoft.com/germany/msdn/events/vs-evolution-2012/default.aspx
• http://blogs.msdn.com/b/cbinder/archive/2013/03/20/neu-in-visual-studio-2012-2.aspx

French

• http://www.microsoft.com/france/visual-studio/bonapp/hub-emission.aspx

Portuguese

• http://www.microsoftvirtualacademy.com/training-courses/introducao-a-application-lifecycle-management-alm-parte-1
• http://www.microsoftvirtualacademy.com/training-courses/introducao-a-application-lifecycle-management-alm-parte-2
• http://www.microsoftvirtualacademy.com/training-courses/guia-de-estudo-certifica-o-tfs-2012-70-496-
• http://www.microsoftvirtualacademy.com/training-courses/introducao-ao-lab-management
• http://blog.andredias.net/videos/

Russian

• http://www.techdays.ru/
• http://www.techdays.ru/series/alm2012training

Spanish

• http://channel9.msdn.com/Blogs/DevWow

 

… and there is more on Channel 9!

When you go to channel 9 link http://channel9.msdn.com/Series/Visual-Studio-2012-Premium-and-Ultimate-Overview and add “-<LANG>” to the url, you’ll get all the localized videos.  So for example

• German, you get via http://channel9.msdn.com/Series/Visual-Studio-2012-Premium-and-Ultimate-Overview-DEU
• Japanese - http://channel9.msdn.com/Series/Visual-Studio-2012-Premium-and-Ultimate-Overview-JPN
• French - http://channel9.msdn.com/Series/Visual-Studio-2012-Premium-and-Ultimate-Overview-FRA
• etc.

Please add a comment to this post or ping me direct if the list is missing any gems, so that I can update the post.

Introduction

This is the second post in the behind the scenes look at what it is like to build and ship a product as an ALM Ranger. The product is the ALM treasure map & this video on channel 9 gives a good insight into what is going on.

It should also be noted that these posts are meant as a more brain dump than an actual learning reference.

What to do with a drunken sailor (with capacity)

In our last sprint, I got all my work done quickly (no walking the plank here) – but I still had capacity and since the crew all did their work quickly too I couldn’t steal work items to keep me out of trouble… so what to do?

• Step one: create some work items for myself.
• Step two: do said work items
• Step three: ?
• Step four: profit!

Hopefully these changes put us in a better starting position for v2 dev which really kicks off in the sprint starting today!

What did those work items contain?

To create some work items I started by just swabbing the deck, so to speak – just cleaning up the solution, removing old folders & code.

Tiles

Starting with the tiles, I went through the assets we have and removed icons we do not used & renamed the existing ones so the right tiles load at the right resolutions. This is much easier to get right thanks to the improved manifest designer in Update 1 of VS 2012. This also helped me find a bunch of missing resolutions which have been sent to Anisha to create the artwork for.

Async

Our DB load method used async but didn’t implement the conventions properly, so that has been changed to return a Task (I didn’t do that, but I am glad it was done) & renamed to have the async suffix on the name.

Category

For some reason we had an old category.cs file in our view models, so in v1 we named our view model categoryviewmodel.cs which bugged me. So removed old file, renamed & fixed class name. Hopefully makes it easier to navigate & also helps with another tasks I did below.

ViewModel Injection

One of the aspects in our MVVM implementation was that the view was responsible to load the correct view model it needed. So every view either had code in it’s OnNavigate event or in the XAML, which was not bad. The performance issue here was that if you moved from full to snapped views, for example, the view would change & thus we would recreate the view model too! So performance could be better there. We haven’t hit state issues yet, but it could’ve lead to that (think typing in text box, switch to snapped & the stuff you typed is gone since we have a new view model instance).

The solution here was to have the navigation system control this, so using conventions again, it looks for the matching view model for the view we want and if we already have that view model available we use that, if not we create a new instance. The navigation system then injects the view model into the views data context property automatically cleaning up the code in the views too!

This added about sixty lines of code to the navigation code, but means the views & view models are simpler to work with!

Code Analysis

VS has a great code analysis feature and it is part of our quality gate to ship the release so I took the time to bump it up to full rules (we normally use recommended) and see what that could find. It found a lot and I went through those and did cleanup to the parts that made sense such as removing unused code & cleaning up the AssemblyInfo.cs file.

I have also switched on code analysis (with recommended rules) as part of the VS debug build options so that while we are developing we are also thinking of our quality gates, so hopefully our final sprint is quickly done!

In TOC - ALM Readiness Treasure Map the team is sharing the vision and plans (Epics) for the next version of the treasure map and transparently discussing the design learning's and experiences to be transparent and most importantly to get your invaluable feedback.

The team has just released a “show what we have” video for the past Sprint finishing on April 30th. Enjoy during your next coffee break!

Our captain, Robert Bernstein had this to say to the team:

Arrr!  Fellow pirates, after reviewing the video covering our Sprint 10 progress, I just wanted to comment on the hard work you’ve been doing so far.

• Fabio: I love what you’ve done with the Sharing contract in v2.  It worked well in v1, but feels much more polished now.  Nice work!
• Anisha: You’ve done a great job designing the new UX for v2.  The updates make me want to resubmit our MSDN Magazine article with the beautiful new artwork!!!
• RobertM: While I liked your explanations for why you’re excited to be Dev Lead on this project, I was really impressed with your clear explanations of how the code is implemented.  You got the full point about how the app was written across while keeping it straightforward and concise.  That’s hard to do in just a couple of minutes.  Well done!
• Willy: Your narration really pulled it all together into a cohesive description of our project.  You conveyed that we are one unified team working well together.  Great communication!

And thanks to the whole team for all the hard work you’re doing.  For those who didn’t get to contribute this round, you’ll have plenty of opportunities to do so in future Sprints.  Keep up the good work!

Rob “Captain” Bernstein

Related

• ALM Readiness Treasure Map Blogs
• ALM Readiness Treasure Map v1 Paper Map and Sample Source Code
• ALM Readiness Treasure Map v1 Windows Store Application

As part of our dog fooding we have been working on improving the Quality Bar, Definition of “DONE” and knowing when it is safe to sleep peacefully, project principles and more recently code reviews with the overall objective of shipping better solutions and creating happier users.

Updated: 2014-04-25 – Distinguish between minor and major change.

WARNING: This post is a journal of how we are dog fooding our environment. It is intended as transparent information sharing and should not be mistaken for guidance. We are intentionally focusing our teams to use what come with Visual Studio and Team Foundation Service out-of-the-box to ensure we eat our own dog food

Overview

In the current vsarUnitTestFx project, which has the quest of “Better Unit Testing with Test Code Generation” we have settled down using a basic branching scenario with a main and release branch, as defined in the Branching and Merging Guide (http://aka.ms/treasure18).

… we have moved away from a dev and feature branches for most projects, unless we require additional isolation.

Our main branch is protected by two checkpoints:

1. Gated check-in, to ensure that submitted changes merge and build successfully in our Team Foundation Service home.
   
2. Code review is performed by the product owner, dev lead, project lead and the team.
• Major change or milestone
  For major milestones, for example ALPA, BETA, V1 or a potentially code/feature breaking change, the current dog fooding rule is to do a code review and then do a gated check-in.
  
• Minor change and no milestone
  For minor changes, which are unlikely to break code or features, the current dog fooding rule is to do a gated checkin and start a code review in parallel. This is to ensure that the team is not blocked for potentially 48h (see below) if reviewers are slow to respond.
  
• What is reviewed?
  1. Code Quality -Raising the Quality Bar for Tooling (Part 1)
  2. Adherence to acceptance criteria
  3. Coding concepts, style … learning from others
        

Code Reviews … as currently defined and used by the team

• We are using the Visual Studio 2012 code review feature in our Team Foundation Service home. The intent is to dog-food the feature and give real-world feedback to the product team.
• We are involving the following personas as code reviewers at the time indicated:
  Team Member When Block Review Focus Product Owner Closing Epic Yes

  Verify PG-level code quality, PG alignment and be in a position to sign-off associated Epic.

  Dev Lead Closing PBI Yes

  Verify code and guide team as dev lead. Focus on feature alignment and quality bar.

  Project Lead Closing PBI Yes

  Verify Ruck-level code quality, feature alignment and support DL where needed.
  Raising the Quality Bar for Tooling (Part 1)

  Quality Check Closing Epic Yes

  Verify Ruck-level code quality and perform an independent code quality review.

  Everyone Always 48h For maximum transparency loop in everyone.

 

• We usually include the entire team reviewers for maximum transparency, but their review feedback may not be required for task closure. As per table only the code reviews by product owner, project lead, dev lead and quality check SME are required and blocking. The rest are optional and after 48h (max) the code review request is closed.
• We do not release bits or move to next objective until all reviews have been completed and PO/DL/PL signoffs have been made. If a blockage is created, the team usually united to extinguish any fires and blockers as a team.

For other dog-fooding posts, see http://blogs.msdn.com/b/willy-peter_schaub/archive/tags/dogfooding/.

ACRONYMS: PO=Product Owner, PL=Project Lead, DL=Dev Lead, PG=Product Group

How do you deal with code reviews?

On Thursday I presented at TechEd Africa 2013 the third & final of my talks which was very personal in nature as I spent a lot of time talking about what I did wrong & what I wish I knew when I started building Windows Store apps. The title of the talk was Windows Store Apps – Tips & Tricks! If you click more (below) you will be able to grab the slides, demos & my demo script if you are wanting to see what I was doing.

AttachmentSize Windows Store Apps - Tips & Tricks Demo Script19.66 KB Alternate use for Visual State Manager demo33.31 KB Background task debugging demo73.99 KB Callisto & Marked up demos458.47 KB Share debugging Demo544.23 KB

Are you looking for a magic cure-all for planning team environments in Visual Studio?

If yes, you are not alone! The Visual Studio ALM Rangers have been dogfooding different models, infrastructures, and technologies since 2006 in search of a solution that meets their unique requirements for disconnected, distributed, and part-time project teams. The details are chronicled in ALM Guidance: Visual Studio ALM Rangers — Reflections on Virtual Teams2.

While we cannot give you magic cure-all, we can share the process we followed to arrive at the team environment we enjoy in the “cloud” today. The whitepapers is a living document and we are planning to revise when and as needed.

Download now

Home site: http://aka.ms/treasure4

Whitepaper: http://aka.ms/vsarcloudhome

 

Please send candid feedback!

We can’t wait to hear from you, and learn more about your experience using these guides. Here are some ways to connect with us:

• Ask a question on the CodePlex discussion forum.
• Contact me on my blog.
• Submit a suggestion on UserVoice, using the Rangers Project category tag.

Today I presented at TechEd Africa 2013 the second of my talks which is my personal favourite What’s new in LightSwitch 2013! If you click more (below) you will be able to grab the slides, demos & my demo script if you are wanting to see what I was doing.

The one item I gave the LEAST amount of coverage to was the SharePoint story, which is really amazing and deserved more. So if you would like to know more about it have a look at Brian Moores blog post on this. Of course, no LightSwitch talk is complete with a mention to Michael Washington (who is Mr. LightSwitch – if he was born in the UK, he would Sir. LightSwitch already) but I never showed his website URL, so here it is: www.lightswitchhelpwebsite.com

Download the completed demo

AttachmentSize LightSwitch Demo Script62.96 KB

Today I presented at TechEd Africa 2013 the first of my talks which is a massive two hour overview of what is new in .NET 4.5 & VS 2012! If you click more (below) you will be able to grab the slides, demos & my demo script if you are wanting to see what I was doing.

For those who could not attend, part one is very similar to this presentation what I did last year!

AttachmentSize What’s new in Visual Studio 2012 & .NET 4.5 Demo Script25.76 KB Entity Framework Diagram Changes Demo27.82 KB VS upgrade is low risk demo169.67 KB Workflow Foundation demo191.89 KB Entity Framework Code First Demo2.14 MB Web API Demo7.34 MB Async Demo16.48 KB

My head literally started to spin during a recent PM event “How to Create Your Elevator Pitch”.
I wondered how we used to pitch our ideas, how we evolved, how we intuitively adopted a lot of the improvements that were highlighted in the course and more importantly how we can improve going forward.

Historical and visual evidence

The training was focused on the “elevator pitch”. Please bear with me as I share a few visuals I pondered over during and after the training, because the “elevator pitch” is evident in many different deliverables.

Back in the days … Recently … My thoughts … In the past our emails (left mock-up) used to be very detailed, precise, formal and most importantly long.

Thanks to a number of phenomenal peer mentors the emails have evolved to a format which is concise, starts with the context, followed by bulleted and actionable items, including visuals.

Which would you intuitively file for later action and which would you action (read) first?

The typical ALM Rangers guidance project include a wealth of practical guidance and artefacts such as guides, hands-on labs, quick reference posters, cheat sheets and calculation workbooks … all in all it can result in a daunting pile of “stuff”.

The latest experiment was the Better Unit Testing with Microsoft Fakes guide, which was developed as a single-artefact eBook containing guidance, walk-through (light-weight HOLs) and cheat sheets.

Which would you intuitively pickup first?

Trivia: The project on the left is enjoying a 14/day and the one on the right a 197/day download average.

The typical ALM Rangers project kick-off was a ceremony that required 1-1.5h and involved the sharing of detailed and often verbose 15-20 slides.

The recent kick-off events have been time-boxed to 30min, using 7 standard slides, with a bulleted, visual and less formal approach.

Which session would you intuitively prefer to attend? Key improvements I took from the course and my mentors Communication in general

• Emails should be kept crisp
  When I have to scroll to read an email, my attention starts to fade and emails are usually deferred for (much) later processing.
• Emails should focus on (one) topic
  When email content forks, it can become very hard to consume and identify the core “ask”.
• Visualizations are invaluable and a picture may say a thousand words
  Many humans (myself included) are visually minded and automatically convert textual (bla, bla, bla, …) content into visual diagrams, mind-maps, etc.
  Invest time in visuals and crisp text … your reader will love you!
• Every sentence you write should be meaningful
  Validate that each sentence (word) has value and do not feel bad to delete content. Less is better!

Elevator pitch

• Why? Create a (visual) vision statement that clearly answers the “why”.
• Start strong.
• You can start with a question: Do you…? Are you…? With an optional “then you are not alone” empathy statement.
• You can also start with a fact (visual) that triggers a favourable response.
• Focus! Instead of boring the user with generic and lots of facts, focus on one (the best) feature.
• End strong
• You can end with a statement that provokes further action: We have / will … interested? Find us …

To determine what could trigger a response with your audience, read about them on LinkedIn, Facebook or their blog. In Willy-Peter Schaub you should, for example, find many things that could trigger a favourable and negative response with me.

To conclude, how would I pitch the Better Unit Testing with Microsoft Fake project if I had to do it all over again?

 

Are you finding it daunting to get started with Microsoft Fakes?

We want to combine the experience of the product group, ALM MVPs and Rangers to develop practical guidance covering:

• Basics of unit testing
• Effective use, extension and augmentation of Fakes
• Walkthroughs that can be used as checklists and training content

We are going to publish an eBook enabling developers to adopt Microsoft Fakes. Interested in joining the team?

Something Zayd Kara probably often asked himself when testing our stuff 

PS: This revised vision has 69 words, the previous involved no less than 112.

 

What do think?

This post is part of an ongoing series of Rangers introductions. See Ranger Index (Who is Who?) for more details.

Who are you?

Kirushna Kumaar (kirushk), Build & Release Lead, OCTO – Microsoft Services Global Delivery (MSGD). Responsible for the all up Build & Release function at MSGD and key responsibilities will include building a robust infrastructure, process & tools at GD to assist with deploying certified builds to customers in a seamless manner as well as innovating in this space to cover next generation technologies. Have 10 years of IT experience in which 6+ years with Microsoft. Kirushna holds Bachelor Degree in Computer Science & Engineering from Madras University and is MCPD, IASA Foundation & PMP certified.

What makes you tick?

Delivering quality through learning and innovation

Where do you live?

Hyderabad, India.

Where is the place you call home?

Chennai (formerly known as Madras), India

Why are you active in the ranger’s program?

Learn from others, share my knowledge and to innovate together

What is the best rangers project you worked on and why?

Yet to start on a ranger project.  Will be interested to bring my experience and knowledge on Team Foundation Build, establishing build automation process across priority areas/workloads.

Overview

I am a proud ALM Ranger and one of the projects I am in is the ALM Rangers Treasure map – we have just started work on version two of it and part of that is an effort to increase the transparency of the project. To facilitate this, each team member will be blogging about their experiences and thoughts on what they are doing for all to see. None of these should be seen as statement of fact or official Microsoft views – rather these are personal views of people working on a project. You can find a table of contents for ALL posts on Willy-Peter’s blog.

Lastly these notes are written with those involved in mind, so I am not going to explain everything – that said if you would like to know more about something, just post a comment and I will go into a lot more detail on it for you.

My first set of design notes

With the overview done, I’ll start off with my first set of design notes which look at how we could fulfil the following Epic: As Alex, the technology consultant, I would like to view my progress through the guidance on the live tile without launching the application.

This epic is broken into two features which I will break down further below.

Feature: Enable users to track their progress through the guidance, sync to the cloud, track on live tile.

The first thing I like to do with designs like this is get a simplified list of goals, really should be no more than three or four items that I can then dig into more detail. So for this feature understanding of the distilled list of goals on this would be:

1. We need cloud sync
2. We need live tile - I do not see this as cloud push live tile (for example sports app), rather app generated live tile (for example photo app)
3. We need to do chart rendering to image for the live tile.

We need cloud sync

Windows RT already supports this and it is a fairly simple thing to do. I am proposing a small wrapper layer around the built in aspects to give us a consistent way to work with this data. There is some overlap here with the features of another Epic (As Alex, the technology consultant, I would like to be able to mark treasure items as complete within the ALM guidance, see the same progress on all my devices where the application is installed, and be able to show/hide completed items) so this may be a feature that is moved out of here and into the other one.

Technically the two API's for cloud sync in Windows RT are:

• Windows.Storage.ApplicationData.Current.RoamingSettings : Gives a key/value store. Each key/value can be up to 8K with max of 64K
• Windows.Storage.ApplicationData.Current.RoamingFolder : Gives a blob storage. Storage has a quota that can be obtained via code.

My idea around the wrapper is to give a simple API that allows us to say something like ToggleStatus(Status.Done, <item id>);

This would store it in either a small XML file in roaming folder or in roaming settings as a key/value. I propose this style so we could extend it to work for favourites too. From the discussion already, the key/value store may be the easiest way to do this.

This API also needs to be able to assist for the map pages where they can ask, how many of items of group X are done (maybe something like GetStatusCount(<group id>, Status.Done) [return int] and also GetItems(<group id>, Status.Done) [returns IEnumerable of the items].

Impact on code: All new code. A new API for our app and then sprinkling the ToggleStatus around the app in the right places.

We need live tile

Easy enough to do again – really what we need the design of what it should look like. We need both a design for small & wide. Live tiles can take image or text, so if we planning on chart - it will mean rendering an image (see below). My thinking here is on app start up & potentially every time ToggleStatus is called we update the tile in a separate Thread/Task. API here is simply the TileUpdateManager.CreateTileUpdaterForApplication().Update(??);

Impact on code: All new code. New bit to the app start and then integration to the above ToggleStatus

Note: We could push this via a service, however that means an external dependency and we are really trying to avoid that. So having it all in app makes me feel a lot happier.

We need to do chart rendering to image for the live tile

This is going to be tough - we have some drawing primitive support in the runtime, but really we will need to rely on third party code here most importantly http://writeablebitmapex.codeplex.com/ (MS-PL license). Once that is done we can look at trying to figure out a nice (intentional usage of a word that could mean different things to different people, since how nice it is will be a factor of how much work we put in) way to generate a chart.

While this is possible, maybe a chart should be a stretch goal on this because anytime we take on an external dependency, it also needs to meet the quality gates from Microsoft & also needs to meet legal requirements for Microsoft. This can add a load of additional time onto a project. So shifting the chart to a stretch goal (i.e. if all comes together we do it) or pushing it out to vNext maybe better.

This may not be the only option – so we need to check with internal contacts at MS for advice on this.

Impact on code: New dependency on Writeablebitmapex + all new code. No impact outside the above items.

Feature: Add ALM blog tracking / news to the app + live tile.

My understanding of a distilled list of goals on this:

1. Grab Rangers RSS feed into app
2. Show RSS feed in app
3. Show RSS feed on live tile

Grab Rangers RSS feed into app

This is pretty simple, we have a pre-configured list of URL's (can be placed in the XML file) that we then parse on start up (in a separate thread/task) with the SyndicationClient API in Windows RT. My feeling is this is just temp data so we can just store in memory but I would love some feedback on that?

Impact on code: New API that wraps this. Changes to XML file & it's API. Some additional start up stuff.

Show RSS feed in app

This is really just a listview with items being shown. Minor impact.

Needs a design though.

Show RSS feed on live tile

This is easy, grab x items from feeds (above) and send to the live tile immediately. We need to plan this with the stats display since we only really have 5 tiles to rotate through. So maybe 1 or 2 for stats and rest for top news article from feeds? I am thinking simple text here will be best.

Question I have here, is what happens when I tap that item. We can detect what tile was shown so do we just go to the general feed view (easy & low impact) or do we try and find the exact item (more tricky since we need to persist some data to match it all together). This is more UX design issue than a dev feature.

Code impact (general feed) - none, it will just be part of the above.

Code impact (matching item) - to existing is none, but the scope for the first item is bigger since we should persist some info on the feed locally so we can quickly launch to the item and show something.