Symbian Belle, mismo teléfono, nueva experiencia

February 7th, 2012

Hoy 7 de Febrero comenzó el deployment mundial de Symbian Belle, yo vengo usando Belle desde la primera versión que se filtro hace ya unos meses y puedo dar fe de que el cambio es grande y para mejor, pero el motivo de este post no es hablar sobre las mejoras que trae Belle, sino dejarles una lista de recursos que les van a servir a la hora de comenzar a adaptar o crear una nueva aplicación que aproveche el nuevo paradigma que propone Belle.

Diseño

En los siguientes links van a poder encontrar las guiás de diseño para Symbian Belle las cuales les van a permitir conocer los nuevos componentes y patrones que forman parte de la UI y como y donde utilizarlos, también encontraran información sobre la nueva iconografía y templates que les permitirán crear los iconos de sus aplicaciones con la seguridad de seguir al pie de la letra las recomendaciones del equipo de diseño de Nokia.

Desarrollo

La mejor forma de que nuestras aplicaciones se adapten completamente al nuevo estilo y a los nuevos patrones de interacción que trae Belle es usando Qt en conjunto con Qt Components, en la siguiente lista de recursos encontraran, documentación, guiás de publicación, presentaciones y webinars que les permitirán ahondar en este tema.

  • Changes in Symbian Belle and Qt 4.7.4
  • Optimize your apps for Nokia Belle
  • Update your Apps for Nokia Belle
  • Introduction to the Qt Quick Components
  • Qt Quick Components for Designers
  • Qt Quick Components Deep Dive
  • Getting your Qt app running and deployed on Symbian
  • Qt Components for MeeGo and Symbian Phones
  • Announcements, User Interface , , , , 1 response

    Gaia, la UI de Boot to Gecko (B2G)

    January 29th, 2012

    Gaia, es la UI de Boot to Gecko, decir que esta en un estado de alpha seria algo muy optimista, Gaia mas que nada esta en un estado experimental, en donde se están probando y aplicando las mejoras que van apareciendo en WebAPI, así que tanto en lo visual como en lo estructural todo puede cambiar en mayor o menor medida.

    En Gaia todo es una WebApp y la primera de las WebApps que vemos es la Homescreen (ver imagen debajo), la Homescreen usa window.navigator.mozApps para encontrar todas las WebApps instaladas y mostrar su correspondiente icono en la Homescreen, esto es en la teoría, actualmente el listado de apps que se ven en la Homescreen esta hardcodeado en el archivo ${GAIA}/apps/homescreen/webapi+apps.js, como dije al principio Gaia es una PoC (prueba de concepto) bastante experimental, por lo que en esta etapa del proyecto es posible encontrar cosas como estas.

    B2G Lockscreen, Homescreen and Dialer
    B2G Lockscreen, Homescreen y Dialer

    El resto de las aplicaciones están en un nivel muy básico de desarrollo, algunas están mas avanzadas y son mas funcionales que otras, por ejemplo ya es posible enviar SMSs usando B2G siempre y cuando lo estemos corriendo en un dispositivo, otra app que por obvias razones esta muy avanzada es el Browser, el resto de las apps están en sus comienzos, por lo que habrá que esperar para ver su evolución.

    B2G Browser
    B2G Browser

    Instalando Gaia

    Podemos probar Gaia, flasehando una imagen de B2G en un dispositivo (Samsung Galaxy S2, Nexus S) he instalando Gaia encima, otra opción es hacer lo mismo pero corriendo todo en el emulador que trae el SDK de Android y por ultimo podemos correrlo dentro de un browser, esta ultima opción es la que escogí yo, el proceso para compilar Gaia, esta muy bien explicado en la Wiki de Mozilla, antes de comenzar con el proceso de compilación es recomendable chequear que cumplimos con todos lo pre requisitos necesarios para compilar Firefox, la información esta disponible para varias distros en Mozilla Developer Network, presten especial atención a Autoconf ya que Mozilla usa la versión 2.13 de Autoconf para las tareas de compilación y la mayoría de las distros viene con una versiones mas actualizada, por lo que casi con seguridad van a tener que hacer un downgrade.

    Web Apps en Gaia

    El modelo de desarrollo de apps para B2G se basa en estándares Web, usando HTML, CSS y JavaScript, si han creado una aplicación Web usando solo estas tecnologías el proceso de portarlas a B2G es algo trivial, ademas se esta trabajando en un conjunto de APIs para poder acceder a funciones “nativas” de los dispositivos y extender su funcionalidad, en la siguiente tabla pueden ver un listado de estas APIs.

    Aplicación API
    Dialer Telephony & Messaging API, Contacts API
    Battery Battery API
    Address Book Contacts API
    SMS Telephony & Messaging API, Contacts API
    Camera Camera API, Filesystem API
    Gallery Filesystem API
    Settings Device Status API, Settings API
    Games Accelerometer API, Mouse Lock API, Vibration API
    Maps Geolocation API, Contacts API

    Estructura de una WebApp

    En el siguiente esquema pueden ver como esta organizada una pequeña WebApp, la estructura es la misma que utilizan las apps que viene precargadas con Gaia, así que estimo sera la que ellos recomendaran en un futuro, si lo desean pueden organizar los archivos de la manera que les parezca mas cómoda lo único que si o si tiene que estar presente en la WebApp es el archivo manifest.appcache.

    paulo@kendra ~/repos/gaia/apps/subtego $ tree
    .
    ├── js
    │   ├── jlinq.js
    │   ├── lines.js
    │   └── stations.js
    ├── manifest.appcache
    ├── manifest.webapp
    ├── style
    │   ├── icons
    │   │   └── SubteGo.png
    │   ├── images
    │   │   ├── a.png
    │   │   ├── b.png
    │   │   ├── c.png
    │   │   ├── d.png
    │   │   ├── e.png
    │   │   ├── h.png
    │   │   ├── h.png
    ... ... ... ...
    │   │   └── pin.png
    │   └── ui.css
    └── subtego.html
    
    manifest.webapp

    Este archivo describe la WebApp, el nombre y el icono que se verá en la Homescreen como así también el archivo de inicio de la WebApp.

    {
      "name": "SubteGo",
      "description": "SubteGo for Gaia",
      "launch_path": "/subtego.html",
      "developer": {
        "name": "realnorth",
        "url": "http://realnorth.net"
      },
      "icons": {
        "120": "/icons/SubteGo.png"
      }
    }
    

    Si siguen estos simples pasos y usan estándares web, migrar o crear una aplicación “compatible” con B2G sera una tarea simple, si tienen dudas o quieren ahondar mas en el tema pueden aprender mucho mas viendo el código de las WebApps que se incluyen en Gaia o consultar directamente el código de una WebApp haciendo uso de la función “View Page Source” (ver primera imagen debajo) que se incluye en varias apps en Gaia.

    B2G "View Source" function and SubteGo
    B2G, función “View Page Source”

    Development, User Interface , , No response

    Tizen, pasado, presente y futuro

    January 18th, 2012

    Desde el día de la liberación de parte del código de Tizen hasta hoy ha habido gran actividad en torno a el, anuncios de fusión con bada, retractaciones, especulación y opiniones, muchas de ellas sin fundamento, una de las cosas que mas se repite es que Tizen es el sucesor de MeeGo, pero esto no es así, ni en código, ni en ideas, el único que podría tomar para si el titulo de sucesor de MeeGo es Mer Project, otro punto que se repite hasta el cansansio es que Tizen es un proyecto nuevo, esto tampoco es así, Tizen es el punto culmine de años de trabajo de Samsung, junto a los otros socios de la LiMo Foundation primero y de la Tizen Association ahora.

    Pasado

    La historia de Tizen comienza a principios de 2007 con la creación de la LiMo Foundation (ahora Tizen Association), esta fundación esta formada por varios fabricantes japoneses, algunos operadores europeos, Samsung y Vodafone entre otros, los socios de la ex LiMo Foundation produjeron mas de 50 dispositivos, la mayoría de ellos nunca salio del mercado japones, a excepción de los modelos que Samsung produjo para Vodafone (Vodafone 360 H1, Vodafone 360 M1).

    Samsung Vodafone 360 M1
    Samsung Vodafone 360 M1

    Estos dispositivos estaban pensados para integrarse con el servicio Vodafone 360 (App Store, Sincronización, Mensajería, entre otros), estos dispositivos usan la versión 2 de la Samsung Linux Platform (compatible con LiMo Release 2) y por encima una UI bastante llamativa e interactiva (aunque en algunos caso no muy funcional) desarrollada con EFL (ver video a continuación)

    Como ven las piezas empiezan a encajar y mucho mas aun si le dan una vista al código liberado de Tizen, que de MeeGo solo usa algo del stack de comunicaciones, el resto es una versión actualizada de la Samsung Linux Platform, lo mismo pasa con el SDK de Tizen, que casi con seguridad se baso o al menos tomo muchas ideas del LiMo BONDI SDK, que, oh casualidad esta optimizado para la creación de Web Apps, al igual que Tizen.

    Presente

    bada, es otra pieza del rompecabezas que posiblemente encuentre su lugar y su razón de ser, si la unión con Tizen se realiza, bada per se no es un OS, según Samsung, bada es una plataforma cuya arquitectura permite usar diferentes kernels, el primer dispositivo bada fue el Samsung S8500 Wave, este usa un kernel RTOS propietario, de este kernel dada la naturaleza cerrada del código de bada poco se sabe.

    El porque Samsung decidió desarrollar toda una nueva plataforma (OS) en vez de usar directamente Samsung Linux Platform, es un misterio, lo que no era ningún misterio eran las intenciones de Samsung de abrir el código de bada, el rumor comenzó a tomar forma a fines del año pasado y al fin puede hacerse realidad si la decisión de integrar bada con Tizen se concreta, ¿en que consistiría esta integración?, la información acerca de este punto es casi nula, lo que si se sabe de forma no oficial es que las aplicaciones bada correrán en Tizen, pero antes deberán recompilarse, Tizen va a soportar las APIs usadas por bada, las que serán agregadas como si se tratase de un toolkit mas, aun falta ver que tan bien se integraran y que grado de compatibilidad tendrán las apps bada corriendo sobre Tizen, si toda esta movida sale bien permitirá sin mucho esfuerzo que Tizen tenga potencialmente en su catalogo alrededor de 20000 aplicaciones listas para usar, pero para que todo esto llegue a buen puerto Samsung va a tener que convencer primero a los demás socios de la Tizen Association para que den el visto bueno a la unión, cosa que dado el peso que tiene Samsung en la asociación debería darse por descontado.

    Samsung Wave Series
    bada phones, Samsung Wave, Wave 2 y Wave 3

    Si la integración de bada con Tizen es aprobada, hay que ver si ademas de las APIs, también esta en los planes de Samsung agregar la UI en la movida, la UI de bada se basa en TouchWiz, al menos en su parte visual y comparada con la UI de la imagen que viene en el emulador del SDK, esta mucho mas desarrollada y pulida, es cierto que la UI es básica y no presenta ninguna función o pattern innovador (como Swipe UX), pero es funcional y se adapta bien al perfil del usuario de smartphones de gama media que es adonde apunta Tizen en un comienzo.

    Lamentablemente el presente de Tizen, a pesar de la liberación del código sigue siendo incierto en mi opinión, todo por una política de comunicación totalmente oscura y deficiente, con anuncios que al poco tiempo se desmienten y donde las únicas fuentes de información son las listas de correos y el canal IRC, lugares en donde la especulación reina.

    Futuro

    Por suerte para ver como se delinea el futuro de Tizen no vamos a tener que esperar mucho, el mes próximo en el MWC 2012, Samsung casi con seguridad estará presentando mínimo un prototipo corriendo Tizen, espero también que Samsung y los demás socios de la Tizen Association aproveche el lugar y la cobertura de los medios para hacer anuncios concretos acerca de que tienen planeado hacer con Tizen y cuales van a ser los pasos a seguir para lograr sus objetivos, sera cuestión de tener un poco mas de paciencia, espero que la espera valga la pena.

    Development, Opinion, Personal , , , No response

    Android Design Guidelines

    January 12th, 2012

    Android Design Guidelines

    No soy un entusiasta de Android y posiblemente nunca lo sea, pero si hay algo de lo que soy fanatico, es del diseño de interfaces de usuario, es por eso que las nuevas Android Design Guidelines me resultan muy interesantes, Android contaba ya con unas guiás, pero eran muy limitadas y se centraban mas en el diseño de iconos que en otra cosas (mas importantes), estas nuevas guiás van un paso mas allá, tratando de transmitir la visión que de ahora en mas el equipo de UX de Android quiere imponer tanto a los fabricantes de dispositivos como a los desarrolladores de aplicaciones, explicando como usar y donde aplicar los diferentes patrones de interacción “aprobados”, como así también cuestiones relacionadas con el diseño visual de las apps, que tienen como objetivo unificar el lenguaje visual y terminar con el zoológico en el que se ha convertido el diseño de interfaces de usuario en Android.

    El diseño de las guiás esta muy logrado y a pesar de haber leído y analizado muy poco de ellas, he podido comenzar a entender lo que el equipo de UX de Android quiere transmitir a sus usuarios, esperemos que tanto los OEMs como quienes desarrollen aplicaciones para Android empiecen a aplicar estos fundamentos tanto en sus dispositivos como en sus apps y que dejen de reinventar la rueda con paradigmas y diseños que nada tienen que ver con la plataforma o con “mejoras” en la UI (TouchWiz, MotoBlur, Sense) que lo único que agregan son problemas a los usuarios a la hora de actualizar de versión.

    Mas información: Android Design Guidelines

    Design, User Interface 3 responses

    Tizen, primer contacto

    January 8th, 2012

    Desde su lanzamiento, he sido muy critico con Tizen, primero porque al parecer prima mas la política que la tecnología en el proyecto, y segundo por la falta de información y transparencia, algo que para ser un proyecto que se quiere posicionar como la verdadera opción Open Source en OSs para dispositivos móviles es totalmente inaceptable, el blog en Tizen.org solo ha publicado un post y este data del 27 de Septiembre de 2011 (casi 3 meses y medio), en las listas de email, no hay nadie que conteste absolutamente nada, afortunadamente esto esta empezando a cambiar, hoy gracias a un tweet de @gsbarbieri me entere que se podía acceder a el repositorio git con el código de Tizen, ademas de que ya estaba disponible para bajar el SDK.

    Arquitectura

    La arquitectura de Tizen, se divide básicamente en 3 capas, una capa con el Kernel Linux (optimizada para procesadores con arquitectura ARM Cortex A8), luego el Core, en donde se encuentran los diferentes servicios (Web, Security, Multimedia, Graphics, UI, Location, Telephony, Messaging, entre otros) que son expuestos por la Web API, a las aplicaciones web que corren en la capa, valga la redundancia de Aplicaciones.

    Tizen Architecture

    SDK

    El SDK se encuentra disponible aquí, y hasta el momento solo se encuentra disponible para Linux, el instalador pesa unos 5 megas y la instalación completa del SDK ocupa aproximadamente 2 gigas de espacio en disco, el IDE se basa en Eclipse y permite crear tanto aplicaciones nativas como Web Apps, el SDK también incluye un emulador con el que podemos testear nuestras apps, el emulador es algo lento y limitado, no soporta OpenGL ES y EFL, tampoco detecta el cambio de posición de la pantalla (portrait, landscape) entre otras cosas, estas limitaciones se verán en parte solucionadas en febrero próximo cuando Samsung lance su primer modelo de referencia y se puedan hacer pruebas directamente en el dispositivo.

    Tizen IDE

    User Interface

    La UI usada en esta versión es bastante básica, con algunos aires a TouchWiz, la homescreen es una simple lanzadera de programas y al parecer es posible tener mas de una homescreen, a diferencia de TouchWiz no es posible agregar widgets, lo cual hace a la UI algo limitada, pero por otro lado, esto favorece el consumo de recursos y es que al parecer Tizen en un principio va a estar mas orientado a equipos del rango medio a medio bajo, la UI también cuenta con una zona de notificaciones similar a la usada por Android, Symbian Belle o iOS 5 y su funcionamiento y apariencia es parecida, también cuenta con un Task Switcher donde podemos ver las aplicaciones que están corriendo, cuantos recursos están consumiendo y cerrarlas.

    Debajo pueden ver algunas screenshots de las diferentes partes de la UI y de algunas aplicaciones en acción.

    Tizen UX - Homescreen and Dialer
    Homescreen and Dialer

    Tizen UX - Settings and Task Switcher
    Settings and Task Switcher

    Tizen UX - Web Browser
    Web Browser

    Tizen UX - Photo Gallery
    Photo Gallery

    Este articulo es solo una primera toma de contacto tanto con Tizen, como con su entorno de desarrollo, en futuros posts iré profundizando mas en puntos como la arquitectura, las APIs disponibles para desarrollo, ya sean las nativas de Tizen como las de la especificación WAC, espero este articulo les sirva para ir conociendo a Tizen y espero también que sea el comienzo de una mayor y mejor comunicación por parte de la Tizen Association.

    Announcements, Architecture, Development , 12 responses