Shutterstock Editor

In 2020 I was tasked with redesigning and simplifying Shutterstock Editor. The result is a site that enables non-designers to easily create, publish, and amplify their stories using Shutterstock content. I worked as the only designer on this project and collaborated closely with product, engineering, analytics, and marketing teams. After launch downloads increased 30% YoY.

KPIs : Increase conversion YoY & Enable sales teams to sign more lucrative deals with API partners

Process

1. Deep dived into current Editor customer base. Revisited personas based on research.

2. Looking into data, understood the most/least used features to first define prototypes for initial testing

3. UX changes based on data. “Jobs to be done” approach 

4. Revisited information architecture to simplify and streamline

5. Conducted user testing with different designs and sought feedback from other designers (iterative)

6. Created guidelines that allows Editor to be customized for any brand

7. Release and continue to iterate

Users

Small to medium business workers who are not creative professionals, but need to design and edit collateral. User group was defined by examining market opportunities and the Shutterstock customer base.

UX Improvement - Refining Features and Information Architecture

The old Editor had editing actions duplicated in several spots throughout the site. This in addition to the dark canvas and cluttered UI overwhelmed users and gave the impression that Editor was a professional editing tool.

In order to reduce feature bloat, myself and the product team did a full-site audit to ensure we could eliminate replicated features and looked at usage data to remove unpopular functionality.

Information architecture remained a problem for the previous version of Editor. Editing tools were interspersed with features to add items to the canvas. While some editing tools were shown as disabled when they couldn’t be used, others disappeared from the panels creating an inconsistent experience.

In order to remedy this, I reorganized the IA to feature only editing panels on the top toolbar, and items users could add to the canvas on the left side of the screen.

Top Editor Jobs to be Done

By looking at click data, previous research and competitor analysis we defined the top 4 jobs to be done. As the target customers are prosumers it was important to focus on making these 4 tasks as easy as possible.

User testing

Throughout the design process I ran usability testing to verify design decisions. This process helped us to confirm that our left side menus did not need static labels, and gave the team insight as to what patterns users did or did not understand. Over the course of the project my product manager and I ran 6 usability tests on a majority of the features.

Additionally, after launch we prompted users to give feedback about their experience. This has helped us to keep track of pain points and what we did well.

UI Design & Customization Work

In redesigning the UI I had 2 goals. One was to make the tool appear friendly and simple to reduce the number of users who might be intimidated upon seeing the tool. My second goal was to create a UI that works in light mode, dark mode, and could be completely customized by our API partners. Customization options, in addition to the sleek new look, helped our sales team to secure big ticket deals with other companies.

Business Results

• Downloads increased 30% YoY

• Our sales team was able to secure two new deals with our Editor product and upsell one client to upgrade to the new Editor.

• This redesign has enabled the Shutterstock to place Editor in a more prominent place in the experience going forward. This is shown with the launch of Shutterstock’s templates pages and soon to be released functionality.

Learnings

The new Editor was launched before engineering was able to finish all the features that were meant to be included. This was done in order to meet a marketing goal for the company. If I could do this project again, I would ensure that we keep a way for existing customers to access the old Editor UI until all features were built out. As we launched without one of our most popular tools, background removal, we both angered existing customers who relied on the feature and created a headache for our customer care team.

I would also work more closely with product to ensure the most important features to the UX are built first. As we did not complete all the features we planned to before launch (for a variety of reasons), some things that I felt were necessary for launch were left out. Thankfully they were treated as fast follows.

Next Steps

I created designs that would increase Editor’s features without cluttering the UI. Additionally new templates are always being added to begin to compete with other design softwares. My hope is that the company will reinvest in features for Editor post its MVP launch.