Como Utilizar Unbounce y Hacer una Landing Page

35
#YouAreAmazing Web + Mobile + Marketing

Transcript of Como Utilizar Unbounce y Hacer una Landing Page

Page 1: Como Utilizar Unbounce y Hacer una Landing Page

#YouAreAmazingWeb + Mobile + Marketing

Page 2: Como Utilizar Unbounce y Hacer una Landing Page

Landing Page con “Unbounce”

1

Vamos a Unbounce.com y seleccionamos “Sign Up”

Page 3: Como Utilizar Unbounce y Hacer una Landing Page

Landing Page con “Unbounce”

2

Vamos a la parte de abajo y damos click donde dice “Sign up for free”

Page 4: Como Utilizar Unbounce y Hacer una Landing Page

Landing Page con “Unbounce”

3

Rellenamos el formulario con nuestros datos y damos click en el botón “Open My Free Account” y revisamos nuestra cuenta de correo personal

con la que nos dimos de alta por indicaciones.

Page 5: Como Utilizar Unbounce y Hacer una Landing Page

Landing Page con “Unbounce”

4

Volvemos a unbounce.com y le damos click en “Log in”

Page 6: Como Utilizar Unbounce y Hacer una Landing Page

Landing Page con “Unbounce”

5

Aparecerá una ventana nueva donde debemos de “Logearnos” con nuestro correo y contraseña

Page 7: Como Utilizar Unbounce y Hacer una Landing Page

Landing Page con “Unbounce”

6

Una vez que nos hallas identificado nos saldrá un panel como este, en medio veremos los proyectos creados y de lado izquierdo en el

botón verde podemos crear un proyecto Nuevo.

Page 8: Como Utilizar Unbounce y Hacer una Landing Page

Landing Page con “Unbounce”

7

Una vez que vallamos a crear un proyecto Nuevo donde dice “Type” seleccionamos “Lead Generation” para poder tener un formulario

de contacto y después seleccionamos un diseño que nos guste a nosotros, recuerda que dando doble clickpodemos tener una vista previa del diseño

Page 9: Como Utilizar Unbounce y Hacer una Landing Page

Landing Page con “Unbounce”

8

Una vez seleccionado el diseño le agregamos el titulo de nuestro proyecto o landing page en la parte inferior donde dice “Page Name”

Page 10: Como Utilizar Unbounce y Hacer una Landing Page

Landing Page con “Unbounce”

9

Ya agregado el titulo de nuestra Landing Page le damos en el botón “Save & Start Editing” para guardar nuestra selección y empezar a trabajar

en nuestra landing page

Page 11: Como Utilizar Unbounce y Hacer una Landing Page

Landing Page con “Unbounce”

10

Una vez creado nuestra Landing Page para agregar una imagen nueva seleccionamos de lado derecho el botón de “image” ubicado de lado izquierdo

como lo muestra la siguiente imagen

Page 12: Como Utilizar Unbounce y Hacer una Landing Page

Landing Page con “Unbounce”

11

Para subir nuestras propias imágenes damos un click donde dice “Uplaod New Image” navegamos hasta la carpeta donde esta se

encuentra y le damos ok, después seleccionamos la imagen que queremos insertar y le damos en el botón “Choose”

Page 13: Como Utilizar Unbounce y Hacer una Landing Page

Landing Page con “Unbounce”

12

Para modificar la Imagen daremos doble click en ella y si queremos agrandarla la jalaremos con el mouse de las orillas (Click sostenido) y

la arrastramos como la imagen de abajo lo muestra

Page 14: Como Utilizar Unbounce y Hacer una Landing Page

Landing Page con “Unbounce”

13

Para insertar un texto nuevo es necesario dar click en el botón de “Text” ubicado en la barra de herramientas en la izquierda

y lo arrastramos a donde lo queremos ubicar dicho texto

Page 15: Como Utilizar Unbounce y Hacer una Landing Page

Landing Page con “Unbounce”

14

Una vez colocado el texto para editarlo le damos doble click a este mismo

Page 16: Como Utilizar Unbounce y Hacer una Landing Page

Landing Page con “Unbounce”

15

Cuando le damos doble click nos aparece el panel de edición de texto como en la imagen de abajo, tenemos las opciones para editar el color, tamaño, contenido etc. Una vez terminada la edición le damos click en

el botón “Close” como lo muestra la imagen

Page 17: Como Utilizar Unbounce y Hacer una Landing Page

Landing Page con “Unbounce”

16

Cuando queremos editar un Formulario de contacto o nuestro “Call To Action” es necesario darle un click sobre este mismo

Page 18: Como Utilizar Unbounce y Hacer una Landing Page

