Widgets

Widgets. Mini aplicaciones con maxipotencial Modulo 2. Aplicaciones Web Por: David Ricardo Cázares Mejía Movilweb sistemas. http://movilweb.com.mx Widgets. Mini aplicaciones con maxipotencial Taller teórico – práctico en Desarrollo de Aplicaciones Móviles http://widgets.com.mx Todos los derechos reservados 2010 Movilweb Sistemas. Taller teórico – práctico en Desarrollo de Aplicaciones Móviles. México 2010. Informes: +5255 36.24.40.93 movilweb.mx@gmail.com , info@movilweb.com.mx

¿Que es un Widget? Mas allá de un nombre curioso... Un Widget es una mini aplicación móvil que reside o no en la memoria del dispositivo, tiene una función sumamente específica, principalmente información o entretenimiento y que además cuenta con las siguientes características: 1.- El usuario no distingue un Widget de una aplicación propia del dispositivo (almenos no el usuario promedio) 2.- Generalmente son instalados en base al gusto y selección del usuario (fomenta fidelidad a la marca o concepto de la aplicación, ya que es adoptada por el target específico al que busca llegar la marca o empresa. 3.- “Pesa poco” y generalmente son descargados de sitios especializados en contenidos para dispositivos móviles conocidos como AppStores o Marketplaces. (en menor número son precargadas en el equipo por el fabricante o carrier). 4.- Al ser aplicaciones estandarizadas son relativamente facil de migrar entre plataformas. http://widgets.com.mx

Lo que NO es un Widget Un mundo de variantes, prepara tus aspirinas No es un sitio wap propiamente*, es una aplicación empaquetada que se ejecutada o lanzada desde el menú del dispositivo (el usuario no ingresa al browser, sino al menu de aplicaciones para hacer click en un icono), y es posible que resida total o parcialmente en un servidor Web, lo cual no es percibido por el usuario, salvo cuando el teléfono muestra mensajes para aceptar la conexión a internet y/o alertas de seguridad. No es una aplicación compleja, por el contrario, un Widget sencillo y amigable es mucho mas deseable que uno saturado de información, complicado y poco intuitivo. No es una aplicación que deba requerir de manuales ni capacitación de usuario. Widget no es una marca comercial, sistema operativo o lenguaje de programación. (Es la evolución del termino Gadget anteponiendole Wi de wireless) No es universal (no confundir con estandarizado), cada fabricante de equipos incluye funcionalidad propia a sus widgets (APIs), por lo que el Widget se adapta a cada plataforma (esta adaptacion no es automática, la realiza el programador), por lo que pueden existir multiples versiones del mismo widget, por ejemplo: uno para Nokia, otro para LG, Samsung, Qualcomm Plaza mobile, Opera, etc. * Aunque se basan en las mismas tecnologías. http://widgets.com.mx

¿Donde está el negocio? Ecuación de oro: Usuario = Proveedor de audiencia Un widget se mide en su valor absoluto (aplicación con costo) o bien por la cantidad de descargas – accesos (valor relativo), osea: En impactos, clicks, inicio de sesiones ó número de usuarios si se trata de un widget de modalidad social, etc, etc. Es decir que se trata de un “concurso de popularidad” donde el valor de una aplicación es medido básicamente por sus descargas, accesos, reingresos, permanencia, e indicadores socioeconómicos del usuario (país, región, grupo étnico, nse, género, edad, etc.). dicho lo anterior el negocio de desarrollar un widget está en: 1) Venderlo (si el contenido es sumamente especializado o exclusivo). 2) Incluir publicidad (Adversiting). 3) Patrocinio y posicionemiento de marca (Mobile Branding). 4) Combinación de todas o algunas de las anteriores. Es en este punto donde debe analizarse cuidadosamente el o los medios para dar difusión al Widget, principalmente la selección de las AppStores (ver tema relacionado a la publicación de contenido). http://widgets.com.mx

¿Que busca un Widget? La belleza de las cosas simples... Un widget busca principalmente: Ser un vínculo íntimo entre marca – usuario. El teléfono celular es un objeto personal, por lo tanto el software que contiene también proyecta la personalidad del usuario (es decir que “vestimos” a nuestro teléfono móvil a nuestra propia imagen y semejanza). Crear hábitos en el usuario a partir de la utilidad del contenido. (mientras más útil y/o divertido es un widget es más usado, y mientras más se usa se crea una fuerte necesidad de tenerlo, actualizarlo y recomendarlo). Fomenta un canal de comunicación interactiva entre el usuario y la marca. Crea un nuevo medio para medir la aceptación de una marca o concepto en base al número de descargas, accesos, reingresos, hora y lugar de acceso, etc. Logra que una marca tenga presencia en todo momento y lugar. (Recordemos que un widget cuenta con audiencia sumamente segmentada). http://widgets.com.mx

