{"id":164,"date":"2017-02-01T01:15:35","date_gmt":"2017-02-01T01:15:35","guid":{"rendered":"https:\/\/portfolio.cherylplatz.com\/?p=164"},"modified":"2021-05-18T22:54:36","modified_gmt":"2021-05-18T22:54:36","slug":"azure-marketplace-2-0","status":"publish","type":"post","link":"https:\/\/portfolio.cherylplatz.com\/?p=164","title":{"rendered":"Azure Marketplace 2.0"},"content":{"rendered":"

In the fall of 2016, my responsibilities as the Azure Framework Design Lead expanded to include direct responsibility for our pro developer marketplaces. When we began, the only active marketplace in our purview was AppSource.com, but there was an immediate need to take the lessons learned on AppSource and apply them to a completely new approach to the existing Azure Marketplace.<\/p>\n

Role and Team<\/h2>\n

For the 2.0 version of the Azure Marketplace, I was the sole designer, working with 3-4 program manager partners and several UI developers on a daily basis. In addition, I partnered with our team’s content designer to review all text and terminology along the way. The engagement began at the end of October 2016, and all generative design work had to be completed by the end of the calendar year. The site went live at the end of January, 2017.<\/p>\n

Problem Statement<\/h2>\n
    \n
  1. Apply and modify the design patterns established on AppSource to a brand new version of the Azure Marketplace.<\/li>\n
  2. Generative design on an aggressive timeline for Azure Marketplace specific features: most importantly, login flows and virtual machine pricing.<\/li>\n
  3. Ensure design does not conflict with existing Azure.com styling and patterns<\/li>\n
  4. Adapt existing designs and new designs to use the proprietary Microsoft Web Framework (MWF).<\/li>\n<\/ol>\n

    Feature: Virtual machine product pages<\/h2>\n

    One of the most challenging new features needed for this Azure Marketplace implementation was support for the complexity of virtual machine pricing. Pricing for virtual machine offerings varies wildly based on a number of factors: billing country, software plan, number of CPUs supported, amount of RAM and disk size, etc. As this design engagement was alongside 4 other new engagements for the site launch, we had only 3 weeks from beginning to end of the design phase.<\/strong><\/p>\n

    Design pivots<\/h3>\n

    For complex design problems like this one, I start by identifying design pivots: individual design variables that can be changed relatively independently. We can mix and match various approaches to design pivots to reach our final design.<\/p>\n

    In this case, the virtual machine pricing feature pivots included:<\/p>\n

      \n
    1. Relationship between billing country and software plan<\/li>\n
    2. Control used to expose software plan<\/li>\n
    3. Placement and visual treatment of filters<\/li>\n
    4. Grouping and selection of filters<\/li>\n
    5. Method of highlighting “publisher recommended” configurations<\/li>\n<\/ol>\n

      Round 1 Explorations<\/h3>\n

      This initial round of explorations went very broad; a selection is shown below. I was working to get coverage on multiple options for each of the design pivots identified above.<\/p>\n