NerdWallet · Case study
Credit card review experience
Rebuilt the highest-traffic conversion surface on NerdWallet without compromising editorial trust — balancing SEO, monetization, and reader confidence inside one template.
- Role
- Product Designer
- Company
- NerdWallet
- Team
- 1 PM, 1 EM, 5 engineers, editorial partners
Scope
- Discovery
- Editorial systems
- Conversion design
- QA
Labels
- Shipped
- Representative reconstruction
Summary
Executive summary
Problem
The credit card review template was the company's largest single source of revenue and one of its largest sources of organic traffic. The existing layout had drifted into a hybrid of editorial article and marketing landing page that served neither purpose well.
Approach
Rebuilt the template as a structured editorial surface with explicit zones for review content, comparison data, and monetization — each with its own rules, governance, and treatment.
Outcome
Shipped to the full card catalog without an organic traffic regression. Conversion lifted on the cards that adopted the new template ahead of an industry-wide rate cycle.
Problem
Diagnosis
The template was simultaneously failing three audiences: readers who wanted a credible review, the editorial team who wanted to ship reviews without negotiating every layout, and the partnerships team who needed apply-now placements that did not feel grafted on.
Editorial team retros
Writers reported that the layout pushed them toward marketing-style headlines they did not want to write, because the structural constraints did not give the review body enough room to breathe.
Onsite analytics
Reader scroll depth dropped sharply at the boundary between the review body and the comparison module — the page felt like it ended there even though more content followed.
External SEO audit
The template's structural data was inconsistent across cards in the catalog, hurting eligibility for review rich results.
Constraints
What was fixed
Editorial governance is sacred
Apply-now placements and rate disclosures cannot interrupt or precede the reviewer's analysis. Editorial leadership held veto on any pattern that confused the two.
One template, hundreds of cards
The template had to work for every card in the catalog without per-card overrides — the editorial team did not have capacity to maintain layout exceptions.
Rate data must be live, not baked in
APR ranges, fees, and promotional offers change frequently. The template had to read from the rate service, not from copy embedded in the article body.
Lighthouse and Core Web Vitals as a launch gate
Mobile LCP could not regress against the existing template at the 75th percentile. The visual rebuild had to net out faster, not slower.
Principles
Design principles
01
Editorial first, monetization explicit
Apply-now placements are clearly labelled and have a dedicated zone — they do not pose as editorial commentary.
02
One canonical structure, not a system of overrides
Every card review has the same modules in the same order. The system absorbs variation through content, not through layout exceptions.
03
Rate data is a citizen, not an ornament
Live rate values render with the same care as editorial copy — properly typeset, disclosed inline, and never abbreviated in a way that misleads.
Exploration
What we tried
We sketched four templates against the same review draft to test how each one handled the editorial / monetization / rate-data tension. The four sketches were evaluated for editorial readability, conversion legibility, and structural-data eligibility — in that order.
Sketch A — single-column editorial, rate card sidebar. Strong for reading; weak for conversion legibility on mobile. Sketch B — review body with embedded comparison module. Comparison felt grafted in; broke the reading rhythm at the seam. Sketch C — structured zones (review → rate facts → comparison → apply). Clear, but cold on first read. Sketch D — structured zones with a quiet rate strip above the review. Combined the rigor of C with a faster first-screen signal.
Chase Sapphire Preferred®
19.99%–29.99% Variable APR · $95 Annual Fee
By NerdWallet Editorial · Updated Jan 15, 2026
Chase Sapphire Preferred® Card Review
The Chase Sapphire Preferred earns 3× on travel and 2× on dining — a rare combination at the $95 price point. Transfer partners include United, Hyatt, and Singapore Airlines, giving cardholders outsized redemption flexibility.
Best for travelers who want to maximize point value without committing to a single brand ecosystem. The annual fee is easily offset by the $50 hotel credit and 5× on Chase Travel bookings.
Compare cards
Amex Gold
~25.99%
$250/yr
Venture X
19.99%–29.99%
$395/yr
Sapphire Reserve
22.49%–29.49%
$550/yr
Advertiser disclosure ℹ
Apply for Chase Sapphire Preferred®
- Rate strip — live APR + fees with inline disclosure
- Editorial review body — full reviewer voice, no monetization
- Reviewer byline + last-updated stamp
- Comparison module — peer cards, neutral framing
- Apply-now placement — labelled, separated, dismissible
BEST TRAVEL CARD OF 2026
Sponsored · Apply today
Chase Sapphire Preferred®
This card earns 3× travel, 2× dining. Annual fee $95. APR varies. Great for travelers. See rates and fees.
Advertisement — compare these cards:
Amex Gold · Capital One Venture · Sapphire Reserve
Our full editorial review continues... the card is best for travelers who want flexible redemption.
Decision
How we chose
| Option | Editorial readability | Conversion legibility | Rich-result eligibility |
|---|---|---|---|
| Sketch A — sidebar rate card | Strong | Weak on mobile | Partial |
| Sketch B — embedded comparison | Weak | Strong | Weak |
| Sketch C — structured zones | Adequate | Strong | Strong |
| Sketch D — zones + quiet rate strip | Strong | Strong | Strong |
Recommendation
Sketch D shipped. It paid a small content-volume tax above the fold to make the rate-data zone unambiguous, which removed the seam problem from Sketch B and warmed up the cold-on-first-read feeling from Sketch C.
Outcome
What shipped
The new template shipped across the full card catalog over six weeks, gated by Core Web Vitals at the 75th percentile and an editorial sign-off per card. Editorial reported the new layout felt easier to write into, not harder.
- Mobile LCP (p75)
- -22%
- Apply-click rate
- +11%
- Editorial throughput
- +1 review/week
Across the catalog post-migration vs. legacy template.
Cards on the new template vs. control during the migration window.
Self-reported by the editorial team after one quarter.
The lift on apply-click rate was the headline number, but the editorial throughput change was the result the team felt most. The template did one thing the old one did not: it told the writer where the editorial content stops and where the comparison begins, so writers stopped negotiating that line every week.
Reflection
Looking back
The strongest lesson from this project was that the most contentious zone — the apply-now placement — got easier to design once the editorial zone was unambiguous. We had spent months trying to soften the apply module before realizing it only felt aggressive because the editorial zone was bleeding into it. Once they were properly separated, the apply module did not need to be soft, just clear.
Available
Want to talk about a problem in this shape?
Best fit for platform UX, growth systems, internal tools, and AI-accelerated product execution. I respond to most inbound within a day.