Conversion UI · Play folder

Pricing card studies

A pricing-card exploration about hierarchy, comparison, plan confidence, and the small details that make SaaS decisions easier.

Category
Conversion UI
Tools
Figma · SaaS UI
Format
Downloadable MD brief
Use with
AI agent context
Decision design

What this is

A small study of SaaS pricing cards. The point is not the specific price. It is the structure around the decision: plan name, anchor, proof, feature grouping, risk reduction, and CTA clarity.

What it demonstrates

Pricing UI has to make comparison easy without flattening every plan into the same weight. The design needs a clear default, honest tradeoffs, and enough detail to reduce anxiety.

Design notes

The card keeps the price prominent, pushes secondary copy into quieter lines, and gives the CTA enough contrast to feel actionable without overpowering the page.

How it connects to product work

Pricing is product strategy rendered as interface. These studies connect messaging, layout, analytics, and user intent into a surface that can be tested and improved.

What to look for
Recruiter signal

Shows product and growth judgment: pricing is treated as a decision interface with strategy, not a decorative card grid.

Useful output

A structured review of plan naming, default emphasis, feature grouping, objection handling, and CTA behavior.

Next iteration

Build a pricing-section variant in the React dashboard shell with event names for plan comparison and CTA clicks.

Let's build something

Got something you want shipped well?
Let's talk.

Open to work across senior product, UI/UX, full-stack, and AI-forward opportunities where design taste and shipping speed both matter.

Where
Bogotá, Colombia · remote worldwide
Response time
Usually within 24 hours
Find me
@jpcasabianca · everywhere