
Lead Agency: Revel
Role: UX/UI Direction – Art Direction
Apps: Sketch, Photoshop, Illustrator, Indesign
Funko, the makers of pop culture merchandise such as POP! figures, wanted to change their online shop. The current one did not display featured products well. The products that were released on the site were online exclusives and needed to evoke that feeling with customers. There were also many websites designed to be a hub for Pops. Funko wanted to be the hub for all things releated to Pops. They were about to change their shop technology to better work with their distribution pipeline, so this was a great time for an update.
Project Breakdown
1. Customer Research
2. Workflow Design
3. Template Design
4. Production Handoff
Customer Research
What was known was learned from working with a strategist who focused on marketing research, focusing on segmentation and growth areas. I focused my research on where Pops were sold and traded, such as conventions, stores, and websites. I had also learned that customers were very proud of their Pops and usually displayed them stacked like shelves on the wall. There were also a lot of unboxing videos, as this was also part of the culture. Customers also took the time to record their Pops online in an index. Collecting is very important, and ultimately, they would be on display.

To improve the customer experience required a bit of new thinking for information architecture. Talking to customers, learning on Pops forums, and learning about current shop behavior gave insight to begin mapping customer desires. This provided some new ideas for the architecture and features of the shop.

I began designing once I was comfortable with the desires of both the customer and Funko in mind. After several concepts, the idea of having the page display like the wall of Pops that were common for most collectors to build. Also, it allowed us to break down the themes of Pops. A lot of collectors would keep their Pops organized by story, movie, or theme.

| Concept 1: A great place to get the business goals aligned. This was presented company-wide and opened the door to alignment of offerings and the limitations of the current tracking/distribution technology. It was a great conversation! | Concept 2: Great ideas for consolidating the current offerings of the store into an architecture that can grow. Also, with deeper research into the customer’s mindset, more marginal space around the product enables better focus. | Concept 3: The last concept pays homage to the shop and collector experience. The products are displayed using the entire screen width and continuing off the viewport. I also included real products in the space to test for image size and product titles. These would also need to be optimized for mobile. |
![]() | ![]() | ![]() |
Before going any further, there needed to be a plan for the output of assets. The new store was going to require being live on both desktop and mobile. The display of the products is very important. The current shop had images of both the box and the product inside it. They had odd shapes to accommodate the variety of product shapes and quantities available in the box. I did a test to develop a good system that would work on both platforms. Finally, I settled on a square with a generous margin and single images of parts of a product set.

Next were the product category landing page, product display pages, and search. For a lot of customers, these will act as the repository of all information about the product, such as run, where it was released (limited edition Comic Con version), and even the mold number.

Now let’s look at this in the larger perspective. The shop needed to feel seamless to the larger site. It was currently on a subdomain, and there was no way to cross-link into the main site. Pages needed to be optimized for sharing, search, and promotion. The integration of this will have to be created in phases, so there needs to be a plan. A site map was proposed, and a strategy for content was also developed to be implemented later.

Using a purchase funnel as a model, the pages were developed with three different focuses depending on clicks into the site. The top-level pages would have more awareness-focused content. The secondary pages would have more content about a single topic, like Star Wars products, to reinforce their journey. The third or tertiary pages would be more focused on the product details and designed to convert to a sale of the product.



Secondary pages with content devoted to themes

These pages are created with the intention to move to a final PDP page or themed section in the shop.

Product detail page wire and hi-res example
Shop Landing Page
Home Page Versions
Made some example versions of homepages to show how customers can jump off to deeper sections.
And I made their marketing dept a nice style guide.









