Call to Action Button Design
-
Upload
phowr-quang -
Category
Design
-
view
539 -
download
0
Transcript of Call to Action Button Design
What is CTA?• In marketing, a call to action (CTA) is an
instruction to the audience to provoke an immediate response, usually using an imperative verb such as "call now", "find out more" or "visit a store today".
• In web design, a CTA is a banner, button, or some type of graphic or text on a website meant to prompt a user to click it and continue down a conversion funnel.
CTA
• Button is Called then action appears
• Better CTA means
• Callable button
• Easier, Faster, More Relevant Action
Colour of a Button
• “What is the best colour for my CTA button?”
• Specific case: The “Buy” button for an e-commerce website
Button shape
• Button must be “pushed”.
• Button must be emerging on the surface.
• Shadow
• Gradient
CTA button Placement
• How to make it more clickable?
• Fixed position
• Above the fold
• Follow patterns : F-pattern, Z-pattern
–Unknown
“Everything happens for a reason. Every action has a reaction. Always remember that whats meant to be will always find a way to come
about.”
Reaction
“an action performed or a feeling experienced in response to a situation or event.”
• Animation
• Messages
• Error-state
Animation
• http://tympanus.net/Development/ProgressButtonStyles/
• http://tympanus.net/Development/CreativeButtons/
The Olympic Store
Default Add to Cart button
http://www.getelastic.com/test-size-color/
With Social Shares Without Social Shares
https://vwo.com/blog/removing-social-sharing-buttons-from-ecommerce-product-page-increase-conversions/#.
Conclusions
• Outstanding CTA Buttons
• Relevant and friendly messages
• Follow human patterns
• Reaction