ArtBinder Mockup

Reimagining ArtBinder's Filters

Details

Company: ArtBinder
Year: 2018
Duration: 4 months
Role: Lead Product Designer
Team: Product Manager, Engineering Manager, Head of Product

Background

ArtBinder was the first of its kind mobile and desktop cloud-based inventory management platform for art professionals that allows them to manage their collections, create virtual galleries, and collaborate with clients and colleagues across the world in real-time. Artbiner is highly customizable and available in over 40 countries with localization and multi-currency support for easily tracking your collection.

The Challange

The initial task to re-design the filters came from customer requests and the growing needs of the ArtBinder platform. As Artbinder scaled and added new features, users were not able to filter by certain criteria, including custom fields. I needed to come up with a flexible framework that would be able to accommodate both current and future business needs.

  • Redesign filer to support the search for keywords within a category
  • Introduce the ability to filter by multiple values within each category
  • Create a flexible solution that could support filtering by as many custom fields as a customer created
  • Filter by dates, date ranges, and multiple currencies

Research

  • Interviewed and observed clients to understand their jobs to be done and pain points
  • Looked at the metrics and data that were being utilized in the system
  • Conducted competitive research exploring multi-currency and custom field handeling in various inventory management systems

Personas

To understand the user journeys and the vastly different needs and pain points, we created an in-depth analysis and created the following personas

  • Gallery Assistant
  • Gallery Registrar
  • Gallery Director
  • Art Collector
1 Gallery Assistant
3 Gallery Director
2 Gallery Registrar
4 Art Collector

Process

  • Conduct an audit and determine what works well in the existing implementation, and what needs to be improved
  • Identify and gather requirements for all of the potential types of filters that are needed
  • Come up with a framework that would support growing filtering needs as the platform scales
  • Iterate, evaluate, and test the solutions

New filer component designs

190211_Typeahead Dropdown
190211_Typeahead with Multiselect Dropdown

High fidelity wireframe of the vertical filter option

Vertical_Filter2

High fidelity wireframe of the horizontal filter option

Horizontal_Filter2

Wireframe prototype of the horizontal filter

Horizontal_Filter_Prototype

User Testing

I came up with and conducted a usability test to find out the following:

  • Compare vertical and horizontal solutions to see if one is preferred over the other
  • Determine whether clicking the “Apply” button or “on the fly” approach by clicking out of the filter, was more intuitive

Once I ran the usability test, a clear preference for one of the solutions emerged

Final Design Direction

We ended up with very robust filters that were much easier to use than before the redesign. The new filers can easily support additional categories and filter types in the future as the platform scales. Overall the Filter redesign was a big success, with overwhelmingly positive customer feedback!

AB Filter Final Mock

Screen recording of the new ArtBinder filers in use

FSS_new

Outcome & Next Steps

Description of the outcome

  • This feature was released at the end of Q4 of 2018. As a direct result, the Artbinder platform was able to grow significantly. From January 2019 to June 2019 the number of Premium accounts increased by 30% and Seats, individual logins, per existing account rose by 25%.
  • At the time of the initial release, date ranges were out of scope and will be introduced at a later time
  • Adding metric and imperial size, and multicurrency price ranges is on the roadmap