Curso de Informática Aplicada a la Educación

Diseño Interactivo

Una vez se tengan definidos los aspectos educativos y de contenido se debe pensar en cómo se quiere que el usuario los vea e interactúe con ellos, de esta forma se diseñará el ambiente en el que se va a mover el estudiante utilizando un computador. (Ver presentación)

Requerimientos Funcionales

Se deben conocer y tener en cuenta las características de desarrollo físico y mental de los usuarios para saber de qué dispositivos y ayudas para la comunicación usuario-computador se requieren, estos requerimientos deben estar por escrito,

Metáforas y Paradigmas

Metáfora : Comparación y Utilización de objetos del mundo real en el Diseño de una Interfaz Paradigma: Viene del latín Paradigma y este del griego Paradeigma que quiere decir modelo, ejemplo.

Diseño de Interfaces

Cuando uno usa una herramienta, o accede e interactúa con un sistema, suele haber “algo” entre uno mismo y el objeto de la interacción.

En un auto, ese “algo” son los pedales y el tablero. En una máquina expendedora o un ascensor, los botones. En un computador, el teclado, el monitor, el mouse, y otros periféricos.

Este “algo” nos informa qué acciones son posibles, el estado actual del objeto y los cambios producidos, y nos permite actuar con o sobre el sistema o la herramienta.

Ese “algo”, que es a la vez un límite y un espacio común entre ambas partes, es la interfaz.

Para conocer más acerca del diseño de interfaces por favor visite los siguientes vínculos:

Curso de diseño de Interfaces Visuales
http://www.cs.cinvestav.mx/CursoVis/ContenidoVis.html

Vínculos sobre usabilidad de interfaces de computador
http://www.microsoft.com/usability/webconf.htm

Ejemplos de malos diseños
http://www.webpagesthatsuck.com/

Tips de diseño digital
http://www.dsiegel.com/tips/
http://www.unplug.com/great/
http://www.websitetips.com/

Vínculos sobre diseño digital
http://www.desarrolloweb.com/directorio/diseno/

Manejo

Una vez se hayan definido los requerimientos funcionales, la metáfora o paradigma y la interfaz a utilizar, se debe especificar el manejo que tendrá la herramienta, si se utilizará el teclado, el ratón, una pantalla sensible al tacto, etc.

Mapas de Navegación

Para tener una mayor claridad sobre la estructura general, la lógica de funcionamiento y el flujo de información del material es importante realizar un mapa de navegación que consiste en un esquema donde se incluyen todos los sitios, pantallas y rutas posibles de interacción del material.

Pantallas de Esquema

Para ir aterrizando todo lo diseñado es importante realizar unos bocetos donde ya apliquemos todo lo pensado en la interfaz, no serán exactos a la interfaz definitiva pero ayudarán al diseñador a aproximarse con mayor precisión a lo que tenemos en mente.
Las pantallas de esquema deben representar cada tipo de página que se quiere desarrollar.

Prototipo de Trabajo:

Con las pantallas de esquema se puede armar una presentación en alguna herramienta de propósito general que permita simular el comportamiento de la herramienta final.