Popcultcha Hero Logo

Reimagining a platform upgrade for a fandom brand

Guidance coupled a platform upgrade with a site redesign to help Popcultcha increase average order volume and conversion. 
5 minute read

Who Should Read This?

This case study will be especially relevant for those interested in the following topics:

  • Fandom marketing
  • UX / UI audit
  • ecommerce platform upgrade
  • Site redesign
  • Customer Migration
  • Magento 1 to Magento 2 upgrade
  • Product Migration
  • Orders Migration
  • Cross collaboration

THE CHALLENGE

Popcultcha needed to upgrade their ecommerce platform from Magento 1 to Magento 2. They had been working with the same Magento framework and site design they had started with five years prior and with Magento 1 support being phased out, much of Popcultcha’s existing technology would be rendered obsolete.

While platform upgrades are invisible to the user and address concerns around the technology solution, Guidance saw an opportunity to address opportunities around traffic, page flow and branding. Although the site was performing well across all key metrics, it had been over five years since the site was designed, and it was not optimized for the mobile consumer.

Brand matters. For an irreverent brand with a passionate fan base, how do you build a case for an ecommerce platform upgrade and redesign while maintaining continuity and familiarity to both users and the client?

THE BRAND

As the largest online seller of the most obscure to mainstream pop culture products, Popcultcha is the original pop culture collectables store, catering to die-hard collectors and customers looking for unique, hard to find items. Established in 1993 in Geelong Australia, Popcultcha has become a magical place for pop culture fandoms to find the objects of their fancy including books, movies, clothing, action figures and collectibles.

HELPING FANDOMS BUY MORE OF WHAT THEY LOVE

Beloved by gamers, movie and comic lovers in Australia and internationally, Popcultcha’s audience skews male (approximately 60% of overall users) with their highest age group being the 25-34 range (accounting for about 40% of their group). This audience loves the fun, irreverent and cool-geek vibe of the site.

The brief from the client was crystal clear. They wanted users to see the site and say, “that’s SO cool,” and then buy a ton of product. 

Guidance started with a comprehensive UX / UI audit of Popcultcha’s Magento 1 site. In addition to experience and visual design reviews of the site itself, this audit encompassed stakeholder interviews, an analytics review, heat map testing, as well as remote user testing with US and AUS comic store shoppers. Our goal was to identify opportunities to bring the site into alignment with best practices and address both client and user pain points without losing any of the punchiness of the brand personality.

Most importantly, we wanted to learn about the shoppers’ needs of these fandom sites, to expose strengths and opportunities of Popcultcha’s current site and identify which parts of the experience should be retained, tweaked, redesigned and/or removed.

Through the audit, we identified three opportunities to move the needle on Revenue Per Visitor (RPV), Average Order Value (AOV) and Conversion Rates (CR):

- Creating paths for users to locate specific products and popular products
- Enabling users to curate a personalized product mix
- Creating a cart and checkout experience that gives users a sense of control

Examples of recommendations Guidance made during the Audit activity.

TRANSLATING USER NEEDS TO DOZENS OF USABILITY ENHANCEMENTS

With these three opportunities in mind, we worked with the Popcultcha team to prioritize the redesign efforts across dozens of changes.

Improved Site Organization

While the desired perception of Popcultcha is to be intentionally overwhelming, the site needed some improved organization to showcase their deep inventory, preorder products as well as the vastness and freshness of their product offering. By making improvements to the existing site map, Guidance has improved the user’s ability to find and shop Just Arrived, Preorder, Popcultcha Exclusives and Specials across all categories.

Popcultcha - Improved Site Organization

Restructuring Popcultcha’s site map led to improvements throughout navigation.

A New Mega Menu Strategy

With an ongoing stream of new products, the mega menu had become a catch-all for ever-evolving sub-categories. Guidance has implemented a new mega menu strategy that allows Popcultcha to elevate high priority user and business categories.

Revised Homepage Layout

Users often search by categories and the only real estate on the home page to do any category merchandising was the hero carousel. Guidance has implemented a revised home page layout that continues to highlight products but adds the ability for Popcultcha to better merchandise entire categories.

Before

before

After

after

Product Listing Pages

Guidance has overhauled the PLP product filtering experience implementing modern and specialized filter patterns. While the existing offerings of Preorder, Brand, Manufacturer, Genre, and Price were good starting points, we discovered that users had other factors that would play into their purchase decision including size, weight, color and material. This new and improved product filtering experience gives users more ways to create their personalized mix of products.

Product Listing Pages

Rather than a consistent treatment across all filters, each filter is formatted to anticipate users’ needs. The price filter includes a slider to set low and high prices as well as text input fields. Filters with many items include scrollbars, preventing any one filter from monopolizing the length of the screen. Filters which are longer still include filter-specific search bars, allowing users to jump directly to their selection. 

Enhanced Search for Brands

Because fandoms are extremely loyal to brands, Guidance has added a search tool to improve the user’s experience looking for a specific brand. Added to this is a curated sort option to provide an effective way for users to find and discover new brands.

IN THEIR OWN WORDS

“Popcultcha is a magical place where many go to find rare or limited-release items, so it was important that we built this in a way where people can easily find what they need and quickly purchase.”
- Kevin Lainez, Project Manager at Guidance

Category Landing Pages

