jueves, septiembre 17, 2009

GeneXus y iPhone


En el evento se mencionó timidamente la palabra iPhone en alguna charla, pero más que nada como caso particular de los "smartphones" en general.
Una aplicación iPhone es lo que está de moda, es lo que todo el mundo quiere hacer y es lo que muchos se preguntan cómo hacer.

Una aplicación iPhone puede ser de 2 tipos (ambos son aceptados en el Apple Store o en Cydia). Puede ser una aplicación nativa desarrollada en Objective-C o puede ser una aplicación web (webapp) que respete una serie de recomendaciones de Apple.

Si queremos desarrollar una aplicación nativa, necesitamos una máquina donde podamos correr el sistema operativo MacOS y utilizar el editor XCode que se instala con el iPhone SDK. Necesitamos además aprender a programar en Objective-C. La ventaja de una aplicación nativa es que tenemos acceso a todas las funcionalidades y features del teléfono, como por ejemplo la cámara, el acelerómetro, los contactos, etc.

Si queremos desarrollar una aplicación web, tenemos varias opciones.

1) Desarrollar una aplicación utilizando el Dashcode (iPhone SDK y MacOS) que nos brinda varios templates y una libreria de controles que podemos poner en la pantalla mediante drag&drop. Consumimos webservices para la comunicación con el server.

2) Desarrollar una aplicación web como lo hacemos habitualmente, utilizando html, css y javascript y ejecutar la misma en el browser del teléfono.

3) Idem al punto 2, pero luego embeber esta aplicación en una "cáscara" de aplicación nativa de iPhone utilizando el XCode en MacOS. Esto lo que hace es ejecutar un browser dentro de una aplicación nativa de tal forma que no te das cuenta que es web.

Dado este entorno, y si tuviera que hacer una aplicación iPhone, no elegiría hacer una aplicación nativa ya que no veo conveniente hacer algo que corra solo en una plataforma (además de aprender Objective-C para terminar haciendo simplemente altas, bajas y modificaciones en una base de datos).
Asi que iría por el lado de las aplicaciones web.

El punto 1 lo probé, me pareció muy piola sobre todo porque ya te resuelve todo el tema de las "animaciones" y "transiciones" tan bonitas que tiene el iPhone para pasar de una pagina a otra o para hacer efectos. Es simplemente decirle como hacer la transicion (similar a elegir un efecto en Power Point). En cuanto al código, lo bueno es que solo hay que saber javascript, por lo que podes hacer request ajax para comunicarte con el server y ejecutar procedures main HTTP o webservices de gx.

El punto 2 es el más sencillo de todos.
Ojo que no es solo hacer la pantalla más chiquita para que entre en el iPhone, es bastante más. Hay que repensar tu aplicación para que en cada pantalla puedas resolver las acciones utilizando solo 1 o 2 botones y tiene que ser altamente customizable (es decir, prendé fuego las tablas y utilizá solo divs y muchisimo css).
Me quedo con la ppt de Gastón Milano de "Los 3 fantásticos" son fundamentales para una aplicación web... html, css, javascript.
Lo ideal sería escribir a mano en procedures main HTTP el código html (evita tener que bajar el gxgral.js y el dojo.js que son muy pesados y si los usuarios que usan la aplicación son "one-time users" y no tienen cacheado estos javascripts, se aburren y cierran el browser antes de que cargue la aplicación) y no utilizar webpanels y menos transacciones, pero esa es una decisión de cada uno. (Hay que tener en cuenta que el tráfico en kbs y la cantidad de requests es crítica para que la aplicacion funcione correctamente).
Es necesario utilizar alguna libreria javascript que te permita emular las transiciones y animaciones, jQuery es suficiente, sin embargo hay librerias especializadas y pensadas para el browser del iPhone (PhoneGap, UIWebkit, etc).
(En un post futuro haremos una evaluación de PhoneGap que es muy poderosa ya que utiliza bibliotecas compiladas en Objective-C para poder acceder a features del iPhone mediante javascript... aunque el Apple Store no está aprobando las aplicaciones que utilizan este framework).

