Work/Subscription page

Sixteen prices. Now two simple questions.

A new page for buying MarketsMojo's research plans.

16 → 4Prices on screen at once
LiveStill selling after the sale ended
Role
Product Designer
Company
MarketsMojo
Platform
Web and mobile
Status
Live
The problem

More plans to sell. Less room to explain.

The old page sold one plan length, as three separate cards. The new one had to carry four markets and four lengths, and still be easier to use.

Before16 prices at once!Compare by hand!Unsure. Leave.!AfterPick a market4 tabsPick how long4 optionsSee price per monthPay
One hard choice became two easy ones.Swipe →
Who it's for

Three kinds of visitor.

Each one needs the page to do something different.

Knows what they want

Needs a fast way to pay.

Still deciding

Needs to compare, fairly.

About to leave

The last chance to make an offer.

Key decisions

What I chose, and why.

01

Ask one question at a time.

Each question has only four answers, so there are only four prices on screen.

02

Show the monthly price.

So a 6-month plan and a 3-year plan can be compared fairly.

03

Keep the full table, one tap away.

All sixteen prices sit behind a Compare button. Tap any price to choose it.

04

No fake countdown.

A timer that restarts on reload isn't a deadline. So there isn't one.

How it got there

Three tries before the version that shipped.

1
Try 1

Four cards, all shouting

Four plan cards side by side, with a countdown clock above them.

Learned: A clock that restarts on every reload isn't a deadline. It was dropped.

2
Try 2

The wrong question

Plans grouped by product bundle, for a single one-year term.

Learned: It asked people to pick a bundle. They think in markets first.

3
Try 3

Works all year

The sale styling removed, the same market tabs and plan rows, plus a five-year option.

Learned: The layout didn't need the sale to work.

The solution

Two questions, then pay.

And when someone tries to leave, a calm offer slides up.

Two questions
The plan chooser12345
  1. 1MarketFour tabs.
  2. 2LengthFour rows.
  3. 3Fair compareEvery price also shown per month.
  4. 4The savingAs a percentage and in rupees.
  5. 5A suggestionOne plan is marked as the popular pick.
Catching people on the way out

Four ways of leaving. One calm sheet. The offer depends on who you are.

ExitBack buttonMouse to the topKeyboard shortcutComing back laterOne offer sheetNever blocks the pageNew visitor₹500 offNever paid10% offLapsed15% to returnPaying10% to extend
Swipe →
Desktop and phone

Everything on one table when you ask for it. On a phone, the pay bar stays put.

The full table All sixteen prices, behind a Compare button. Tap any price to choose it.
On a phone The market tabs scroll sideways and the bar with your plan and the pay button stays fixed.
The result

It shipped, and it's still running.

ChangedLongest plan first

The rows were flipped, so the best monthly price is read first.

ChangedPlans can sell out

A closed plan shows a Join the queue button instead of Buy.

Held up29 markets

Global grew from 13 to 29 markets. The page didn't change shape.

A page built for one sale became how the product is sold.

What I learned

What I'd carry into the next one.

Split the decision

Two small questions beat one big table.

Hide, don't delete

The full table stayed, just out of the main path.

Hand over something working

Developers learned the behaviour by using it.

The person behind this work Finance first, then design. I build what I design. Read my story → All work