Descargar la presentación
La descarga está en progreso. Por favor, espere
Publicada porAna Isabel Quintero Montoya Modificado hace 8 años
1
Carlos Fernández Durán Manuel Molina Menéndez Tutor: Miguel Gea Megías
2
FINALIDAD DEL PROYECTO
3
Estudio sobre el desarrollo de aplicaciones en redes sociales, orientadas a la creación de un servicio de valor añadido: la geolocalización social. FINALIDAD DEL PROYECTO
4
1.INTRODUCCIÓN 2.DESARROLLO APLICACIONES EN FACEBOOK 3.GEOLOCALIZACIÓN Y GOOGLE MAPS 4.APLICACIÓN DEMOSTRATIVA 5.CONCLUSIONES ÍNDICE
5
1.INTRODUCCIÓN 2.DESARROLLO APLICACIONES EN FACEBOOK 3.GEOLOCALIZACIÓN Y GOOGLE MAPS 4.APLICACIÓN DEMOSTRATIVA 5.CONCLUSIONES ÍNDICE
6
1.INTRODUCCIÓN ÍNDICE 1.1 Objetivos planteados 1.2 Situación actual 1.1 Objetivos planteados 1.2 Situación actual
7
Entorno de programación bajo un modelo social, en concreto, Facebook. 1. INTRODUCCIÓN 1.1 Objetivos planteados
8
Estudio del desarrollo de aplicaciones sobre APIs y SDKs propias de Facebook. 1. INTRODUCCIÓN 1.1 Objetivos planteados
9
Desarrollo servicio valor añadido para esta comunidad: Geolocalización social Complementada con la API de Google Maps. 1. INTRODUCCIÓN 1.1 Objetivos planteados
10
Web 2.0 y Redes Sociales El uso de internet Geolocalización Social 1. INTRODUCCIÓN 1.2 Situación actual
11
Web 2.0 y Redes Sociales El uso de internet Geolocalización Social 1. INTRODUCCIÓN 1.2 Situación actual
12
Web 2.0 y Redes Sociales El uso de internet Geolocalización Social 1. INTRODUCCIÓN 1.2 Situación actual
13
Web 2.0 y Redes Sociales El uso de internet Geolocalización Social 1. INTRODUCCIÓN 1.2 Situación actual
14
1.INTRODUCCIÓN 2.DESARROLLO APLICACIONES EN FACEBOOK 3.GEOLOCALIZACIÓN Y GOOGLE MAPS 4.APLICACIÓN DEMOSTRATIVA 5.CONCLUSIONES ÍNDICE
15
2. DESARROLLO APLICACIONES EN FACEBOOK ÍNDICE 2.1 Social Graph: el núcleo de Facebook 2.2 Graph API: Acceso a los datos 2.3 Herramientas y SDKs 2.1 Social Graph: el núcleo de Facebook 2.2 Graph API: Acceso a los datos 2.3 Herramientas y SDKs
16
2. DESARROLLO APLICACIONES EN FACEBOOK 2.1 Social Graph: el núcleo de Facebook Red de elementos de facebook conectados entre relaciones. Elementos: Usuarios Páginas Imágenes y Vídeos Aplicaciones Relaciones: Amigo Me gusta Etiqueta Permisos
17
2. DESARROLLO APLICACIONES EN FACEBOOK 2.2 Graph API: Acceso a los datos Interfaz de conexión entre una aplicación y los datos de facebook.
18
2. DESARROLLO APLICACIONES EN FACEBOOK 2.2 Graph API: Acceso a los datos Consultas de datos Consultas sobre elementos (objetos) Todos los elementos en facebook tienen un ID único https://graph.facebook.com/ID https://graph.facebook.com/220439 { "id": "220439", "name": "Bret Taylor", "first_name": "Bret", "last_name": "Taylor", "link": "http://www.facebook.com/btaylor", "username": "btaylor", "gender": "male", "locale": "en_US" } { "id": "220439", "name": "Bret Taylor", "first_name": "Bret", "last_name": "Taylor", "link": "http://www.facebook.com/btaylor", "username": "btaylor", "gender": "male", "locale": "en_US" }
19
2. DESARROLLO APLICACIONES EN FACEBOOK 2.2 Graph API: Acceso a los datos Consultas de datos Consultas sobre elementos relacionados https://graph.facebook.com/ID/RELACION https://graph.facebook.com/me/friends { "data": [ { "name": "Demo Geolocaliza", "id": "100001861697401" }, { "name": "Manu Molina", "id": "100001254034995" }, { "name": "Carlos Fern\u00e1ndez", "id": "100000306140880" }] } { "data": [ { "name": "Demo Geolocaliza", "id": "100001861697401" }, { "name": "Manu Molina", "id": "100001254034995" }, { "name": "Carlos Fern\u00e1ndez", "id": "100000306140880" }] }
20
2. DESARROLLO APLICACIONES EN FACEBOOK 2.2 Graph API: Acceso a los datos Autenticación Facebook utiliza el protocolo oAuth 2.0 para la autenticación y autorización. Para que una aplicación acceda a los datos de un usuario necesita un token de acceso, previa confirmación del usuario.
21
2. DESARROLLO APLICACIONES EN FACEBOOK 2.3 Herramientas y SDKs Sitios WebAplicaciones Aplicaciones Móviles JavaScript SDK PHP SDK Social Plugins Android SDK iOS SDK
22
1.INTRODUCCIÓN 2.DESARROLLO APLICACIONES EN FACEBOOK 3.GEOLOCALIZACIÓN Y GOOGLE MAPS 4.APLICACIÓN DEMOSTRATIVA 5.CONCLUSIONES ÍNDICE
23
3. GEOLOCALIZACIÓN Y GOOGLE MAPS ÍNDICE 3.1 Geolocalización 3.2 Métodos de geolocalización 3.3 Utilidades de Google Maps 3.4 Desarrollo sobre API Google Maps 3.1 Geolocalización 3.2 Métodos de geolocalización 3.3 Utilidades de Google Maps 3.4 Desarrollo sobre API Google Maps
24
Determina el posicionamiento de un objeto en un sistema de coordenadas. En la actualidad además de en dispositivos móviles, podemos geolocalizar un equipo a través de su navegador html5: API de geolocalización W3C 3. GEOLOCALIZACIÓN Y GOOGLE MAPS 3.1 Geolocalización
25
3. GEOLOCALIZACIÓN Y GOOGLE MAPS 3.2 Métodos de geolocalización
26
3. GEOLOCALIZACIÓN Y GOOGLE MAPS 3.2 Métodos de geolocalización Gelolocalización sin GPS: servidores de localización wifi Base de datos con información de ubicación de redes wifi, identificadas por la dirección MAC del punto de acceso (skyhook). Origen de los datos: Recorrido en coche por zonas (streetview). Auto actualización a través de cada conexión.
27
3. GEOLOCALIZACIÓN Y GOOGLE MAPS 3.2 Métodos de geolocalización Gelolocalización sin GPS: servidores de localización wifi
28
W3C Geolocation: 1. Permiso del navegador para georreferenciar Navigatior.geolocation() 2. Obtiene las coordenadas de ubicación navigator.geolocation.getCurrentPosition() 3. GEOLOCALIZACIÓN Y GOOGLE MAPS 3.2 Métodos de geolocalización
29
3. GEOLOCALIZACIÓN Y GOOGLE MAPS 3.3 Utilidades de Google Maps -Visualización y manipulación de mapas. -Superposición de marcas e información sobre los mapas. -Código libre. -Permite trabajar con coordenadas geográficas obtenidas en la geolocalización. -Forma intuitiva de representar ubicaciones.
30
MAPS JAVASCRIPT API -Librería para la visualización de mapas en páginas web. -Rápido y eficiente para su ejecución en navegadores. -Proporciona utilidades para la manipulación de mapas y para añadir contenido al mismo. 3. GEOLOCALIZACIÓN Y GOOGLE MAPS 3.4 Desarrollo sobre API Google Maps
31
MAPS JAVASCRIPT API 3. GEOLOCALIZACIÓN Y GOOGLE MAPS 3.4 Desarrollo sobre API Google Maps CARGA API EN NAVEGADOR DIBUJAR MAPA SUPERPONER MARCAS DE UBICACIÓN
32
1.INTRODUCCIÓN 2.DESARROLLO APLICACIONES EN FACEBOOK 3.GEOLOCALIZACIÓN Y GOOGLE MAPS 4.APLICACIÓN DEMOSTRATIVA 5.CONCLUSIONES ÍNDICE
33
4. APLICACIÓN DEMOSTRATIVA ÍNDICE 4.1 Objetivos y requisitos 4.2 Arquitectura del sistema 4.3 Objetos básicos 4.4 Funcionalidades 4.1 Objetivos y requisitos 4.2 Arquitectura del sistema 4.3 Objetos básicos 4.4 Funcionalidades
34
Objetivo: Desarrollo de una aplicación integrada en facebook que haga uso de la geolocalización como valor añadido utilizando las APIs y herramientas estudiadas. Requisitos: -Integración en Facebook. -Georreferenciar ubicación del usuario. -Georreferenciar amigos del usuario. -Compartir ubicación a través de facebook. -Mostrar información contenida en facebook. -Mostrar todos los datos a través de mapas. 4. APLICACIÓN DEMOSTRATIVA 4.1 Objetivos y requisitos
35
Modelo cliente / servidor: (esquema) 4. APLICACIÓN DEMOSTRATIVA 4.2 Arquitectura del sistema CLIENTE SERVIDOR
36
Checkin (Visitas): Representa una visita del usuario a una localización de Facebook Places. El usuario y la página están conectados por una relación denominada también checkin. Información contenida: -Usuarios que hacen el checkin o están etiquetados. -Nombre y geolocalización del lugar. -Aplicación con la que se hizo. 4. APLICACIÓN DEMOSTRATIVA 4.3 Objetos básicos
37
Marcas de posición: Objeto con información de geolocalización. Se muestra con un icono dibujado sobre el mapa en la ubicación que indica. Icono personalizable. Se vincula a una ventana de información extra en contenido html. 4. APLICACIÓN DEMOSTRATIVA 4.3 Objetos básicos
38
Solicitud de permisos / autenticación: Comprueba si un usuario está conectado a Facebook y conectado a la aplicación. 4. APLICACIÓN DEMOSTRATIVA 4.4 Funcionalidades FB.getLoginStatus(function(response) { if (response.authResponse) { // Está conectado, se inicia la aplicación } else { // No está logeado o conectado a la aplicación //Redirigir a inicio sesión/solicitud de permisos } }); FB.getLoginStatus(function(response) { if (response.authResponse) { // Está conectado, se inicia la aplicación } else { // No está logeado o conectado a la aplicación //Redirigir a inicio sesión/solicitud de permisos } });
39
Mi ubicación: -Obtención de la posición del usuario mediante la API de geolocallización W3C. -Añadir icono de usuario al mapa en su posición. 4. APLICACIÓN DEMOSTRATIVA 4.4 Funcionalidades if (navigator.geolocation) {// Intenta la geolocalización W3C navigator.geolocation.getCurrentPosition(function(position){ //Crear y posicionar marca de usuario}); } else if (google.gears) {//Si no, intenta mediante google gears geo.getCurrentPosition(function(position) { //Crear y posicionar marca de usuario}); } else {//No se encuentra la ubicación del usuario} if (navigator.geolocation) {// Intenta la geolocalización W3C navigator.geolocation.getCurrentPosition(function(position){ //Crear y posicionar marca de usuario}); } else if (google.gears) {//Si no, intenta mediante google gears geo.getCurrentPosition(function(position) { //Crear y posicionar marca de usuario}); } else {//No se encuentra la ubicación del usuario}
40
Compartir mi ubicación: -El usuario elige entre los sitios registrados en Facebook places más cercanos. -Crea una entrada de visita (checkin) en Facebook con el lugar seleccionado. 4. APLICACIÓN DEMOSTRATIVA 4.4 Funcionalidades function viewPlaces() { // llamada a Graph API con una búsqueda de lugares centrados en la ubicación actual FB.api('search?type=place¢er=' + initialLocation.lat() + ','+ initialLocation.lng(), function(response) { //Crear marca para cada lugar obtenido }}); } function publishCheck(placeID) { // POST a Graph API con los datos del checkin FB.api('/me/checkins', 'post', { place : placeID, coordinates : { //lat y long}}); } function viewPlaces() { // llamada a Graph API con una búsqueda de lugares centrados en la ubicación actual FB.api('search?type=place¢er=' + initialLocation.lat() + ','+ initialLocation.lng(), function(response) { //Crear marca para cada lugar obtenido }}); } function publishCheck(placeID) { // POST a Graph API con los datos del checkin FB.api('/me/checkins', 'post', { place : placeID, coordinates : { //lat y long}}); }
41
Mis amigos: -Muestra marcas de la última ubicación chequeada por cada uno de nuestros amigos. -Cada marca muestra dónde, cuándo, con quién y con qué aplicación se realizó el checkin. 4. APLICACIÓN DEMOSTRATIVA 4.4 Funcionalidades function getFriendsCheckins() { // Obtenemos el listado de amigos FB.api('me/friends', function(response) { //Para cada amigo se crea una marca en el mapa de su último checkin }); } function getFriendsCheckins() { // Obtenemos el listado de amigos FB.api('me/friends', function(response) { //Para cada amigo se crea una marca en el mapa de su último checkin }); }
42
Cercanos: -Igual que en Mis Amigos mostrando sólo las marcas más cercanas a la posición del usuario. 4. APLICACIÓN DEMOSTRATIVA 4.4 Funcionalidades //Cálculo de la distancia google.maps.geometry.spherical.computeDistanceBetween(initialLocation, posicion); //Cálculo de la distancia google.maps.geometry.spherical.computeDistanceBetween(initialLocation, posicion);
43
Historial: -Muestra marcas de todos los checkins realizados por el usuario. -Cada marca muestra dónde, cuándo, con quién y con qué aplicación se realizó el checkin. 4. APLICACIÓN DEMOSTRATIVA 4.4 Funcionalidades function getMeCheckins() { // Llamada a Graph API para obtener los checkins del usuario activo (me) FB.api('me/checkins', function(response) { //Para cada lugar se crea una marca. }; } function getMeCheckins() { // Llamada a Graph API para obtener los checkins del usuario activo (me) FB.api('me/checkins', function(response) { //Para cada lugar se crea una marca. }; }
44
Invitar: -Permite enviar solicitudes de aplicación de Facebook a los amigos seleccionados. 4. APLICACIÓN DEMOSTRATIVA 4.4 Funcionalidades function inviteFriends() { FB.ui({ method : 'apprequests', message : ‘xxx', data : ‘xxx' }); } function inviteFriends() { FB.ui({ method : 'apprequests', message : ‘xxx', data : ‘xxx' }); }
45
1.INTRODUCCIÓN 2.DESARROLLO APLICACIONES EN FACEBOOK 3.GEOLOCALIZACIÓN Y GOOGLE MAPS 4.APLICACIÓN DEMOSTRATIVA 5.CONCLUSIONES ÍNDICE
46
5. CONCLUSIONES Redes sociales -Rápida difusión de la información. -Gran “base de datos” en continua actualización. -Aplicaciones personalizadas. Desarrollo sobre APIs y utilización de SDKs. -Reducción en tiempo de desarrollo. -Continuo crecimiento de las funcionalidades ofrecidas. Geolocalización. -Crecimiento del uso de la georreferencia, extendiéndose a equipos de escritorio. -Múltiples aplicaciones personales y comerciales.
Presentaciones similares
© 2024 SlidePlayer.es Inc.
All rights reserved.