.png)
Token Yard
We partnered with Token Yard to design a prediction marketplace where probability reads as signal, not as a bet, and where the difference between the two is visible on the surface of the product.
Prediction markets have a credibility problem. The category is crowded with platforms that borrow their visual language from gambling, which makes serious participants discount the data underneath.
Token Yard needed the opposite reading. The product had to feel closer to a terminal than a casino, without becoming so austere that a first-time user bounces off it.
Our objective was to translate a macro-focused market framework into a responsive web app that investors, analysts, and experienced traders would trust on sight, while keeping the entry point warm enough for someone encountering prediction markets for the first time.
Process
.png)
.png)
Signal and Noise, Rendered Side by Side
The featured market surfaces something no competitor puts on screen: the sources moving a probability, sorted by whether they can be verified. Institutional flow data sits in one column, unverified social claims sit in the other, both timestamped and attributed. This turns the brand promise into a working interface element rather than a marketing line, and it gives a skeptical user a reason to trust the number before they ever place a position.
A Market Taxonomy That Explains Itself
The homepage moves through three levels of density on purpose. A featured market carries full evidence and trend context, live pulse markets compress direction into a scannable card, and the wider market grid trades depth for breadth. Users learn the model by scrolling rather than by reading documentation, and each card answers one question: where is this going, how hard is it moving, or will this level be reached.
Probability as the Primary Object
Every surface leads with percentage likelihood and treats price as secondary detail. A single directional pair carries meaning across the entire system, appearing in the probability figure, the sparkline, the outcome buttons, and the depth bars, so users read state before they read text. Volume, trader count, and resolution date sit inside the card, which means the cost and horizon of a position are visible at the moment of interest rather than at checkout.
An Illustrated World That Buys Back Warmth
A crafted three-dimensional environment runs beneath the data layer and repeats as market thumbnails, giving abstract macro questions a physical object to attach to. It solves the category's hardest design problem by keeping the platform from reading as a casino without pushing it into sterile terminal territory. The metaphor stays consistent across every asset, so the brand feels authored rather than assembled.
.png)
.png)
.png)
.png)
.png)
The Token Yard interface was built around a single promise: that any probability on screen is one you can interrogate. Rather than compressing markets into a feed of odds, the structure moves from category to market to evidence, letting a user arrive at a number and then work backwards through the sources, the criteria, and the history behind it. Density is layered deliberately, so a newcomer sees a clear question and a clear percentage while an expert finds volume, participation, and trend without leaving the card.
.png)
.png)
.png)
.png)
Color Palette
The palette is built almost entirely from neutrals, with a single directional pair reserved for outcome and movement. Because that pair does semantic work across percentages, charts, buttons, and depth bars, users read market state before they read a single word, and color never appears as decoration.
Typography
The system pairs an editorial serif for market questions and headings with a neutral sans for data, labels, and interface controls. The contrast frames each market as a question worth considering rather than a product listing, while uppercase letterspaced micro-labels organize the page into scannable zones without adding visual weight.
Closing (visual system → conversion)
Beneath the data layer sits a crafted illustrated environment that repeats as market thumbnails and gives abstract macro questions something concrete to hold onto. It is the mechanism that keeps a serious financial product approachable, and it is the reason the platform reads as authored rather than templated.
Conversion mechanics were designed around confidence rather than urgency. Outcome actions carry their price inline, so committing to a position is a single deliberate step with no hidden consequence. Because the MVP targets an invite-only alpha and investor presentations, the interface was optimized to convert scrutiny into belief, which is a harder and more durable outcome than converting a click.
.png)
.png)
.png)
.png)
.png)
"We came in worried that a prediction market would end up looking like every other prediction market. The Charly team understood immediately that our whole positioning depends on not looking like that. The signal and noise idea was ours in principle, but they were the ones who put it on the screen where people can actually see it. First time we showed the prototype to investors, nobody asked us to explain what the product was. They just started arguing about the markets."