Adobe
Advanced image search 🔍
Search imagery on Adobe Stock using computer vision.
Empowering users with new ways to find the right image in a database of millions of assets.
Adobe Stock is a marketplace for finding great content for your creative projects. From 2015 – 2018, I was the lead designer for the browsing experience on the site. This includes the navigation, search input, saved items (“My Libraries“), and filters panel. The majority of those design implementations continue to live on the site today.
One of my favorite things I worked on for Adobe Stock was advanced search. Users needed tools for sorting through the massive amount of content provided in a search result and Adobe had some interesting technology becoming available for identifying objects within images.
🚀 This is a feature that continues to live on the site.
Problems
⛔️ Users felt a deep lack of control over what content they saw from performing searches on Adobe Stock and similar sites.
⛔️ People often need to find imagery with space for text to be added.
Opportunities
👁️ Emerging capabilities of computer vision technology.
Prototypes
I did a lot of prototyping and usability testing for this. Because of the complexity in the interactions and animations, I needed to use a tool like Framer (Framer Classic, RIP 😔) that allowed me to fully control the interaction design.
Some of these early prototypes are conceptual and exploratory, but the movement of objects within a composition continued to be a focus.
Throughout this process it was important to confirm that concepts worked well using the actual image content in our database. It's one thing to create a concept with hand-picked imagery, and another to put it to the test using real data.
The project required collaboration with the internal Adobe Search team to understand technical constraints and possibilities. It involved reviewing their prototypes and creating my own concepts. We (design, product, engineering) continuously shared ideas of what could be possible.
Goals
🎯 Increase user confidence in their ability to find the right images for their projects.
🎯 Deliver functionality not available on similar products. Provide a new reason to switch from a competing product to our product.
🎯 Design an experience that illustrates Adobe's powerful technology and deep understanding of what people need to do their creative work.
Outcome
I worked as the lead designer for this project before ultimately (moving to New York) passing it along to a designer whom I had originally worked with when they were an intern (they were hired as a new graduate 🎓 🎉). We shared ideas, built prototypes, and they ultimately pushed it into production about a year after I left Adobe in 2018.
A few years later the experience continues to live on the site.
One more thing…
Building Adobe Stock for Framer. Product as a service.
One of the most interesting aspects of working on Adobe Stock was thinking about the product as a service rather than just a website or an app. A product can live in so many places. Google Slides, design applications, or even a CMS. You can deliver the “product” directly to users within the context of their workspace.
A few years ago I built a plugin for Framer that allows a user to search for content within a design file. It uses the Adobe Stock API. I made this before the beautiful world of Figma plugins came into existence. We see much more of these kinds of tools available today.
Recently, I put the code for this on open source. You can also play around with an example of it in action here.