Aplicaciones Móviles Híbridas

21
Aplicaciones Móviles Híbridas 1. ¿Qué son? 2. ¿Como se hacen? 3. ¿Cuándo es buena idea desarrollar una aplicación híbrida? 4. Tips para crear aplicaciones móviles híbridas 5. Ejemplos

description

Presentación que se preparo para la conferencia dada en el Congreso Multidisciplinario en Tecnologías para la Innovación Tekhné 2014, sobre Aplicaciones móviles híbridas.

Transcript of Aplicaciones Móviles Híbridas

Page 1: Aplicaciones Móviles Híbridas

Aplicaciones Móviles Híbridas

1. ¿Qué son?

2. ¿Como se hacen?

3. ¿Cuándo es buena idea desarrollar una aplicación híbrida?

4. Tips para crear aplicaciones móviles híbridas

5. Ejemplos

Page 2: Aplicaciones Móviles Híbridas

¿Qué son las Aplicaciones móviles Híbridas?

• Son aplicaciones que se ejecutan en dispositivos y sistemas operativos móviles (Android, iOS, Windows Phone etc.)

• Son creadas con tecnologías Web: HTML5, JavaScript y CSS

• Se ejecutan sobre un contendor nativo utilizando el motor de un navegador móvil para procesar el HTML, JS y CSS de manera local (WebView)

• Tienen una capa intermedia que habilita el acceso a capacidades nativas del sistema operativo en el que se ejecutan, tales como el almacenamiento, acelerómetro, cámara etc.

=

Page 3: Aplicaciones Móviles Híbridas
Page 4: Aplicaciones Móviles Híbridas

Ejemplo de WebView en Android

Un WebView despliega una URL o documento Web local en el

dispositivo

Page 5: Aplicaciones Móviles Híbridas

• Las Aplicaciones Móviles híbridas NO se ejecutan en un servidor web local del dispositivo como Apache o IIS.

• Los datos que muestran y con los que interactúa el usuario pueden provenir de:• Archivos Locales (SQLlite, documentos XML etc.)• Servicios REST (Node.js, Ruby on Rails, ASP.NET WEB API)

Page 6: Aplicaciones Móviles Híbridas

Apps Híbridas vs Apps Nativas

Pros:

• No se requiere saber los lenguajes de programación nativos de cada plataforma para crearlas.

• Existen muchas herramientas que facilitan el desarrollo y generación de aplicaciones híbridas.

• Se pueden generar aplicaciones para múltiples sistemas operativos móviles relativamente rápido usando el mismo código para todos.

Contras:

• Dependiendo de la complejidad de la aplicación híbrida el desempeño de la misma puede ser malo.

• Se pueden generar dependencias sobre frameworks usados para crearlas.• Las Apps híbridas no tienen acceso a todos los API’s y recursos de los sistemas operativos.

Page 7: Aplicaciones Móviles Híbridas

¿Cómo Crear Aplicaciones Móviles Híbridas?

Existen varios Frameworks que facilitan la creación de aplicaciones híbridas por medio de herramientas como:

• Plugins para acceso a funcionalidad nativa vía JavaScript, listos para usarse• IDE’s y simuladores para pruebas de las aplicaciones en diferentes resoluciones.• Servicios de compilación en la nube, lo que evita tener que configurar ambientes de desarrollo para múltiples

plataformas.• Backend as a Service: Proveen servicios de uso común en aplicaciones móviles, tales como notificaciones PUSH o

Administración de usuarios• Asistentes para publicación de las aplicaciones en las App Stores.• Desarrollo colaborativo de apps.• ETC.

Page 8: Aplicaciones Móviles Híbridas

Apache CordovaEstos frameworks utilizan Apache Cordova, un set de API’s quepermiten acceso a funciones nativas del dispositivo desde códigoJavaScript

Page 9: Aplicaciones Móviles Híbridas
Page 10: Aplicaciones Móviles Híbridas

