
Color meanings:
•	Red. Confidence, youth, and power.
•	Orange. Friendly, warm, and energetic.
•	Yellow. Happiness, optimism, and warmth.
•	Green. Peace, growth, and health.
•	Blue. Trust, security, and stability.
•	Purple. Luxurious, creative, and wise.
•	Black. Reliable, sophisticated, and experienced.
•	White. Simple, calm, and clean.

Shape meanings:
•	Squares and rectangles meanings: discipline, strength, courage, security, reliability.
•	Triangles meanings: excitement, risk, danger, balance, stability.
•	Circles, ovals, and ellipses meanings: eternity, female, universe, magic, mystery.
•	Abstract shapes meanings: the duality of meaning, uniqueness, elaborate.


University of Michigan - Ann Arbor

Size: 
Th size of an element indicate its importance, the bigger makes it more noticeable and chance to be clicked. CTA button should be designed in a big enough noticeable size, however, we should keep in mind the visual composition and layout hierarchy Some recommendations on CTA button sizes in mobile UI: 
Apple: at least 44Х44 pixels 
Microsoft: at least 34Х26 pixels.

Color and shape:
Our mind reacts to colors and shapes while we usually do not notice it. Colors and shapes has different meanings. Traditionally, CTA buttons look like horizontal rectangles since people got used to perceiving this shape as clickable buttons. In addition, it is recommended to design CTAs with rounded corners because they are thought as they point inside of the button drawing attention to the copy.
Color choice depends on various aspects which make the process more complicated. Designers need to consider such factors as the basic color of the composition as well as potential preferences and psychological peculiarities of the target audience. There is one condition which is vital to keep in mind while choosing colors for CTA: buttons and background colors should be contrasting enough so that CTAs would stand out from the other UI components.


Placement: 
The placement of CTA buttons is crucial for their capability. Studies shown that people tend to scan webpages to decide if they are interested or not. Considering this fact, designers may learn the most prominent scannable areas and place call-to-actions within the user’s path.
popular scanning patterns for web pages, among which “F” and “Z” patterns. These patterns allow designers to place CTAs in the spots of highest attention, such as top corners and put the other points requiring attention along the top and bottom lines. Also, it is a good idea to place CTA buttons at the center of the layout, especially when it isn’t overloaded with other UI elements.

Microcopy: 
Microcopy plays a significant role in the efficiency of call-to-action. It is defined as the small components of text which serve as hints for users. To be more specific, microcopy includes buttons and menu copy, error messages, security notes, terms and conditions, as well as any kind of instructions on product usage.
CTA microcopy is actually a call which tells users what action they will take if they click the button. The powerful CTA microcopy is usually short but consistent so that it could quickly catch users’ attention.


What makes a powerful CTA button?

https://uxplanet.org/call-for-attention-ui-design-tips-on-cta-buttons-5239413aded2

Call for Attention UI Design


F-pattern is the most common for web pages with a big amount of content such as blogs, news platforms. A user first scans a horizontal line on the top of the screen, then moves down the page a bit and reads across the horizontal line which usually covers a shorter area. And the last one is a vertical line down on the left side of the copy where they look for keywords in the paragraphs’ initial sentences.

Z-pattern is a typical model of scanning for landing pages or websites not loaded with copy and not requiring scrolling down the page, which means that all the core data is visible in the pre-scroll area. A user first scans across the top of the page starting from the top left corner, looking for important information, and then goes down to the opposite corner at a diagonal, finishing with the horizontal line at the bottom of the page, again from left to right.


Learn Before

Related