Técnicas de diseño para interfaces

Dahyam Sanabria
Composición de interfaces
TÉCNICAS Y COMPONENTES IMPORTANTES DEL DISEÑO PARA NUEVAS INTERFACES

ELEMENTOS TÉCNICOS DE USABILIDAD:
Para elaborar interfaces y tener un buen diseño, con una buena interacción frente al usuario, debemos comenzar con los siguientes elementos técnicos:

1. Estudio de usuario: Cuando se desarrolla una idea, que debe ser reflejada en una interfaz con una funcionalidad importante. Se comienzan a elaboran wireframes de alta y baja fidelidad, estos nos permiten tomar decisiones más profundas para el contenido. La UX y las funciones de diseño, nos permiten indagar y conocer a nuestros usuarios objetivos. En este tipo de procesos es bueno tomar los detalles, inquietudes o preguntas que tienen los usuarios que interactúan con nuestros prototipos para obtener un producto funcional y llamativo.

2. Arquitectura de la información: Elaborar un flujo de información frente a la necesidad del usuario es un punto clave dentro de la creación de nuestra interfaz, las opciones y posibles desviaciones que tendrá nuestro usuario frente a la información que plasmemos será a partir de los datos que recopilemos en:

Público objetivo y audiencia
Análisis competitivo
Diseño de interacción, navegación y contenidos.
Ubicación de los contenidos para acceder a la información
Facilidad de búsqueda
Accesibilidad

3. Sistemas de navegación: Cuando ya se ha seleccionado el contenido que irá en nuestra interfaz con el correspondiente diseño, comenzamos a identificar los flujos de tareas con las funciones esenciales. Esto en base al análisis realizado por nuestros usuarios, nos permite orientar una navegación más eficiente que aporte orden y jerarquía del contenido en cada pantalla, de manera que en cada una se destaquen los contenidos más relevantes. La “Navegación global” se refiere específicamente a los botones y enlaces que habitualmente están situados en un sitio consistente, mientras que la “Navegación local” se refiere a la sección de contenido en la que se encuentra el usuario.

-Interfaces atractivas: Estas son sencillas según Donald Norman, donde nos sugiere 3 motivaciones para nuestros diseños en una interfaz:
La visceral idea del usuario, nos refleja una reacción emocional y psicología positiva frente al diseño, esto inspira confianza en el producto o servicio para que este bien diseñado.
Conductual: La atención al detalle inspira confianza en que el producto o servicio sea funcional de cara al usuario.
Reflexivo: Establece una confianza inmediata, donde se garantiza la satisfacción de uso según las expectativas funcionales o de lo contrario nuestro usuario se decepcionará.

4. Pruebas funcionales con diseño: Reunir a un grupo de usuarios para que interactue con nustra interfaz ya con un diseño incorporado y funcional, permite que nosotros como diseñadores indaguemos en sus interacciones, gustos, disgustos, navegación y satisfacciones en relación al producto. Siempre debemos apuntar o detallar los posibles problemas o interrogantes que se presenten durante la interacción, solicitar que mencionen sus ideas, conclusiones, actos y razonamientos nos permitirá entablar un análisis más profundo.

5. Realizar una evaluación Heurística: Reunir un grupo de participantes, estos nos ayudaran a evaluar e identificar las dificultades de uso de nuestro producto ya diseñado y su interfaz. Nuestros participantes nos compartirán sus propias observaciones en relación a sus experiencias con algunos productos similares, que les permitan conseguir sus propias tareas o si descubren más dificultades.

10 PRINCIPIOS DE USABILIDAD:
Estos principios de usabilidad se basan en las reglas heurísticas de Jakob Nielsen y deben aplicarse en la evaluación de diseño y usabilidad.

1. Diseño elegante y sencillo: Será atractivo y minimalista, el usuario seleccionara algunas funciones y accederá al contenido sin distraerse con diseños complejos.

