Forms & Signup

Dimming the Background Behind a Modal Form A/B Test

Dimming the page behind a modal may draw attention to the form, but a strong overlay can hide useful context or make visitors feel trapped.

Control vs Variant

The visual treatment is the variable, not the words or the position.

Control

Forms & signupHomeShopSaleAboutCreate your accountFull nameEmailContinue

VariantVisual style · changed

Forms & signupHomeShopSaleAboutCreate your accountFull nameEmailContinue

ControlVariant

Visual style · changed

Forms & signup

Create your accountFull nameEmailContinue

Forms & signup

Create your accountFull nameEmailContinue

Hypothesis

Compare one predefined overlay with no dimming, keeping the form and close behavior the same.

Form completion rate

Compare successful submissions among eligible visitors assigned to the modal treatment.

Form completion rateCompare successful submissions among eligible visitors assigned to each modal treatment.
Form start rateMeasure intentional first interaction with the form, not the modal opening.
Page exit rateCompare exits among visitors assigned to each form presentation; this alone does not explain why they left.

BackdropAdd one semi-transparent dark overlay behind the modal.
Keep constantUse one predefined backdrop opacity in the variant. Keep the modal content, trigger and dismissal behavior the same in both arms.
Required informationKeep essential decision information inside the modal or in an accessible area that is not dimmed.
Form dataCheck whether entered data is preserved if the modal closes unexpectedly.
Keyboard and motionKeep the modal keyboard-dismissible and avoid blur animation that ignores reduced-motion settings.