Mobile filter
Working with cloud on-the-go?
Bulk management on mobile
Azure mobile app enables customers to be connected, informed, and in control of their Azure even when they are on-the-go. As we were working to enable simple tasking on mobile, a challenge naturally emerged - within such limited digital space on mobile, how could we help the IT professionals quickly find their targeted resources for bulk management among their ocean of cloud? From Dec 2018 - Feb 2019, I had the opportunity to tackle this challenge, and designed a filtering experience that enables efficient on-the-go connections.
Magnifying each step
Leverage the learnings from the industry audit, I quickly identified the essential elements that help fulfill a productive filtering flow. With the goals for each step in mind, I moved into rapid prototyping, and started to ideate and explore different solutions in visuals.
Finding the right pattern
I investigated different patterns on both iOS practices and Material Design guidelines, and quickly mocked up several options. After discussing and reviewing the options internally, the tab approach seemed to be the best - it helped present the filtering mechanism clearly without creating unnecessary switches between screens.
Learning from users
We decided to give it a try and test it with our users. With the help of our excellent researcher, we tested the designs with 12 participants who were Azure users. There was a 100% success rate in the usability study, and luckily, we've got to identify some untapped needs as well.
1. Count info
Instead of seeing an overall count, participants expressed that the capability of quickly locating the selected filters was more important.
2. Tab style
The greyed style of unselected tabs were interpreted as disabled. To prevent this confusion, I changed them to colored. All the colors pass AAA contrast ratio.
3. Selected items
As a list could go long, I tweaked the design to surface the selected items on the top of the list as users revisit.
Final solutions
Productive filtering on-the-go
As you are looking to investigate a specific set of your Azure resources, you can quickly filter down by using the following experience:Learn it once and use it twice
Leveraging this pattern, we solved the filtering issues in Notification on Azure mobile app as well.
My take-aways
Balancing between product consistency and platform capabilities
Through this project, I've greatly learned that it's important to maintain consistency across different platforms (web to mobile), so that you users can transit and navigate smoothly even when they switch platforms. Meanwhile, it's necessary to understand the capabilities of a platform (iOS and Android) and take the best practices into accounts.