PhoneGap Build

Page 11: Aplicaciones Móviles Híbridas
Page 12: Aplicaciones Móviles Híbridas
Page 13: Aplicaciones Móviles Híbridas
Page 14: Aplicaciones Móviles Híbridas

Frameworks de JavaScript para Desarrollo Móvil

Page 15: Aplicaciones Móviles Híbridas

Kendo ListView Widget Kendo SplitView Widget

Page 16: Aplicaciones Móviles Híbridas

Servicios de Backend en la Nube Para Aplicaciones Móviles

• AWS Mobile Services• Telerik’s Everlive• Heroku• Buddy.com

• Notificaciones PUSH• Envío de Correo Electrónico• Procesamiento de Imágenes• Servicio de Autenticación de usuarios• Almacenamiento de Archivos• Análisis de datos• Sincronización de Archivos

Ejemplos de Proveedores

Ejemplos de Servicios

Page 17: Aplicaciones Móviles Híbridas

¿Cuándo es Buena Idea Desarrollar una Aplicación Híbrida?

• Cuando se requiere crear un proyecto relativamente rápido. Por ejemplo para validar una idea por medio de un prototipo sencillo en múltiples sistemas operativos móviles.

• Cuando se requiere utilizar conocimientos existentes vs aprender los lenguajes nativos de cada plataforma.

• Para aplicaciones que muestran pocos datos y que no requieren demasiadas animaciones.

Page 18: Aplicaciones Móviles Híbridas

Tips Para el Desarrollo De Aplicaciones Móviles Híbridas

1. Aplicaciones que presentan una gran cantidad de datos e interactúan con múltiples recursos pueden no ser un candidato ideal para ser Híbridas debido a que pueden tener un mal desempeño

2. Siempre siempre siempre prueba en dispositivos móviles reales!3. Evitar Jquery Mobile, es pesado4. Considera siempre el mantenimiento de la aplicación ante cosas como las actualizaciones del

sistema operativo o actualización de los frameworks, es particularmente importante para apps híbridas!

5. Antes de publicar tus apps en las tiendas de aplicaciones asegúrate de probarlas en los principales dispositivos del mercado. (Apple es especialmente delicado)

6. Considera todos los escenarios de una app móvil que normalmente no existen en una app web de escritorio, por ejemplo: La rotación de la pantalla, el estado de la red, el estado de los servicios de geolocalización, la capacidad de almacenamiento, el ciclo de vida de la app en el sistema operativo, la disponibilidad de sensores y cámara etc.

7. La teoría dice que el mismo código que escribes funciona para todas las plataformas, en la práctica esto no siempre es así, hay veces que se necesita hacer código particular para cada plataforma, sobre todo en apps muy complejas, de ahí la importancia del primer punto.

Page 19: Aplicaciones Móviles Híbridas

Facebook (2012) Untappd TIPWeb-IT Mobile(Appbuilder + Kendo UI Mobile + .NET)

Ejemplos de Apps Híbridas

Page 20: Aplicaciones Móviles Híbridas

Referencias

• Apache Cordova: http://cordova.apache.org/• Adobe PhoneGap: http://phonegap.com/• AWS Mobile Services: http://aws.amazon.com/mobile/• Devgirl.org (Blog con muchos recursos de desarrollo hibrido usando PhoneGap): http://devgirl.org/• Intel XDK: https://software.intel.com/en-us/html5/tools• PhoneGap Plugin Directory: build.phonegap.com/plugins• Sitio de Talento de Scio: www.scio.com.mx• Telerik AppBuilder www.telerik.com/appbuilder1• Telerik Backend Services: www.telerik.com/backend-services

Page 21: Aplicaciones Móviles Híbridas

¿Preguntas?

• Google Plus: https://plus.google.com/+DanielCalzada/• Twitter: @danielcalzada• Email: [email protected]

• Descarga esta presentación en www.danielcalzada.com/docs