My Role
Enhance the user experience for data filtering within the product by redesigning and developing a scalable, reusable component in the Design System that can be seamlessly applied across all MYOB platforms.
The Problem
Filtering through data on invoices, bank transactions, and other records to find specific information can be challenging. Using filters, particularly on smaller screens, is not intuitive or user-friendly.
Design Development
As part of the initial design development, an accordion and a modal design concept was created to determine which was the preferred experience with users.
Accordion design
The accordion design featured a drop-down filter bar that sits at the top of the page. The decision was made to explore this concept as it a familiar experience for the MYOB Practice platform users.
Modal design
The modal design featured a pop-up modal filter that appears in the centre of the screen. The decision was made to explore this concept as it a familiar experience for the MYOB Business platform users.
User Testing
A vital part of the design process was to involve 
customers in the design development.
Prototypes were created, a script was written and user testing was conducted to gain insights into the usability of the design and ultimately determine which was the preferred design approach.
Prototypes were created, a script was written and user testing was conducted to gain insights into the usability of the design and ultimately determine which was the preferred design approach.
Insights
Prototypes
Accordion prototype
Modal prototype
Insights & Results
After synthesising the results, it was clear that the user found the modal experience a better experience.
The results showed that users found status, type and other attributes easier to find in the modal, they found it easy to clear filters and favoured the search input to find clients. They also liked the checkboxes in the modal.
The results showed that users found status, type and other attributes easier to find in the modal, they found it easy to clear filters and favoured the search input to find clients. They also liked the checkboxes in the modal.
Final Design Solution
Before deciding on a final design decision, insights from user testing were presented to stakeholders,
and several rounds of iterations took place, with design updates going through design reviews.
and several rounds of iterations took place, with design updates going through design reviews.
The final design solution has successfully improved the user experience.
Design system components
