Successfully reported this slideshow.
We use your LinkedIn profile and activity data to personalize ads and to show you more relevant ads. You can change your ad preferences anytime.

Iván Barreiro y Rubén Cougil - Elogia - WebCongress Madrid 2011

1,091 views

Published on

Iván Barreiro y Rubén Cougil - Elogia - Facebook Apps - WebCongress Madrid 2011

  • Be the first to comment

  • Be the first to like this

Iván Barreiro y Rubén Cougil - Elogia - WebCongress Madrid 2011

  1. 1. FACEBOOK APPS @Ibargom @Rcougil
  2. 2. <ul><li>- Social Media Strategist - </li></ul><ul><li>Iván Barreiro </li></ul><ul><li>Rubén Cougil </li></ul><ul><li>- Social Media Developer - </li></ul><ul><li>Facebook Apps Workshop </li></ul>
  3. 3. FACEBOOK COMO CANAL EN LA ESTRATEGIA DE MARKETING
  4. 4. <ul><ul><li>Conocer/Auditar/Escuchar/Monitorizar la opinión de los públicos sobre la marca. Hay que saber cuáles son los puntos fuertes y débiles de la marca. Aquello que el usuario más valora y lo que más detesta o echa en falta. </li></ul></ul><ul><ul><li>Definir objetivos y público a alcanzar. ¿Qué es lo que queremos conseguir? ¿A cuáles de los 15 Millones de españoles en Facebook queremos impactar? </li></ul></ul><ul><ul><li>Definir en la estrategia de campaña qué papel va a jugar facebook en la integración </li></ul></ul>Antes de entrar en Facebook… Facebook como canal en la estrategia de MK
  5. 5. Creación de una página en Facebook <ul><ul><li>Punto de partida: https://www.facebook.com/pages/create.php </li></ul></ul>
  6. 6. Customización Básica de la página
  7. 7. <ul><ul><li>Rellenar Información (Datos postales, Misión, Productos … ) </li></ul></ul>Customización Básica de la página
  8. 8. <ul><ul><li>Vanity Url </li></ul></ul><ul><ul><li>( http://www.facebook.com/username ) </li></ul></ul>Customización Básica de la página
  9. 9. ¿Cuál es la página española con más seguidores en Facebook? 1- FC Barcelona (22.950.000 fans) 2- Real Madrid CF (21.846.000 fans) 3- Rafa Nadal (8.770.000 fans) (*) Fuente: SocialBakers
  10. 10. Customización Básica de la página
  11. 11. Cobertura a la página <ul><ul><li>Accesos a las redes sociales en la home </li></ul></ul>
  12. 12. <ul><ul><li>Visibilidad a las redes sociales en las comunicaciones de la marca </li></ul></ul>Cobertura a la página
  13. 13. Cobertura a la página <ul><ul><li>Uso de plugins sociales para darle visibilidad a nuestra página. </li></ul></ul>
  14. 14. Cobertura a la página <ul><ul><li>SOCIAL ADS </li></ul></ul><ul><ul><li>sistema publicitario de Facebook </li></ul></ul><ul><ul><li>CPC / CPM </li></ul></ul><ul><ul><li>Alto poder de Segmentación </li></ul></ul><ul><ul><li>Presupuesto escalable </li></ul></ul><ul><ul><li>Pueden redirigir a Facebook o web </li></ul></ul><ul><ul><li>Optimización </li></ul></ul><ul><ul><li>Configuración: </li></ul></ul><ul><ul><ul><li>Máximo de 25 caracteres  Título </li></ul></ul></ul><ul><ul><ul><li>Máximo de 135 caracteres  Cuerpo </li></ul></ul></ul><ul><ul><ul><li>110 ancho x 80 alto  Imagen </li></ul></ul></ul>
  15. 15. <ul><li>SPONSORED STORIES (Historias patrocinadas) </li></ul><ul><li>Los anuncios de Facebook contienen mensajes personalizados de los publicistas. Las Sponsored No . </li></ul><ul><li>Ambas pueden hacer alusión a una interacción social </li></ul>Cobertura a la página
  16. 16. <ul><ul><li>Sponsored Stories (Tipo 1)  Page Like History </li></ul></ul>Cobertura a la página
  17. 17. <ul><ul><li>Sponsored Stories (Tipo 2)  Page Post History </li></ul></ul>Cobertura a la página
  18. 18. <ul><ul><li>Sponsored Stories (Tipo 3)  Page Post like History </li></ul></ul>Cobertura a la página
  19. 19. Facebook como canal en la estrategia de MK <ul><li>Se calcula que Facebook ingresará cerca de 4.000 millones de dólares en 2011 </li></ul>1- Publicidad Social (Social Ads y Sponsored Ads) 2- Acuerdos Empresariales 3- Facebook Credits ¿De dónde provienen esos ingresos?
  20. 20. EDGE RANK Facebook como canal en la estrategia de MK U - La afinidad entre el usuario y página W – El peso del edge D – Tiempo transcurrido
  21. 21. <ul><li>Público, Objetivos, Estrategia </li></ul>Recomendaciones Páginas
  22. 22. <ul><li>Aspecto Visual </li></ul>Recomendaciones Páginas
  23. 23. <ul><li>Landing Page de Bienvenida </li></ul>Recomendaciones Páginas
  24. 24. <ul><li>Ofrecer contenidos relevantes para el usuarios </li></ul>Recomendaciones Páginas
  25. 25. <ul><li>Hablar con los usuarios </li></ul>Recomendaciones Páginas
  26. 26. <ul><li>Monitorizar los contenidos </li></ul>Recomendaciones Páginas
  27. 27. <ul><li>Política de comentarios </li></ul>Recomendaciones Páginas
  28. 28. Facebook Apps <ul><ul><li>¿Qué son? </li></ul></ul><ul><ul><li>Son servicios web alojados en servidores externos a Facebook que se pueden integrar en la plataforma. </li></ul></ul>
  29. 29. <ul><ul><li>¿Para qué sirven? </li></ul></ul><ul><ul><li>Para integrar contenidos </li></ul></ul><ul><ul><li>y mejorar la experiencia </li></ul></ul><ul><ul><li>del usuario. </li></ul></ul>Facebook Apps
  30. 30. Facebook Apps <ul><ul><li>¿Por qué son necesarias las Facebook Apps? </li></ul></ul><ul><ul><li>Por la política de privacidad de Facebook. </li></ul></ul><ul><ul><li>https://www.facebook.com/promotions_guidelines.php </li></ul></ul>“ Las promociones de Facebook se deben administrar en aplicaciones que están en Facebook.com , ya sea en la página principal de una aplicación o en una aplicación que se encuentra en la pestaña de una página ” “ No debes usar las funciones ni las características de Facebook, por ejemplo el botón Me gusta , como mecanismos de votación para una promoción ” “ Los anuncios no pueden dar a entender que Facebook patrocina la promoción ni que está asociado con ella de ningún modo ”
  31. 31. Tipos de Apps <ul><ul><li>Landings de Bienvenida </li></ul></ul>
  32. 32. Tipos de Apps <ul><ul><li>Aplicaciones de Servicio </li></ul></ul>
  33. 33. Tipos de Apps <ul><ul><li>Aplicaciones de Concurso </li></ul></ul>
  34. 34. Tipos de Apps <ul><ul><li>Egames </li></ul></ul>
  35. 36. Errores frecuentes en Aplicaciones de Concurso <ul><li>¿Para qué? </li></ul><ul><li>Votos </li></ul><ul><li>Publicidad </li></ul><ul><li>moderación </li></ul><ul><li>B ases legales </li></ul><ul><li>Incentivo </li></ul>
  36. 37. Proveedores de Aplicaciones Prediseñadas
  37. 38. Cool-Tabs
  38. 39. Involver
  39. 40. Trisocial
  40. 41. Pagemodo
  41. 42. Easypromos
  42. 43. <ul><li>Aplicaciones Prediseñadas (Twitter, Youtube, Flickr) </li></ul><ul><li>Sistema sencillo de edición HTML </li></ul>Ventajas Aplicaciones Prediseñadas
  43. 44. Inconvenientes Aplicaciones Prediseñadas <ul><li>Limitaciones </li></ul><ul><ul><li>Usuarios </li></ul></ul><ul><ul><li>Nª Pestañas </li></ul></ul><ul><ul><li>Nº Fans </li></ul></ul><ul><li>Logo de Proveedor </li></ul><ul><li>Icono de Pestaña </li></ul><ul><li>Tiempos de Carga </li></ul><ul><li>Contest Limitados </li></ul><ul><li>No hay medición </li></ul>
  44. 45. Medición de Resultados | Insights App
  45. 46. DESARROLLO DE APPS PARA FACEBOOK
  46. 47. <ul><ul><li>Cualquier tecnología web es válida siempre que la interfaz de nuestra aplicación se pueda insertar dentro de un iframe . </li></ul></ul><ul><ul><li>La aplicación deberá limitarse en ancho: </li></ul></ul><ul><ul><ul><li>520px si se integra como una pestaña de una página. </li></ul></ul></ul><ul><ul><ul><li>780px si se integra como una app en la plataforma. </li></ul></ul></ul><ul><ul><li>La aplicación estará alojada fuera de Facebook (hosting propio) </li></ul></ul>1.- Servicio/página/aplicación/sistema web Facebook Apps - Ingredientes 520px
  47. 48. 1.- Servicio/página/aplicación/sistema web Facebook Apps - Ingredientes WEB SERVER Database
  48. 49. <ul><ul><li>Obligatorio que nuestra aplicación soporte conexiones mediante protocolo HTTS. Desde el pasado 1 de Octubre de 2011 Facebook no acepta aplicaciones con conexiones no encriptadas. </li></ul></ul><ul><ul><li>Se necesita una capa SSL (Secure Socket Layer) en nuestro servidor. </li></ul></ul>2.- Soporte SSL Facebook Apps - Ingredientes <ul><ul><li>Existen multitud de proveedores de certificados SSL: </li></ul></ul>
  49. 50. 2.- Soporte SSL Facebook Apps - Ingredientes WEB SERVER Database
  50. 51. <ul><ul><li>Cualquiera puede crear un perfil de desarrollo en Facebook previa verificación de su cuenta. El site de aplicaciones de Facebook es: </li></ul></ul>3.- Perfil de desarrollador. Facebook Apps - Ingredientes https://developers.facebook.com <ul><ul><li>Un perfil de desarrollo nos va a permitir integrar servicios de tres formas: </li></ul></ul>Websites Mobile Apps Apps on FB Conecta tu sitio web con Facebook gracias a FB Connect. Herramientas para dispositivos móviles (iOS, Android y Mobile Web) Integra tu aplicación dentro de la plataforma.
  51. 52. <ul><ul><li>Un perfil de desarrollo puede crear perfiles de aplicación. Un perfil de aplicación es el vínculo que conecta Facebook con tu sitio web, dispositivo o aplicación. Ofrece un completo panel de control de administración y configuración. </li></ul></ul>4.- Perfil de aplicación. Facebook Apps - Ingredientes
  52. 53. 4.- Perfil de aplicación. Facebook Apps - Ingredientes
  53. 54. 4.- Perfil de aplicación. Facebook Apps - Ingredientes
  54. 55. Facebook Apps - Ingredientes WEB SERVER Database
  55. 56. <ul><ul><li>1.- Un servicio/aplicación/sistema Web en un servidor propio. </li></ul></ul><ul><ul><li>2.- Soporte SSL para nuestra aplicación. </li></ul></ul><ul><ul><li>3.- Un perfil de desarrollador. </li></ul></ul><ul><ul><li>4.- Un perfil de aplicación. </li></ul></ul>Ya tenemos: Facebook Apps - Ingredientes <ul><ul><li>Esto es suficiente para integrar nuestra aplicación en la plataforma Facebook, pero... ¿ Cómo puedo sacarle más partido a esta integración? La respuesta es... </li></ul></ul>Facebook Open Graph Protocol
  56. 57. ¿Qué es el Open Graph? Facebook Apps – Open Graph
  57. 58. ¿Puede mi aplicación acceder al Open Graph? Facebook Apps – Open Graph Sí , mediante el Graph API , siempre y cuando el usuario que va a utilizar la aplicación conceda los permisos adecuados. <ul><ul><li>El método para solicitar permisos de aplicación a un usuario se denomina Auth Dialog y se implementa gracias al protocolo OAuth 2.0 </li></ul></ul><ul><ul><li>Existen muchos permisos diferentes dependiendo del tipo de información a la que la aplicación quiere acceder. Estos permisos siempre hacen referencia a información de perfil privada. </li></ul></ul><ul><ul><li>Herramientas para la comunicación con el Grap API (aportadas por FB): </li></ul></ul>
  58. 59. Diagrama de Secuencia (primer acceso) Facebook Apps – Open Graph USUARIO FACEBOOK PLATFORM APPLICATION GRAPH API 1. Login 2. Request App Access 3. Al intentar acceder al Graph API y no envíar un access token válido se deniega el acceso 4. Display Auth Dialog 5. Acepta los permisos. (Se genera un access token válido asociado al app Id y al Secret de la aplicación) 6. Si se accede con un access token válido el Graph API devuelve el resultado.
  59. 60. <ul><li>UserID : 434557142518876 </li></ul><ul><li>AppID/App Key : 168967846518892 </li></ul><ul><li>App Secret : n6d2843gd253533d3d7995m2e2fd594k </li></ul><ul><li>Access Token : AAACEdEose0cBAJtrSz02iH0NpWL1edVt7kgZA4I522n5uDYZ </li></ul><ul><li>Bf5WnpwZACLlOhRwik8m2836ZCKewCvIiemajLH9uidyaN5YM3lpXdIectFmVNMMnPX0 </li></ul>Conceptos sobre el manejo del API Facebook Apps – Graph API Mi aplicación ya tiene acceso a la información que el usuario ha autorizado. ¿Y ahora qué? <ul><li>¡Puedo intentar extraer esa información y utilizarla en mi aplicación! </li></ul><ul><li>Cada elemento en el Open Graph se denomina Objeto y se le asocia un ID único (fotos, videos, usuarios, grupos, notas, checkins...) </li></ul><ul><li>Si el access token me permite acceder a un Objeto determinado solamente tendré que hacer una llamada GET especificando el objeto al que quiero acceder y adjuntar dicho token. </li></ul><ul><li>Y no solo eso, puedo también enviar peticiones POST y DELETE (si tengo permiso) para realizar acciones en nombre del usuario . </li></ul>
  60. 61. Facebook Tools – Graph API Explorer Facebook Apps – Graph API
  61. 62. Ejemplo de uso de Graph API con Facebook Apps – Graph API 1.- Importar el SDK : 2.- Inicializar el SDK y conectarlo con tu aplicación:
  62. 63. Ejemplo de uso de Graph API con Facebook Apps – Graph API 4.- Ya puedo hacer llamadas al API: 3.- Pedir permisos extendidos:
  63. 64. Facebook Apps – Graph API API Database ¡Hola Rubén! Tienes 27 años y has nacido en Vigo WEB SERVER
  64. 65. Ejemplo de uso de Graph API con Facebook Apps – Graph API 1.- Importar el SDK : 2.- Inicializar el SDK y conectarlo con tu aplicación:
  65. 66. Ejemplo de uso de Graph API con Facebook Apps – Graph API 3.- Pedir permisos extendidos: 4.- Ya puedo hacer llamadas al API:
  66. 67. Facebook Apps – Graph API API Database ¡Hola Rubén! Tienes 27 años y has nacido en Vigo WEB SERVER
  67. 68. Facebook Apps – Graph API API Database ¡Hola Rubén! Tienes 27 años y has nacido en Vigo WEB SERVER

×