• Save
Touch, gestures y acelerómetro con JavaScript en ipad
Upcoming SlideShare
Loading in...5
×

Like this? Share it with your network

Share

Touch, gestures y acelerómetro con JavaScript en ipad

  • 2,319 views
Uploaded on

Esta plática fué impartida por Paco Cuevas durante el evento Software Guru Conference and Expo 2011, donde se explica la forma de tomar ventaja de los sensores en un iPad a través de JavaScript......

Esta plática fué impartida por Paco Cuevas durante el evento Software Guru Conference and Expo 2011, donde se explica la forma de tomar ventaja de los sensores en un iPad a través de JavaScript para Web Apps.

More in: Technology
  • Full Name Full Name Comment goes here.
    Are you sure you want to
    Your message goes here
    Be the first to comment
No Downloads

Views

Total Views
2,319
On Slideshare
2,311
From Embeds
8
Number of Embeds
2

Actions

Shares
Downloads
0
Comments
0
Likes
3

Embeds 8

http://www.sg.com.mx 7
http://www.linkedin.com 1

Report content

Flagged as inappropriate Flag as inappropriate
Flag as inappropriate

Select your reason for flagging this presentation as inappropriate.

Cancel
    No notes for slide

Transcript

  • 1. Touch, Gestures, ´y Acelerometro conJavaScript paraaplicaciones web en iPad@@pacocuevas
  • 2. ´ ´Que aprenderan en 50 mins ? cuál es la justificación para apostar en las web app´s que necesito saber y que herramientas tener para desarrollar mi primer gran web app conocer los detalles de web app´s en iPhone y iPad Multi-touch, Gestures, GPS, Acelerómetro todo con HTML5, CSS3 y JavaScript
  • 3. No pierdas degenerado ´vistapor smarthphones web el trafico
  • 4. el número debúsquedas localesesta creciendoexponencialmente ! a un ritmo de 50% anual Desktop Mobile 50% 50% la mitad de las conexiones a internet son realizadas desde móviles
  • 5. Web App´sfuente (Sept 2011): StatCounter.com
  • 6. Mobile Page Views vs Desktop Page ViewsPrincipales taréas que serealizan en un smarthphone
  • 7. No te quedes en ´busqueda delsanto grial...codifica una vez y crea apps paratodos los dispositivos ??
  • 8. CORONAPhoneGapTitaniumSencha
  • 9. “ al día de hoy la mejor plataformapara codificar aplicaciones móviles es... la que conocemos. ” -el práctico
  • 10. Analicemos a detallealgunos aspectos relevantesde las Web Apps
  • 11. INMERSIÓN INMEDIATAno se trata de engañar al usuario haciendolo creer que es una aplicación nativa
  • 12. CONSIDERAR DOS VISTAS portrait y landscape
  • 13. EXISTE UN WEB APP STOREel modelo de negocio no queda en manos de Apple $
  • 14. GO BACK & GO FORWARD “basadas en historial de navegación”
  • 15. WEB APPS O APPS HIBRIDAS en realidad se necesita un marketplace ?
  • 16. LOS GRANDES CONFIANYouTube, Google, Nike, Twitter, Amazon, Netflix, etc.
  • 17. Touch y Gesturescon JavaScriptpara iPad
  • 18. pero si ya tengo instaladoJavaScript ?
  • 19. Touch y Gestures-Tap, Touch, Swipe, Pan, Pinch, Flick, Spreadaquí en México-picale-pellizcale pa´adentro-avientale-tócale y arrastralo(...nos son albures)
  • 20. Demo:Touch, Gestures y Acelerómetrocon Java Script
  • 21. JavaScript Touch Event Model touchstart El dedo hace contacto en la pantalla touchmove El dedo se mueve en la pantalla touchend El dedo es retirado de la pantalla touchcancel El contacto ha sido interrumpido
  • 22. TouchEvent Objecttres dedos en contactoelement.addEventListener(‘touchstart’, handleTouchStart, false);function handleTouchStart(touchEvent) { ...TouchEvent Touch (contacto) TouchList touches TouchList changedTouches TouchList targetTouches
  • 23. Touch Objectuno para cada dedoTouch unsigned long identi er EventTarget target Long screenX Long screenY Long pageX Long pageY
  • 24. Touch Objectubicando el objetoTouch unsigned long identi er EventTarget target screenX Long screenX screenY Long screenY Long pageX Long pageY
  • 25. pageXpageY
  • 26. Usos del Touch Object- crear gestures a la medida- rastrear múltiples dedos- utilizar GestureEvent (pinch / zoom / rotate) float scale float rotation- deshabilitar comportamientospor defaultevent.preventDefault();- cancelar eventos (handler) touchcancel
  • 27. ´GPS y Acelerometrocon JavaScriptpara iPad
  • 28. Usos del Shake!
  • 29. Recapitulando desarrolla Web Apps tomando ventaja de una UX con eventos touch y gestures agrega contexto geográfico a las funcionalidades incorpora detección de movimiento para más interactividad continua confiando en los estándares (HTML5, CSS3, JavaScript)
  • 30. Gracias!te esperamos en nuestrostand para sortear tarjetasdel App Store.@@pacocuevas
  • 31. @@AppStudiosMX