CAPITULO I: APLICACIONES MVILES

Las aplicaciones
Qu son las aplicaciones?
Aunque no parezca, las aplicaciones llevan tiempo entre nosotros. Antes de empezar a disearlas, queremos
que las conozcas: Cules son sus tipos y caractersticas? Qu diferencias hay entre ellas y con una web
mvil?
Las aplicaciones tambin llamadas apps estn presentes en los telfonos desde hace tiempo; de hecho, ya
estaban incluidas en los sistemas operativos de Nokia o Blackberry aos atrs. Los mviles de esa poca,
contaban con pantallas reducidas y muchas veces no tctiles, y son los que ahora llamamos feature phones,
en contraposicin a los smartphones, ms actuales.
En esencia, una aplicacin no deja de ser un software. Para entender un poco mejor el concepto, podemos
decir que las aplicaciones son para los mviles lo que los programas son para los ordenadores de escritorio.

FIGURA 1.1.En la AppStore hay cientos de miles de apps disponibles.

Actualmente encontramos aplicaciones de todo tipo, forma y color, pero en los primeros telfonos, estaban
enfocadas en mejorar la productividad personal: se trataba de alarmas, calendarios, calculadoras y clientes de
correo.
Hubo un cambio grande con el ingreso de iPhone al mercado, ya que con l se generaron nuevos modelos de
negocio que hicieron de las aplicaciones algo rentable, tanto para desarrolladores como para los mercados de
aplicaciones, como App Store, Google Play y Windows Phone Store.
Al mismo tiempo, tambin mejoraron las herramientas de las que disponan diseadores y programadores para
desarrollar apps, facilitando la tarea de producir una aplicacin y lanzarla al mercado, incluso por cuenta
propia.
Diferencias entre aplicaciones y web mviles
Las aplicaciones comparten la pantalla del telfono con las webs mviles, pero mientras las primeras tienen
que ser descargadas e instaladas antes de usar, a una web puede accederse simplemente usando Internet y
un navegador; sin embargo, no todas pueden verse correctamente desde una pantalla generalmente ms
pequea que la de un ordenador de escritorio.
Las que se adaptan especialmente a un dispositivo mvil se llaman web responsivas y son ejemplo del
diseo lquido, ya que se puede pensar en ellas como un contenido que toma la forma del contenedor,
mostrando la informacin segn sea necesario. As, columnas enteras, bloques de texto y grficos de una web,
pueden acomodarse en el espacio de una manera diferente o incluso desaparecer de acuerdo a si se entra
desde un telfono, una tableta o un ordenador.

FIGURA 1.2.El diseo responsivo se adapta dependiendo del dispositivo donde es visualizado.
Quienes cuentan ya con una web responsiva pueden plantearse la necesidad de disear una aplicacin,
pero la respuesta a si esto es o no necesario, depende de entender tanto los objetivos de negocio, como las
caractersticas que diferencian las aplicaciones de las webs.
Por ejemplo, las aplicaciones pueden verse aun cuando se est sin conexin a Internet, adems, pueden
acceder a ciertas caractersticas de hardware del telfono como los sensores, capacidades que
actualmente estn fuera del alcance de las webs. Por lo anterior, puede decirse que una aplicacin ofrece una
mejor experiencia de uso, evitando tiempos de espera excesivos y logrando una navegacin ms fluida entre
los contenidos.
No siempre hay que elegir entre una u otra. Webs y aplicaciones no son competidoras, ms bien, pueden
complementarse entre ellas; por ejemplo, una web puede ser til como canal de informacin para motivar la
descarga de la aplicacin.
Primero el mvil
Es posible que cuando llegue la hora de disear una aplicacin ya exista una web como antecedente. En esos
casos, la app tiene que tomar las funciones y contenidos que se han pensando para la web y adaptarlos para
que tengan sentido, de acuerdo al tamao de pantalla y a la forma de interaccin de un mvil. En otros casos,
el diseo comienza desde cero, cuando todava no hay ni web ni aplicacin, y hay que decidirse por cul de
ellas empezar. Aqu es donde adquiere ms trascendencia el concepto de mobile first, que implica plantear el
proceso de diseo teniendo en cuenta el mvil en primer lugar.
La ventaja de esta forma de trabajar es que el pensar en el mvil como punto de partida, obliga a
concentrarse en lo esencial de un producto y a hacer foco solo en lo que tiene sentido para este dispositivo.
Una vez que la aplicacin est diseada, puede preguntarse cul es la mejor forma de llevar lo hecho para el
telfono a una pantalla de ordenador o a otros dispositivos, extendiendo y escalando el contenido y
repensando la diagramacin. Todos los dispositivos tienen usos diferentes, y en el momento de adaptar el
diseo, hay que tener en cuenta las caractersticas particulares de cada uno de ellos.
Mobile first es una propuesta de trabajo que ha surgido recientemente; una tendencia emergente que an est
por consolidarse. Actualmente, es solo una manera de afrontar el proceso de diseo y como tal, puede
evaluarse la comodidad que se tiene trabajando de esta forma antes de empezar1.
El proceso de diseo y desarrollo de una app
El proceso de diseo y desarrollo de una aplicacin, abarca desde la concepcin de la idea hasta el anlisis
posterior a su publicacin en las tiendas. Durante las diferentes etapas, diseadores y desarrolladores trabajan
la mayor parte del tiempo de manera simultnea y coordinada. Hemos resumido las fases de este proceso
solo desde la perspectiva del diseo y desarrollo, es decir, sin tener en cuenta los roles de coordinacin, la
participacin del cliente, ni los accionistas de la empresa.
1. CONCEPTUALIZACIN

