Alinhando o design às metricas e conversões

Alinhando o design àsmétricas e conversões. Rafael Lima - @rafaelp

Rafael Lima @rafaelpQual o objetivo de um website?

Rafael Lima @rafaelp

Rafael Lima @rafaelpEcommerce ?

Rafael Lima @rafaelpEcommerce Vender

Rafael Lima @rafaelpSite de Evento ?

Rafael Lima @rafaelp Site de EventoCaptar Inscrições

Rafael Lima @rafaelpEmpresa de Engenharia ?

Rafael Lima @rafaelpEmpresa de EngenhariaReceber uma Ligação

Rafael Lima @rafaelpAplicativo Web ?

Rafael Lima @rafaelp Aplicativo WebSign-up no Sistema

Rafael Lima @rafaelpSite de Restaurante ?

Rafael Lima @rafaelpSite de RestaurantePedido de Delivery

Rafael Lima @rafaelpBlog ?

Rafael Lima @rafaelp BlogLer outro post

Rafael Lima @rafaelpServiço de Design ?

Rafael Lima @rafaelpServiço de DesignSolicitar cotação

Rafael Lima @rafaelpTodo site deve terum objetivo bem deﬁnido

Rafael Lima @rafaelpComo devo montar o site?

Rafael Lima @rafaelp NOBig Design Up-Front

Rafael Lima @rafaelpLanding Page

Rafael Lima @rafaelp Landing Page• Chamada Principal• Pitch• Call to Action• Imagem/Foto do Resultado• Benefícios• Form Newsletter

Rafael Lima @rafaelp Só tem umprobleminha...

Rafael Lima @rafaelp Você não vaiacertar de primeira :/

Rafael Lima @rafaelp Montar umaLanding Page não garante que o objetivo seja atingido

Rafael Lima @rafaelpO que devo saber para atingir o objetivo, então?

Rafael Lima @rafaelp Conceitos• Visitantes• Leads• Prospects• Clientes• Funil de Vendas• Taxa de Conversão

Rafael Lima @rafaelp Visitantes xLeads/Prospects x Clientes

Rafael Lima @rafaelpFunil de Vendas

Rafael Lima @rafaelpVISITANTES LEADS PROSPECTS CLIENTES

Rafael Lima @rafaelpTaxa de Conversão

Rafael Lima @rafaelp10.000 VISITANTES 1.000 INSCRITOS } TC = 500/10.000 = 25 PAGANTES } TC = 25/500 = 2,5%

Rafael Lima @rafaelp O design aplicado no front-end deve ser feito paraconverter o máximo de visitantes

Rafael Lima @rafaelpComo mensuraresses números?

Rafael Lima @rafaelpPageviews x Events

Rafael Lima @rafaelp<script type="text/javascript">//<![CDATA[var mpq = [];mpq.push(["init", "XXXXXXXXXXXXXXXXXXX"]);(function() { var mp = document.createElement("script"); mp.type = "text/javascript"; mp.async =true; mp.src = (document.location.protocol == https: ? https: : http:) + "//api.mixpanel.com/site_media/js/api/mixpanel.js"; var s = document.getElementsByTagName("script")[0]; s.parentNode.insertBefore(mp,s);})();//]]></script>

Rafael Lima @rafaelp<script type="text/javascript">//<![CDATA[mpq.push([set_conﬁg, {test: false}])mixpanel_distinct_id = get_visitor_guid();mpq.push([register_once, {distinct_id: mixpanel_distinct_id}, all, "False", 31])//]]></script><script type="text/javascript">//<![CDATA[mpq.push([track, visited new account, {}]);//]]></script>

Rafael Lima @rafaelp<script type="text/javascript">//<![CDATA[mpq.push(["track", "homepage"]);$("#video-preview").click(function() { mpq.push(["track", "video"]);});//]]></script>

Rafael Lima @rafaelp Não é só paraJavascript. Pode serusado no back-end.

Rafael Lima @rafaelp# account_observer.rbclass AccountObserver < ActiveRecord::Observer def after_create(account) Delayed::Job.enqueue MixpanelJob.new(account created,{:distinct_id => account.mixpanel_distinct_id}) end def after_destroy(account) Delayed::Job.enqueue MixpanelJob.new(account cancelled,{:distinct_id => account.mixpanel_distinct_id}) endend

