Inicio Diseño para Móviles Principios de diseño orientado a móviles

Principios de diseño orientado a móviles

4 Comentarios


Principios de diseño orientado a móviles
Este es un artículo como invitado de Iván Román, blogger de OK HOSTING, sitio que ofrece hosting, diseño de páginas web y dominios.

Recuerda que si quieres puedes escribir un artículo para Trazos Web y de paso promocionar tu sitio. Ve las condiciones aquí: Participa en Trazos Web.

El desarrollo de aplicaciones hoy en día esta convirtiéndose en el gran propulsor de economía para los nuevos talentos. Ejemplos como Instagram, Instapaper, Angry Birds son casos de éxito que muchos quisieran repetir con sus propias ideas.

Diseñar una aplicación no es tan sencillo, aunque con un poco de practica, bases de teoría y guías de estilo podríamos hacer de nuestra primera App algo digno de presumir.

Diseño movilCrear una aplicación no es solo diseño, obviamente implica la mucho desarrollo y es un hecho que una depende de la otra para crear un producto interesante y bien trabajado.

Hoy los Marketplaces, esta llenos de aplicaciones, muchas muy buen y otras que no han sido descargadas ni una vez, para citar, según un estudio, hasta Julio del 2012, en la AppStore de Apple había un 70% de aplicaciones que jamás han sido descargadas. Cifras como la anterior no ponen en alerta para crear aplicaciones que sean funcionales y con el claro objetivo de hacerlas virales, en otras palabras, que se descarguen.

 

Un punto que poco a poco se ha tomado con mas seriedad es el diseño funcional dentro de las aplicaciones, en un principio esto no era tan importante para la mayoría de los desarrolladores de aplicaciones, ya que tenían la idea de si la aplicación era funcional seria suficiente para ser exitosa (algo similar a lo que paso con los sitios web), lamentablemente no todas las aplicaciones corrieron la misma suerte y tuvieron el éxito deseado, es cuando se buscaron las razones y una de ellas fue el carente diseño. Situaciones como esta orillaron a los desarrolladores independientes y empresas a tomarle vital importancia a conceptos nuevos como la usabilidad, experiencia del usuario, diseño, entre otras.

 

Conceptos básicos para el diseño de aplicaciones móviles

Las aplicaciones se han ido diversificando desde que vieron la luz con el iPod Classic, si, este fue el primer dispositivo que incorporo aplicaciones, aunque solo eran desarrolladas por Apple, tenían una experiencia del usuario horrible y eran muy pocas, fueron el parte aguas para todo lo que vemos hoy en día.

 

Cada plataforma tiene sus reglas y también ofrece ventajas y desventajas, pero hay principios básicos que trascienden la plataforma y son aplicables a casi cualquier proyecto.

 

Punto 1. Toma en cuenta las resoluciones

ResolucionTomar en cuenta el tamaño de la pantalla es muy importante en el desarrollo de una interfaz. Todos los dispositivos tienen una resolución de pantalla definida, pero con la llegada de las densidades, se ha venido complicando la cosa. La densidad en los dispositivos es sinónimo a lo que diseñadores llaman, puntos por pulgada pero aplicado a resoluciones digitales. Recomendación, si no estas familiarizado con las densidades, diseña sobre la resolución de la plataforma y sobre la media de los puntos por pulgada, mi consejo son 200 dpi.

 

 

 

Punto 2. Los menús de navegación en cada entorno

NavegacionAunque es un punto lógico, cada entorno o interfaz tiene elementos específicos y dentro de las líneas guía y el estilo se define que se puede hacer y que esta prohibido en este tipo de menús. Un ejemplo son las barras de acción en Android. Estas barras comúnmente se encuentran en la parte superior de las aplicaciones y tiene como objetivo brindar elementos adicionales al entorno dentro de una interfaz especifica.

 

 

 

 

Punto 3. La constancia en la navegación

Este punto, aunque es un común denominador entre el diseño web y el móvil, debe a abordarse por la importancia que conlleva en muchos desarrollos no se le atribuye. Los flujos en la lógica visual de una aplicación se resumen a no cambiar o mover elementos necesarios o repetitivos dentro de la aplicación a lo largo de las pantallas. Con esto se busca brindar al usuario una experiencia constante dentro de la interfaz.

 

Punto 4. Los elementos son mas pequeños de lo que aparentan

TamañosLos que ya tengan experiencia y hayan diseñado alguna aplicación para móviles habrán pasado por lo mismo. Si no has utilizado mockups en proporciones y has creado nuevos elementos sabrás que al momento de testearlos en el teléfono se verán mas pequeños, aunque nosotros los veamos enormes en la pantalla del ordenador. Para evitar este tipo de dudas, puedes basarte en diseños o mockups ya realizados y que abundan por internet o en su defecto hacer tus propios esquemas de diagramación en pantalla.

 

 

 

 

Punto 5. Toma en cuenta Las fuentes tipográficas de cada entorno

Otro de los problemas constantes es el uso de tipografía personalizada, o para decirlo de otra forma, familias de fuentes que no son base de la plataforma. Cuando una aplicación utiliza fuentes externas por lo general hay que importarlas sobre los assets de la aplicación y esto puede llegar a ser un problema al momento de la navegación y experiencia del usuario ya que el uso de recursos externos y no optimizados hace que la aplicación consuma mas recursos del sistema.

 

Estos consejos vienen de nuestra experiencia al diseñar mas de 40 aplicaciones móviles para diferentes plataformas, desde s40 para Nokia, pasando por MeeGo, Android, IOS, WP, Symbian, etc.

¿Tu has diseñado para móviles? ¿Que piensas de estas recomendaciones?

Hay 4 Comentarios en “Principios de diseño orientado a móviles”

  1. cristina

    Muchas gracias por tus consejos!! me han sido de gran utilidad.
    Solo me queda una duda; dices que hay que diseñar (en photoshop) a 200 dpi? al ser así,y teniendo en cuenta que un iphone tiene 326 dpi, no saldría pixelado o desenfocado?

    Gracias de nuevo!!!

Trackbacks/Pingbacks

  1. Pingback: 14 Blogs que deberías de seguir si trabajas con WordPress | Pixellegancy