xeral[arroba]galinus.com

Artigos de Galinus >

Deseño de imaxes para unha comunicación efectiva

Introducción

O uso dos iconos nas interfaces gráficas ou na web debería ter un obxectivo moi concreto: axuda a comunicar visualmente unha función do sistema. Se colocamos imaxes co único obxectivo de decorar, estaremos introducindo ruido que pode facer máis confusa a nosa web ou programa.

Expoñemos uns principios básicos para mellora-la capacidade de comunicación das imaxes que utilicemos,reforzando a facilidade de uso da nosa web ou programa.

Características dunha imaxe para lograr unha comunicación efectiva

Enumeramos as características principais que debe ter unha imaxe para mellora-la sua capacidade para comunicar.

Inmediatez

O obxectivo é capturar axiña a atención e que a impresión que cause sexa perdurable. Para isto, as imaxes deben ser claras, simples, equilibradas e integradas co fondo.

As marcas comerciais buscan esa inmediatez e perdurabilidade nos seus logotipos.

Forma e contornos simples, sen adornos innecesarios para lograr unha imaxe que se asimila sen esforzo.

Xeneralidade

É a capacidade para representar unha clase de obxectos, máis que un obxecto en si. Quitándo os detalles particulares podemos ir abstraendo e creando unha imaxe máis xeral. Se utilizamos unha reproducción moi fiel dun obxecto familiar daremos a impresión de que o icono se refire ó obxecto en si, non a unha clase de obxectos da mesma clase ou unha función asociada a eses obxecto.

Representación do función "calcular" nun programa hipotético. O proceso de abstración fai máis sinxelo comprende-la función do icono.

Cohesión

Cando as imaxes aparecen xuntas, situación moi común nas interfaces gráficas, deben gardar unha coherencia entre elas cunha relación visual ben clara.

O tipo de trazos, cores e tamaño axudan a darlle cohesión.

Botóns de navegación do Safari. Tódolos botóns manteñen unha unidade estética.	Botóns de navegación do Explorer. O caracter bidimensional dos catro primeiros botóns contrasta co botón "Inicio". Os trazos rectos dos tres primeiros é curvo no cuarto icono. O uso do fondo non é igual para todos.

Caracterización

Os obxectos e o seu estado deben ser recoñecibles. Un punto de vista axeitado e a esaxeración de rasgos característicos do obxecto axuda a indentificalo.

Visto desde arriba un avión é máis sinxelo de identificar.	A esaxeración na separación de pernas e brazos fai máis claro a actividade á que se refire.

Tipos de imaxes

Unha porcentaxe grande dunha interfaz gráfica é un sistema de sinais. Codifican en imaxes funcións do sistema.

Os sináis podemos divilos en 3 categorías, según a semiótica

• Iconos: describen o significado mediante unha caracterización do propio significado. É dicir, sempre describen obxectos tanxibles.
• Índices: representación do signficado por asociación de conceptos relacionados (fume para indicar lume).
• Símbolo: representan un significado por pura convención.

Nota: debido a que a maioría das imaxes nunha interfaz gráfica son do primeiro tipo (iconos), estas son coñecidas popularmente por "iconos" aínda que formalmente poidan ser índices ou símbolos.

Cada tipo de sinal é axeitado para distintas situacións.

¡¡Importante!! Non mesturar nun mesmo grupo de imaxes iconos, índices e símbolos. Os procesoso mentais para interpretalos son moi distintos e se aparecen xuntos poden crear confusión.

Técnicas para facer imaxes efectivas

O primeiro que temos que facer é pensar se é axeitado o uso dunha imaxe. Se así é, determina e que tipo de sinal cómpre utilizar: icono, índice ou símbolo.

• Se non queres representar un concepto abstracto: icono ou índice
• Se a imaxe vai ser utilizada constantemente e dun xeito coherente, podes escoller un símbolo
• Se o que queres codificar é un concepto abstracto, recurrir ó texto

Exemplos
Algúns iconos utilizados no Dreamweaver	Símbolos utilizados no Windows XP en tódolas ventanas para minimizar, maximizar e pechar ventana.

Se queremos utilizar un icono ou un índice:

1. Escolle unha representación fiel e o punto de vista máis representativo.
2. Determina o nivel de abstración preciso. A práctica irache dicindo ata onde podes chegar no proceso de abstración.
3. Comenza a quitar detalles innecesarios, experimentando continuamente con diferentes combinacións dos elementos que poidan identifica-la imaxe.
4. Simplifica as formas empregando figuras xeométricas
5. Elimina contornos que non sexan precisos. Xoga co espazo negativo.
6. Se vai ser utilizado xunto con outras imaxes, necesitas que teñan coherencia unhas con outras: cores predominantes, tipo de trazos, tamaño, etc.

Este non é un proceso pechado. O primeiro boceto probablemente sirva como punto de partida para unha mellor idea e así sucesivamente ata obter o resultado desexado.

Comentarios finais

O deseño de imaxes para interfaces gráficas non é cuestión de habilidades artísticas, se non de seren capaces de plasmar un concepto nunha imaxe que fale por si soa. O obxectivo é axudar na comunicación (cousas especialmente importante se a túa audiencia é xorda) para facer programas e webs máis sinxelas.

Isto non quere dicir que a estética e capacidade comunicativa sexan incompatibles.

Ligazóns

Guías de estilo de Apple para o deseño de iconos.

Bibliografía

• Designing Visual Interfaces.
• Kevin Mullet e Darrel Sano. Prentice Hall.