El punto 3 es el más atractivo para mi. Todo lo que hiciste para terminar tu aplicación en el punto 2, ahora lo podes poner facilmente en una cáscara de aplicación nativa y ver tu webapp "transformada" en una iPhone Application. Lo que se debe tener en cuenta es que no se puede abrir otra ventana del browser, asi que si tienen algun "target=_blank" por ahi, hay que sacarlo.

Qué otra ventaja tiene hacer tu aplicación web y no nativa... que esa misma aplicación si la pensaste bien, funciona en cualquier browser de cualquier teléfono móvil, y solo necesitas cambiar el css de la misma.

Ahora bien, mucho teórico y nada de práctica.... estas son unas screenshots de una aplicación generada con genexus y con mucho javascript para que la experiencia de navegación del usuario no sea diferente a la que tendría si fuese una aplicación nativa (cosa que no se verá en las fotos, pero espero poder hacer un video de como se ve en el telefono realmente). Esta aplicación está embebida en una aplicación nativa iPhone como mencionamos en el paso 3.

La aplicación sirve para organizar eventos, los invitados pueden confirmar su participación via email, via sms, via web... y ahora via iPhone. Se pueden subir fotos del evento y se pueden realizar comentarios.



En el siguiente post, si hay interés, les contamos cómo es la odisea de la publicación de una aplicación en el Apple Store... y sin ir mas lejos, cómo tenes que hacer para poder instalar tu aplicación en tu teléfono y los de tus amigos para poder testear el desarrollo.

También explicaremos como hacer el paso 3 que mencionabamos antes y poder transformar tu aplicación web en una aplicacion nativa iPhone en unos pocos y simples pasos.


Si te sirvió el tutorial, regalanos una cerveza!!





9 comments:

Leo dijo...

Muy bueno el post y el blog en general.
Estaría bueno si podés seguir con este tema y explicar un poco más como hacer esto en Genexus.
Saludos
Leo

Marcos Crispino dijo...

Muy bueno, esperamos el siguiente con los tips...

¿De verdad hiciste la aplicación de las fotos en GeneXus?

Fabi dijo...

Gracias Marcos.
Si, genexus X, generador .net y jQuery.
Esta aplicación tiene además la parte Web para los browsers no móbiles por decirlo de alguna forma, está publicada en una maquina en mi casa donde hago los tests, pero me da verguenza la velocidad del adsl :) como para pasarles el link.

Cuando mejore un poco el tema del server de publicación, estaría bueno si alguno se prende al beta test :)

Una cosa que laburamos bastante es el tema del prechache, el cache en background y la optimización en general de la aplicación siguiendo las 15 rules de Yahoo... pero eso da para otro post entero.
Se mejoró mucho la performance.

Javier dijo...

Muy pero muy bueno!
Por lo menos algo diferente hecho con Genexus.
Me gustaría saber como lo hiciste, si se puede saber claro.

Javier

Enrique Almeida dijo...

Me gusto mucho la pantallas de la aplicacion y esta muy bueno que compartas las experiencia del desarrollo y de su deployment. Lidiar con iTunes no debe ser nada trivial.

Felicitaciones!

Diego dijo...

Bueno un poco tarde, pero como dice el dicho mas vale tarde que nunca.

Tu post es muy buena, me parece genial que existan aplicaciones GeneXus para dispositivos como el Iphone, creo que abre un gran abanico de posibilidades a los desarrolladores GeneXus ya que podes salir de los sistemas tradicionales y meterte en el mundo mobile.
Creo que solo con el Generador .Net Mobile ya no es suficiente y es necesario tener posibilidad de salir a Iphone y en un futuro a Android.

Muchas gracias,
Un saludo,
Diedo.

P.D: seria bueno que publicaras un post de como desarrollaste la aplicación, así podemos copiar ideas.

Fabi dijo...

Nunca es tarde!!
Muchas gracias.

La verdad hace mucho que no publico nada e hice unos cuantos avances en cuanto a poder hacer una aplicacion iPhone sin mucho esfuerzo.

En cuanto tenga un tiempo, comento los tips y el codigo.

saludos

enniorlando dijo...

quien es waldenei????

Fabi dijo...

Hola. No es un "quien"... somos varios los que escribimos en este blog (o al menos solíamos hacerlo).