Rafael Lima @rafaelp# Gemfilesource "http://rubygems.org"gem rails, "3.0.3"gem mixpanel, 0.7.0# mixpanel_job.rbclass MixpanelJob < Struct.new(:event, :properties) def perform mixpanel = Mixpanel.new(ENV[MIXPANEL_TOKEN], {}) mixpanel.track_event(event, properties) endend

Rafael Lima @rafaelpSomente medir não resolve. Até agora demos apenas o primeiro passo.

Rafael Lima @rafaelpComo melhorar as conversões?

Rafael Lima @rafaelpTestes A/B(A/B Testing / Split Testing)

Rafael Lima @rafaelphttp://37signals.com/svn/posts/1525-writing-decisions-headline-tests-on-the-highrise-signup-page

Rafael Lima @rafaelphttp://www.dustincurtis.com/you_should_follow_me_on_twitter.html

Rafael Lima @rafaelphttp://dmix.ca/2010/05/how-we-increased-our-conversion-rate-by-72/

Rafael Lima @rafaelpEsta fase não acaba nunca. Você pode ﬁcar eternamentefazendo testes A/B.

Rafael Lima @rafaelpDicas Práticas

Rafael Lima @rafaelp Fotos de Produtos• Foco no Produto• Fotos de mais de um ângulo• Mostre alguém usando• Fotos do maior tamanho possível• Mostre as diferentes opções• Mostre pessoas apreciando o

Rafael Lima @rafaelp Botões• Use botões grandes• Inclua ícone nos botões• Adicione profundidade• Adicione efeito ao passar o mouse• Use uma cor diferente da paleta• Descreva o próximo passo

Rafael Lima @rafaelp E-commerce• Descreva o produto com os detalhes• Não peça cadastro• Apresente as formas de pagamento• Não apresente menu nem links• Utilize selos de servidor seguro• Apresente os dados da empresa

Rafael Lima @rafaelp Qual o percentualmédio de abandono de carrinho de compras?

Rafael Lima @rafaelpA. 27%B. 59%C. 36%D. 15%

Rafael Lima @rafaelp A. 27% B. 59% C. 36% D. 15%MarketingSherpa Ecommerce Study, 2006

Rafael Lima @rafaelpPara ﬁnalizar...

Rafael Lima @rafaelp Recapitulando...1. Deﬁnir Objetivo2. Determinar Conversões3. Mensurar o Funil4. Realizar Testes A/B5. Adaptar o Site ...

Rafael Lima @rafaelpSe coloque no lugar do usuário e use o seu site

Rafael Lima @rafaelpSucesso!

Rafael Lima @rafaelpObrigado!

Rafael Lima @rafaelp Obrigado!Pessoalhttp://twitter.com/rafaelphttp://rafael.adm.brBielSystemshttp://bielsystems.com.brWorkshop de EmpreendedorismoBootstrappershttp://bootstrappers.com.br/workshopStartup DEV

Rafael Lima @rafaelp Referênciashttp://www.slideshare.net/EcommmerceSummit/42-ecommercesummithttp://www.marketingsherpa.com/content/?q=node/2973http://www.slideshare.net/rpanini/a-importncia-do-design-no-ecommercehttp://www.smashingmagazine.com/2010/06/24/the-ultimate-guide-to-a-b-testing/http://www.ﬂickr.com/photos/kdlc/877547288/http://www.ﬂickr.com/photos/jeff_snodgrass/1473675982/

Rafael Lima @rafaelp Copyleft• Use essa apresentação como quiser• Distribua para quem quiser• Altere o quanto quiser• Não precisa nem se preocupar em citar o autor• Sinta-se livre para fazer absolutamente o que quiser com

http://rafael.adm.br	273
http://blog.zenorocha.com	56
http://paper.li	22
http://feeds.feedburner.com	20
url_unknown	11
http://www.slideshare.net	1
http://localhost:4000	1

Alinhando o design às metricas e conversões

by Rafael Lima on Jun 20, 2011

Accessibility

Categories

Tags

Upload Details

Usage Rights

7 Embeds 384

Statistics

Alinhando o design às metricas e conversões — Presentation Transcript