Lepší Call to Action

Post on 13-May-2015

167 views 2 download

description

Call to Action neboli výzva k akci může být velmi silou zbraní designera při návrhu webových stránek, e-mailové kampaně, banneru či jakéhokoli jiného nástroje, kterým se snaží přimět ostatní lidi provést žádoucí činnost. V prezentaci projdeme celou řadu tipů, jak naše CTA vymazlit k dokonalosti.

transcript

Lepší Call to ActionOptimalizace s příchutí psychologie

Čtvrtkon #4 / 10.1.2013 v Horké Vaně

Ondřej Machart / @sleepygraphic

1. Proč toto téma?

Co se stalo?Uživatel internetu je bombardován prvky, které se snaží upoutat jeho pozornost a odradit jej od původního záměru, se kterým na web přišel.

Důsledek: Uživatelé se naučili podobné prvky ignorovat.

Co s tím?Je třeba nalézt způsoby, jak uživatelovu pozornost získat zpět.Protože se snažíme změnit chováníuživatelů, můžeme čerpat poznatkyz oboru psychologie.

2. Co všechno je Call to Action?

Call to action obecněCall to action (CTA) je jakákoli výzva, která využívá text (doprovázený často grafikou) a jejímž cílem je přimět uživatele k provedení žádané akce - například:- proklik- nákup- sdílení - stáhnutí souboru- přehrání videa- apod.

Call to action konkrétně- odkazy v textu- reklamní bannery- tlačítka- nadpisy článků- předmět infomailů- apod.

3. Jak můžeme CTA vylepšit?

Psychologie a Call to actionCílem CTA je přimět uživatele k akci, se kterou původně nepočítal. Psychologie jako věda zabývající se lidským chováním nabízí mnoho poznatků, které lze v návrhu účinného Call to action využít.

V následujících tipech se dozvíme:1. Jak optimalizovat text2. Jak formulovat nabídku3. Jak optimalizovat grafiku doplňující CTA

Cílem je využít tyto poznatkyke zvýšení konverze výsledného CTA.

4. Text v CTAJak optimalizovat obsah sdělení

4.1 Využití slovesAneb řekněte jim, co mají dělat...

„Slovesa jsou část sdělení, která generuje nejvíce sdílení na Twitteru.“

- Dan Zarella, výzkumník sociálních médií

Proč využívat slovesa?- Vyjadřují skutečnou akci.- Ujasňují, jakou akci po uživateli chceme.

Na co si dát pozor?- Čím více sloves v jednom sdělení, tím menší účinek.- Fráze typu "Klikněte sem" nefungují.

Zdroj: HubSpot

4.2 Ideální počet znakůAneb méně je více...

„S ohledem na množství konkurenčních nabídek je rozumné předpokládat, že máte jen omezený prostor pro to, abyste uživatele zaujali a udrželi jeho pozornost.“

- Simms Jenkins, CEO @Brightwave marketing

Jaký je tedy optimální počet znaků ve sdělení?- 30 až 150 znaků

Na co si dát pozor?- Nezkracovat sdělení, pokud by utrpěl jeho význam a smysl.

Užitečná technika je napsat celé sdělení, které pakzkrátíme na polovinu, přičemž odstranímejen části, které jsou skutečně navíc.

Zdroj: HubSpot

4.3 Využití číselAneb hrátky s počty

„Čísla jsou skvělý způsob, jak se zbavit nejasnosti, být konkrétní o své nabídce a nastavit správná očekávání.“

- Magdalena Georgieva, Marketing manager @Hubspot

Proč využívat čísel?1. Čísla udávají konkrétní údaj o tom:- kolik toho uživatel dostane, - za kolik to dostane,- na jak dlouho apod.2. Člověk i při skenování obsahu vnímá čísla samostatně.3. Čísla pomáhají překonat vágnost obecných tvrzení.

Zdroj: HubSpot

4.4 Efekt urgentnostiAneb co neuděláte dnes, neuděláte

„Abyste vytvořili účinnou naléhavost, budete muset odpovědět na otázku "proč bych to měl udělat dnes?“

- Magdalena Georgieva, Marketing manager @Hubspot