When users clicked on a primary navigation item, they would be taken to a listings page which could feature thousands of products – an impossible and time consuming task for users to find what they want. Guidance has introduced a new level to the Popcultcha experience with the addition of Category Landing Pages, which encourages users to take a more deliberate path selection before being exposed to hundreds of products on a product listing page.

Category Landing Pages

Desktop and mobile category page experiences both clearly orient users within a shoppable category, and provide Popcultcha with real estate for category-specific promotional content.

New Cart and Checkout Experience

One of the main reasons for shopping cart abandonment is when users can’t see or calculate up-front total order cost. To solve for this, Guidance has implemented a new cart and checkout experience. Funneling the user through the cart gives them access to tools that allow them to estimate shipping, taxes, apply coupon codes and “check their work” prior to completing the purchase. The new cart experience also gives Popcultcha an opportunity to promote impulse buys.

shopping-cart

The new shopping cart design surfaces critical information to users early in the purchasing process.

Mobile Shopping

A modern ecommerce site has to be designed for the mobile consumer and Popcultcha’s Magento 1 mobile experience was dated and not optimized for mobile devices. Guidance has redesigned the entire mobile shopping experience to be mobile first.

Popcultcha - Mobile Shopping

Evolving the Visual Design

While the UX team was focused on how users could better interact with and navigate the new site, the UI team was focused on how to create an orderly visual language, define a hierarchy of interaction across each interface, and increase conversion performance.

Working with Popcultcha’s existing style guide, the visual goal was to create order, convey the brand style, and meaningfully guide the eye through the interface while using their vibrant, playful and busy aesthetic. Guidance has played with the relative size of elements, strategic placement of those elements, “empty” space to allow the brain a moment to digest, and a very deliberate hierarchy of typography and colors to provide clarity.

IN THEIR OWN WORDS

“Popcultcha’s users are really passionate about the brand, so we knew that it was crucial that the brand personality still shone through all the UX/UI improvements we were making.”

 

- Serena Illescas, Visual Design Director at Guidance

BRINGING UX IMPROVEMENTS TO LIFE VIA TECHNOLOGY

The Guidance technology, UX, and UI teams worked collaboratively to make sure that during the Magento 1 upgrade, the technology is delivering value to users as outlined by the UX / UI audit.

AWS RDS Databases for Speed and Reliability

This was extremely important as Popcultcha has several sales events (i.e. ComicCons) each year where thousands of orders are processed in a single night.

Smile.io Rewards

To drive repeat purchases and loyalty, Smile.io was selected as the rewards program due to their focus on niche audiences and community building. This unique rewards program provides a seamless platform for fandoms to become Popcultcha brand advocates and build thriving brand communities.

Smile Rewards - Popcultcha

Yotpo Customer Reviews

To facilitate and amplify Popcultcha customer’s love of sharing, Yotpo was selected for product review aggregation, management and marketing. Direct integrations with Facebook and Instagram allows customized product pages to be generated on the fly, using user posts which contain Popcultcha products.

yotpo

Five Years of Data Migration

One of the most challenging aspects of the Magento 1 to Magento 2 upgrade was the data migration. Guidance was responsible for migrating over five years of customer and order data, along with products, reviews and loyalty rewards. This required careful planning to ensure adherence to a sequence and workflow that supported several interrelated moving parts. Most importantly, while the data migration was happening, the customer’s ability to manage their account was uninterrupted.

In addition to the custom integrations and data migration, the technology upgrade delivers enhancements to performance, simplifies user interfaces and improves site search via predictive search. Guidance has also reimagined the shopping cart experience so customers can save the entire contents of their shopping cart in a single click, add cart contents back to the cart at a later date, edit the content and share the cart items as a Wish List for key gifting occasions. And finally, Guidance has added integrated payment gateways like Braintree and PayPal so users can save previous credit card information for faster checkout.

Results

Guidance delivered a redesign and platform upgrade solution for an irreverent brand with a passionate fan base.

 

By focusing on user needs and opportunities, the creative and technical solutions are helping Popcultcha fandoms find and buy more of what they love and delivering business growth for Popcultcha.

Summary

As part of a Magento 1 to Magento 2 platform upgrade for Popcultcha, the original pop culture collectables store, Guidance saw an opportunity to also redesign the site to address opportunities around traffic, page flow and branding. In addition to bringing the UX improvements to life via technology, the Guidance team migrated 5 years worth of customer data and integrated new technology platforms for loyalty and rewards, product reviews, predictive search, payment gateways and created a new cart and checkout experience.

The upgraded solution leverages Popcultcha’s existing brand equity and demonstrates how a redesign involves more than just a look and feel update and how technology can deliver a better customer experience.

The result is a mobile first ecommerce site that helps fandoms find and buy more of what they love while delivering higher AOV, RPV and CR for Popcultcha.

SERVICES

  • Creative Audit
  • Site Map
  • Wireframes
  • Visual Design Comps
  • Project Management
  • Technical Delivery
  • Account Direction
  • Workflow Development

TECHNOLOGY SOLUTIONS

  • Magento 2.3 EE
  • AWS Relational Database Service
  • Smile.io Loyalty
  • Yotpo Reviews
  • Braintree Payments
  • Afterpay Pay Later
  • PayPal Payments
  • Signifyd Fraud

Find out how Guidance can create solutions for you!

CONTACT GUIDANCE