Filters for Comments

for Workfront web app

New filters for comments list designed with enterprise customers in mind.

Project Overview

The Product

Workfront provides an Operational System of Records - advanced work management platform for enterprise customers. Online application dedicated for reviewing and approving digital content is an important part of the system. Thanks to this tool users can collaborate and go through review process.

The Problem

Users struggle to find comments matching certain criteria as: author, action, flag etc. List of comments is usually very long and it takes a lot of time to go thought it. It is challenging to find information in threads and it is currently impossible to filter replies. Users claim that experience is too messy and counterproductive.

The Solution

Create a complex but easy-to-use way of filtering comments. New solution should be designed with enterprise customers' needs in mind. They need multiple filtering options optimised for big number of users and custom flags.

Understand

Who is this solution for?

Comment list is a basic experience in the application. It is browsed by all the users - from beginners and guests to advanced users and system administrators. 

Beginners and guests

It is important to not overwhelm those users with multiple options when it comes to filtering. They should be able to use just one or two simple criteria without analysing all the available options. Filters should be designed with progressive disclosure in mind.

Advanced users

They need multiple categories of filters applicable at the same time. For example, it should be possible to see replies from one person which have two flags assigned. Editing filters without losing previous settings is important as well.

Design challenges

Make it intuitive for everyone

Both beginners and advanced users should be able to find all the criteria they need.

Give right amount of information at the right time

Do no overwhelm beginners but enable agile workflow for power users.

Inform clearly when and which filters are applied

Interface should give visual feedback to indicate that user is not viewing the whole list but only filtered comments. It is important  as research shows that filters should be saved and applied when reopening the document and between different proofs. 

Design principles

Lead with why

Be bold and innovative

Think enterprise

Keep it simple

Design

Panel structure

2nd Proposition

All sections are open and ready-to-use. Users can see what they can choose from. When reentering the filters panel, it is clearly visible which options are applied.

Assumptions

- Users prefer to see all options when entering the panel

- Hierarchy is strong and user can easily scan the screen

Considerations

Busy interface may be too difficult to scan for users and make process
time-consuming.

Decision

We decided to choose second proposition. We took a step back and analysed other situations when we had to choose between simple interface with hidden options and open but busy experience. Overwhelming majority of our users were choosing to see
all options available. Research conducted later for the whole comment section showed that we made the right decision.

Choosing Authors

Assumptions

- Users have a lot of contacts on the list
- They usually choose only 1-3 people

After opening the dropdown users see all the contacts on the list. They can use search functionality or choose people manually.

1st Proposition

When the name is chosen it disappears from the list and transforms into pill on the top of the dropdown.

Pros

- It is a standard behaviour of the list-pills module
- List gets shorter and name is mentioned in only one place

Cons

When user scrolls through the list she has to refer to pills to find out whether someone is already chosen or this person is not on the list at all and should be invited to the proof.

2nd Proposition

Chosen name is indicated both by check mark on the list and by pill above it.

Pros

- User clearly sees chosen person both in pills and on the list
- No confusion between already chosen names and those which are not on the list at all

Cons

It may be misleading that the same name appears on two lists.

Decision

We decided to choose second proposition. It is more user-friendly and leaves no doubt. Also, following ‘think enterprise' rule, we have to avoid unclear communication regarding access rights. It should be clear which users are not on the list on purpose, as they don’t have access to the proof, and which are already added to filters.

Checkboxes are disabled, until user chooses first person from the list, to avoid confusion regarding whether all contacts are available on the list or they are limited to authors of comments / replies.

For the most popular use case - choosing 1-3 people - pills look tidy and elegant.

When user chooses extremely high amount of people from the list we provide two independed scrollbars - for list of contacts and for pills.

Indicators

Assumptions

Users apply the same filters when entering the same proof - for example: they always look for insights from the same decisive person, search for unresolved issues or would like to see only new comments.

It is important to inform users that they are viewing limited amount of comments as filters are applied. We would like to avoid confusion and misunderstanding. I came up with two types of indicators:

Different icon states

Filter icon changes to indicate whether or not some filters are applied. Indicator is contextual and subtle.

Contextual notification

When user reenters the proof notification shows that some filters are already applied in order to let her know that some comments are not being displayed.

Contextual notification

Lessons learned and future iterations

Filtering turned out more complex than we were assuming at the beginning. Taking into consideration enterprise character of the tool and amount of functionalities it offers, every functionality must be able to serve all the use cases. It sometimes makes interface busy and complicated.

In future iterations, concept of applying two separate solutions for beginners and advanced users should be revisited.