CATALYST
GAME
LABS
An edgier, more useful digital storefront
How do you take a company from inception to one of the fastest growing companies in an extremely crowded technical market?
Catalyst Game Labs (CGL) merges the best aspects of game fiction and dynamic universes to architect the best tabletop games in the industry.
We collaborated with CGL to build a new digital storefront in time for the holidays as part of a larger brand refresh.
During the last two days of November, Catalyst saw their sales increase by 12% over the entire month of November in the previous year.
The increase in sales during December was even more dramatic. Sales more than tripled over the previous year.
Before, the search box was buried underneath numerous sidebar items at the very bottom of the page.
And knowing we had to make their products more discoverable, we opted to make it much more prominent. We moved it closer to the top of the page and made it persistent across every page on the site.
We spent a lot of time evaluating our options for categorizing products. Specifically, determining how we'd integrate categories with tags.
We asked ourselves questions that led to other, more involved questions, like "What should be a tag and what should be a category?" or "How do we go about naming each and what will they ultimately be used for?" We really needed the foresight to discern any future pitfalls to accurately answer these questions.
We set up tags to mirror the categories that helped structure the navigation. This allowed out filtering system to move along with the products we've set up.
We tried to structure our categories simply.
We came up with the three "Buckets" we thought that would be most clear and sorted the categories to fit inside those umbrellas.
"Congratulations on getting the new storefront up and running. It looks like a more easily navigable interface, and I like the elimination of time limits on downloads."
Product filtering was one of the features we knew from the outset had to be included.
Filtering has become prevalent enough on modern e-commerce websites that it's what customers expect, and it immediately made our products much easier to sift through. The old site had no filtering to speak of, so this was a major improvement.
A LOOK INTO
OUR PROCESS
This is where we spent most of our time. We wanted to get a solid understanding of who was using the site and how they were using it.
So we started with User Research. Through several conversations with the client as well as through our own industry research, we were able to create some personas that accurately represented CGL's customer base.
We then used these to map out each users' journey through the site, getting them to complete a set of commonly performed tasks like adding/removing items to the cart, searching for a product or writing a product review.
We iterated pretty quickly through this process, first sketching some different layouts for each of the main pages (homepage, product page and category page)
Then wireframing those pages and finally creating (very) low-fidelity mockups, just to get a rough understanding of how the final product would turn out. There wasn't much debate on the structure or look of each so we jumped into development.
The combination of Shopify + Beanstalk was our friend throughout, allowing several of us to make changes on the site simultaneously without stepping on each others' toes.
The bulk of the dev work was product filtering, styling and modifying Shopify Apps in a way our future selves would be proud of.
PROVIDED
Let’s have a chill, simple convo about your idea.