¿Que contiene un Widget? No puedes dar gusto a todo mundo... Todos los Widgets móviles para cualquier plataforma pueden mostrar: 1) Texto con formato. 2) Imágenes (jpg, png, etc). 3) Links de descargas (contenido gratuito o premium). 4) Funciones “click to call”, “click to mail”, “click to sms”. 5) Scripts (JavaScript - Ajax) del lado cliente*. (En modelos touch se maneja el término “tap” en lugar de “click”) De acuerdo a la marca y modelo pueden o no mostrar: 1) Información de geolocalización. 2) Contenido embebido (por ejemplo. Video de Youtube en reproductor Flash). 3) Administración de contactos. 4) Administración de agenda. 5) Administración de archivos. 6) Transición de pantallas y efectos gráficos. 7) Creación y manejo de datos persistentes. Existen Frameworks adaptados a cada plataforma http://widgets.com.mx

Navegador vs Plataforma La guerra por crear contenido... Dado el enorme crecimiento en el mercado de teléfonos inteligentes que se manifiesta a nivel global los desarrolladores de sistemas operativos así como las empresas de tecnología integradora, han abierto sus plataformas para poder facilitar al desarrollador de aplicaciones la creación de contenido específico para cada dispositivo a fin de dar valor agregado a los equipos, además claro, de aprovechar la creciente aceptación por la descarga de contenido a través de AppStores, en donde curiosamente quien hace el trabajo de crear las aplicaciones aveces es quien menos gana en este nuevo ecosistema tecnológico (y su correspondiente modelo de negocio). Es por esto que actualmente contamos con contenido WAP adaptado para las capacidades gráficas y de procesarimento de dispositivos móviles accesible mediante el browser integrado en el sistema operativo (WRT, Opera, etc) y por aplicaciones Widget que no requieren que el usuario acceda al navegador ni tenga que ingresar dirección alguna para visualizar el contenido, tal vez para un usuario experto en tecnología no represente mayor problema ingresar una URL, mas no así para el usuario promedio. Aunque en esecia una página WAP y un Widget puedan ser técnicamente iguales, la forma en que el usuario accede a la información es completamente determinante en el éxito del proyecto. Y es en este último punto donde los fabricantes han iniciado una guerra para “reclutar” programadores (Publishers como le llaman algunos) que desarrollen contenido que favorezca a sus correspondientes marcas. http://widgets.com.mx

Tecnologías Optimizar ante todo... (Snippets disponibles en sesión práctica) Teoricamente los Widgets se basan en estándares bien definidos (http://www.w3.org/TR/widgets/). Sin embargo durante la práctica vemos que es necesario adaptar el contenido para cada plataforma. No obstante existen al menos tres estándares técnicos que podemos emplear sin mayores modificaciones para la creación de un Widget: XHTML Basic. Aunque es aceptado HTML es recomendable ser estrictos en la sintaxis para ayudar al navegador a interpretar nuestra aplicación y por consiguiente lograr un mejor rendimiento. CSS. Hay que estudiar cuidadosamente que características de estilo admite la plataforma de ejecución de nuestro Widget para evitar código paja que no será aplicado, logrando así un código más limpio y rápido. JavaScript. Hay que tener mucho cuidado al implementar código del lado cliente, en primer lugar para no revasar los límites de funciones y variables admitidos por cada plataforma y en segundo lugar para logar código mas ligero, es muy recomendable que todas las validaciones de formularios, cálculos y funciones residan del lado servidor (revisar apartado de PHP Aplicado en Aplicaciones Móviles). Código ligero (Sin comentarios*, optimizado y validado). Código útil (Solo funciones y estilos que realmente sean usados). Código reusable (Rutinas y estilos bien diferenciados para nuevas aplicaciones) http://widgets.com.mx

Tecnologías Todo mundo habla de Ajax. (Snippets disponibles en sesión práctica) Ajax (Asynchronous JavaScript And XML) se define como el conjunto de tecnologías que emplean la espacificación XMLHttpRequest propia del navegador para proporcionar funcionalidad adicional en la transferencia de datos entre el cliente y el servidor, particularmente basadas en respuestas asincrónicas. Existen numerosos Frameworks basados en esta especificación, sin embargo NO son universalmente soportados, es así que podemos tener entornos de trabajo soportados a la perfección por iPhone (iWebKit, iui y jqTouch por mecionar algunos), pero que en otras plataformas muestran numerosos errores (lo mismo sucede con Guarana para Nokia S60). Por lo tanto el uso de Frameworks basados en Ajax es recomendable solo cuando nuestra aplicación será específica para algun dispositivo o familia de dispositivos. Para lograr funcionalidad asincronica óptima para todos los navegadores que soportan Ajax lo mejor es escribir nuestras propias funciones básicas y reutilizarlas sin mayor modificación: El autor de esta ponencia recomienda por lo menos contemplar: 1) Función para cargar/actualizar contenido en DIVs. 2) Función para enviar formularios. 3) Función para leer contenido XML (RSS). http://widgets.com.mx

