Pattern #13: Centered Forms & Buttons Save Pattern Bookmark

Pattern Author: Jakub Linowski - Founder & Editor @ GoodUI.org

Based on 6 Tests, Members See How Likely This Pattern Will Win Or Lose And Its (?) Median Effect

Almost Certain Loser
-5
-4
-3
-2
-1
0
+1
+2
+3
+4
+5
Almost Certain Winner
Centered Forms & Buttons

  1. Add: Center Input Forms One Column Layout

    The pattern suggests to center any input forms for greater visibility, instead of placing them on the sides.

Median Effects

?

Engagement

Ex: Any Action / Visit

(2 tests)

?

Conversions

Ex: Signups, Leads

(3 tests)

?

Sales

Ex: Transactions, Upsells

(1 tests)

?

Revenue

Ex: AOV, LTV

?

Retention

Ex: Return Visits

?

Referrals

Ex: Social Shares

Tests

Pattern #13: Centered Forms & Buttons
Was Tested On Vivareal.com.br by Rodrigo Maués

Test #90 Tested on Vivareal.com.br by Rodrigo Maués Rodrigo Apr 01, 2017

Find Out How It Performed With 18,408 Visitors

Home & Landing

  •  

  • Measured by successful form submits   |   p-val (?)

Zoom In
  •  
  • (?)% ((?) successes out of (?) visits)
A
  •  
  • (?)% ((?) successes out of (?) visits)
B

Get Access To See The Test Results

The Same Pattern Was Also Tested Here

Test #240 Tested on Thomasnet.com by Julian Gaviria Julian May 16, 2019

Find Out How It Performed

Listing Desktop

  • Measured by clicks on View Catalog button   |   p-val (?)

  •  

Zoom In
  • (?)% ((?) successes out of (?) visits)
  •  
A
  • (?)% ((?) successes out of (?) visits)
  •  
B

In this experiment, two different positions of the View Catalog button were compared. In version A the button was smaller and on the right. In version B the button was wider and more central. (The actual test was inverted before publishing to match the A-B of the pattern.)

Get Access To See The Test Results

Test #239 Tested on Volders.de by Alexander Krieger Alexander May 02, 2019

Find Out How It Performed

Home & Landing Desktop

  • Measured by moved to the next step   |   p-val (?)

  •  

Zoom In
  • (?)% ((?) successes out of (?) visits)
  •  
A
  • (?)% ((?) successes out of (?) visits)
  •  
B

A contract cancellation landing page was tested for the effect of a single (wider CTA area with a left aligned button) vs two column layout (narrow CTA area with a right aligned button).

Get Access To See The Test Results

Test #202 Tested on Kenhub.com by Niels Hapke Niels Oct 01, 2018

Find Out How It Performed With 2,884 Visitors

Checkout Desktop, Mobile

  •  

  • Measured by successful sales   |   p-val (?)

Zoom In
  •  
  • (?)% ((?) successes out of (?) visits)
A
  •  
  • (?)% ((?) successes out of (?) visits)
B

Get Access To See The Test Results

Test #179 Tested on Yummly.com by Marcos Ciarrocchi Marcos May 18, 2018

Find Out How It Performed With 391,537 Visitors

Listing

  •  

  • Measured by form submits   |   p-val (?)

Zoom In
  •  
  • (?)% ((?) successes out of (?) visits)
A
  •  
  • (?)% ((?) successes out of (?) visits)
B

Get Access To See The Test Results

Test #108 Tested on Acousticalsurfac... by Julian Gaviria Julian Jun 01, 2017

Find Out How It Performed With 2,410 Visitors

Home & Landing Desktop

  •  

  • Measured by successful form submits   |   p-val (?)

Zoom In
  •  
  • (?)% ((?) successes out of (?) visits)
A
  •  
  • (?)% ((?) successes out of (?) visits)
B

Get Access To See The Test Results

For each pattern, we measure three key data points derived from related tests:

REPEATABILITY - this is a measure of how often a given pattern has generated a positive or negative effect. The higher this number, the more likely the pattern will continue to repeat.

SHALLOW MEDIAN - this is a median effect measured with low intent actions such as initiating the first step of a lengthier process

DEEP MEDIAN - this is derived from the highest intent metrics that we have for a given test such as fully completed signups or sales.