DEV Community

Daniel Dong
Daniel Dong

Posted on

My API product has 5 pages. Here's what each one does and why.

My API product has 5 pages. Here's what each one does and why.

Not the backend. Not the gateway code. The 5 pages users actually see.

1. The landing page — one button, not three

Every API product landing page looks the same: hero text, feature grid,
pricing table, three CTA buttons.

Mine has one button that matters: "Try Playground →"

Before that was the main CTA, registration sat at the top and conversion
was 2.5%. Swapped the order. Playground first, signup second. Visitors
land, type a prompt, see a response, then register. Conversion hit 19%.

The lesson: let people use the thing before you ask them to commit to it.

1

2. The playground — no login, no friction

15 models, 10 free requests per day, no signup. Pick a model, type a
prompt, get a response. If you like it, "Get your API key →" is one
click away.

The most important feature isn't the model selection or the markdown
rendering. It's the fact that there's no wall. No email. No password.
No "create an account to continue." Just type and go.

2

3. The onboarding page — 30 seconds to first call

After login, instead of an empty dashboard, you land on a page that
shows your API key, a curl command you can paste and run immediately,
and Python SDK code to copy.

30 seconds from login to first API response. For the 68% of users who
registered but never made a single call, this is the bridge between
"I have an account" and "it works."

3

4. The dashboard — polite, then urgent

Usage bar that escalates. Below 50%: small blue bar, subtle upgrade
button. Above 80%: orange bar, "Unlock 10x more →". Above 90%: red
flashing bar, "Only 15K tokens left," full-width upgrade button.

The same data. Different urgency. You notice it exactly when you need
to act — not before, not after.

4

5. The prompt library — 24 things to do right now

68% of users made zero API calls. Not because the API was hard. Because
a blank input box doesn't tell you what to ask.

The prompt library says: here's 24 things you can do right now. Find
bugs → Kimi K3. Translate → Qwen Max. Write tests → DeepSeek. Each
card has a "Try in Playground" button that pre-fills the model, system
prompt, and user message. One click from browsing to running.

6 categories. 24 prompts. One static HTML file. No backend changes.

6


Five pages. Each one answers a different question:

  1. "What is this?" → Landing page
  2. "Can I try it?" → Playground
  3. "How do I start?" → Onboarding
  4. "How much have I used?" → Dashboard
  5. "What should I ask?" → Prompt library

The gateway code does the heavy lifting. But the pages do the
conversion. And conversion is what turns a functional API into
something people pay for.

AIBridge — 15 Chinese AI models behind one OpenAI-compatible endpoint.
Free tier: 500K tokens/month. GitHub login. Instant onboarding.
Prompt library. Playground with no signup.

aibridge-api.com/playground.html
aibridge-api.com/prompts.html

Top comments (0)