Case study — 2021

Bulk Edit Metadata

bulk-edit_header

Editing, completing, and updating metadata is the cornerstone to leverage value out of the content but is often seen as a chore. How could we help our users to be more efficient on this tedious task? I lead the design to extend our feature set to allow users to edit in bulk.

My role

Lead and solo designer— discovery, user research, design, testing

Team

Bertrand Chauvin, Product Manager

Lisa McIntyre, Product Manager

Gabriel Barata, Lead Engineer

Miguel Nixo, Engineer

Problem

The lifecycle of a document begins with creation, then adding metadata so that it can be easily found. Often the same metadata needs to be applied to multiple files. Users could not do this in one action, and thus were repeating the same task hundreds of times. We were making this a frustrating experience for users. 

In an ideal world, one where digital transformation has finally taken place a digital asset would never leave its business context. This would lower the need for storing standardized metadata content on the file itself. But most of the industries haven’t quite reached this stage yet and until then leveraging file metadata will still be of great interest. 

The ability to edit metadata in bulk has been a customer request for years in our backlog, as it solved key use cases for our users to become more efficient and faster at applying metadata. However, because they were unable to do this in WebUI, we were forcing our users to spend a lot of time doing repetitive tasks and increasing the chances of committing mistakes during that repetition. 

Edit-options

Editing options

The central feature of this project was allowing the user to change the metadata of multiple files. We landed on three types of applying changes that fit within our scope: replace, append, and remove values. These supported different use cases, for example, changing a client's address on documents, removing an expiration date on assets, and adding models and products names of a photoshoot.

Error feedback

To help the user recognize, diagnose and recover from errors, we planned for all the possible mistakes and situations that could happen.

Since each individual file may have fields that are required, on a schema level, we need to prevent the user from deleting information. On these fields, we disabled the option to clear any existing value.

Once a user starts typing on a field, the editing option switches automatically to replace the original value with the new one. If this field is cleared, the editing option defaults back to don't apply any change.

Explore and iterate

An extensive study on bulk editing and our competitors showed me that there are two possible approaches for this problem: editing on a spreadsheet or editing on a form. I first began by interviewing some of the customers that asked for this feature and their users so that I could better understand their needs and current obstacles. After talking with them, I gathered all the findings and organized them on an affinity diagram. From there, I created a user flow with the points we needed to focus on for an MVP.

Shaping-Bulk-Edit-Frame-2

After sketching ideas and flows onto freehand, I went back to the customers and stakeholders to gather feedback on these two approaches. We found out that our current spreadsheet editor could be improved to deliver what we were proposing, but the user needs were more complex. We needed to think of how could we allow the users to bulk remove, add or replace values on each metadata field. The spreadsheet wouldn't work for this but we could use the form concept as a base.

I began designing variations in Sketch. I would show my team the designs I was most confident about, then get feedback and go back to the drawing board for another iteration on the designs. Every single detail was nuanced, and I felt as if I was trying to put all these important pieces together into a jigsaw puzzle.

Bulk-edit

Bulk edit form and framework

Recognizing the need to simplify the flow and start with an MVP, I focused on the most urgent needs and explored options where we could choose for each metadata field to keep the values as it is, to remove them, or to replace them. These were the first use cases that customers brought to us. I also focused on creating a solution that could scale to fit more use cases, such as editing to add more values on multivalued fields. This could easily become a too complex solution and so trying to minimize the amount of information in the modal and make it less overwhelming was the fulcrum.

MOCKUPS

Editing interactions

As part of the editing flow, we realized that our components were missing certain states and had other inconsistencies. Therefore, as part of this work, every state and interaction had to be accounted for and mapped to the other components styles and interactions used throughout WebUI.

states
Outcome

This was a very exciting and fun project for me to work on as it provides real value, involved a lot of research, and detailed interaction work. However, shifting priorities and changing roadmaps have delayed the launch of this feature. Still, I learned some important takeaways from this project related to product and business processes.

How to adapt to changing requirements

New timelines, resourcing issues, and reprioritization meant the scope of the project was constantly changing. I had to adapt to those changes and still deliver the best design in time with tight deadlines.

Always fight for good UX

I had to work under very strict technical constraints but, still, fight for what I believe is essential to having a good user experience.

Don’t overpromise and underdeliver

I learned how to define a true MVP vs. something that is simply not usable and therefore not shippable.

Choosing what we won’t do

There were many great use cases we could tackle with a rich feature set. However, every single one was costly or unrealistic. I had to determine where the real value was for WebUI so we did not spread ourselves too thin.

Carolina.mgouveia@gmail.com

Find me on LinkedIn ↗