Skip to end of metadata
Go to start of metadata

You are viewing an old version of this page. View the current version.

Compare with Current View Page History

« Previous Version 2 Next »

Component type

Atom

Document status

DRAFT

Author

nathan.mckean@reckitt.com (Unlicensed)

Responsible

Julia Boyarshchikova (Deactivated)

Introduction


Anatomy

For MVP as CTA Block only the CTA links should be taken. It can look like a button but it is still the link within designs submitted.

Similar content

Technically CTAs are similar to Buttons and Links.


States

CTA block have 2 states that define their appearance: Non-stacked and Stacked.

Stacked state is out of MVP scope


Usage

When to use

Buttons use a variety of sizes, colors, and iconography combinations.

Use a CTA block to motivate user for some actions or decisions that are important. They should be used throughout your UI, it can be used in situations where users need to :

  • trigger a new element to appear on the page,

  • trigger a transition to an other page,

  • specify a new or next step in a process.

When not to use

Do not use CTAs to submit a form, to confirm a change.

Do not use CTA as links.

Do not use two CTAs at the same time.


Editorial


Props

Props of the CTA block base component are also available.

Useful materials

Components overview session - CTA Block, Image, Link-20220421_140635-Meeting Recording.mp4

  • No labels