Shutterstock Collections

Product Design (UX-UI)
Company: Shutterstock
Research & Design collaborators: Erin Essex, Matthew Gottesman, Rose Matsa
Year: 2020

Making Shutterstock Collections an integral part of the creative workflow

Shutterstock is a global online marketplace providing royalty-free stock assets and innovative tools, empowering creative professionals worldwide to produce their best work, all on one platform. Shutterstock Collections existed for years, allowing users to bookmark, curate and organize the assets they select for their projects during their creative process and workflow. It was a practical feature on paper, but the quantitative data we collected revealed a different picture: most of our customers were not saving their assets to collections, overlooking or quickly abandoning them from their daily workflow. Our focus promptly revolved around transforming Shutterstock Collections into the powerful tool we envisioned, which holds and creates high value for Shutterstock customers.

A fresh start: research and understand the problem(s)

Starting fresh with Shutterstock Collections allowed our team to set up our preferred process and follow the design thinking methodology, empathizing with customers to refine our pre-existing data analysis and frame our problem better. Past research findings indicated that our collections feature was a good indicator of high-value customers, driving conversions and retentions (for instance, users with 2+ collections converted at around 30%, versus 10% for users with zero collection). However, most of our customers were not using Shutterstock Collections as part of their creative workflows: 70% of users abandoned the feature after creating only 1 collection!‍

We started by conducting several user research sessions, as we needed to understand our primary target audience, the usual workflows of our customers, and what brought the most value to our customers in these workflows. Our research goal was to uncover answers to the following central questions:
→ When searching for and organizing assets, what patterns do our customers follow, and what tools do they use?
→ Are our customers aware of our collections feature when browsing assets on our platform?
→ How are our power users using the collections feature in their workflow?
‍
Our user research methodology consisted of 6 moderated interviews, 8 unmoderated interviews (using the UserTesting platform), and a Qualtrics survey triggered on collections pages.

—
User quotes from our moderated and unmoderated user interviews

Communicating findings and sharing users' feedback with stakeholders

Our efforts resulted in approximately 163 nuggets, 20 insights, and 15 recommendations entries in Airtable, then formatted into a curated presentation to stakeholders across the company. Getting stakeholders to hear customers’ live impressions and feedback through video reels showcased in the presentation deck had a more substantial impact on getting buy-in on a plan of action advocating for putting our users first and prioritizing optimizations.

Ideate, prototype and test solutions, starting with the Save to a collection flow

Once our team analyzed the data collected from our round of user research, we brainstormed to transform our users’ insights into design recommendations to address systematic usability, discoverability and performance issues. I explored various design solutions and prepared prototypes to test.

Our first priority was to address one central pain point among our users: saving an image or video to a collection. The current icon (a little Plus sign in a circle) used to represent the action to save an asset to a collection confused many users, who ultimately overlooked the feature.

First, we replaced all instances of the Plus icon with a new Heart icon on the web and native apps and made it persistent on the web search results for Images first, then across the experience and products (Footage, Music, Enterprise...). We tested different positioning and styling options for the new icon on search results grids.

—
Our first optimization was based on our users’ feedback from past and recent research initiatives around collections: implement a more explicit Save to a collection action icon. We replaced the Save to a collection original icon across the Shutterstock experience, from the log-in / sign-up modals to asset details pages.

Early numbers from April 2020 for the web platform showed a 25% increase in engagement and a 15% increase in conversions following the icon change.
—

Next on our list was simplifying and optimizing the Save to a collection flow. Saving to a collection was indeed a tedious process for users still. The repetition of a pop-up modal for each asset selected was highly disrupting and slowed down our users’ browsing flow. This iteration comported two parts, which allowed for a quick win and feedback loop for users:
‍
→ Simplifying the flow by leveraging existing patterns and components: the second time a user saves an asset to a collection (in the same session), the asset is automatically saved to the latest selected collection. Our success feedback snackbar component pops up in place of the modal, avoiding annoying repetition and removing a bit of friction from the interaction.
‍
→ Enhancing the success feedback snackbar component, by adding an asset preview image and introducing multiple actions like View and Change. We also tested different styles, positioning, stacking rules, and timing to optimize further.

After testing different options with users, we implemented an improved success feedback component integrating an asset preview, a link to the current collection, a new Change action, and new positioning in the top-right corner of the page.

Beyond Shutterstock Collections: saving an asset to a Workspace Project

A company-wide restructuration happened at this point of the Shutterstock Collections project. I temporarily joined forces with another team before helping on a new initiative based on all the foundational work we initiated for collections: Shutterstock Workspace.
‍
The idea behind Shutterstock Workspace was to create a dedicated space where users could save and organize their images, videos and music tracks into Projects, a new concept bound to replace our collections feature in the future. Users would also access various new features enhancing their creative and collaborative workflow.

The Save to a collection flow optimization was replicated for saving an asset to a project but remained a source of frustration and friction among users. To get a quick refresher and build on past learnings, I reviewed our most recent user research findings on collections again; I also did a quick competitive research analysis about bookmarking photos or adding songs to playlists on various platforms. Then, I started ideating beyond existing components and patterns, exploring a new contextual menu component and more integrated feedback interactions using simple animations. I laid out the different scenarios and interactions for a first-time flow, a returning customer flow, un-saving an asset, and so on.

A need to pivot and test Workspace solutions with Enterprise customers

The new contextual menu component was positively welcomed and successfully sped up users’ workflows. Still, Workspace BETA users were confused about the difference between Collections and Projects and hesitated to replace Shutterstock Collections with Workspace as their new workflow to save assets. We also noticed positive feedback about new features like commenting and notifications but little usage and engagement. This indicated that the team might have addressed the wrong audience when testing these new concepts and collaboration features on the e-Commerce platform. The time had come to pivot and apply Workspace’s learnings and solutions to our Enterprise audience and empower teams’ workflows with a new offering that would become the future Shutterstock Catalog.

< Previous See all Next >