El resultado de esta etapa es una idea de aplicacin, que tiene en cuenta las necesidades y problemas de los
usuarios. La idea responde a una investigacin preliminar y a la posterior comprobacin de la viabilidad del
concepto.

Ideacin
Investigacin
Formalizacin de la idea

2. DEFINICIN
En este paso del proceso se describe con detalle a los usuarios para quienes se disear la aplicacin, usando
metodologas como Personas y Viaje del usuario. Tambin aqu se sientan las bases de la funcionalidad, lo
cual determinar el alcance del proyecto y la complejidad de diseo y programacin de la app.

Definicin de usuarios
Definicin funcional

3. DISEO
En la etapa de diseo se llevan a un plano tangible los conceptos y definiciones anteriores, primero en forma
de wireframes, que permiten crear los primeros prototipos para ser probados con usuarios, y posteriormente,
en un diseo visual acabado que ser provisto al desarrollador, en forma de archivos separados y pantallas
modelo, para la programacin del cdigo.

Wireframes
Prototipos
Test con usuarios
Diseo visual

4. DESARROLLO
El programador se encarga de dar vida a los diseos y crear la estructura sobre la cual se apoyar el
funcionamiento de la aplicacin. Una vez que existe la versin inicial, dedica gran parte del tiempo a corregir
errores funcionales para asegurar el correcto desempeo de la app y la prepara para su aprobacin en las
tiendas.

Programacin del cdigo

Correccin de bugs

5. PUBLICACIN
La aplicacin es finalmente puesta a disposicin de los usuarios en las tiendas. Luego de este paso
trascendental se realiza un seguimiento a travs de analticas, estadsticas y comentarios de usuarios, para
evaluar el comportamiento y desempeo de la app, corregir errores, realizar mejoras y actualizarla en futuras
versiones.

Lanzamiento
Seguimiento
Actualizacin

Tipos de aplicaciones segn su desarrollo

A nivel de programacin, existen varias formas de desarrollar una aplicacin. Cada una de ellas tiene
diferentes caractersticas y limitaciones, especialmente desde el punto de vista tcnico.
Aunque a primera vista esto no parezca incumbencia del diseador, la realidad es que el tipo de aplicacin que
se elija, condicionar el diseo visual y la interaccin.
APLICACIONES NATIVAS

Las aplicaciones nativas son aquellas que han sido desarrolladas con el software que ofrece cada sistema
operativo a los programadores, llamado genricamente Software Development Kit o SDK. As, Android, iOS y
Windows Phone tienen uno diferente y las aplicaciones nativas se disean y programan especficamente para
cada plataforma, en el lenguaje utilizado por el SDK.
Este tipo de apps se descarga e instala desde las tiendas de aplicaciones con ciertas excepciones en el caso
de Android, que veremos en el captulo Lanzando la app sacando buen partido de las diferentes
herramientas de promocin y marketing de cada una de ellas.
Las aplicaciones nativas se actualizan frecuentemente y en esos casos, el usuario debe volver a descargarlas
para obtener la ltima versin, que a veces corrige errores o aade mejoras.
Una caracterstica generalmente menospreciada de las apps nativas, es que pueden hacer uso de las
notificaciones del sistema operativo para mostrar avisos importantes al usuario, aun cuando no se est usando
la aplicacin, como los mensajes de Whatsapp, por ejemplo.

FIGURA 1.4.Las aplicaciones nativas permiten aprovechar el sistema de notificaciones.