2. Convenciones y lenguajes: Se empleará lenguaje visual y verbal, la experiencia de usuario debe ser intuitiva gracias al orden de la información.

3. Coherencia: Los usuarios deberán familiarizarse con el diseño de una forma más rápida y dinámica para que sea coherente con ellos mismos.

4. Visibilidad: El diseño se asegura de que las acciones, objetos y opciones sean constantemente visibles y el usuario no tenga que memorizarlos, deberá encontrarse una opción de “ayuda” en todo momento.

5. Feedback visible: El diseño informara a los usuarios mediante un feedback en el momento apropiado, como una sugerencia al detallar un problema o demora en la accion.

6. Control del usuario: El diseño le otorga al usuario un control total sobre las funciones, con capacidad de cancelar acciones y una simple función de salida si decide no continuar con el proceso de interacción.

7. Atajos: El diseño debe ofrecer pequeños atajos o comandos que permitan a los usuarios expertos que no se distraigan a los menos experimentados. Si es posible podemos brindarle opciones de configuración personalizada para acciones frecuentes dentro de la interfaz.

8. Ausencia de errores: La interfaz intentará que el usuario no cometa errores, al menos dando la opción de confirmación en la pantalla, para asegurar la accion a tomar, como la de eliminar algún objeto.

9. Informes de errores: Se debe informar al usuario de los errores empleando un lenguaje claro y comprensible, explicandole lo ocurrido y la forma en la que se rectificará la información.

10. Ayuda: El diseño además deberá ser un proceso intuitivo para nuestros usuarios, para que no tengan la opción de leer algún manual para navegarlo.

Cuando necesiten ayuda esta debera estar disponible en cualquier momento y será sencilla y oportuna para el usuario.

COMPONENTES ELEMENTALES PARA DISEÑO EN INTERFACES:
Para iniciar a elaborar nuestros diseños para una interfaz concreta, debemos tener en cuenta elementos claves para generar una buena experiencia de usuario.

1. Diseño y uso del color: Los colores se encargan de armonizar y organizar la información de los elementos gráficos. El uso de colores basado en las nociones básicas del círculo cromático aportan equilibrio, armonía y organización al diseño.

2. Iconos: Representan signos relacionados a formas u objetos de nuestra vida cotidiana, algunos de ellos son representaciones literales, metafóricos o análogos.

3. Tipografía: Para el diseño de interfaces debemos ser conscientes de la legibilidad y fluidez que tenga nuestra tipografía vinculada al diseño. Algunas claves para la selección de una fuente esta en: Tipo de letra, leading, tracking, longitud de línea y alineación.

4. Composicion: Para elaborar un buen diseño debemos tener en cuenta las estructuras de los elementos visuales basándose en las teorías de las percepción de la Gestalth, así como la sección áurea y la regla de tercios, estos contribuyen al orden y la jerarquía.

5. Equilibrio: Es la distribución de los elementos dentro de una página deben ser simétricos, estos deben transmitir estabilidad y armonía. La simetría si está desequilibrada crea una tensión y un movimiento natural, por la razón que algunos diseños suelen elaborar piezas asimétricas para que sean comunicativas.

6. Forma y espacio: Las formas son elementos comunes en cualquier composición al igual que los espacios, en estos casos se utilizan teorías como los de la Gestalt de semejanzas, cierre y figura fondo. Teniendo en cuenta estas teorías, nosotros como diseñadores somos capaces de elaborar formas simétricas o asimétricas, que permitan al espectador entender rápidamente el mensaje que deseamos transmitir.

7. Tamaño y escala: El tamaño es una variable en la creación del orden y jerarquía de elementos, aquellos que nos atraen suelen ser los más grandes que los pequeños, de modo que automáticamente les asignamos más importancia. Por otro lado la escala no solo asigna una importancia dentro de la composición sino que las imágenes y textos también representan una interacción con el usuario.

