The Good, The Bad and The UX

A collection of UX patterns with comparative examples

Back to all examples
Forms

Disable submit button during loading

Prevent double submissions by disabling the button and showing a spinner

buttonloadingformmobile

Bad example

Good example

Disable Submit Button During Loading

Description

When a form is being submitted, the submit button should be disabled and show a loading indicator. This prevents users from accidentally submitting the form multiple times.

Why it matters

  • Prevents duplicate submissions: Avoid creating duplicate records or charging users twice
  • Clear feedback: Users know their action was registered
  • Reduces anxiety: Visual feedback reassures users something is happening

When to apply

  • Form submissions (login, signup, checkout)
  • Any action that triggers an API call
  • Payment processing
  • File uploads

When not to apply

  • Instant local actions (toggling a checkbox)
  • Actions that can safely be repeated (refresh button)

Explore more examples

Forms

Autofocus on Modal input

When a modal opens with a single input, it should be automatically focused

View example
Forms

Verification code paste support

Allow users to paste verification codes instead of typing digit by digit

View example
Forms

Auto-submit verification code

Automatically validate the code when all digits are entered instead of requiring manual submission

View example