Herramientas Optimiza costos, usa freeware... Edición de código fuente Notepad ++. http://filezilla-project.org/ Cliente FTP FileZilla. http://filezilla-project.org/ Servidor Web local para pruebas Apache (XAMPP) http://www.apachefriends.org/es/xampp.html Emuladores y navegadores Phonegap Simulator Opera mobile Simbian SDK Simulator (Necesario registrarse en Forum Nokia ) Es recomendable hacer pruebas en equipos reales. Validación de Código http://validator.w3.org/check?uri=http://tuaplicacion.com El uso de entornos integrados de desarrollo es elección de dada desarrollador, solo hay que tomar en Cuenta que: Muchas veces se agregan comentarios y rutinas sin previa consulta. Generalmente se basan en “templates” específicos para algún dispositivo. Un ejemplo de un buen IDE es http://www.aptana.com/ http://widgets.com.mx

Appstores El que no enseña no vende... Entre los principales AppStores para distribuir Widgets a nivel regional (AL) OVI (Nokia) Web: https://publish.ovi.com Características: Presencia global, respaldo del fabricante de dispositivos móviles #1 Costo: 90 USD / Año Tipo de contenido: JAR, SIS, SISX, WGZ (Widget para Nokia S60 3aEd o superior). GetJar Web: https://developer.getjar.com/publishing/allApps/ Costo: Gratuito Tipo de contenido: URL*, WGZ (Widget Nokia) Qualcomm Plaza Mobile (ideas widgets) Web: http://telcelmx-web.qualcomm.com/ Características: Presencia en América Latina a traves de Telcel y Claro (Ambas de América Móvil) Costo: Gratuito Tipo de contenido: ZIP (La aplicacion web compila el contenido) * Esta característica es revisada en el capítulo dedicado a GetJar. http://widgets.com.mx

Los gigantes y sus pequeños Revisión global de compañias que han integrado Widgets a su oferta tecnológica. Nokia Nombre: Widgets Información: http://www.nokia-latinoamerica.com/soporte/aprende-como/widgets Qualcomm Plaza Mobile (ideas widgets) Nombre: Widgets Información: http://plaza-global.qualcomm.com Yahoo Nombre: Yahoo Widgets Información: http://widgets.yahoo.com/ Opera Nombre: Opera Widgets Información: http://widgets.opera.com/ Apple Nombre: Apple WebApps Información: http://www.apple.com/webapps/ * * Aunque no es propiamente un Widget, es el único recurso disponible para que los desarrolladores de aplicaciones web accedan a esa plataforma sin hacer uso de desarrollo de aplicaciones nativas. http://widgets.com.mx

Los gigantes y sus pequeños Revisión global de compañias que han integrado Widgets a su oferta tecnológica (2). Palm Nombre: Widgets Información: http://developer.palm.com/index.php?option=com_content&view=article&id=1553&Itemid=44 Blackberry Nombre: Blackberry Widget Información: http://na.blackberry.com/eng/developers/browserdev/widgetsdk.jsp Android Nombre: Android Widgets Información: http://developer.android.com/guide/practices/ui_guidelines/widget_design.html LG Nombre: Widgets Información: http://developer.lgmobile.com/lge.mdn.tnd.RetrieveTopicWidget.dev?objectType=P SAMSUNG Nombre: Widgets Información: http://innovator.samsungmobile.com/platform.main.do?platformId=12 http://widgets.com.mx

Widgets

by Movilweb sistemas on Oct 06, 2010

Accessibility

Categories

Tags

Upload Details

Usage Rights

Statistics

Widgets — Presentation Transcript