Construyendo y publicando nuestra primera APP

952 views

Published on

En este webinar CARLOS ALONSO PEREZ nos permite analizar la variedad que existe en el mercado de los dispositivos móviles (telefonos, smartphones, tabletas) y como esta variedad se convierte en una complicación para los que queremos dedicarnos al mundo de las aplicaciones y/o videojuegos móviles.
Se presenta la solución: una aplicación mutiplataforma y se vera una pequeña demostración de como crear y publicar una utilizando HTML5, JS y CSS3 como únicas herramientas.

Published in: Mobile
0 Comments
4 Likes
Statistics
Notes
  • Be the first to comment

No Downloads
Views
Total views
952
On SlideShare
0
From Embeds
0
Number of Embeds
325
Actions
Shares
0
Downloads
43
Comments
0
Likes
4
Embeds 0
No embeds

No notes for slide

Construyendo y publicando nuestra primera APP

  1. 1. www.interlat.co  –  info@interlat.co  -­‐    h2p://www.facebook.com/interlat  -­‐  www.twi2er.com/interlat  -­‐  PBX:  57(1)  658  2959    -­‐  Bogotá  -­‐  Colombia     Aula  Virtual:  h2p://www.interlat.co/moodle/   Construyendo y publicando nuestra primera aplicación multiplataforma Carlos Alonso Pérez
  2. 2. www.interlat.co  –  info@interlat.co  -­‐    h2p://www.facebook.com/interlat  -­‐  www.twi2er.com/interlat  -­‐  PBX:  57(1)  658  2959    -­‐  Bogotá  -­‐  Colombia     Aula  Virtual:  h2p://www.interlat.co/moodle/   ESTE WEBINAR ES REALIZADO GRACIAS A TU NUEVO CANAL DE NEGOCIOS EN INTERNET.
  3. 3. Índice de la presentación • Planeando nuestra aplicación • Construcción • Publicación • Conclusiones @calonso
  4. 4. Planeando nuestra aplicación • Objetivos • Problemas • Soluciones • Viabilidad • Decisión final @calonso
  5. 5. Objetivo: Triunfar @calonso
  6. 6. ¿Qué hace falta para triunfar? Y ... @calonso
  7. 7. Llegar a todos los públicos @calonso
  8. 8. Problema: La fragmentación @calonso
  9. 9. Fragmentación: Sistemas Operativos. @calonso
  10. 10. Fragmentación: Tamaño de pantalla. @calonso
  11. 11. Fragmentación: Método de entrada. @calonso
  12. 12. Fragmentación: Hardware. @calonso
  13. 13. Fragmentación: Errores software. @calonso
  14. 14. Fragmentación: Conclusión Equilibrio Capacidades utilizadas Clientes Potenciales vs @calonso
  15. 15. Solución: Una única aplicación multiplataforma @calonso
  16. 16. Estudio de la solución: Tecnologías disponibles @calonso
  17. 17. HTML 5. Potencia y capacidades para tu browser Etiquetas semánticas <header>! <nav>! <section>! <article>! <figure>! <footer>! <menu>! Acceso Hardware Filesystem Sensores Almacenamiento local Funcionamiento offline Comunicaciones en tiempo real Notificaciones WebSockets Web workers Multimedia y Gráficos canvas 2D y 3D gráficos vectoriales (SVG) audio y vídeo @calonso
  18. 18. Javascript. El lenguaje de programación de la web. prototype! eval! isFunction! typeof! instanceof! Object! new Function()! Object.isPrototypeOf()! Clases y objetos! @calonso
  19. 19. CSS 3. Experiencia de usuario de última generación Selectores Tipografías personalizadas Efectos en textos Organización en columnasSemi Transparencias Colores personalizados Esquinas redondeadas Gradientes Sombras Animaciones Transformaciones @calonso
  20. 20. jQuery Mobile. Desarrollo móvil rápido y sencillo Javascript no intrusivo Plugins Máxima compatibilidad Muy ligero Ampliamente usado‘write less, do more’ Documentación @calonso
  21. 21. Viabilidad técnica SI • Geolocalización (GPS) • Reproducción multimedia • Sensores de movimiento • Almacenar datos locales • Acceso offline NO • Otros sensores • Cámara • Notificaciones • Web GL • Alto rendimiento http://mobilehtml5.org/ @calonso
  22. 22. Decisión final @calonso
  23. 23. Construyendo nuestra aplicación multiplataforma • Demo • Primeros pasos • Componentes UI • Capacidades HTML 5 • Diseño personalizado @calonso
  24. 24. http://js-interlat-demo.herokuapp.com @calonso
  25. 25. Primeros pasos. El documento @calonso
  26. 26. Primeros pasos. El viewport @calonso
  27. 27. Primeros pasos. Estructura de la aplicación @calonso
  28. 28. Componentes UI @calonso
  29. 29. Componentes UI. @calonso
  30. 30. Componentes UI @calonso
  31. 31. Componentes UI @calonso
  32. 32. @calonso
  33. 33. @calonso
  34. 34. @calonso
  35. 35. @calonso
  36. 36. Diseño personalizado. • CSS • jQuery Theme Roller @calonso
  37. 37. Publicando nuestra aplicación multiplataforma • Como aplicación nativa • Como aplicación híbrida • Como aplicación web @calonso
  38. 38. Como aplicación nativa ...   ...   @calonso
  39. 39. Como aplicación híbrida ...   ...   @calonso
  40. 40. Como aplicación web. Instalación @calonso
  41. 41. Como aplicación web. Instalación II @calonso
  42. 42. Conclusión Buena solución... ... pero no definitiva. @calonso
  43. 43. Carlos Alonso Pérez   Web Developer - OffsideGaming Site: http://mrcalonso.com Email: info@mrcalonso.com Twitter: @calonso @calonso
  44. 44. www.interlat.co  –  info@interlat.co  -­‐    h2p://www.facebook.com/interlat  -­‐  www.twi2er.com/interlat  -­‐  PBX:  57(1)  658  2959    -­‐  Bogotá  -­‐  Colombia     Aula  Virtual:  h2p://www.interlat.co/moodle/   GRACIAS. CARLOS ALONSO PÉREZ @CALONSO
  45. 45. www.interlat.co  –  info@interlat.co  -­‐    h2p://www.facebook.com/interlat  -­‐  www.twi2er.com/interlat  -­‐  PBX:  57(1)  658  2959    -­‐  Bogotá  -­‐  Colombia     Aula  Virtual:  h2p://www.interlat.co/moodle/   SINTONIZA INTERLAT.TV PARA PRÓXIMAS EMISIONES…

×