Exemplo pedagógico
Como é um relatório UXClarity
Estrutura do entregável real. A loja é fictícia. Sem números de vendas inventados.
Exemplo pedagógico. Loja fictícia «Atelier Nord». Não é a auditoria de um site real nem um benchmark.
Atelier Nord — ficha de produto (fictícia)
The visitor can tell this is apparel, but buying is not obvious at first glance: the button sits low, the price drowns in variants, and reassurance only appears after a long scroll. The page asks for too much effort for a simple decision.
Por que os visitantes saem sem comprar
Do not rebuild the site. Lift the purchase action, reduce choices visible up front, and place a trust line next to the price — where the thumb hesitates.
Ilustração do primeiro ecrã móvel, não uma captura de uma loja real.
Manteau laine courte
S · M · L · XL · XXL · Sur-mesure
Prix
Os 4 pilares
Visual hierarchy & F-pattern
54Eye drops off
Estado atual
The title is clear, but the buy button sits under a stack of promo chips. The eye ends on variants, not on the action.
Maquete corrigida
One visual offer above the fold: photo, name, price, button. Push badges and secondary variants below the primary action.
Mental load & Hick’s law
48Too many choices too soon
Estado atual
Size, color, bundling and express shipping are all visible before the button. The visitor compares instead of acting.
Maquete corrigida
A default path (guided size, color already selected). Advanced options expand after the buy tap, not before.
Trust signals
57Proof too low
Estado atual
Reviews and returns sit at the bottom. At the moment of doubt (price + button), nothing sits beside them.
Maquete corrigida
One proof line next to the price: rating, delivery time, returns. Full reviews can stay lower.
Mobile readability
72Fine, can be tighter
Estado atual
Body text reads. The secondary “wishlist” button visually competes with buy.
Maquete corrigida
One solid buy button. Secondary action as a text link, not an equally heavy pill.
Plano CRO — ordem, impacto, esforço
1. Lift the buy button above the fold
Impacto High · Esforço Low · First screen
In the product theme, pin price + CTA under the title, before the variant grid. Check an iPhone SE: the CTA must be visible without scrolling.
2. Cut choices visible before the tap
Impacto High · Esforço Medium · Variants
Pre-select a variant. Hide bundling and secondary options behind “Customize”.
3. Place proof next to the price
Impacto Medium · Esforço Low · Price / CTA
One line: review count + delivery time. Not a review carousel in that spot.