Adems, no requieren Internet para funcionar, por lo que ofrecen una experiencia de uso ms fluida y estn
realmente integradas al telfono, lo cual les permite utilizar todas las caractersticas de hardware del terminal,
como la cmara y los sensores (GPS, acelermetro, girscopo, entre otros). A nivel de diseo, esta clase de
aplicaciones tiene una interfaz basada en las guas de cada sistema operativo, logrando mayor coherencia y
consistencia con el resto de aplicaciones y con el propio SO. Esto favorece la usabilidad y beneficia
directamente al usuario que encuentra interfaces familiares.
APLICACIONES WEB
La base de programacin de las aplicaciones web tambin llamadas webapps es el HTML, conjuntamente
con JavaScript y CSS, herramientas ya conocidas para los programadores web. En este caso no se emplea un
SDK, lo cual permite programar de forma independiente al sistema operativo en el cual se usar la aplicacin.
Por eso, estas aplicaciones pueden ser fcilmente utilizadas en diferentes plataformas sin mayores
inconvenientes y sin necesidad de desarrollar un cdigo diferente para cada caso particular.
Las aplicaciones web no necesitan instalarse, ya que se visualizan usando el navegador del telfono como un
sitio web normal. Por esta misma razn, no se distribuyen en una tienda de aplicaciones, sino que se
comercializan y promocionan de forma independiente. Al tratarse de aplicaciones que funcionan sobre la web,
no es necesario que el usuario reciba actualizaciones, ya que siempre va a estar viendo la ltima versin. Pero,
a diferencia de las apps nativas, requieren de una conexin a Internet para funcionar correctamente.

FIGURA 1.5.Facebook cuenta tanto con una webapp como con una app nativa.
Adicionalmente, tienen algunas restricciones e inconvenientes en factores importantes como gestin de
memoria y no permiten aprovechar al mximo la potencia de los diferentes componentes de hardware del
telfono. Las aplicaciones web suelen tener una interfaz ms genrica e independiente de la apariencia del
sistema operativo, por lo que la experiencia de identificacin del usuario con los elementos de navegacin e
interaccin, suele ser menor que en el caso de las nativas.
APLICACIONES HBRIDAS
Este tipo de aplicaciones es una especie de combinacin entre las dos anteriores. La forma de desarrollarlas es
parecida a la de una aplicacin web usando HTML, CSS y JavaScript, y una vez que la aplicacin est
terminada, se compila o empaqueta de forma tal, que el resultado final es como si se tratara de una aplicacin
nativa.
Esto permite casi con un mismo cdigo obtener diferentes aplicaciones, por ejemplo, para Android y iOS, y
distribuirlas en cada una de sus tiendas.
A diferencia de las aplicaciones web, estas permiten acceder, usando libreras, a las capacidades del telfono,
tal como lo hara una app nativa.

FIGURA 1.6.Netflix tiene una aplicacin hbrida que se ve prcticamente igual en iOS y en Android.
Las aplicaciones hbridas, tambin tienen un diseo visual que no se identifica en gran medida con el del
sistema operativo. Sin embargo, hay formas de usar controles y botones nativos de cada plataforma para
apegarse ms a la esttica propia de cada una.

Existen algunas herramientas para desarrollar este tipo de aplicaciones. Apache Cordova3 es una de las ms
populares, pero hay otras, como Icenium4, que tienen la misma finalidad.
CUL DEBERAS USAR?
Dadas las caractersticas de cada una de las aplicaciones, decidirse por una u otra estar determinado por
unos pocos factores fundamentales y por la forma en que afectan finalmente la experiencia de uso. Cuando la
disponibilidad de la app sin Internet, la posibilidad de usar notificaciones y el acceso a los recursos de
hardware del telfono sean importantes, una aplicacin nativa ser la opcin ms indicada.
Si ninguna de estas cosas es realmente importante para la aplicacin, quizs sea ms fcil disear una
aplicacin web, si es que ya se dispone del conocimiento para ello, heredado del desarrollo de sitios web. En
este caso, el costo de desarrollo es ms bajo y la forma de trabajar un poco ms gil.
Independientemente de esto, las aplicaciones nativas son las que ofrecen una mejor experiencia de uso y
sobre todo, rendimiento. Algunas apps como Facebook o LinkedIn, que antes eran hbridas, han pasado a ser
nativas por este motivo. Adicionalmente, ellas responden ms a las guas de diseo de cada sistema operativo.
Por lo anterior, nos enfocaremos en las aplicaciones nativas. De aqu en adelante, y por el resto de los
captulos que quedan por venir, vamos a estudiarlas, conocerlas y a ver qu las hace diferentes.