Landing Page con “Unbounce”

17

Una vez seleccionado el formulario de contacto le daremos un clicken el botón llamado “Edit Form Fields”

ubicado en la parte superior derecha como lo muestra la imagen

Page 19: Como Utilizar Unbounce y Hacer una Landing Page

Landing Page con “Unbounce”

18

Después de darle click al botón de “Edit Form Fields” Aparecera una ventana llamada “Design Your Form” seleccionamos dando un click el campo que queremos

editar en esta caso será el campo llamado “Name”

Page 20: Como Utilizar Unbounce y Hacer una Landing Page

Landing Page con “Unbounce”

19

Una vez seleccionado el campo que vamos a editar de lado derecho aparecerán nuevas opciones donde podremos cambiar el nombre del campo (Field Label) y si este este campo es obligatorio (Required Field)

como la imagen lo muestra

Page 21: Como Utilizar Unbounce y Hacer una Landing Page

Landing Page con “Unbounce”

20

De lado izquierdo contamos con 3 botones son para acomodar la ubicación de los campos, el botón

Page 22: Como Utilizar Unbounce y Hacer una Landing Page

Landing Page con “Unbounce”

21

Una vez que terminemos de editar nuestro formulario damos un click en el botón “Done” ubicado en la parte inferior derecha de su pantalla

Page 23: Como Utilizar Unbounce y Hacer una Landing Page

Landing Page con “Unbounce”

22

Para guardar las ediciones posteriores debemos de dar click en el botón llamado “Save” ubicado en la parte superior izquierda

Page 24: Como Utilizar Unbounce y Hacer una Landing Page

Landing Page con “Unbounce”

23

Si quieres ver como ha quedado nuestro diseño de “Landing Page” daremos click en el botón “Preview” ubicado en la parte superior derecha

Page 25: Como Utilizar Unbounce y Hacer una Landing Page

Landing Page con “Unbounce”

24

Para volver al menú principal donde están ubicados nuestros proyectos daremos click en el botón del logotipo en la parte superior izquierda

Page 26: Como Utilizar Unbounce y Hacer una Landing Page

Landing Page con “Unbounce”

25

Para ver la información de nuestra landing page le daremos un click en el panel de nuestro “dashboard” seleccionando el proyecto

Page 27: Como Utilizar Unbounce y Hacer una Landing Page

Landing Page con “Unbounce”

26

Una vez seleccionado nuestro proyecto veremos una pantalla como la siguiente, ahora duplicaremos nuestra landing page

basándonos en el diseño principal le daremos un click sobre el botón del engrane y daremos click sobre “Duplicate This Variant”

Page 28: Como Utilizar Unbounce y Hacer una Landing Page

Landing Page con “Unbounce”

27

Una vez duplicada nuestra landing page veremos una segunda variante de bajo de esta misma como lo muestra la siguiente imagen

Page 29: Como Utilizar Unbounce y Hacer una Landing Page

Landing Page con “Unbounce”

28

Para cambiar el nombre de esta daremos un click sobre el dibujo del “lápiz” o sobre el mismo titulo

Page 30: Como Utilizar Unbounce y Hacer una Landing Page

Landing Page con “Unbounce”

29

Para editar esta segunda variante daremos un click sobre el botón “Edit” y nos devolverá a la pantalla de edición que vimos posteriormente.

Page 31: Como Utilizar Unbounce y Hacer una Landing Page

Landing Page con “Unbounce”

30

Seleccionaremos el porcentaje con el que creamos indicado mostrar/publicar nuestras variantes, es decir el porcentaje de impresión de cada una para nuestros visitantes.

Page 32: Como Utilizar Unbounce y Hacer una Landing Page

Landing Page con “Unbounce”

31

Una vez terminados nuestros cambios publicaremos nuestra Landing Page en el bton llamado “Publish Page

Page 33: Como Utilizar Unbounce y Hacer una Landing Page

Landing Page con “Unbounce”

32

Cuando publiquemos nuestra Landing Page y empecemos a obtener datos/leads/conversiones encontraremos esta información sobre este

mismo panel , ubicado un poco más abajo ala derecha en el botón llamado “View Leads”

Page 34: Como Utilizar Unbounce y Hacer una Landing Page

Landing Page con “Unbounce”

33

Al dar click sobre “View Leads” nos devolverá una pantalla como la siguiente con los datos de la gente interesada en nuestra propuesta de valor

Page 35: Como Utilizar Unbounce y Hacer una Landing Page

Landing Page con “Unbounce”

34

Para exportar estos datos y trabajar con ellos daremos click sobre el botón llamado “Generate CSV of Leads”