8. Posición y ubicación: La posición visual de los elementos dentro de la pantalla nos permite establecer un orden natural de los objetos con los que estemos interactuando. En la cultura occidental, leemos de izquierda a derecha, arriba e izquierda abajo a la derecha. De modo que si todos los elementos compositivos tuvieran el mismo tamaño no podríamos dar una jerarquía de importancia a los elementos.

9. Color y contraste: El color es un elemento clave en la composición, dado que las diferencias entre tono y saturación alteran el foco de atención y la importancia de los elementos compositivos. El contraste establece un orden de diferencias, aquellos elementos que tienen más contraste sobre el fondo son más dominantes.

10. Sección aurea: Es una proporción naturalmente recurrente y armoniosa que se aplica desde tiempos antiguos.

11. Ley de tercios: Está regla sugiere que las composiciones deben dividirse en tercios, empleando dos guías horizontales y verticales, que resultan en nueve secciones iguales. Los elementos más importantes siempre deben ubicarse en las intersecciones, obteniendo composiciones más dinámicas y de interés visual.

12. Resolución de pantalla: Para la composición de interfaces debemos tener en cuenta la resolución con la que se va a trabajar, sea un monitor, tablet o smartphone.

CREACIÓN EN INTERFACES INMERSIVAS:
La creación de ambientes virtuales tridimensionales se vuelven más complejos cuando el diseño de la interfaz y la experiencia del usuario son más interactivos. Ofrecerle al usuario un juego intituivo y feedback sobre la interacción con el entorno es sumamente complicado, ya que dependemos de diversas interacciones y funciones planteadas dentro de la interfaz y manejadas por el usuario en varios aspectos según su necesidad de personalización si está la brinda.

La creación de nuevos eventos y experiencias, describen a las nuevas interfaces como interacciones más físicas con el mundo real, como la interacción de hologramas interactivos que recurren a dispositivos de entrada externos,como en: centros educativos, museos, centros médicos y de investigación científica.

QUE SON LOS HOLOGRAMAS
Los hologramas es una imagen que se obtiene a partir de una holografía, haciendo uso de la iluminación mediante láseres, donde consigue generar imágenes a través de 3 dimensiones. El láser permite la grabación microscópica de una película fotosensible, en donde 2 haces de luz producen una interferencia que permiten reflectar la luz a la creación del objeto.

A diferencia de las nuevas tecnologias, la experiencia de usuario debe centrarse en cómo se representa el diseño dentro de la interfaz, hay que tener en cuenta que el diseño para el Web es diferente del diseño tradicional de interfaces de usuario (IU) para software; principalmente porque el diseñador de Web tiene que dar el control y compartir la IU con los usuarios y con el software o hardware.

“Una interfaz gráfica de usuario (GUI), es donde coinciden el diseño de la interacción y el de la interfaz. Es sólo una manifestación visual de «inter» actividades; sólo es un aspecto del diseño de interacción, no el mismo diseño de la interacción.”

Hay que tener en cuenta el objetivo principal que tiene la GUI en relación de la ineformacion para que esta sea comprensible y útil para el usuario, por lo tanto la GUI dependerá de cómo el usuario la interprete según su entorno y la tecnología con la que disponga.
(GUI: interfaz gráfica de usuario)

Bibliografías:
Ruiz Fernández, (2012). interfaces de usuario: diseño de la visualización de la información como medio para mejorar la gestión del conocimiento y los resultados obtenidos por el usuario. Universidad de Zaragosa

López Javier, (2007). Diez principios para un buen diseño
http://digitk.areandina.edu.co/repositorio/bitstream/123456789/453/2/Diez%20principios%20para%20un%20buen%20diseño%20segun%20dieter%20rams0001.pdf

Jamie Steane, (2016). Fundamentos del diseño interactivo. Reino Unido. Editorial: Promopress.

Ros Germán, García Mateos, (2012). Realidad aumentada basada en características naturales. Alemania. Editorial: Académica Española.

Leave a Reply

You must be logged in to post a comment.