Resumen: Planificación de una aplicación

Pensar en móvil

Es fundamental adaptarse al contexto. Algunos sitios cuentan con versiones

especialmente optimizadas para móviles y tablets.

Un factor clave es el tiempo de carga inicial y el performance general. Es

fundamental que cada página o pantalla sea liviana.

Arquitectura de la información

Comenzó a finales de la década de los 50, y en práctica a partir de los años 60.

Al definir cómo se mostrará una página, los aspectos estéticos deben

complementarse con la organización eficaz del flujo de información que se
necesita ofrecer en ese espacio. Debemos enforcarnos en la arquitectura de la
información, la manera en que estructuramos el contenido de cada página de
nuestro proyecto.

Orden jerárquico: ayudará a organizar la información en el espacio reducido para

proyectar las interfaces en aplicaciones y sitios web para móviles.

Arquitectura de la información en una Web App

Nos permite determinar qué elementos estarán disponibles en cada pantalla. Ante
todo, es necesario fijar jerarquías para organizar los elementos en cada pantalla
para definir la estructura, luego establecer el lugar para cada elemento. Ubicar
todos los elementos en el lugar adecuado será una labor que tendremos que
emprender en cada una de las pantallas de nuestra aplicación.

Usabilidad

Los elementos tienen un objetivo.

• Al adaptar para móviles es importante dividir el contenido en porciones más

pequeñas de lo habitual en desktop.
• El diseño a una sola columna suele ser el indicado si pensamos en usabilidad
de cara a los usuarios de smartphones.
• Al crear interfaces para móviles debemos pensar el área donde el usuario
puede pulsar de una manera diferente.
• Los cuadros de diálogo y ayudas deben ser simples.
• Los mensajes de error tienen que ser descriptivos.
• Es importante evitar el scroll horizontal, salvo que se requiera
específicamente.
• En formularios para móviles, que el usuario escriba lo menos posible.
• Debemos tratar siempre de ayudar al usuario.
• Preferir desarrollos web que utilicen lenguajes nativos del browser.
Accesibilidad

Puede ser utilizado sin problemas por una persona, más allá de sus habilidades,
aptitudes y contexto. La legibilidad en los textos y la claridad en las consignas son
factores clave. Resulta también importante que los elementos de la interfaz de
usuario sean fácilmente reconocibles.

Accesibilidad en el mundo móvil

El objetivo es que el contenido se adapte de la mejor manera posible al medio, y

que le permita a los usuarios tener una experiencia adecuada y agradable.

• Evitar que los elementos que tienen acciones programadas, al ser pulsados
o seleccionados, se encuentren solapados o demasiados cerca.
• Layouts simples que puedan ser comprendidos de un vistazo.
• Reducir la cantidad de pasos al máximo para cada operación.
• Correcta combinación de colores.
• Tipografías demasiado pequeñas dificultan la lectura.
• Recursos multimedia potencian el nivel del sitio o aplicación.

El concepto de navegabilidad aplicado a una Web App

Un paso fundamental es la creación de un mapa de sitio o un mapa de la

aplicación con la conexión de las pantallas; ahí podemos definir una estructur a
general, especificar cómo se conectan las pantallas y detectar inconsistencias.

Cómo orientar al usuario

El usuario siempre debe tener opciones para continuar navegando. De ser posible,
deberíamos brindarle la jerarquía del nivel en el que se encuentra para que pueda
desplazarse.

Mejora progresiva

Busca unir la accesibilidad, usabilidad y arquitectura de la información; a otros que

posibilitan crear una solución que pueda ser vista por usuarios en diferentes
contextos. Partiendo de un modelo básico para trabajar hasta mejorarlo.

El diseño adaptado al medio

En el diseño Web Adaptivo confluyen diversas técnicas para crear estructuras que
se ajusten a diferentes sistemas, plataformas y resoluciones de pantalla.

La estructura básica inicial

Existen opciones variadas para comenzar con las primeras etapas de trabajo: flujo
de la aplicación, estructurade alambre, boceto, etc. Podemos trabajar con las
aplicaciones de diseño con las que estamos habituados o bien optar por algunas
alternativas específicas para crear este tipo de prototipos.
• Balsamiq Mockup: es una alternativa que facilita el trabajo de crear
Mockups. Destaca su facilidad de uso y las opciones que brinda para ayudar
a distribuir elementos que están predefinidos dentro de la aplicación.
• Axure RP: permite crear prototipos de nuestros proyectos. Muy útil para
definir el flujo de información y el detalle de las páginas, que serán las
pantallas que conformarán nuestra aplicación