Skip to main content
UI Coach Logo
Intermediate

Transparent Affiliate Review

Design a product review page that makes testing evidence, commercial relationships, and comparison criteria easy to inspect.

Responsive web1 to 2 hours

The brief

Understand the problem

Background

Affiliate-funded reviews can help readers compare products, but trust erodes when sponsorship, testing methods, ownership, and link commissions are hidden or when every option is presented as best.

User context

Theo is comparing noise-cancelling headphones for travel. He wants to know which models were tested, how scores were derived, and whether purchases support the publisher.

Product problem

Readers need commercial disclosure and evidence close to the recommendation, not buried in generic policy pages.

Objective

Create a review, comparison, methodology, and outbound-link confirmation experience for an affiliate publication.

What to design

Define the experience

Required experience

  • Scan the recommendation and intended use case
  • Compare products by consistent criteria
  • Inspect testing notes and update history
  • Understand commission disclosure before visiting a retailer

Screens and states

  • Review article
  • Product comparison
  • Testing methodology
  • Retailer link disclosure

Core user flow

Follow the critical path

  1. 01

    Theo sees who the top pick suits and who should avoid it

  2. 02

    He compares comfort, battery, repairability, and price

  3. 03

    He opens the test protocol and sample limitations

  4. 04

    He follows a labeled affiliate link after seeing the relationship

Product rules

Requirements and constraints

Requirements

  • Place compensation and supplied-product disclosures near recommendations
  • Separate measured results, reviewer judgment, and manufacturer claims
  • Show publication and material update dates
  • Include drawbacks and non-affiliate alternatives

Constraints

  • Commercial terms cannot change the visible scoring method
  • Unavailable products need a dated status
  • Retail prices must name source and capture time

Reality check

States worth considering

A product is recalled
The affiliate relationship ends
A manufacturer disputes a result
A retailer changes price after click-through

Finish line

What to deliver

  • Four responsive page states demonstrating disclosure and evidence

Optional direction

Visual resources

Use these as a starting constraint if you want one. They are not part of the required solution.

Font pairing
LoraRoboto

Lora & Roboto

Clear interface writing gives people the confidence to understand what changed and decide what to do next.

Icons
Illustrations

Keep practicing

Beginner
Marketing

Book a Social Media Strategy Consultation

Design a consultancy site that helps a prospective client assess fit, understand scope, and submit a useful strategy brief.

Responsive web1 to 2 hours
Content DesignForms
Beginner
Marketing

Mobile Product Launch Page

Design a responsive launch page for a mobile trail journal that proves its core value before asking visitors to install it.

Responsive web1 to 2 hours
Responsive DesignVisual Design
Intermediate
Marketing

Campaign Agency Lead Journey

Design a high-credibility agency website that turns a qualified campaign need into a useful discovery call request.

Responsive web2 to 4 hours
Visual DesignContent Design
Advanced
Marketing

Direct Sales Opportunity Disclosure

Design a transparent website that helps prospective direct sellers evaluate costs, earnings evidence, and cancellation rights before joining.

Responsive web2 to 4 hours
Trust and SafetyData Visualization
Beginner
Marketing

Local Service Company Website

Design a trustworthy responsive website for a family-owned heating and cooling company.

Responsive web1 to 2 hours
Information ArchitectureContent Design
Intermediate
Creator tools

Compare a Curator's Top Picks

Design an editorial recommendation page that explains why a small set of products earned a place on a best-of list.

Responsive web2 to 4 hours
Content DesignInformation Hierarchy