Proč využívat naléhavost?- Vytváří pocit urgentní nutnosti provést danou akci.- Pozor, je rozdíl mezi naléhavostí a nátlakem.

Zdroj: HubSpot

4.5 Cliffhanger efektAneb položte otázku

„Lidé nemohou vystát nejistotu. Máme tendenci co nejdříve najít odpovědi na zajímavé a nezodpovězené otázky.“

- Vitaly Friedman, Editor-in-Chief @SmashingMagazine

Proč klást v CTA otázky?- Otázky, zejména provokativní, zvyšují zájem uživatelů o obsah sdělení.- Bluma W. Zeigarnik (1927):

- Vytváří se emocionální spojení mezi čtenářem a sdělením.- Čtenáři si lépe pamatují obsah sdělení.

Autor: Jaroslav Foglar

4.6 Umístění odkazu v CTAAneb kam s ním

„Uživatelé raději provedou akci okamžitě, než aby se vraceli a hledali odkaz někde uprostřed věty.“

- Anthony T, Founder @UX Movement

Proč umístit odkaz na konec CTA?- Odkaz je tak jednodušší a rychlejší najít.- Uživatel po dočtení naváže akcí, nemusí se vracet a hledat odkaz.

Zdroj: Smashing Magazine

5. Nabídka a CTAJak optimalizovat nabídku

5.1 Efekt reciprocityAneb chci vrátit laskavost

„Neměli byste se stydět požádat uživatele o vrácení laskavosti.“

- David Travis, Psycholog a kanzultant @UserFocus

Jak to funguje?1. Nabídneme uživateli drobný dárek.

- kapitola z knihy zdarma- užitečná informace (článek)- zkušební verze produktu zdarma

2. Vznikne podvědomý pocit zavázání k vrácení laskavosti3. Požádáme o vrácení laskavosti

- koupě celé knihy, pokud zaujala kapitola- doporučení či sdílení (článek apod.)- jakákoli jiná akce

5.2 Efekt stádaAneb chci být všude tam, kde jsou ostatní

„Sledujeme, co dělají jiní, abychom dle toho posoudili, co je běžné a pak toto chování zkopírovali.“

- David Travis, Psycholog a kanzultant @UserFocus

Jak to funguje?1. Sbíráme data o aktivitě uživatelů

- počet lajků- počet sdílení- počet registrací- počet stažení apod.

2. Tato data prezentujeme v kontextu k nabídce- "Přidejte se k 1 milionu zaregistrovaných uživatelů."- Stáhněte si knihu, kterou již četlo 100.000 designerů."a apod.

5.3 Goldilocks effectAneb beru zlatou střední cestu

„Lidé nejsou velmi zdatní při odhadování skutečné hodnoty toho, co nakupují. Využívají tak srovnání s jinými alternativami a to i s těmi, které jim sami nabídnete.“

- David Travis, Psycholog a kanzultant @UserFocus

Jak to funguje?1. Vytvoříme základní verzi toho, co nabízíme.2. Přidáme levnější "Basic" verzi s významnými omezeními.3. Přidáme "Golden" verzi s drobnými výhodami.4. Prezentujeme srovnání všech 3 verzí s důrazem na ekonomicky výhodnou "střední" variantu.

Ve výsledku si lidé "racionálně" zvolí střední cestu, protože budou mít pocit, že ušetřili, ale přitom získaliplnohodnotný produkt.

5.4 Salience effectAneb zajímá mě to, co právě řeším

„Během nákupního procesu je několik míst, ve kterých je uživatel ochoten věnovat zvýšenou pozornost nabídkám souvisejících s jeho aktuálním nákupním chováním.“

- David Travis, Psycholog a kanzultant @UserFocus

Jak to funguje?1. Ke každé nabídce vytvoříme seznam komplementárních nabídek.2. Tyto komplementy nabízíme ve vhodných momentech.

- v detailu produktu- v průběžném přehledu nákupního košíku- před potvrzením nákupu (před platbou)

5.5 Ambassador effectAneb chci se ujistit, že jsem udělal správné rozhodnutí

„Chceme věřit tomu, že naše chování je konzistentní s tím, čemu věříme. Jakmile zaujmeme nějaký viditelný postoj, cítíme potřebu jej obhájit.“

