Angel Sánchez

Diseñar la interfaz de usuario antes de comenzar con el código

Muchas veces el inicio de un proyecto de software comienza con el enfoque y perspectiva del desarrollo de código; sin embargo, lo ideal es iniciar el proyecto desde la perspectiva del diseño.

Cuando hablamos de diseño de interfaz, el término «diseño» no debe entenderse como el arte final a entregar, sino como un conjunto de situaciones en las que debe involucrarse el equipo de desarrollo. Partiendo de un concepto basado en datos o métricas, esbozado en papel y lápiz, pasando por una serie de validaciones e iteraciones que involucran más métodos como la generación de wireframes (o esquemas iniciales), mockups en baja y alta fidelidad (o representaciones con mayor o menor detalle del producto final), diseños de interacción (donde se muestren los comportamientos que suceden como consecuencia de las acciones del usuario interactuando con la interfaz), etc., el diseño involucra también la gestión de los contenidos textuales, la arquitectura de información y navegación, la gestión de errores, la gestión de situaciones de ayuda, la gestión de los llamados «blankstates» —situaciones en las que la interfaz se muestra con espacios vacíos de contenido. Como puede notarse, comenzar con el «diseño» es mucho más que comenzar a dibujar en Sketcho o en Photoshop.

El desarrollo de la mayoría de las aplicaciones comienza con la idea de programar primero, y esa es una mala idea. La programación es el proceso que más recursos consume en el desarrollo de una aplicación (o un website, o una tienda en línea, etc.) y es la parte mas cara y difícil de cambiar. En vez de empezar por la programación, siempre conviene comenzar por el diseño.

«Mejor goma de borrar en la mesa de dibujo, que martillo en la zona de obra».

El diseño es un elemento relativamente flexible (y ni qué decir de los bocetos). Un boceto en papel es barato y fácil de modificar, incluso los diseños maquetados en HTML/CSS se pueden cambiar (o desechar) con relativa simplicidad. Pero no se puede decir lo mismo de la programación pura y dura. Diseñar primero te mantiene flexible. Comenzar programando te cierra opciones y conlleva futuros costes adicionales. De ahí que es tan importante trabajar con continuas iteraciones con el equipo de desarrollo, entender que el equipo es «diseñador de producto».

Otra razón por la cual conviene comenzar con el diseño es que la interfaz es el producto, lo que ven las personas, a fin de cuentas es lo que estás vendiendo. Si simplemente colocas la interfaz al final de la programación se podrán ver las grietas. Por ello, también vale tanto comenzar con el enfoque de la funcionalidad del diseño ya que hacer pruebas sobre prototipos es muchísimo más económico y rápido que realizar pruebas de uso en productos terminados. Comenzar con el diseño te mantiene flexible y te proporciona las respuestas antes que después, en el proceso de desarrollo.

Entonces conviene empezar con la interfaz para poder ver desde el principio el aspecto y funcionamiento de la aplicación. La interfaz se revisa continuamente durante el proceso completo de desarrollo. ¿Tiene sentido? ¿Es fácil de usar? ¿Soluciona el problema que tenemos entre manos? Estas son preguntas que solo se pueden contestar de verdad cuando se están trabajando con las pantallas reales.

Pero no todo es diseño por el diseño puro, también se debe involucrar a los usuarios que utilizarán el sistema que se está diseñando. Por ello conviene que el equipo domine los métodos de User Centered Design.1 Además al trabajar con métodos de AgileUX2 o LeanUX3 la perspectiva inicial desde el diseño funcional es, simplemente, la mejor forma de enfocar el desarrollo del producto digital. 

Author
Angel Sánchez Córdoba
  1. User Centered Design: Métodos que tienen por objeto la creación de productos que resuelvan necesidades concretas de sus usuarios finales. Más información.
  2. Agile UX: Forma simplificada de los métodos de «Diseño de Experiencia de Usuario» que prima los ciclos de desarrollo y despliegue del producto. Más información.
  3. Lean UX: Forma simplificada de los métodos de «Diseño de Experiencia de Usuario» que prima los ciclos de diseño y métricas del producto. Más información.

Published on 07/10/2015

IMPORTANT: This article does not express the opinion of the editors and managers of FOROALFA, who assume no responsibility for its authorship and nature. To republish, except as specifically indicated, please request permission to author. Given the gratuity of this site and the hyper textual condition of the Web, we will be grateful if you avoid reproducing this article on other websites. Instead, we suggest and value a partial reproduction, also including the name of the author, the title and the source (FOROALFA), a link to this page (https://foroalfa.org/articulos/disenar-la-interfaz-de-usuario-antes-de-comenzar-con-el-codigo) in a clear and visible place, inviting to complete the reading.

Autor:
Angel Sánchez

More articles byAngel Sánchez

Article:

Qué es ser un diseñador UX

Article:

Qué es ser un diseñador ágil

Followers:
133

Related

Illustration:
Gonzalo De La Cuadra Reveco
Author:

Gonzalo De La Cuadra Reveco

Title:

Comunicación, diseño y accesibilidad

Synopsis:

Problemáticas y desafios de la comunicación y el diseño a la hora de trabajar la accesibilidad.

Votes:
60
Comments:
21
Followers:
33
Idioma:
ES
Illustration:
Dante Claudio Reynoso
Author:

Dante Claudio Reynoso

Title:

El mercado de las respuestas

Synopsis:

Los buscadores proponen potentes integraciones. La calidad de sus respuestas influye en cómo pensamos y nos movemos en la red, paranoias incluidas.

Votes:
15
Comments:
7
Followers:
50
Idioma:
ES
Illustration:
Dosve
Author:

Dosve

Title:

Creatividad en movimiento para un canal infantil

Synopsis:

El difícil desafío de diseñar un universo animado para una programación televisiva destinada a niños de dos a cinco años.

Votes:
63
Comments:
35
Followers:
7
Idioma:
ES
FOROALFA ISSN 1851-5606 | Contactar | Publicidad | ©Luciano Cassisi 2005~2016