Some users in Microsoft's Volume Licensing portal had access to more accounts than the existing pattern for selecting accounts could handle. I worked with a software engineer and the design lead to create a new pattern. Our new pattern allows users to search and display more relevant information and loads in a fraction of the time. An interaction that took over thirty seconds now takes less than five.
Before:
The original design was a drop down menu that contained a list of purchasing accounts. As software resale partners sold more software to more customers their list of accounts grew into the hundreds, this made account selection painful at best. On top of that, the backend services were showing their age and it could easily take more than 30 seconds for the account list to load. Lastly, the drop down wasn't displaying information in a way that our users could quickly scan or search.
After:
The lead designer for the Volume Licensing portal approached me with the above challenge and I sketched and mocked up several designs. I developed a flyout design that allows for more fields which can be scanned quickly and narrowed down via smart search. Our software engineering team rewrote the back end services to load much faster.
After the initial design was completed we ran it through usability studies with our target users and refined the design based on the findings. When the work was done, we had streamlined a task that was taking users more than thirty seconds to complete and brought it down to around five seconds. The pattern has proven to be so successful that it has been replicated throughout the portfolio.
The original pattern did not allow for search, and had information compressed into a very tight dense space.
Only the activation button and details the user needed were surfaced when the flyout is closed.
The flyout initially loads with all possible accounts. As the user types the list of accounts shrinks in real time.
