Shutterstock Elements

Product Design (UX-UI)
Company: Shutterstock
Year: 2019

Shutterstock Elements: introducing visual effects packs

Shutterstock is a global online marketplace providing royalty-free stock assets, tools and services. When I joined the Footage and Music business unit in Montreal in 2017, the team’s long-term mission was to consolidate Shutterstock’s product portfolio into a unique, holistic user experience. We started with the migration and redesign of the entire Shutterstock Footage interface, completed in 2019 with the launch of a new product, Shutterstock Elements, answering the video customers’ growing demand for VFX packs.

Integrating Rocketstock VFX packs into the Footage experience

Before the migration to Shutterstock Elements, VFX packs were curated and sold by Shutterstock on Rocketstock, a separate, proprietary platform. To consolidate and expand our offering to Shutterstock customers, the mandate was to rebrand the existing packs and integrate them seamlessly into the new, revamped Footage experience. This project was a perfect opportunity to improve parts of the user experience while keeping feature parity and consistency in mind.

We started by having conversations with users and stakeholders to unveil pain points in their journey and agree on a plan of action. We ended up designing and integrating a complete discovery and purchase flow around the new Elements libraries in the Footage experience, with an additional section on the Footage homepage as one of the starting points.

As logical parts of this new flow, we created:
→ A link under the Footage menu in the global top navigation, directing to a dedicated landing page
→ A dedicated section on the Footage homepage, directing to a dedicated landing page
→ A dedicated landing page where customers could explore and browse by categories
→ Categories pages, grouping similar Elements libraries
→ A lister page showcasing all the Elements libraries
→ A product details page filled with information and previews for each Element library

A supercharged product details page

The Element details page was an essential step in the customer journey to aid them in finalizing a decision and purchasing a pack. A large hero playing an impactful video trailer, a curated introduction paragraph, and a practical panel laying out all the technical details were the first elements on the page to provide a helpful overview of the product. When scrolling down the page, customers could discover featured effects by opening a full-screen overlay showcasing animated effects previews, as well as resourceful "Behind The Scenes" and "Tutorial" videos.

Ensuring visual assets consistency

Although product design was at the heart of the Shutterstock Elements project, it also called for some branding and marketing requirements. Selecting and preparing the visual material for each Element library helped me ensure visual consistency across the website experience, from the thumbnail on the Lister page to the hero image on the Product details page. It was also a fun and creative way to explore each pack and ultimately enabled me to communicate their content and singularities most instantly.

< Previous See all Next >