- David Travis, Psycholog a kanzultant @UserFocus

Jak to funguje?1. Po provedení akce dáme uživateli možnost vyjádřit svůj postoj.

- "olajkování" produktu, který koupil- doporučení produktu ostatním- sdílení akce ("koupil jsem si XYZ") na soc. sítích

2. Tím, že uživatel tuto možnost využije, nastanou dva jevy:- uživatel je emocionálně svázán s akcí - uživatel doporučí ostatním provedení stejné akce

= Stane tzv. Ambassadorem (značky, produktu).

6. Grafika a CTAJak optimalizovat vzhled sdělení

6.1 Teplé a studené barvyAneb teplá letí, studená se topí

„Během amerických prezidentských voleb měli všichni kandidáti na svém webu tlačítko (pro zaslání finanční podpory) v červené barvě.“

- Dmitry Fadeyev, autor @UsabilityPost

Jak to funguje?1. Teplé barvy na pozadí studených barev vyhodnocuje mozek jako objekty, které se "vznášejí" nad pozadím.2. Naopak studené barvy na pozadí teplých barev se jeví jako kdyby se "topily" a nořily do pozadí.

Jak to využít?Jednoduše. Akční prvky (tlačítka, odkazy apod.)by měly být v teplých barvách a pozadí ve studených.

6.2 Lidská tvářAneb to první, co rozpoznáme

„Lidé instinktivně rozpoznají cizí obličej, jakmile vstoupí do jejich zorného pole. “

- Dmitry Fadeyev, autor @UsabilityPost

Jak to funguje?1. Tvář je první, co v jakémkoli designu či shluku prvků člověk rozpozná.2. Nejvíce pozornosti pak poutají oči.

Jak to využít?Jakoukoli nabídku můžeme doprovodit lidskou tváří.Strhneme tak prvotní pozornost na oblast s naší nabídkou.

6.3 Pohled očíAneb kam to kouká?

„Ukázalo se, že máme tendenci podívat se směrem, kterým kouká osoba na fotografii.“

- Dmitry Fadeyev, autor @UsabilityPost

Jak to funguje?1. Uživatel nejprve rozpozná tvář a ta strhne jeho pozornost.2. Uživatele poutají nejvíce oči.3. Pokud se člověk na fotografii dívá jiným směrem, uživatel tento směr kopíruje.

Jak to využít?Tvář doprovázející nabídku můžeme komponovat tak, aby sledovala text nabídky a CTA.

Zdroj: Smashing Magazine

Zdroj: Smashing Magazine

6.4 Viscerální designAneb automatický (dis)like

„Design ovlivňuje, jaký prožitek mají uživatelé z produktu, na třech rovinách - viscerální, behaviorální a reflektivní.“

- Donald Norman, profesor kognitivních věd @Nielsen Norman Group

Jak to funguje?1. Viscerální rovina prožitku designu je podvědomá a biologicky naprogramovaná.2. Na této rovině automaticky posuzujeme, zda se nám určité věci líbí nebo nelíbí.(Např. Pavouci, hniloba - nelíbí. Symetrické objekty, hezcí lidé - líbí.)

Jak to využít?Pro grafiku doprovázející CTA můžeme využít symboly,které lidé automaticky považují za líbivé.

(A naopak se můžeme vyhnout chybám.)

6.5 Další tipy ke graficeAneb co už by se nevešlo...

Negativní prostorVelká plocha, málo obsahu, dojem čistoty. CTA přitáhne pozornost.

KontrastUmožňuje oddělit CTA od všeho ostatního a poutat pozornost.

SměrŠipky dokáží nasměrovat pohled uživatele ke správnému místu.

a další...

InspiraceSmashingMagazine.com- ebook Psychology of web design- ebook User experience design- ebook Professional web designEmotional Design - kniha od Donalda NormanaBlog.hubspot.com- ebook Mastering the design & copy of call to action- ebook Effective call to action- ebook 102 examples of effective call to actionZbraně vlivu - kniha od Roberta B. CialdinihoMyšlení, rychlé a pomalé - kniha od Daniela Kahnemana

Díky za pozornostČtvrtkon / Ondra Machart @sleepygraphic