Individual HTML example · Interface interference

Annual plan active by default

A fictional streaming service opens with the annual plan selected and highlights a monthly-equivalent figure while the payable annual total is smaller.

Preselection and defaultsStreaming plan selectionSubscription

This is an original fictional comparison. It depicts no real company and is not a legal finding or safe harbour.

Streaming plan selectionSubscription

Annual plan active by default

A fictional streaming service opens with the annual plan selected and highlights a monthly-equivalent figure while the payable annual total is smaller.

Potentially problematicChoose your plan
Neutral alternativeChoose a billing period

Why the first version can mislead: The presentation changes what the user can notice or predict at the subscription decision. The problematic state shows: “Annual billing is active before the user chooses and its total is visually secondary.” Its influence should be tested by comparing the consequence and usability of “Annual selected” with “Select monthly or annual”. A user may commit to a larger upfront payment without making an active billing-period choice.

What a fairer design does: Start with no paid plan selected and show both payable totals and billing periods consistently.

Show annotated differences (2)
Potentially problematic version
  • Not selected: Select monthly or annualIn “Annual plan active by default”, this element shows how preselection or bad default can shape the decision.
Neutral alternative
  • Choice consequences, expanded: The consequence of selecting “Select monthly or annual” is displayed beside the option.In “Annual plan active by default”, this element keeps the clearer alternative visible at the same decision point.
Review questions (3)
  • Do “Annual selected” and “Select monthly or annual” receive comparable prominence and explain their consequences before activation?
  • Capture every peer option, its default state and visual prominence; do those states support “The default benefits the business or increases cost, data use, tracking or commitment”?
  • What neutral rendering or comprehension result would falsify the classification, particularly in light of “state restored from a prior explicit user choice”?
Side-by-side streaming plan selection interface showing “Choose your plan” and the clearer alternative “Choose a billing period”.Provenance: Original hypothetical streaming plan selection example created for this library; no real business, product or interface is depicted.

Complete pattern context

How this example relates to Preselection and defaults

A business-favoured option with a plausible adverse consequence is active before a deliberate user choice. The label describes a recurring design mechanism; whether a particular implementation is harmful or unlawful depends on the complete journey, audience, evidence and rules within scope.

The full guide explains inclusion and exclusion criteria, harms, fair design principles, evidence questions and the relevant EU legal information layers. The example page isolates one scenario so it can be shared and discussed without reproducing the complete library on one page.

Open the complete pattern guideMore interface interference examples

Continue comparing

Preselection and defaults

Paid protection preselected in basket

Electronics checkoutCheckout

A fictional retailer preselects a €12 protection plan and includes it in the total before the shopper has made a distinct choice.

Open this example

Bundled options

Ticket and travel pass presented as one package

Event bookingCheckout

A fictional ticket seller offers a concert ticket only through a control that also adds a city travel pass, although the travel component is separately deliverable and not required for entry.

Open this example

Bundled options

Support and migration locked into one plan

Business software pricingPricing

A fictional service offers a core plan only as a bundle with premium support and data migration, while implying those extras can be removed later although no controls exist.

Open this example
Sources and provenance for this example

Evidence base

Sources

  1. Dark commercial patternsOrganisation for Economic Co-operation and Development · Secondary · checked 2026-09-14 · OECD Digital Economy Papers No. 336
  2. Unfair Commercial Practices DirectiveEuropean Parliament and Council of the European Union · Primary · checked 2026-08-09 · Directive 2005/29/EC; CELEX 02005L0029-20220528
  3. Consumer Rights DirectiveEuropean Parliament and Council of the European Union · Primary · checked 2026-08-09 · Directive 2011/83/EU; CELEX 02011L0083-20220528
  4. General Data Protection RegulationEuropean Parliament and Council of the European Union · Primary · checked 2026-08-09 · Regulation (EU) 2016/679; CELEX 32016R0679
  5. Digital Services ActEuropean Parliament and Council of the European Union · Primary · checked 2026-08-09 · Regulation (EU) 2022/2065; CELEX 32022R2065