The Vault

The Vault is a Mexican marketplace for Magic: The Gathering and Pokémon singles and sealed product, serving competitive players, collectors and investors. It runs on Shopify with a custom account layer on a second subdomain, and it competes on something most TCG platforms don’t attempt: trust and information, rather than inventory volume.

That distinction matters for everything that follows. In a category where buyers pay strangers for items they can’t inspect and can’t easily price, the product that wins isn’t the one with the most listings. It’s the one that tells you what something is worth and guarantees the transaction resolves.

Role

Sr. Product Designer

Type

E-commerce marketplace

Tools

Figma, FigJam, Photoshop, Shopify

Context

The Vault Co · in-house since 2023

What I own

The product-direction layer: what gets built and why, the business case behind it, its limitations, and how each surface looks and behaves. That work — research, specs, and design — is handed to engineering, who build against the design system I established.

To be precise, because this is a team product: the features themselves — the instant scanner, the auction engine, the deck builder — were built by the dev team. What carries my name is the reasoning that put them on the roadmap, the landing page that makes them reachable, and the language they’re all built in.

A default Shopify storefront answers exactly one question: what is for sale right now. The Vault answered it competently — a filterable grid, prices in MXN, availability chips, sort by price, 100 products, three pages deep. Every visit started the same way and had the same shape. You searched for a card, or you scrolled.

The problem was everything that question leaves out. A buyer arriving cold had no way to learn what the platform could do, what was new that week, what a card was worth against what it would cost to import it, or that they could bid on inventory that was never listed at a fixed price at all.

The whole brief sat in one screenshot: underneath the pagination was a paragraph explaining that The Vault is not just a marketplace but a technological ecosystem — instant scanner, live auctions, real-time quoting, portfolio tracking. Every claim was true. Not one of them existed anywhere a buyer would actually encounter it.

And the navigation proves this wasn’t a roadmap problem. Arma tu deck and Subastas were already sitting in that header. The deck builder and the auction system were live, funded, finished — and functionally unreachable, one dropdown deep, with nothing on the page giving anyone a reason to click.

Each surface started from the same set of questions — how players search for a single card, what information decides a purchase, what causes someone to abandon a cart, how collectors handle buying from several sellers at once, and which signals build enough trust to pay a stranger for something they can’t hold. Those questions produced the benchmarking, the personas, the journey maps and the success metrics every build decision was argued from.

That last one is what turned a homepage module into the centrepiece of the page. I benchmarked The Vault against TCGPlayer, Cardmarket and Hobby Mart across the capabilities that decide whether someone buys.

The table is useful for what it shows — Saved Cart is a genuine gap, and the subject of a companion case study. It’s more useful for what it has no row for. Every axis on it is a transaction feature: search, wishlist, cart, checkout, seller rating. Nobody is benchmarked on market data, because nobody has any. No row for deck building, none for physical pickup, none for treating a collection as a tracked position. An entire category had converged on competing over who had the better cart.

The whitespace wasn’t a missing feature. It was a missing axis — nobody was giving a buyer any way to judge whether a price was good. That’s what the rest of this project went after.

The old header had the right words in it. As a plain dropdown, though, it could only tell you where you were allowed to go — not what was there. In a category where the real question is “do you carry the Lorwyn showcase printing, and what’s it going for,” where-you-can-go is a weak answer.

The mega menu restructures the catalog into four columns that match how players think: the whole game (singles, sealed, express delivery), the four competitive formats they build for, the expansions currently rotating, and a curated track for the cards that drive traffic. Live inventory from the newest set sits beside it with real prices attached, so opening the menu is already browsing.

Two smaller decisions do disproportionate work. Selling lives inside the menu rather than on a separate marketing page — in a C2C marketplace every buyer is a latent seller, and the moment they’re looking at card values is the moment to say so. And the filters at the base — Foil, Mythic, Rare, Express — expose the four attributes that decide most purchases, one click from anywhere.

Research had already established that The Vault serves four distinct goals, not one. A single filterable grid serves the first adequately and the other three not at all.

So the page routes rather than funnels. The search field takes a card name or a pasted decklist, which promotes multi-card intent to the primary input instead of burying it a level down. Under it, five actions name the five things people actually arrive to do: paste a list, browse singles, sell cards, import a collection, check a balance.

Directly below, four cards route by role rather than task — and this is the part I’d point a recruiter at. A player converting unused inventory into cash. A shop earning commission on stock already crossing its counter. Someone running fulfilment for their city for a percentage. And a buyer whose order needs resolving. Marketplaces are two-sided; a landing page that only speaks to demand quietly starves supply. Naming each role on the front page turns recruitment into a permanent surface instead of an outbound task.

Two of The Vault’s strongest tools were the two a catalog grid structurally cannot serve, which is likely how both ended up parked behind a dropdown. The deck builder serves a buyer shopping for sixty cards. The auction system serves a buyer who isn’t comparing prices at all — they want something not reliably listed at a fixed price, and they’ll compete for it. It had been running with escrow custody and structured bidding on a separate subdomain, invisible from the storefront it was built to serve, while its live competition ran auctions in Facebook comment threads with no custody and no protection.

La Red de Bóvedas does the same job for the physical layer. Partner shops act as custody and handoff points, and putting them on the landing page — named, with addresses — converts an operational arrangement into visible proof that a transaction resolves at a counter rather than in the mail. The trust strip underneath states the three guarantees plainly: cards verified, held in custody, payment protected.

Nine surfaces, and the grid is one of them rather than all of them. The landing page’s job is no longer to sell a card — it’s to sort people by intent and hand them to the right tool.

Surfaces built by different people at different times will look like different products unless something holds them together — and an ecosystem that looks assembled is worse than a store that looks coherent, because the entire argument rests on it feeling like one place.

The design system is what makes that hold. Three principles: components that behave identically everywhere, WCAG-aligned contrast and touch targets, and semantic tokens structured so the system extends without breaking. In practice it enforces a small number of rules, hard.

The mega menu, the carousels, the market view, the deck builder, the auction screens and the portfolio dashboard were built by different hands and render in one language. That’s the system doing its job — and it’s the part of this work that will never show up in a conversion metric.

Traffic more than tripled, which is the number that looks best and means least on its own. The one I’d defend is next to it: the share of sessions that added a card to the cart held at roughly six percent across both periods.

Holding a rate flat while volume triples is harder than it sounds, because incoming traffic is almost always worse than the traffic you already had. Half a percentage point of dilution across 3.1× the sessions is the discovery result: the new surfaces pulled in people who hadn’t arrived with a card name in mind, and they engaged at nearly the same rate as the people who had.

I want to be exact about what this project did not do, because the funnel makes it obvious. The large gain sits at the last step — payment screen to purchase, 34% to 63% — and that isn’t discovery work. It came from the buying-journey redesign running in the same window, where required information was deferred to the final step and the cart became something a buyer could leave and return to. The landing page filled the top of a funnel that had just been fixed at the bottom. Both were needed; neither number belongs to only one of them.

Two honest limits. The baseline period recorded twelve completed checkouts — small enough that a handful of transactions swings the percentage hard, so the direction is trustworthy and the precision isn’t. And I instrumented the outcome rather than the surfaces: I can tell you the ecosystem worked, not whether the mega menu or the market view did the work. Per-surface attribution should have been designed in from the first sprint. It’s the first thing I specified on the next feature.