Faster product understanding
← Back to Work
Case 04T · PDP Case Study Test · 2026
A PDP designed to make the product feel clear, credible, and worth buying.
A perception-led case study built around product clarity, trust timing, and lower-friction purchase decisions across desktop and mobile.
- Client
- HelloNutra
- Scope
- Figma PDP concept
- Mode
- Test build · PERCEPTION narrative
Perception Story · PDP Design
Built to make the product feel trustworthy before the CTA asks for commitment.
This test build reframes the HelloNutra PDP around one idea: users should understand the product fast, trust it progressively, and reach the purchase decision without having to work through visual noise.
The Problem
Supplement PDPs often mix education, offers, and proof at the same level. That makes the page feel busy before it feels believable.
The Goal
Use the product page itself to build clarity, trust, and decision confidence in the right order across desktop and mobile.
The Result
A more editorial case story where real PDP screens act as proof blocks instead of sitting inside a generic gallery.
Clarity had to arrive before persuasion.
- Problem
- The top of the page asked users to absorb too many signals before the product role felt obvious.
- Why it matters
- When first-screen meaning is weak, trust drops before reviews or pricing ever get a chance to help.
- Decision
- Lead with a sharper product visual and a simpler benefit stack so the first screen explains the offer in one pass.
- Result
- The PDP opens with clearer product meaning, giving the rest of the trust story a stronger base.
Trust needed to feel built into the layout.
- Problem
- Proof that feels detached from the buying path rarely changes how the page is perceived.
- Why it matters
- Users need reassurance while they evaluate, not after they've already lost momentum.
- Decision
- Bring in lifestyle context and authority signals so trust feels attached to the product, not pasted on afterward.
- Result
- The page feels more human and more credible because reassurance now has context, not just placement.
What the page had to solve
Three friction
points.
One clearer decision path.
-
The product had to make sense in one pass.
Users should not need to decode the offer before they decide whether the page deserves more attention.
-
Reassurance had to arrive before purchase pressure.
Proof works better when it meets hesitation near reviews, pricing, and CTA proximity instead of appearing as filler.
-
Package selection had to feel guided, not heavy.
Decision support was treated as trust design, not as a separate pricing problem to solve later.
Mobile had to guide trust, not just display it.
- Problem
- PDP trust often breaks on mobile because users make faster decisions with less patience for clutter.
- Why it matters
- If the sequence feels unclear, the add-to-cart moment becomes a risk instead of a natural next step.
- Decision
- Structure the mobile flow to remove hesitation step by step: clarity through benefits, confidence through real people, and commitment through transparent pricing.
- Result
- Each screen resolves a specific doubt, turning the scroll into a guided path instead of a series of disconnected sections.
Package choice was treated as trust design.
- Problem
- Even when users liked the product, uncertainty around pricing and bundles slowed the decision.
- Why it matters
- If the offer feels complex, users hesitate, even when they are already convinced by the product.
- Decision
- Combine pricing, savings, and subscription logic into a single guided choice that feels clear and justified.
- Result
- The offer becomes easier to commit to because value and reassurance are understood at the same moment.
The CTA worked because the page earned belief first.
- Problem
- A strong CTA cannot fix doubt if the page has not built enough confidence before the decision.
- Why it matters
- Users do not commit because a button is visible. They commit when the page has already reduced risk.
- Decision
- Position the CTA only after trust, proof, and realistic expectations are established, so commitment feels justified before it is requested.
- Result
- The final action feels earned because users reach the CTA after confidence, validation, and believable outcomes are already in place.
What changed
Four shifts that made the PDP feel easier to buy from.
More trust before CTA
Lower-friction package choice
Stronger mobile purchase confidence
Built to make the product feel clear before the CTA
asks for commitment.
UI system used across PDP structure, trust blocks, and mobile decision points ·
2026
Color System
Violet
Core
660ECC
Hover
570CB0
Deep Violet
Pressed
440A86
Soft
EEE7FF
Cyan
Accent
19D6E0
Mist
BFF7FA
Neutral
White
FFFFFF
Ink
191918
Display · Uto Bold
HelloNutra.
Trust first.
Then the ask.
UI · Inter Regular
ABCDEFGHIJKLMNOPQRSTUVWXYZ
abcdefghijklmnopqrstuvwxyz
0 1 2 3 4 5 6 7 8 9
Clear product
role.
Progressive proof.
Designed to convert.
Next Steps
Need this level of clarity in your own ecommerce UX?
If your pages look good but still underperform, I can audit the flow, clarify the structure, and define a cleaner path before design execution.
Typical response within 24h