top of page

Modernising a legacy app: 
Enabling new and connected diagramming experiences 

LEAD UX DESIGNER,    MICROSOFT VISIO,   2020/2021
2 MINUTE OVERVIEW      |      CASE STUDY AVAILABLE UPON REQUEST

Greetings,

 

Thank you for visiting this website. Please note that this website is not yet optimized for small screen sizes. For the best experience, I recommend visiting this website on a desktop or laptop.

 

In the meantime, if you are using your phone, you can view some of my new-media sketches or connect with me on Instagram @abhinav.m.n.

Sincerely,

Abhinav 

Meeting customers where they are!

Microsoft Visio is a popular diagramming and vector graphics application that has a loyal and active customer base. Part of the M365 family of products, Visio is used to create diagram types such as flowcharts, org charts, floor plans, network diagrams, UML diagrams, mind maps and more. Up till recently, Visio was available only on Windows. In the late 2010s, the leadership of Visio decided to take a "Web First" approach and invest in creating a browser based Visio app. This decision was driven by the core business value of the company, which is to:

"empower every person and every organization on the planet to achieve more."

To meet customers where they are, Visio started to shift towards the web. During this transition phase, I joined the Visio team as a UX designer leading this shift. I led the Design and User Research of multiple features simultaneously. As I moved forward in this role, I found ways to connect work across features and partner products into a coherent design approach.

On this page, I am sharing an overview of my responsibilities, different features I worked on along with my impact and contribution to the product. 

My responsibilities

BACKGROUND

I owned and led the design for multiple features simultaneously. Overall, I was responsible for improving Core App experiences, New Diagram types and Integrations with other Microsoft products.

Continue reading to know more about my responsibilities, impact and contribution.

Creating a design system for Visio

01

The first problem I solved was that of creating an effective communication setup between developers, design and product management.

As a part of this effort I created a design system for Visio and its App Anatomy, that was aligned with the M365 family of apps, Fluent Design system and included Visio Specific elements. This included corresponding Figma component library and variants. This was a long term project that kept evolving throughout my tenure at Visio.

02

M365 integrations

Being on the web and part of the M365, Visio had to work well with other apps of the family like Excel and Teams. This required close collaboration with the teams across Microsoft, aligning with their vision and roadmap and exploring Visio’s role in the journey of a M365 user.

I designed and helped ship MVP and subsequent versions of Visio’s Excel Data Visualiser Plugin that allows users to create diagrams from spreadsheets and edit them inside Visio. I also designed and helped ship Visio in Teams.

New web-first experiences & diagramming capabilities

I also led the conception, design and research of new diagramming capabilities in Visio. These were designed grounds-up for the web. Examples of such capabilities includes Org-charts (Relationship Tree diagrams) in Visio. I designed the features that enable effortless creation of relationship tree diagrams introducing brand new functionality to Visio Web. 


The opportunity was not only to migrate users from desktop to the web but also to acquire new users who expect a faster and smarter solution to creating diagrams. 

03

Blue-sky concepts exploring the future of diagramming

The larger goal was to not just catchup with the present but to help steer diagramming towards the future. This needed an active explorations of future scenarios and opportunities where Visio could add value to its users.

I created concepts for the team that helped provide a direction for future development.

04

Impact & contribution

Being part of a small product development crew, allowed me to own multiple features. This was not limited just towards shipping features, but extended towards fostering a web-first and user-centric, research driven and iterative approach.

While its not possible for me to state exact numbers here, my work was directly responsible for:

Increased Customer Satisfaction and Success:

  • Double Digit NPS growth during my tenure at Visio.

  • Improved number of diagram exports and shares from Visio Web, indicating the successful customer sessions.

Strong User 

Acquisition

  • Significantly increased the funnel for acquiring new users by shipping multiple features and partner app integrations. 

  • Effective and seamless user migration from Desktop to Web

Establishing Efficient Systems:  

  • Opening channels of inter-product communication for Visio within the company and helping create shared product design roadmaps.

  • Design System that has scaled effectively with new subsequent features.

* * *

Email me to know more: abnv.work@gmail.com

bottom of page