Diseño de una interfaz de chat para móviles tomando en cuenta el needfinding, una interpretación del calm technology para lo visual en pantallas pequeñas y cuya evaluación se basó en las pruebas de comunicabilidad de la ingeniería semiótica y un modelo simple de los modos de apelación de la retórica.
Tesis de la Maestría en Diseño de Información de la Universidad de las Américas Puebla (UDLAP), localizada en San Andrés, Cholula.
---
Design of a chat interface for mobiles considering a needfinding excercise, an interpretation of calm technology according to visual inside small displays, and evaluated taking as base communicability tests from semiotic engineering, and from a simple model about the rhetoric's appealing modes.
Master's thesis in Information Design from University of the Americas Puebla (UDLAP), located in San Andrés, Cholula.
Libro DIBUJO I digital (1).pdf, para estudiantes de nivel basico
UDLAP Visual Calm Technology, Semiotic Engineering and Rhetoric for GUI Design
1. O r o aT e
ma S s z c
T ssd Ma sr e
e i e e ta n
í
D s ñ d Ifr có
ie o e no ma in
E c ead C e ca S cae ,
s u l e in is o ils
A tsyH ma ia e
re u nd d s
D p r me t d
e at no e
a
Aq i cuay i ñ
ru e tr Ds o
t e
Otñ , 0 6
o o 20
3. Tesis realzada por Omar Sosa Tzec, sometda al
Departamento de Arqutectura y Dseño, en cumplmento
parcal de los requstos para obtener el grado de
Maestro en Diseño de Información
Sínodo
Director de Tesis Mtro. Samuel Cortna Arteaga
Mtro. Alejandro Ortz Lma
Mtro. Horaco Iván Rodríguez Juárez
Universidad de las Américas, Puebla
Escuela de Cencas Socales, Artes y Humandades
Otoño, 2006
Correo de Contacto:
omar.sosa@gmal.com
om@tzek-desgn.com
Portafolio en línea:
www.tzek-desgn.com
4. Resumen
Este trabajo de tesis se contextualiza en el ámbito de la computación
ubicua, las tecnologías de información, los nuevos procesos comu-
nicativos entre los seres humanos, mediados por las dos anteriores,
y la importancia del diseño de información para resolver interfaces
gráficas de usuario de aplicaciones de comunicación, en particular
de mensajería instantánea a través de Internet, utilizando disposi-
tivos electrónicos de pantalla pequeña; en este caso de un dispo-
sitivo de tipo Smartphone. Se propone la interfaz para un cliente
de mensajes denominado MoviTalk, desarrollada a través de un
proceso de búsqueda de necesidades para el diseño de información
que introduce nuevos métodos basados en el muestreo de experien-
cia y adaptando la filosof ía del paradigma de tecnología de calma.
En adición, se presenta un resumen monográfico de la teoría de
Interacción Humano-Computadora llamada Ingeniería Semiótica
con el fin de tener una perspectiva más amplia para el diseño de la
interfaz, además de la usabilidad, y poder así establecer un diseño
esquemático e innovador que sea adecuado al contexto planteado.
Junto con las ideas de Ingeniería Semiótica, se introduce un nuevo
enfoque para el diseño de interfaces basado en los modos de persua-
sión o apelación de la retórica, en conjunto con un método simple
que permita caracterizar espacialmente una interfaz en este sentido.
De esta forma, la interfaz del MoviTalk fue sometida a pruebas de
comunicabilidad provenientes de esta teoría, así como de usabilidad
y este nuevo enfoque retórico-apelativo, para extraer conocimiento
sobre la aceptación y factibilidad de uso de este proyecto.
7. Agradecimientos
Este proyecto de tesis es una realidad gracias a muchas personas
que con buena voluntad y cariño hicieron posible que llegara a este
punto tan importante de mi vida.
Quiero agradecer a Samuel Cortina, mi asesor, por su tiempo, orien-
tación y valiosos comentarios para desarrollar este trabajo.
Agradezco a mis profesores de la Maestría en Diseño de información
por darme la oportunidad de abrir “mi visión” del mundo con una
perspectiva fresca, que sin duda ha roto paradigmas en mi persona.
Gracias a David por mostrarme la importancia y utilidad de la visua-
lización, a Hanno por darme a conocer los conceptos de retórica que
hoy me permiten construir un nuevo enfoque de diseño de interfaces
e información en general. A Roberto, por introducirme al método de
búsqueda de necesidades, el muesreo de experiencias y el paradigma
de tecnología de calma, herramientas que perfilaron el camino por
cual podría conducir esta tesis. También agradezco a mi coordinador
Alejandro Ortiz, no sólo por sus motivantes comentarios sobre este
trabajo, sino por todo el apoyo brindado durante toda la maestría.
Quiero agradecer a mis amigos de la MDI por hacer tan rica esta
experiencia. A Jaime, Janet, Viry, Omar, Jorge, Lasso, Lulú y Claudia
por su amistad y apoyo, tanto en el tiempo que duró la maestría, así
como la ayuda que me brindaron para realizar este trabajo, y otros
más que tuvimos durante nuestros estudios. Mucho cariño a ustedes.
Gracias a Leslie, Rocío, Sergei, Víctor y al Mtro. Luis Gabarrón
por su disponibilidad para realizar las pruebas para la interfaz del
MoviTalk, quienes en conjunto con Elena, Juan y Alejandro, me
han apoyado desinteresada y constantemente, además de desearme
siempre el bien.
También quiero agradecer a Mau, Edgar, Víctor Hugo y Carlos Ferco
por su sincero apoyo y tiempo invertido en ayudarme a resolver
contingencias que se me presentaron durante el desarrollo de esta
tesis. Bien saben cuánto aportaron a este trabajo y a tranquilizar mi
desesperación cuando pensaba que no podría concluir este proyecto.
De corazón, espero no haber dejado a alguien fuera de estos agrade-
cimientos. En general, todas las personas que de alguna u otra forma
han sido parte de experiencia de vida en Puebla hasta el momento,
tienen gran valor para concluir hoy este ciclo de mi vida. Gracias.
v
9. Contenido
Págna
1 1. IntroduccIón
5 2. PrelImInares
7 2.1. Interfaz e Interfaz Gráfica de Usuario
8 2.2. Diseño de Información e Interacción Humano-Computadora
10 2.3. Usabilidad
11 2.4. El Chat
15 3. dIseño de InformacIón e Interfaces de usuarIo
17 3.1. Visualización de Información y su relación con las GUI
28 3.2. Diseño de información para Baby Faces
39 4. IntroduccIón a la IngenIería semIótIca
41 4.1. Conceptos generales de Semiótica
44 4.2. Semiótica y HCI
46 4.3. Qué es la ingeniería semiótica
50 4.4. Conceptos teóricos que utiliza la Ingeniería Semiótica
54 4.5. La ingeniería semiótica y el diseño de interfaces
54 4.5.1. Perspectiva considerada en el diseño de interfaces
58 4.5.2. Diseño de la metáfora del centro de comunicación
61 4.6. Comunicabilidad
64 4.7. Pruebas de Comunicabilidad
64 4.7.1. Cómo evaluar la comunicabilidad
66 4.7.2. Etiquetar la comunicación usuario-sistema
67 4.7.3. Interpretación de los registros
69 4.7.4. Generación del perfil semiótico
70 4.7.5. Mejoramiento del discurso del intermediario del diseñador
73 5. otras HerramIentas Para el dIseño de InformacIón
75 5.1. Observación participante
76 5.2. Búsqueda de Necesidades
79 5.3. Introducción al Muestreo de Experiencias
x
10. Contenido (continuación)
83 6. metodología Para el dIseño de una guI
85 6.1. El paradigma de Tecnología de Calma
87 6.2. Métodos mixtos para diseñar una GUI
87 6.2.1. Bitácora de uso
90 6.2.2. Registro de actividades
91 6.2.3. Aplicación y resultados de una encuesta de satisfacción
95 6.2.4. Resultados de los métodos aplicados
100 6.2.5. Primer diseño de GUI para IM
106 6.3. MoviTalk: GUI de un cliente IM para SmartPhones
106 6.3.1. Búsqueda de necesidades a través de diseño participativo
110 6.3.2. Retórica en el diseño de GUI
114 6.3.3. Proceso de bocetaje, toma de decisiones y pruebas con un
grupo de enfoque
118 6.3.4. Diseño de GUI final
124 6.4. Aplicación de Pruebas mixtas
127 7. resultados y dIscusIón
137 8. conclusIones y trabajo futuro
141 a. clIentes de cHat Para Pc en el mercado
147 b. bItácora de uso
151 c. escenarIos y tareas Para las Pruebas
155 d. maquetas
159 referencIas
165 índIce alfabétIco
x
11. Lista de Diagramas, Esquemas,
Figuras y Tablas
9 Diagrama 1. Modelo teórico del diseño de información a partir de las
disciplinas que lo componen según Petterson.
31 Diagrama 2. Espacios de uso de los dispositivos móviles.
36 Diagrama 3. Representación gráfica del modelo valente-arousal de
emotions utilizado por Sánchez et al., 2005.
89 Diagrama 4. Metodología extra aplicada a la bitácora.
90 Diagrama 5. Metodología adjunta aplicado a las anotaciones en la
bitácora de uso.
91 Diagrama 6. Registro de actividades como un pseudo-ES.
92 Diagrama 7. Consideraciones implicadas en la aplicación de una
encuesta de satisfacción.
98 Diagrama 8. Pseudo-poliedro de actividades.
98 Diagrama 9. División en cada cara del pseudo-poliedro de actividades.
112 Diagrama 10. Modelo del triángulo retórico en el diseño de información.
7 Esquema 1. Modelo Ontológico Tríadico para la Interfaz según Gui
Bonsiepe aplicado al ejemplo de cortar una pieza de papel.
101 Esquema 2. Actividades básicas en una computadora conectada a Internet.
13 Figura 1. Pantallas del MSN Messenger para PDA.
25 Figura 2. Interacción social en línea generada por el software
People Garden.
26 Figura 3. Visualizaciones de anémona de un sitio del MIT.
27 Figura 4. Visualización valente para la relación entre las palabras
encontradas en una novela.
28 Figura 5. Muestras de la interfaz de Chat Circles.
35 Figura 6. Vista general del concepto de diseño de teléfono móvil
propuesto por Berg et al., 2003.
88 Figura 7. Representación para las variables visuales relacionadas con
un cliente IM en una pantalla pequeña.
100 Figura 8. Representación visual de los eventos posibles en las venta-
nas de un IM.
95 Figura 9. Proyección de la bitácora realizada.
102 Figura 10. Lista de contactos de un Prototipo de chat CT.
102 Figura 11. Idea para cambio de estado de conexión.
103 Figura 12. Selección de miembros en la lista de contactos en el pri-
mer prototipo de chat.
103 Figura 13. Uso del menú contextual en el primer prototipo de chat.
104 Figura 14. Selección de usuarios fuera de línea.
104 Figura 15. Prototipo de ventanas de chat CT para pantallas pequeñas.
105 Figura 16. Demostración de la función de marquesina para chateo.
105 Figura 17. Ejemplo de CT en la interfaz del primer prototipo para
funciones no principales.
106 Figura 18. Tabla de tendencia de búsqueda en Google de los celulares
x
12. contra los smartphone.
107 Figura 19. Planteamiento del ejercicio de diseño participativo.
108 Figura 20. Desarrollo de ideas dados los scenarios y personas.
108 Figura 21. Etapa de análisis, discusión y definición de la funcionali-
dad del chat.
109 Figura 22. Bocetos de interfaz.
109 Figura 23. Presentación de bocetos.
114 Figura 24. Mapa mental de las ideas resultantes del diseño participativo.
114 Figura 25. Bocetos de rediseño para la pantalla de inicio.
115 Figura 26. Idea convencional para la lista de contactos en MoviTalk.
115 Figura 27. Inclusión de la idea de representar la lista de contactos
con un grafo.
116 Figura 28. Bocetos que trataban de resolver la representación en
forma de grafo en la GUI.
116 Figura 29. Boceto de ideas finales para el diseño de GUI del MoviTalk.
117 Figura 30. Discusión de los bocetos de MoviTalk por parte de un
grupo de ingeniería de software.
118 Figura 31. Pantalla de acceso al servicio IM de MoviTalk.
121 Figura 32. Lista de contactos del MoviTalk en dos tiempos diferentes
pero con los mismos contactos conectados.
121 Figura 33. Adminstración de datos del usuario y de los contactos en
la ventana por grupos.
121 Figura 34. Ventana de chat en el MoviTalk.
122 Figura 35. Posibilidad de chat múltiples en MoviTalk.
123 Figura 36. Resultado de recibir un archivo de un contacto en particular.
123 Figura 37. Video chat interactivo en MoviTalk.
123 Figura 38. Ventana de ToDo’s para el MoviTalk.
124 Figura 39. Prueba de caracterización retórica de la interfaz.
125 Figura 40. Aplicación de pruebas para la usabilidad/comunicabilidad.
126 Figura 41. Registro y Análisis de Usabilidad y Comunicabilidad.
130 Figura 42. Resultado de la caracterización relativo por parte de los
usuarios de la lista de contactos del MoviTalk y su triángulo retórico.
145 Figura 43. Frecuencia de rupturas en la comunicación con la interfaz
del MoviTalk.
142 Figura 44. Imagen un tutorial que muestra las últimas características
en el ICQ.
143 Figura 45. Visita guiada que muestra una de las nuevas característi-
cas en el mensajero de Yahoo!
144 Figura 46. Imágenes del AIM en su versión para Linux y MacOS,
respectivamente.
144 Figura 47. Pantalla de inicio de sesión en el MSN Messenger.
145 Figura 48. Pantallas correspondientes a la lista de contactos y de chat
en Google Talk.
20 Tabla 1. Adaptación de las variables bertinianas para procesos de
diseño gráfico según Mijksenaar.
30 Tabla 2. Áreas de investigación y salidas determinadas por Marcus
para el proyecto Mob-i.
x
14. En la actualidad la comunicación y la tecnología son dos conceptos
que se encuentran muy ligados. La comunicación efectiva entre dos
individuos puede efectuarse a pesar de grandes distancias, gracias a
las tecnologías de información y los dispositivos electrónicos que las
emplean. Así, ha roto incluso paradigmas temporales y mediáticos,
ya que gracias a los avances tecnológicos, el proceso puede darse en
forma asíncrona (y aún así efectiva) y presentada ricamente a través
de la combinación de medios.
Como parte de estos nuevos procesos comunicativos se encuentran
algunos servicios de Internet, disponibles en computadoras que
funcionan como estaciones de trabajo o bien, en dispositivos tecno-
lógicos ubicuos como los celulares y PDA (asistentes electrónicos),
entre los cuales se encuentran el correo electrónico, los blogs y por
supuesto, la capacidad de envío de mensajes instantáneos. Este últi-
mo servicio ha dejado una marca en la manera en la que los indivi-
duos no sólo se comunican, sino comparten también información en
un sentido general; de ahí la importancia del servicio.
En la literatura existen una gran variedad de trabajos que consideran
tanto la representación de la información en un sistema de mensajes
instantáneos vía Internet (Viegas et al., 1999), así como el comporta-
miento social y nuevas necesidades para usuarios deestos dispositi-
vos tecnológicos ubicuos (Marcus et al., 2002; Berg et al., 2003). Este
trabajo de tesis se interesó originalmente en el diseño de una interfaz
gráfica tomando en cuenta estos trabajos y otros de visualización de
información (Fry, 1997, 2000; Maeda, 2004) para intentar resolver
el problema de administración de espacio de las múltiples ventanas
que suelen aparecer al utilizarse un programa de envío de mensajes
instantáneos en una computadora portátil de pantalla pequeña. Lo
anterior condujo al desarrollo de un anteproyecto cuyo objetivo es
evitar la carga cognitiva en los usuarios dadas las múltiples funciona-
lidades y características que pueden encontrarse en la interfaz (Sosa
Tzec et al., 2005). Para lograr el objetivo, el diseño se basó en el
paradigma de Calm Technology (Weiser, 1995), el cual originalmente
aplica a los dispositivos ubicuos, no a sus interfaces. Para conseguir
el mapeo de ideas provenientes de este paradigma, se realizó un
ejercicio de búsqueda de necesidades (Patnaik et al., 1999) y el desa-
rrollo de métodos basados en el muestro de experiencias (Hurlburt,
2006a, 2006b). En particular, cuando se trata de dispositivos móviles
y tomando en cuenta que muchos ellos despliegan la información en
pequeñas pantallas (i.e. displays), entonces, puede ser factible cues-
tionar cuál es la mejor forma de presentar la información dadas las
restricciones de tamaño, y más aún, de captura (local) y acceso (vía
remota) de los datos. Por todo lo anterior, una interfaz de usuario de
un programa de mensajes instantáneos por Internet en un disposi-
tivo móvil presenta un reto interesante de diseño de interfaces y por
ende, de diseño de información. Este trabajo ve dicho reto como una
2 Introducción
15. gran área de oportunidad dada la tendencia del cómputo ubicuo.
Así, se propone el diseño de la interfaz, metodológicamente soporta-
do, de un programa de envío de mensajes instantáneos por Internet
para un dispositivo de tipo Smart Phone (i.e. combinación de celular
y PDA) conservando el mismo objetivo antes descrito. Entre los
detalles del soporte metodológico se introducen los métodos desa-
rrollados en el anteproyecto mencionado, la propuesta de un nuevo
enfoque para el diseño de interfaces tomando en cuenta los medios
de apelación retóricos y la construcción de su espacio de diseño, así
como la evaluación del producto de diseño resultante bajo una nueva
teoría de diseño de interfaces, e Interacción Humano-Computadora
en general, denominado Ingeniería Semiótica (de Souza, 2005a).
La organización de este documento es como sigue:
En el capítulo 2 se presentan los preliminares necesarios para la
comprensión de este trabajo, definiendo términos tales como inter-
faz, interfaz gráfica de usuario, diseño de información y su relación
con la disciplina de Interacción Humano-Computadora, qué es la
usabilidad y que se entiende por la palabra chat.
El siguiente capítulo explica que es la visualización de información,
esquemática general y computacional, y muestra la relación posible
con las interfaces gráficas de usuario. Se introduce el término de
Baby Faces para denotar las interfaces situadas en pantallas peque-
ñas (como en un celular) y se explican algunos trabajos encontrados
en la literatura.
El capítulo 4 explica en forma monográfica la nueva teoría para la
Interacción Humano-Computadora denominada Ingeniería Semióti-
ca, así como su proceso de evaluación de interfaces de usuario.
En el quinto capítulo se explican brevemente tres métodos cuali-
tativos que fueron usados en el proceso de diseño en esta tesis: La
observación participante, la búsqueda de necesidades y el muestreo
de experiencias.
Posteriormente, el capítulo sexto muestra todo el proceso de diseño
elaborado en este trabajo de tesis. Se explican los métodos emplea-
dos para un primer diseño de interfaz y cuáles fueron sus resulta-
dos. Posteriormente se muestra el trabajo evolutivo hasta liberar el
diseño final, así como su evaluación.
El capítulo 7 comenta los resultados obtenidos en este trabajo de
tesis.
En el último capítulo, el octavo, se establecen las conclusiones y se
plantea el trabajo a futuro.
Introducción
16. Introducción
Interfaz Observación Participante
GUI Needfinding
HCI Experience Sampling
Usabilidad
Prmer Dseño
Chat
de GUI
Infovis
Baby Faces
Calm Technology
Bitácora de Uso
Registro de Actividades
Encuesta de Satisfacción
MovTalk
Dseño de GUI
Semiótica
HCI Semiótica
Ingeniería Semiótica Espacio Retórico de GUI
I.S. Diseño de Interfaces Diseño Participativo
Comunicabilidad Pruebas de Papel Resultados y Conclusones y
Pruebas de Comunicabilidad Dscusón Trabajo Futuro
Aplicación de Pruebas Mixtas
17. Este capítulo comienza explicando la
definición bajo la cual se entiende el
témino de interfaz en este trabajo. Luego
se explican diferentes definiciones acerca
de lo que se entiende por diseño de
información y cuál es su diferencia con el
diseño gráfico.
Se establece entonces la conexión del
diseño de información y la Interacción
Humano-Computadora. Relevante en los
diseños elaborados en ambas disciplinas,
se define el término usabilidad y los cinco
atributos que la caracterizan. Por último
se hace una breve exposición de los
clientes de mensajería instantánea por
Internet, o simplemente chat.
Preliminares
19. 2.1. Interfaz e Interfaz Gráfica de Usuario
Gui Bonsiepe (1998) menciona que existe un agente social que quiere
cumplir una acción, la cual es en sí una tarea porque hay un objetivo
particular involucrado; así, el usuario necesita un artefacto para eje-
cutar dicha tarea. Todo el proceso puede ser visto como una unidad
compuesta de tres elementos heterogéneos: el usuario, el objetivo
de una acción y un artefacto. Luego, según comenta, la conexión
de estos tres elementos puede ser establecida únicamente vía una
interfaz. La interfaz no es un objeto, es un espacio en el cual recae
la interacción entre el cuerpo humano, la herramienta y el objeto de
acción (Bonsiepe, 1998).
Este autor muestra un ejemplo efectivo: El usuario necesita cortar
algo, por ejemplo una pieza de papel, así que la tarea es entonces
cortar. Luego, el artefacto requerido puede ser un par de tijeras. Tal
como menciona Bonsiepe (1998), un objeto puede ser llamada “ti-
jeras” unicamente si satisface las condiciones de tener dos cuchillas
cortantes; y para pasar a considerar las tijeras como un artefacto, es
necesario que estas cuchillas estén complementadas con algún dis-
positivo el cual permita a un ser humano interactuar con ellas. Por
lo tanto, la interfaz es el factor constitutivo de la herramienta (i.e. las
tijeras per se). Es claro que la interfaz es cualquier cosa que provee
el medio para interactuar con un objeto, de forma que este objeto
resulta en un artefacto o herramienta, con el propósito de completar
una tareas. Lo anterior deriva en un modelo ontológico triádico para
la definición de una interfaz (Bonsiepe, 1998).
Esquema 1.
Modelo Ontológco Tríadco
para la Interfaz según
Gu Bonsepe aplcado al
ejemplo de cortar una peza
de papel.
En inglés, el verbo to interface significa interconectar dos o más en-
tidades en un punto común o frontera común, o preparar cualquier
entidad para ese propósito. Así, una interfaz de usuario puede deter-
minarse como los atributos funcionales y sensoriales de un sistema
(programa computacional, un vehículo, etc.) que resultan relevantes
a sus usuarios para su operación (Wikipedia, 2006).
Preliminares
20. Una interfaz gráfica de usuario o GUI (por sus siglas en inglés y
pronunciado güi) es un método de interactuar con una computado-
ra a través de una metáfora de manipulación directa de imágenes y
widgets1 en adición a texto (Wikipedia, 2006). En las ciencias de la . Componente de Ven-
tana. El bloque básco de
computación, una metáfora debería ser interpretada como una en- construccón de una nterfaz
tidad, frecuentemente con una visualización de naturaleza icónica o gráfica.
textual, el cual representa algo que puede ser encontrado en el “mun-
do real” donde puede funcionar a su vez como una interfaz.
2.2. Diseño de Información e
Interacción Humano-Computadora
Entre las décadas de los 50s y 60s, Lidman y Lund (citados en Petter-
son, 1998) describieron las ventajas de una maquetación informativa
donde el texto, imágenes y diseño gráfico trabajaran juntos para for-
mar un mensaje que sea fácil a su lector de recibir y entender. Ellos
la llamaron el “tercer lenguaje” así como “maquetación lexi-visual”.
Lo anterior en contraste a la maquetación tradicional artística, la
cual podría complacer la individualidad del diseñador gráfico artís-
tico, pero la cual no tiene relación con el contenido del mensaje. La
maquetación informativa tiene un propósito práctico y tres puntos
importantes:
1. El tema del contenido,
2. el propósito pedagógico, y
3. la forma estética.
Así, los productos lexi-visuales son resultados de trabajo en equipo
entre sujetos expertos en la materia, visualistas y editores. Este con-
cepto fue evolucionando y afinándose hasta concretarse en lo que
hoy se conoce como diseño de información (Petterson, 1998).
El diseño de información es la definición, planeación y acción de dar
forma al contenido de un mensaje en los ambientes en los que es
presentado, con la intención de alcanzar ciertos objetivos particula-
res en relación a las necesidades de sus usuarios (IIID, 2006). Según
Martín Fernández (NSU, 2006): “el diseño de información tiene una
gran variedad de raíces disciplinares entre las cuales se incluye el
diseño de interfaces, la comunicación visual, la presentación de la
información, la tipograf ía y la psicología cognitiva”.
Para Petterson (1998) el origen del diseño de información se encuen-
tra en
1. El diseño gráfico (enfocada en la maquetación lexi-visual),
2. educación y enseñanza (uso de medios audiovisuales, tecnología
educativa, tecnología instruccional, literatura visual, diseño instruc-
cional y diseño de mensajes instruccionales),
3. arquitectura e ingeniería (ilustración técnica, escritura técnica,
presentación visual y comunicación técnica).
Preliminares
21. Socedad
Lenguaje Arte
Tecnologías
Negocos
de los
y ley
medos
Comuncacón Informacón
Diagrama 1.
Modelo teórco del dseño
de nformacón a partr de las Cogncón
dscplnas que lo componen
según Petterson.
El objetivo del diseño de información para Horn (citado en NSU,
2006) es “la conexión entre la información, el pensamiento humano
y el uso”; comenta que los tres requisitos para un buen diseño de
información se determinan a través de:
1. Documentos comprensibles,
2. sistemas interactivos, y
3. espacios de información navegables.
De lo anterior, Martín Fernández indica que la relevancia del primer
requisito es la compresión de la información transmitida y que
existen diferentes perspectivas para cumplirlo, dependiendo de la
disciplina. Para este autor, y tomando como referencia a Horn, la
comprensibilidad de los documentos está directamente relacionada
con el empleo de lenguajes visuales y las representaciones mentales
de este tipo en los usuarios, lo cual conduce a la visualización de
información (NSU, 2006).
El diseño de información es explicado por Paul Mijksenaar (2001)
como una disciplina interdisciplinaria, donde los diseñadores tien-
den a combinar los valores y principios descubiertos por otras dis-
ciplinas en un todo funcional que desemboca en un conjunto mayor
que la suma de las partes que lo componen. Esto es, la información
resulta en algo más rico que lo que se espera conseguir del simple
hecho de yuxtaponer diferentes elementos en el diseño. Este autor
menciona que el diseño siempre implica tres elementos relacionados
de manera intextricable: durabilidad, utilidad y belleza; la combina-
ción adecuada de estos tres elementos son importantes para lograr
un buen producto de diseño, tomando esto último como una activi-
dad que une los elementos de durabilidad y utilidad, e intensifica la
percepción estética (Mijksenaar, 2001).
Preliminares
22. Así, puede entenderse que el diseño de información motiva y partici-
pa activamente en investigación que incremente el entendimiento de
la información y el efecto que ésta tiene: cómo y por qué los huma-
nos responden a la información, cómo el cerebro humano procesa
la información y construye conocimiento y, cómo los humanos
organizan el conocimiento… Mejor entendimiento de estos factores,
permitirá crear la mejor información posible, interfaces y comunica-
ciones (Boxes and Arrows, 2006).
Las cuestiones referentes al diseño de interfaces en las ciencias de
la computación se tratan en la disciplina de la Interacción Humano
Computadora (HCI por sus siglas en inglés), aunque en la práctica
es de carácter interdisciplinario. La anterior, estudia en general la
interacción entre la gente (i.e. los usuarios) y las computadoras, la
cual ocurre en la interfaz de usuario (o simplemente interfaz) y que
considera tanto el hardware como el software, por ejemplo, para de-
terminar el qué y el cómo de la información presentada a un usuario
en la pantalla (Wikipedia, 2006). Así, las ciencias de la computación,
dentro de la disciplina de HCI, comparte intereses con el diseño de
información en cuanto al diseño de interfaces de usuario (gráficas y
de cualquier tipo). Por lo que podría considerarse que el desarrollo
de las teorías y obtención de resultados en las ciencias de la compu-
tación son aplicables a cuestiones del diseño de información.
2.3. Usabilidad
El término usabilidad va de la mano con los productos del diseño
de información tomando en cuenta la ruptura con la maquetación
tradicional artística explicada por Petterson (1998). En realidad,
dicho término no existe en el español, es un anglicismo de la palabra
usability, lo cual tendría su equivalente con lo que podría llamarse
útil. Aún más, es un estándar de facto denominar con la palabra
usable a los productos de diseño que poseen un grado palpable de
usabilidad. Luego, la usabilidad es la combinación de cinco atributos
relacionados con la facilidad de uso a considerar durante el proceso
de diseño (Nielsen, 1993):
1. Aprendizaje. El sistema debería ser fácil de aprender, tal que el
usuario rápidamente consiga terminar algo de su trabajo con
el sistema.
2. Eficiencia. El sistema debería ser eficiente al usarse, de modo
que una vez que el usuario a aprendido a usar el sistema, incremente
su productividad altamente.
3. Memoria. El sistema debe ser fácil de recordar, ya que si un
usuario casual regresa al sistema después de un período de no usar-
lo, no tiene que aprender todo de nuevo.
4. Errores. El sistema debe tener una razón baja de errores, lo cual
induzca a que los usuarios cometan pocos errores durante el uso del
0 Preliminares
23. sistema y de tal modo que si los cometen, puedan recuperarse fácil-
mente. Aún más, los errores catastróficos no deben ocurrir.
5. Satisfacción. El sistema debe ser placentero de usar, de tal forma
que los usuarios quedan subjetivamente satisfechos al usarlo;
les gusta.
La usabilidad es típicamente medida al realizar un número de prue-
bas de usuarios (seleccionados lo más representativo posible con res-
pecto a los usuarios intencionados), en las que realizan un conjunto
preestablecido de pruebas (Nielsen, 1993). Las pruebas de usabilidad
se caracterizan según Dumas et al. (1999) por lo siguiente:
1. La meta primaria es mejorar la usabilidad del producto.
2. Los participantes representan usuarios reales.
3. Los participantes hacen tareas reales.
4. Es posible observar y registrar lo que los usuarios dicen y hacen.
5. Los datos son analizados para diagnosticar problemas reales, y
recomendar los cambios para repararlos.
2.4. El Chat
2. Palabra provenente del El wiki2 enciclopédico Wikipedia (2006), en su versión en inglés, de-
caló de Internet que define a
los stos web donde todos
fine chat como el acto de hablar de cosas ordinarias que no son muy
pueden crear o edtar sus importantes, el equivalente en español corresponde a “platicar”. En
págnas (Wkpeda, 2006). adición, también explica que: “la gente también utiliza esta palabra
ahora para lugares en la Internet donde pueden hablar con muchas
diferentes personas al mismo tiempo. Usualmente, usted puede
platicar en la Internet en un cuarto de plática o con un servicio de
mensajes como el AOL Instant Messenger (AIM), Yahoo Messenger,
o MSN Messenger”.
Para la gente de habla hispana, emplear la palabra “platicar”, para re-
ferirse a esta comunicación vía Internet, no es tan usada, sino que en
forma coloquial se emplea la palabra “chatear”, la cual es en realidad
un anglicismo del verbo platicar en inglés.
Para poder chatear, la gente utiliza un programa de computadora
denominado cliente. Existen dos tipos de clientes para chatear, uno
que emplea el protocolo llamado en inglés Internet Relay Chat (IRC)
y uno simplemente para envío de mensajes instantáneos. Los usua-
rios chatean en un cliente IRC conectándose a un servidor, en el cual
pueden acceder a un canal (temático) y comunicarse en tiempo real
con otros usuarios presentes en dicho canal. En el caso de la mensa-
jería instantánea (IM por sus siglas en inglés) los usuarios mandan
mensajes a sus contactos, a diferencia del correo electrónico, en
tiempo real. (Wikipedia, 2006).
La historia redactada por la comunidad del Wikipedia (2006) co-
Preliminares
24. menta que la primera forma de mensajería se implementó en 1970.
Para las décadas de los 80 y 90, se empleó el Talk para la plataforma
Unix. Luego, en noviembre de 1996 apareció para computadoras con
sistema operativo diferente a Unix el cliente ICQ3, el cual provocó la . URL:
http://www.cq.com
posterior aparición de varios clientes IM hasta la fecha. Debido a la
variedad, los usuarios debían estar conectados utilizando cada clien-
te para sus correspondientes redes de mensajería, lo cual ha causado
el desarrollo de programas multicliente, como lo son Gaim4, Trillian5 . URL:
http://gam.sourceforge.net/
o Jabber6.
. URL:
De acuerdo al AOL’s Annual Instant Messenger Trend Survey (AOL, http://www.trllan.cc/
2006), los mensajes instantáneos se han vuelto parte importante en 6. URL:
la vida de los estadounidenses y de la gente del mundo. Se comenta http://www.jabber.org/
también que existió un incremento anual del 19%, el cual está ligado
a un contexto laboral, escolar y de estar en movimiento, afirmando
que los estadounidenses envían tantos mensajes instantáneos, sino
es que más, como correos electrónicos. Otro punto importante es
la mención de que los consumidores norteamericanos gustarían de
consumir entretenimiento en conjunto con su servicio de mensajes
instantáneos, así como usar su cliente para hacer llamadas de larga
distancia y a celulares.
Según la Wikipedia (2006), los clientes IM poseen ciertas caracterís-
ticas básicas con respecto a los contactos:
1. Existencia de contactos. Es decir, las “personas” a las que un
usuario puede mandar mensaje. Dichos contactos pueden manifes-
tar varios estados de actividad y/o disponibilidad para chatear (e.g.
ocupado).
2. Mensaje de estado. Palabra o frase que aparece junto al nick7 de . Nck, es una abrevacón
un contacto. de la palabra en nglés nck-
name (apodo) y se refiere al
3. Registro y eliminación de usuarios en la lista de contactos8. identificador de un contacto;
4. Posibilidad de agrupar los contactos. esto es, el “nombre” con
el que utlza el clente IM
5. Empleo de una imagen que le identifique a uno (i.e. un avatar). o IRC.
. Desplegado de todos los
Y otras con respecto al chateo mismo: contactos para un usuaro,
1. La existencia del aviso, el cual no solo es una invitación a una vsbles al momento de co-
conversación, tambien puede ser un indicativo enviado sobre la nectarse con su clente IM.
llegada de un nuevo mensaje.
2. Invitación a chatear en tiempo real.
3. La aparición de mensaje emergente, tal que sólo dura unos
segundos y sirve usualmente como aviso breve.
4. La habilidad de indicar cuando la otra persona se encuentra . La palabra emotcon
tecleando un mensaje durante la conversación. provene de la combnacón
de las palabras en nglés
5. Empleo de emoticons9. emocón e ícono, el cual
srve para expresar el estado
anímco de los usuaros
También existen otras características en el chat como la creación mentras utlzan un clente
de salas o grupos de charla, ya sean públicas o privadas, o incluso el IM o algún concepto o cosa
nherente a la plátca.
envío de invitaciones certificadas para gente selecta. Una caracterís-
2 Preliminares
25. tica importante es el envío de archivos y la posibilidad de usar otros
sistemas de comunicación, como puede ser una pizarra electrónica o
realizar videoconferencias. (Wikipedia, 2006).
Figura 1.
Pantallas del MSN Messen-
ger para PDA.
Algunos mensajeros en el mercado (véase apéndice A) tienen una
distribución para Dispositivos de Asistencia Personal (PDA por sus
0. Se dce que un software siglas en inglés). El ICQ está solo disponible en su versión 1.0 beta10
está en versón beta cuando para la plataforma Windows CE, el sistema operativo que utilizan
se lbera para que los
usuaros lo prueben antes de los PDA de Microsoft, denominados Pocket PC. En el caso de AIM,
hacerlo como un producto su versión determina el PDA en el que se puede instalar, ya sea el
definitivo.
sistema operativo de Palm, Windows CE o Symbian. Debido a que
Google Talk es un servicio, es posible emplear un cliente desarro-
. La averguacón de la llado por otra compañía11. Ciertamente, el contexto de uso entre un
posbldad de los clentes
IM para PDA se realzó en
cliente IM de una PC a un PDA cambia mucho. Para comenzar, se
forma drecta en cada uno tiene la limitante del tamaño de pantalla disponible, la introducción
de los stos web donde de datos a la misma PDA, así como la capacidad de transmisión de
se pueden descargar las
versones para PC. información en forma inalámbrica. Además del interés de investi-
gación causado por estas restricciones, se tienen la interrogante de
cómo diseñar clientes IM que se incorporen a la vida de las personas
dado desarrollo tecnológico, derivando en propuestas de nuevos
mensajeros para PDA como resultado de investigación.
Preliminares
27. Este capítulo comienza con la definición
y caracterización de la visualización de
información, tanto en medios digitales
como analógicos.
Se explica mediante trabajos provenien-
tes de la literatura la importancia de la
visualización esquemática y el poten-
cial interactivo como enfoque principal
en el diseño de una interfaz gráfica; en
particular, el Chat Circles, un mensaje-
ro de Internet con una interfaz gráfica
abstracta, la cual está relacionada con el
objetivo de esta tesis. Considerando que
este proyecto se enfoca a dispositivos
con pantalla pequeña para desplegar la
información se introduce el concepto de
Baby Faces.
Para finalizar se explican otros trabajos
de la literatura, ya sea relacionados con
mensajeros vía Internet o Baby Faces,
que se consideraron relevantes para el
desarrollo de esta tesis.
DiseñodeInformacióneInterfacesdeUsuario
28. “The arts are the science of
enjoying life.”
John Maeda, 2003.
6 DiseñodeInformacióneInterfacesdeUsuario
29. 3.1. Visualización de Información y
su relación con las GUI
La visualización de información involucra una actividad cognitiva y
conlleva a la construcción de modelos internos en la mente (Spence,
2001). Según Fry (2000), tiene su importancia en la capacidad de
ayudar a las personas a “ver” cosas que no han sido previamente en-
tendidas en forma de datos abstractos. En palabras de Costa (1998),
el verbo visualizar se refiere al hecho de hacer visibles y comprensi-
bles al ser humano aspectos y fenómenos de la realidad que no son
accesibles al ojo, y muchos de ellos ni siquiera de naturaleza visual y
está directamente relacionado con el proceso de transformación de
los fenómenos en información y la información en conocimiento.
Joan Costa (1998) particulariza a un tipo de visualización esquemáti-
ca, en la cual un esquema puede considerarse como una representa-
ción gráfica o simbólica de las cosas materiales o inmateriales (RAE,
2006). Sin embargo admite que visualizar per se no siempre está
relacionado con la construcción de esquemas, aunque incluye la
acción de esquematizar (Costa, 1998). Así, para este autor se presen-
tan doce puntos sobre la naturaleza y funcionalidad de la visualiza-
ción esquemática:
1. La “visualización esquemática” no tiene el carácter ni la función
representacional que son propios de la imagen figurativa, ni la fun-
ción narrativa o descriptiva del texto escrito.
2. La primera condición del diseño de información es su valor
semántico y monosémico; no es el valor estético, aunque la visuali-
zación gráfica implica en sí misma unos valores estéticos relativos, a
los que no renuncia: el placer del ojo, la agradabilidad perceptiva y,
por tanto, la eficacia comunicacional por esta vía añadida.
3. Tampoco son objeto del diseño de información, la persuasión
publicitaria, la seducción de la propaganda ideológica, ni el decorati-
vismo o la fascinación óptica.
4. La visualización de información de baja iconicidad, se centra en
“representaciones elaboradas” e iconicidad nula con las presentacio-
nes no figurativas, como lo son los diagramas, gráficos y esquemas.
5. El objeto del diseño de información es la transmisión de conoci-
mientos comprensibles y útiles, tanto para el individuo corriente en
su vida cotidiana, como para el técnico y profesional, y el científico.
6. La información visual tiene fines claramente pragmáticos y su
grado de eficacia depende de cómo el visualista elimina la compleji-
dad de los fenómenos y los procesos y los hace visibles, inteligibles
y comprensibles a los ojos de su receptor, en el mínimo de tiempo y
con el menor número de elementos.
7. La información visual por esquemas se opone a la ambigüedad
abstracta de los fenómenos complejos e inaccesibles a la percepción
directa, o a través de otros modos de presentación (e.g. lingüística), o
de representación por medio de la imagen (en sí misma polisémica)
DiseñodeInformacióneInterfacesdeUsuario
30. y de otros “lenguajes” gráficos.
8. La información visual consiste en presentar mensajes unívocos,
monosémicos, que no admitan otras interpretaciones más que las
que deben suscitar en el receptor humano por medición del diseña-
dor visualista, verdadero organizador de la estructura y los elemen-
tos del mensaje esquemático.
9. La información visual encarna el tránsito de la comunicación
unidireccional y reactiva, hacia la comunicación bidireccional in-
teractiva, en el sentido de la autodidaxia, donde hay un juego entre
los mecanismos de inducción-deducción, por los que el individuo
deja de ser receptor pasivo ante los estímulos que le llegan, para ser
intérprete, actor y protagonista.
10. El cometido de la información visual es reducir la compleji-
dad, reducir la ambigüedad, reducir la incertidumbre. Pero estos
modos de “reducir” lo real para hacerlo comprensible y utilizable,
no pueden ser “reduccionistas” del fenómeno que representan, sino
que deben conservar toda su riqueza real y tener en cuenta al mismo
tiempo las relaciones del fenómeno con su contexto.
11. La información visual debe ser implicante, animar al ojo para
que descifre paso a paso el mensaje, compare las diferentes partes de
los datos gráficos y extraiga así conocimientos prácticos.
12. Los esquemas constituyen un nuevo “lenguaje”, que no es el de
la imagen representacional ni del texto literal. Es un lenguaje lógico,
estructurado, codificado y abstracto.
Los doce puntos anteriores caracterizan a la visualización desde
un punto de vista no necesariamente computacional; esto es, Joan
Costa no se enfoca directamente en lo que podría ser la presentación
de información en un medio digital. En contraste, Spence (2001)
identifica otros elementos, los cuales se plantean cuando el medio es
completamente digital:
1. Selección. De todos los datos disponibles, cada autor debe
seleccionar que datos deben ser relevantes con respecto a una tarea
determinada.
2. Representación. El autor de una herramienta de visualización
debe representar cosas abstractas de alguna forma. En estos as-
pectos se involucran varios métodos de codificación posibles para
aplicar a los datos.
3. Presentación. Cada autor predispone de una diagramación
particular para los datos.
4. Escala y dimensionalidad. El autor debe considerar la dimen-
sionalidad de los datos desplegados en relación con las característi-
cas inherentes en ellos que sean posibles de mostrarse.
5. Reordenamiento, interacción y exploración. La oportunidad
de explorar los datos desplegados no debe ser completa o pocamente
limitada. La habilidad de explorar los datos mediante un reordena-
miento interactivo resulta muy valiosa.
6. Externar. En toda visualización se crea un modelo interno o
DiseñodeInformacióneInterfacesdeUsuario
31. imagen en el usuario. Lo que el usuario ve efectivamente de la visua-
lización, es lo que se considera como externar los datos.
7. Modelos mentales. Resulta importante entender la creación del
modelo interno en los usuarios, para derivar en un buen diseño de
la visualización.
8. Invención, experiencia y habilidad. El éxito de una herramien-
ta de visualización está directamente relacionado con la capacidad
del diseñador de entender la tarea para la cual la herramienta está
intencionada, así como de la variedad y habilidades de él dentro del
rango del diseño visual hasta el diseño algorítmico.
Algunos de estos puntos están relacionados con la percepción de
la visualización misma. Es por esto que resulta relevante identificar
los componentes visuales que conlleven a un mejor resultado. Fry
(2000) enlista estos componentes que define el psicólogo de la per-
cepción, Colin Ware:
1. Forma. Orientación de linea, longitud de línea, ancho de línea,
colinearidad de línea, tamaño, curvatura, agrupación espacial, mar-
cas añadidas, luminosidad.
2. Color. Tono, intensidad.
3. Movimiento. Dirección de movimiento.
4. Posición espacial. Posición en dos dimensiones, profundidad
esteroscópica, forma cóncava/convexa a partir de sombreado.
Por su parte, Costa (1998) también involucra componentes simila-
res en el diseño esquemático, los cuales se toman de los principios
propuestos por Jacques Bertin en su trabajo Sémiologie graphique.
Comenta Joan Costa que el enfoque de Bertin se basaba en conside-
rar las manchas como el elemento base sobre un papel. En este caso,
los componentes o características involucradas con las manchas son:
1. posición,
2. tamaño,
3. valor,
4. grano,
5. color,
6. orientación y
7. forma;
donde las seis últimas se definen como “variables retinianas”. Al
añadir el plano, se cuenta entonces con ocho variables para el diseño
sobre papel. Estas ocho variables bertinianas poseen propiedades
semánticas y capacidades de visualización diferentes e infinitas
(Costa, 1998).
Según Mijksenaar (2001): “los números, monótonos pero exactos,
pueden sustituirse por sorprendentes efectos visuales, pero que
muestran las diferencias con menor precisión. En efecto, el color
y la forma no indican las diferencias cuantitativas y se seleccionan
más o menos al azar. Sin embargo, con ellas es posible, por ejemplo,
DiseñodeInformacióneInterfacesdeUsuario
32. la distinción entre varias categorías”. Añade: “Se puede comenzar
dividiendo las variables en dos categorías: variables jerárquicas, que
denotan una diferencia de importancia, y variables de distinción, que
denotan diferencias de tipo… Las variables jerárquicas se pueden
expresar mediante el tamaño y la intensidad, y las variables de dis-
tinción mediante el color y la forma. Además, existen elementos vi-
suales de ayuda, como zonas de color, líneas y cuadros, cuya función
es acentuar y organizar. En este caso también es posible expresar
diferencias en cuanto a su importancia y tipo”. De lo anterior, este
autor crea una tabla aplicable al trabajo de los diseñadores gráficos,
mostrada a continuación.
Distinción Color
Clasifica según categoría y tipo Ilustraciones
Ancho de Columna
Tipo de Letra
Jerarquía Posición secuencial (cronología)
Clasifica según importancia Posición en la página (maquetación)
Tamaño de letra
Grosor de letra
Interlineado
Soporte Áreas de color y sombra
Acentúa y enfatiza Líneas y recuerdos Tabla 1.
Símbolos, logotipos, ilustraciones Adaptacón de las varables
Atributos de texto (e.g. cursiva) bertnanas para procesos
de diseño gráfico según
Mjksenaar.
Es Joan Costa quien menciona que estos principios establecidos por
Bertin tienen gran relación con las leyes de la psicología Gestalt. Este
término significa “configuración” en español en el sentido estructural
del mensaje (que podría considerarse la visualización per se), o sea,
como un “complejo organizado” cuya articulación de sus elementos,
por medio de leyes de coherencia, es la que determina su propia
forma global (Costa, 1998). Así, este autor enlista dichas leyes:
1. Ley de la totalidad. El todo es diferente y es más que la suma de
sus partes.
2. Ley estructural. Una forma es percibida como un todo, con
independencia de la naturaleza de las partes que lo constituyen.
3. Ley dialéctica. Toda forma se desprende del fondo sobre el que
está establecida. La mirada decide si tal o cual elemento del campo
visual pertenece alternativamente a la forma o al fondo.
4. Ley de contraste. Una forma es mejor percibida en la medida
en que se establece mayor contraste entre ella y su fondo. Este hecho
se denomina usualmente como “de buena forma”.
5. Ley de cierre. Una forma será mejor en la medida en que su
contorno esté mejor cerrado. En efecto, una forma debe volver sobre
20 DiseñodeInformacióneInterfacesdeUsuario
33. sí misma; de otro modo deja escapar la “forma potencial” por esa
“obertura” provocada.
6. Ley de completación. Si un contorno no está completamente
cerrado, la mente tiende a completar o continuar dicho contorno in-
cluyéndole los elementos que son más fáciles de aceptar en la forma,
o que son de algún modo inducidos po ella.
7. Noción de pregnancia. La “pregnancia” es la fuerza de la forma.
Es la dictadura que la forma ejerce sobre el movimiento ocular, así
como su capacidad por imponerse en la mente y en el recuerdo.
8. Ley de simplicidad. En un campo gráfico dado, las figuras me-
nos complejas tienen mayor pregnancia. Una figura simple es aquella
que necesita un menor número de grafemas para constituirla: menos
segmentos de rectas, menos curvas, menos ángulos, menos intersec-
ciones.
9. Ley de concentración (llamada también de simetría, de equili-
brio y de inclusión). Los elementos que se organizan alrededor de un
punto central, que es su núcleo, constituyen en todos los casos, una
forma pregnante.
10. Ley de continuidad. Los elementos que se desarrollan siguien-
do un eje continuo constituyen una forma pregnante.
11. Ley de contorno. Las figuras cuyas formas poseen mayor con-
traste sobre el fondo son agrupadas y asociadas por la percepción, y
poseen un alto potencial de pregnancia.
12. Ley de movimiento coordinado. Los diferentes elementos que
participan de un mismo movimiento constituyen una forma preg-
nante.
13. Ley de continuidad de dirección. Una línea curva es percibida
como un fragmento de circunferencia y un segmento de línea. Esta
ley se relaciona con el efecto estroboscópico sobre el que se funda el
“cierre”. Si los estímulos visuales se suceden rápida, pero separada-
mente, la imagen aparece en movimiento.
14. Principio de invariancia topológica. Una forma resiste a la
deformación en que se la hace incurrir. Esta resistencia se da en la
medida en que la forma es más pregnante.
15. Principio de enmascaramiento. Una forma resiste a las
diferentes perturbaciones a las que está sometida (ruido, manchas,
elementos parásitos). En la medida en la que la forma sea más preg-
nante, será más persistente.
16. Principio de Birkhoff. Una forma será tanto más pregnante en
la medida en que se contenga un mayor número de “ejes de simetría”
(regularidad, establilidad).
17. Principio de proximidad. Los elementos del campo perceptivo
que están aislados, pero que son vecinos, tienden a ser considerados
como “grupos” o formas globales.
18. Principio de similiaridad. En un campo de elementos equidis-
tantes, aquellos que tienen mayor similitud por su forma, tamaño,
color y dirección, se perciben ligados entre ellos para formar una
cadena o grupos homogéneos.
DiseñodeInformacióneInterfacesdeUsuario 2
34. 19. Principio de memoria. Las formas son tanto mejor percibidas
por un individuo en la medida en que le son presentados con mayor
frecuencia.
20. Principio de jerarquización. Una forma compleja será tanto
más pregnante cuando la percepción esté mejor orientada por el
visualista, conduciendo la mirada del receptor de lo principal a lo
accesorio. Es decir, cuando sus partes están mejor jerarquizadas.
La relevancia de los puntos anteriores en el diseño y visualización de
información radica en que brindan lineamientos a considerar sobre
el proceso del diseño mismo. Resulta muy importante el hecho que
este tipo de diseño involucra la presentación de información que no
necesariamente es visible de primera mano, y que además, puede
enfocarse en mejorar el cumplimiento de la tarea particular para la
cual el diseño y/o visualización fueron realizados. Ahora bien, estos
lineamientos no quedan restrictivos a visualización (esquemática o
no) producida sobre un lienzo de papel o algún medio de presenta-
ción f ísico.
Frank Thissen (2003) menciona la importancia de las leyes de
Gestalt y su aplicación al diseño para pantalla, y en general al diseño
de GUI. A diferencia de los autores antes mencionado, la metodo-
logía de Thissen, al ser enfocada a interfaces digitales, se basa en un
diseño centrado en el usuario; por lo tanto, otras características son
consideradas, más allá de la mera visualización de información que
esté directamente relacionada en el proceso de diseño de interfaces.
En particular, los pasos que conciernen al diseño para pantalla según
Thissen (2003) son:
1. Determinación del usuario y sus metas con respecto al pro-
ducto de diseño. Este paso tiene como base el modelo ontológico de
Bonsiepe (1998) y su fuerte es la aplicación del método de “personas”
de Alan Cooper (2006).
2. Orientación y Navegación. Involucra la definición de las
necesidades en los diferentes tipos de usuario, agrupamiento de la
información, diseño de metáforas visuales, definición de elementos
de navegación, visitas guiadas y orientaciones visuales.
3. Información. Consiste en seleccionar la tipograf ía para panta-
lla, la forma en la que se sintetizará el texto para la fácil lectura en
este medio, así como el diseño iconográfico y selección de elementos
multimediáticos en la interfaz.
4. Diagramación en Pantalla. El diseñador debe tomar la decisión
de cómo componer los diferentes elementos en la pantalla tomando
en cuenta aspectos como el escaneo visual, la aplicación de las leyes
de Gestalt, psicología del color, etc.
5. Interacción. Entender la comunicación entre la interfaz y el
usuario en forma reactiva, además de considerar la ley de Fitt (Wiki-
pedia, 2006).
6. Emoción. Explica que en toda interfaz existe un metamensaje
22 DiseñodeInformacióneInterfacesdeUsuario
35. que deriva de la comunicación implícita de la interfaz hacia el usuario.
7. Interculturalidad. Debe incluirse en el diseño para pantalla
aspectos de identidad y cultura, así como de manifestaciones cultu-
rales, lo cual reafirma que el diseño es centrado en el usuario.
Por otro lado, Costa (1998) menciona que existen otros mecanismos
de la visión que se sitúan en el umbral inferior a los de la percepción
dados por la Gestalt, y que estos constituyen un microfuncionamien-
to interno de la dinámica de la percepción icónica. Tales mecanis-
mos fueron establecidos por Abraham Moles (citado en Costa, 1998)
y dan origen a las leyes de la infralógica visual; tales leyes son más o
menos independientes de las leyes del razonamiento lógico formal,
las cuales solo se ejercen en la medida en que la mente dispone del
tiempo necesario para pensar lógicamente. Las leyes enlistadas por
Costa (1998) son las siguientes:
1. Ley de la centralidad. Los elementos que se presentan en el
centro de la figura son los más importantes, o mejores, que los pre-
sentados en la periferia.
2. Ley de correlación. La correlación es siempre una (presunción
de) causalidad: si A está junto a B, es porque A y B mantienen una
relación causal; A es causa parcial de B, o bien a la inversa, B es causa
parcial de A.
3. Ley de no transitividad. Si A implica a B y B implica a C, ello
no significa que A implique a C.
4. Ley de amplificación de la causalidad de las series. Si A
implica que a B y si B implica a C y si C implica a D, el hecho de que
A implique a B es más evidente, más cierto, que si sólo estuvieran
presentes A y B.
5. Ley de infinidad. Si en una serie infinita de elementos represen-
tados, todos ellos son idénticos, la mente se forma la idea de que esa
serie es limitada si la serie comporta al menos tres términos yuxta-
puestos; la noción de infinito riguroso de la serie se adquiere cuando
el número de elementos similares es superior a siete.
6. Ley de percepción de complejidad. El concepto de compleji-
dad emerge en la conciencia cuando el número de elementos presen-
tes en el espacio gráfico con relaciones de diferentes naturalezas es
superior a siete.
7. Ley perspectivista. En una composición, el orden cercano es a
priori independiente del orden lejano.
8. Ley de dominio del ángulo recto. Los elementos u objetos cu-
yos contornos están formados por ángulos rectos están más elabora-
dos –si todo lo demás es igual– que los formados por otro tipo
de ángulos.
9. Ley de cuantificación de los ángulos. Los únicos ángulos
que poseen existencia autónoma en el mundo visual de ensamblaje
de contornos lineales son los ángulos de 90°, 60°, 45° y 30°. Todos
los demás que aparecen en una figura plana se consideran a priori
deformaciones o aberraciones de los ángulos precedentes, o combi-
DiseñodeInformacióneInterfacesdeUsuario 2
36. naciones de éstos.
10. Teorema de Franck. Cuando, en un conjunto amplio de ele-
mentos uniformes, un determinado número de elementos está pro-
visto de una propiedad única (una coloración definida de los objetos,
la presencia de una letra particular en el interior de una secuencia
literal, etc.), la percepción subjetiva estima que se ha producido un
cambio cualitativo en el conjunto a partir del momento en que el
cambio afecta a más del 34% de los elementos del conjunto.
11. Ley de perspectiva dinámica. Una representación perspec-
tiva de objetos o de seres que poseen un punto de fuga cercano es
más dinámica que una vista perspectiva del mismo conjunto con un
punto de fuga alejado.
12. Ley de coloración. Las cosas representadas en color tienen
mayor carga connotativa y expresiva, en igualdad de condiciones,
que las representadas en negro, o monocromas.
13. Ley del valor cualitativo de los colores. Los elementos que
poseen un crominancia intensa son superiores a los que poseen una
crominancia débil, si todos los demás factores son iguales.
14. Ley de pureza cromática. Los objetos de color puro saturado
son superiores a los objetos de color mezclado o pastel en cualquier
situación connotativa.
15. Ley de fuerza cromática. Los objetos de color puro y “fuerte”
(rojo, amarillo, negro, blanco, etc.) dominan la atención con respecto
a los objetos o cosas de colores débiles (entre los cuales está el gris,
verde, azulado, violeta y rosa).
Como puede observarse, los elementos de composición para una vi-
sualización por parte de Ware (citado por Fry, 2000) se acoplan bien
con los principios bertinianos considerados por Costa (1998) para el
diseño esquemático. En estas dos, sin duda, las leyes de Gestalt jue-
gan un papel importante debido a la naturaleza misma de este tipo
de productos de diseño. Los puntos de Spence (2001) se caracterizan
porque su enfoque considera visualizaciones generadas por com-
putador, idea que solidifica Benjamin Fry (2000) con tesis doctoral
incursionando el paradigma de diseño denominado Computational
Information Design. Sin embargo, es la metodología de Frank This-
sen (2003) quien permite el mapeo directo a las GUI, y sobretodo en
considerar el diseño centrado en el usuario, relevante para el diseño
de información per se. Resulta así que lo no “considerado” en la me-
todología de Thissen, puede complementarse en forma natural con
las ideas propuestas por los autores anteriores, ya que al ser una GUI
un objeto visual per se, implica de alguna forma el diseño esquemá-
tico, principalmente para apoyar diseños innovadores tomando en
cuenta que la visualización de información permite el entendimiento
de fenómenos que los usuarios no necesariamente tienen presente
(i.e. visiblemente) durante el cumplimiento de su tarea.
Actualmente existen sitios en la Web donde puede observarse el po-
2 DiseñodeInformacióneInterfacesdeUsuario
37. der del diseño y visualización de información (usualmente generado
en forma computacional) para realizar innovadoras explicaciones
visuales tales como: Information Aesthetics (2006), Visualcomplexi-
ty (2006) o hasta el mismo Computation and Aesthetics Group del
Media Lab en el MIT (ACG, 2006).
En particular, tomando en cuenta aspectos de interacción social, un
ejemplo de cómo la visualización puede brindar información valiosa
que no era considerada por no ser visible per se, es la propuesta del
People Garden por Rebeca Xiong et al. (1999). Este jardín es una
visualización de las interacciones de personas en ambientes virtua-
les, donde cada usuario es representado mediante la metáfora de una
flor; sus objetos de datos, particularmente sus “conversaciones” en
un foro virtual, son representados por pétalos, los cuales se ordenan
con respecto a las manecillas del reloj, por lo que a mayor número
de mensajes colocados en el foro mayor crecimiento de la flor del
usuario. Además, cada pétalo visualiza el número de réplicas con el
“crecimiento” de un apéndice. Cada flor, es decir cada usuario, tiene
el tallo más alto o corto dependiendo del tiempo de participación
en ese ambiente virtual en particular. Así, el jardín permite no sólo
observar históricamente el comportamiento de un usuario en par-
ticular, además es posible determinar el comportamiento social de
todo el ambiente virtual, determinándose la naturaleza democrática
y social de las personas cuando están en línea.
Figura 2.
Interaccón socal en línea
generada por el software Antes de llegar a la propuesta de un nuevo paradigma en el diseño de
People Garden. información, el computacional, Fry comenzó con la definición de un
Fuente: Xong et al., .
proceso orgánico para este diseño en su tesis de maestría: Organic
Information Design (Fry, 1997). Este proceso aplica a visualizaciones
esquemáticas generadas por computadora y cuyos elementos (u ob-
jetos esquemáticos vistos como “entes vivos”) siguen ciertas reglas y
DiseñodeInformacióneInterfacesdeUsuario 2
38. características encontradas en los sistemas orgánicos mismos. Según
Fry (1997), éstas son:
1. Estructura. La agregación de elementos para formar estructuras
más complejas.
2. Apariencia. La expresión visual del estado interno.
3. Metabolismo. La síntesis de los nutrientes para los materiales
en crudo y combustible.
4. Crecimiento. Un incremento ya sea en escala o tamaño de
la estructura.
5. Homeostasis. El mantenimiento de un sistema interno balanceado.
6. Respuesta. Reacción a estímulos y advertencias provenientes
del ambiente.
7. Adaptación. Los ajustes para sobrevivir en un ambiente cambiante.
8. Movimiento. La expresión de comportamiento del estado interno.
9. Reproducción. La habilidad de las entidades de crear otras
como ellas mismas.
El trabajo de tesis de maestría de Fry (1997) generó dos proyectos
interesantes de mencionar: Anemone y Valence. El proyecto Ane-
mone utiliza el proceso de diseño de información orgánico para
responder cuestiones relacionadas con la estructura de un sitio web
y sus estadísticas de visita, así como proyectar el comportamiento
navegacional no lineal de sus usuarios. Los caminos de navegación
van conformando una anémona en crecimiento y adaptativa, donde
además se muestran indicios de importancia en ciertas secciones
del sitio en estudio mediante factores de crecimiento. Así, es posible
visualizar patrones de conducta de los usuarios y las páginas con
mayor relevancia dentro del sitio.
Figura 3.
Vsualzacones de anémona
de un sto del MIT.
Fuente: http://acg.meda.
mt.edu/people/fry/
Por su parte, Valence, tiene por objetivo construir representaciones
que exploren las estructuras y relaciones inherentes en grandes con-
juntos de información. La visualización valente se presenta en forma
de grafo tridimensional cuyos nodos son conectados por aristas pro-
yectadas en pseudo-coordenadas polares. Tanto los nodos como las
aristas tienen valores y reglas, las cuales son tomadas del proceso de
diseño de información orgánico. Los valores en los nodos indican la
posición, frecuencia y una etiqueta para nombrarlos; mientras que el
26 DiseñodeInformacióneInterfacesdeUsuario
39. de las aristas solo indica la relación entre dos nodos conectados. Las
reglas de los nodos corresponden a la reproducción, metabolismo,
apariencia y movimiento, mientras que en las aristas se incorporan
las correspondientes a la reproducción, metabolismo y apariencia.
Fgura .
Vsualzacón valente para la
relacón entre las palabras Cabe mencionar que la importancia de este proceso es derivar
encontradas en una novela. en productos de diseño que expresen fenómenos, bajo el mismo
Fuente: http://acg.meda.
mt.edu/people/fry/ enfoque considerado por Costa (1998) y Spence (2001), en forma
“autónoma” dados los datos a visualizar. Sin embargo, si es posible
analizar que tanto en el trabajo de Fry (1997) como en el de Xiong
(1999), aunque exista un mapeo con los puntos tratados por los otros
autores en forma natural, no consideran a priori un diseño
centrado en el usuario, tal y como lo plantea Thissen (2003) para
diseño en pantalla (e interfaces en general). Por lo tanto, puede mar-
carse una brecha entre las visualizaciones per se y aquellas inheren-
tes en las GUI, lo cual es riesgoso de afirmar desde el punto de vista
del diseño de información, ya que por definición, cualquier visuali-
zación debe estar sustentada y conllevar al entendimiento claro de
dichos fenómenos.
Para cerrar con este tipo de ejemplos, se comenta acerca del proyec-
to desarrollado por Viegas et al. (1999) y denominado Chat Circles,
una interfaz gráfica abstracta para conversaciones síncronas. En este
chat la presencia y actividad (i.e. el ritmo de la conversación) están
manifestadas por los cambios en color y forma tomando el círculo
como elemento base y representativo de las personas en línea. El
empleo de este elemento tiene por propósito proyectar la dinámica
de la conversación y revelar patrones de actividad que surgen de la
interacción entre sus usuarios. Cada usuario es representado por un
círculo de color en cuyo interior aparecen las palabras que “dice”. Los
círculos crecen y se hacen brillantes con cada mensaje, sucediendo
lo contrario en períodos grandes de silencio, aunque no desaparecen
DiseñodeInformacióneInterfacesdeUsuario 2
40. completamente mientras el usuario esté conectado al chat. La iden-
tidad de cada usuario se determina por medio del color y nombre
que seleccionan antes de conectarse al chat. El software posee un
filtro de proximidad que va acercando los círculos de los usuarios
en cuyas conversaciones están involucrados, de tal forma que se van
formando grupos que permiten asociar las relaciones de un usua-
rio en particular y al mismo tiempo tener un panorama general del
comportamiento del sistema. Esta idea funciona como una metáfora
de proximidad f ísica, por lo que es observable el desenvolvimiento
social de los usuarios en línea, además de que el software incluye la
visualización del historial para cada uno de los usuarios en forma de
“hilos conversacionales”.
Fgura .
Muestras de la nterfaz de
Chat Crcles.
Fuente: Vegas et al.,
3.2. Diseño de información para Baby Faces
Como comentan Marcus et al. (1998), los congresos y la literatura
se enfocan en proyectos en los cuales, las grandes paletas de color,
alta resolución espacial y pantallas de gran tamaño, se presumen
como disponibles. Caso contrario en dispositivos como los PDA o
celulares, los cuales están limitados en sus características. También
comentan que los profesionales en el diseño de interfaces gráficas
para este tipo de dispositivos se debaten en la mejor manera de
diseñar para productos en los cuales muchas características están
significativamente limitadas como las fuentes, resolución espacial y
de color y gráficas. Estas interfaces son denominadas “baby faces” o
caras de bebé en español (Marcus et al., 1998) las cuales son simples
en muchos sentidos, pero también son bastante complejas como reto
2 DiseñodeInformacióneInterfacesdeUsuario
41. de diseño tomando en cuenta las características limitadas mencionadas.
De acuerdo a Holtzblatt (2005), diseñar para plataformas móviles
(e.g. teléfono celular) presenta retos únicos a diferencia de disposi-
tivos más grandes. Para dicha autora, apenas se están desarrollando
aplicaciones sofisticadas, las cuales al ser frecuentemente descarga-
das por los usuarios, no ofrecen un punto de partida para aprender
a como usarlas; a lo cual se añaden las capacidades f ísicas de dichos
dispositivos, determinando que el gran reto es manejar adecuada-
mente el espacio limitado de pantalla. Al desarrollar una aplica-
ción para un celular, Holtzblatt (2005) se enfrentó a tres retos en el
diseño:
1. La familiaridad con el dispositivo,
2. la información donde se necesita,
3. el factor de forma (como desplegar la información en una pan-
talla pequeña para hacerla disponible y leíble en un instante) y,
4. minimizar la navegación.
Dichos retos le permitieron concluir que particularmente en el
caso de los teléfonos celulares se imponen fuertes restricciones a
los diseñadores y observó que los usuarios no están interesados en
tomarse el tiempo de aprender a usar las aplicaciones, que dichos
dispositivos no favorecen a la implementación de sistemas de ayuda
y que poseen interfaces extremadamente restringidas. Sin embargo,
añade que es posible producir con el proceso adecuado, aplicaciones
exitosas tanto como aquellas de pantalla completa. Dicho logro para
Holtzblatt es consecuencia de usar métodos centrados en el cliente
(i.e. customer-centered methods, en inglés).
Hace más de diez años, Landay et al. (1993) discutieron sobre los
problemas y situaciones encontradas en el cómputo móvil de aquel
entonces. Comentan que el cómputo móvil evolucionaba en dos
direcciones: los localizadores y otros dispositivos “manuales” (e.g.
PDA) se estaban volviéndose más poderosos, y las computadoras
portátiles se estaban volviendo más pequeñas. En el tiempo en
que Landay et al. publicaron su trabajo, establecieron que un tema
común en la mayoría de los esfuerzos en cómputo móvil radicaba
en el deseo de correr ambientes de cómputo similares en las má-
quinas móviles y las estaciones de trabajo convencionales. Añaden,
que no importa que se deseen correr muchas aplicaciones en ambas
plataformas, el ambiente computacional influye en que son comple-
tamente diferentes.
El diseño centrado en el usuario y las técnicas de análisis de tareas
estresan lo que debería determinarse primero; esto es, las tareas que
la población de usuarios gustarían de realizar en los dispositivos
móviles. Un análisis de tareas en cómputo móvil puede producir un
conjunto vasto de prioridades en las aplicaciones diferentes a los
encontrados en un posible análisis en estaciones de trabajo. Muchas
DiseñodeInformacióneInterfacesdeUsuario 2
42. de las tareas en estaciones de trabajo involucran gran cantidad de
datos de entrada, mientras que las tareas en móviles involucran
pequeñas cantidades de entrada de datos, así como de presentación
de información existente (Landay, et al., 1993). La escala de los dis-
positivos móviles marca una diferencia con las estaciones de trabajo.
Para Landay et al. (1993) un factor determinante resulta el tamaño
de pantalla (lo cual implica una baby face); los sistemas que son
considerados fáciles de usar se basan en componentes de interfaz
estáticos, mientras que en una baby face, por ejemplo, una interfaz
podría resolverse mejor con la implementación de varios menús
emergentes.
Aunque pueda parecer complicado el desarrollo de aplicaciones de
cómputo móvil, es seguro afirmar que el éxito para esta labor radica
en el entendimiento de las personas que interactuarán con alguno de
estos dispositivos. El trabajo de Marcus et al. (2002) sobre el diseño
del PDA del futuro, es un ejemplo claro sobre un proceso de diseño
(de información) centrado en el usuario y que identifica necesidades
subyacentes en los dispositivos móviles. El proyecto de cuatro años
que inició en el 2002 para diseñar la “PDA del futuro” involucró in-
vestigación de mercado, observación de usuarios, tormenta de ideas,
desarrollo de escenarios y prototipeo. El resultado fue denominado
Mob-i. A continuación se presenta una tabla de las áreas de investi-
gación y sus salidas correspondientes (Marcus et al., 2002):
Estudio: Provee un medio para adrentarse en:
Usuarios Necesidades/Deseos Tabla 2.
Contexto social y de negocios Necesidades y funciones Áreas de nvestgacón y
Oportunidades tecnológicas Función y forma saldas determnadas por
Interfaces de usuario avanzadas Forma Marcus para el proyecto
Mob-.
Marcus et al. (2002) notaron que los focus groups resultaban no con-
fiables ya que los usuarios encontraban dif ícil vislumbrar productos
o conductas con los que aún no se habían encontrado, por lo que
la observación, en particular la técnica de sombreo, fue necesaria.
También se mantuvieron registros auditivos en situaciones en las
que el registro de papel no resultaría efectivo, por ejemplo, cuando el
sujeto de estudio caminaba.
Durante el proyecto del Mob-i se concluyó que debido a que los
dispositivos inalámbricos eran capaces de tener muchos usos inte-
rrelacionados, era un reto definir ese espacio de diseño complejo.
Dicho esfuerzo resultó en un marco de trabajo sobre el espacio de
uso de dispositivos inalámbricos por parte de Marcus et al. (2002), el
cual se compone de varios subespacios de uso, los cuales se enlistan
como sigue:
1. Información. Este espacio incluye información referencial está-
0 DiseñodeInformacióneInterfacesdeUsuario
43. tica, tal como el reporte del clima, diccionarios, etc.
2. Auto-mejora. Describe la manera en la que dispositivo extiende
las capacidades normales de una persona.
3. Relaciones. Los dispositivos móviles se volverán especialmente
exitosos cuando extiendan los protocolos sociales existentes.
4. Entretenimiento. Este espacio incluye lo disfrutable de los me-
dios portátiles, tales como la música, lecturas de astrología, juegos,
etc.
5. M-commerce. Encapsula una variedad de usos incluyendo el
dinero electrónico y los cupones electrónicos. La popularidad de los
dispositivos móviles será catalizada por los servicios comerciales
disponibles.
Los cinco espacios anteriores se concentran alrededor de la iden-
tidad del usuario, en particular de su identidad inalámbrica (WID
por sus siglas en inglés). Según Marcus et al. (2002) los dispositivos
móviles tienen gran potencial en la medida que lleguen a poseer “co-
nocimiento” acerca de sus dueños, ya que son prácticamente compu-
tadoras portátiles, las cuales estarán todo el tiempo con las personas.
Lo anterior significa que este tipo de dispositivos eventualmente irán
recopilando información, que al ser procesada por él mismo, la fun-
cionalidad en sus aplicaciones de software se irían adaptando según
las necesidades de algún usuario en particular.
Educacón Extraños
Auto ayuda Relaciones
Amgos
Asstenca actva
Comundad
Referencal Juegos
Organzaconal
Información Entretenimiento
Diagrama 2. De
Espacos de uso de los negocos Medos
dspostvos móvles.
Fuente: Marcus et al., 200
Comercio
“ellos”
Para Marcus et al. (2003), las fortalezas en el cómputo móvil radican
que siempre están con la persona, incursionable en ajustes sociales,
listo para interfaz de voz, telefonía y conectividad incluidas de fábri-
ca y cómputo permisible; las debilidades según comentan están en
las limitaciones de salida y la dificultad de entrada de datos en estos
dispositivos. Con respecto a esas dos últimas limitaciones, comentan
DiseñodeInformacióneInterfacesdeUsuario
44. que es necesario encontrar soluciones creativas dadas las restriccio-
nes de las baby faces y la entrada tediosa de texto:
a) Conciencia contextual. Los dispositivos móviles pueden usar
técnicas para contextualizar la entrada de los usuarios. Al tomar
ventaja de entender el contexto del usuario, el dispositivo automáti-
camente puede asistirlo tanto como sea posible.
b) Conciencia de Localidad. Esta se encuentra en dispositivos
como los sistemas de posicionamiento global (GPS por sus siglas
en inglés) y tecnologías basadas en Bluetooth. Los diseñadores de
interfaces que se centran en la interacción pronto serían capaces de
usar el conocimiento de la localidad de los usuarios como un modo
de apoyar la usabilidad.
c) Cambio de tiempo. El Mob-i introduce este concepto me-
diante funciones que le permiten a los usuarios manejar un enfoque
“inicia ahora-termina después” en el cumplimiento de sus tareas.
La fase de prototipeo del Mob-i fue precedida por sesiones de
tormenta de ideas con el fin de dirigir el diseño conceptual, desarro-
llando para cada concepto escenarios descriptivos e ilustraciones.
De esta forma Marcus et al. (2003) llegaron a una taxonomía del uso
básico de información:
a) Creación. Uso de herramientas de autor, tales como una herra-
mienta de hojas de cálculo.
b) Reunión. Incluye toma de fotograf ías, filmaciones, grabación
de audio, etc.
c) Procesamiento. Organización, manipulación e interpretación
de la información a través de aplicaciones y administradores de archivos.
d) Recuperación. Acceso de información de la Web o de almace-
namiento personal.
e) Comunicación. Transferencia de información entre dispositi-
vos, ya sea de ida o vuelta.
Para explorar cuando y lo que los usuarios están dispuestos a revelar
acerca de su localización para sus relaciones sociales mientras utili-
zan dispositivos móviles, Consolvo et al. (2005) efectuaron un estu-
dio en tres fases basado en el método del Experience Sampling (ES
por sus siglas en inglés y explicado en el capítulo 5). La cuestión está
relacionada si cuando los usuarios desean revelar su localización ac-
tual a la gente que conocen, ellos quieren decir su dirección exacta,
utilizar algún nombre genérico (e.g. “trabajo”), el nombre del vecin-
dario, ciudad u otro cosa. Este trabajo parte de las preguntas sobre
lo que los usuarios quieren revelar, quién realiza esa petición, dónde
se encuentran cuando reciben dicha petición, que están haciendo
actualmente y cómo se sienten cuando les llega dicha petición.
La primera fase del estudio permitió a Consolvo et al. (2005) en-
tender las redes sociales de los participantes para crear una “lista
de amigos” con los que los usuarios desearían intercambiar in-
2 DiseñodeInformacióneInterfacesdeUsuario
45. formación; para realizar dicha lista resultó necesario explorar los
aspectos comunes acerca de las maneras que los usuarios tratan a
los miembros de un mismo grupo social. La segunda fase empleó
el método ES para capturar las respuestas de los participantes in
situ con respecto a peticiones hipotéticas acerca de su localización
provenientes de miembros de las listas dependiendo de cada usuario.
Los cuestionarios realizados incluyeron preguntas relacionadas con
el contexto (e.g. ¿Qué estás haciendo?) y con lo que el participante
deseaba revelar en ese momento acerca de su localización. En la fase
final, los participantes reflejaron sus experiencias en las dos primeras
fases, particularmente sus actitudes acerca del cómputo de mejora
de localización.
Consolvo et al. (2005) mostraron que los factores más importantes
son determinar quién estaba realizando la petición, el por qué de la
petición y qué detalle era necesario para quien realizaba la petición.
Añaden, que otro resultado interesante estuvo en encontrar que los
participantes típicamente revelaban el mayor detalle útil acerca de su
localización (lo cual no es necesariamente lo más detallado) o que no
la revelaban del todo. Así, se determinaron los siguientes puntos:
a) Lo que los participantes revelaban,
b) el efecto de la relación de la persona que hacía la petición con el
participante,
c) el efecto de dónde vivía el que realizaba la petición en relación
con el participante,
d) el efecto de la localización del participante cuando recibía la
petición,
e) el efecto del estado de animo o actividad del participante cuan-
do recibía la petición,
f ) el efecto de lo que el participante clasificó como privado, es
decir, por qué el participante rechazó peticiones,
g) lo que el participante quería saber acerca de la localización de
otros, y
h) las preocupaciones sobre privacidad y seguridad en los partici-
pantes.
Así, se puede afirmar según este estudio que los participantes (i.e.
usuarios de dispositivos móviles estando en línea) quieren revelar lo
que piensan es útil para quien realiza las peticiones o denegar de pla-
no éstas, y la privacidad de los participantes se determina en forma
muy personal y no puede ser planteada a partir un modelo genérico
(Consolvo et al., 2005).
Para ayudar al proceso de diseño de interfaces, el diseño de informa-
ción emplea métodos de las ciencias sociales en algunas ocasiones.
Berg et al. (2003) realizaron un estudio etnográfico tomando como
campo de estudio a los usuarios adolescentes de teléfonos móviles,
involucrándolos incluso en el diseño de la interfaz y la conformación
de un concepto de teléfono móvil. Descubrieron que los adolescen-
DiseñodeInformacióneInterfacesdeUsuario
46. tes participantes del estudio utilizaban sus teléfonos celulares para
participar en prácticas sociales de intercambio; específicamente, sus
actividades mediadas por el teléfono mostraron los patrones de rega-
lar-dar descritos en la literatura de antropología y sociología (Berg et
al., 2003).
Resultó evidente que los teléfonos inducían a los adolescentes a
“obligaciones sociales de intercambio” lo cual consiste en recibir,
dar y ser recíproco. Esto se observó claramente en el intercambio de
mensajes de texto, lo cual permitía a los adolescentes de “realizar”
ofertas sobre algo especial o personal, y el recibir ese ofrecimiento
en una muestra de solidaridad mutua, el ser recíproco en ese aspecto
completa el contrato implícito que establece el vínculo entre el emi-
sor y el receptor (Berg et al., 2003).
En sí, los principales puntos tomados del estudio de Berg et al.
(2003) explican que:
1. Los teléfonos y sus contenidos son usados por los participantes
en prácticas sociales de intercambio.
2. Los teléfonos y particularmente los mensajes de texto dan forma
a lo que los adolescentes tratan de significar, lo cual deriva de sus
estilos gramaticales y sintácticos y de forma que toman los mensajes.
3. Mediante sus teléfonos, los adolescentes son capaces de partici-
par en las obligaciones de intercambio: regalar, aceptar y ser recípro-
cos.
4. La participación en la ceremonia ritual puede hacer especial el
intercambio debido a que evoca un entendimiento mutuo y compartido.
5. Los lazos sociales y rivalidades pueden ser demostradas a través
de la participación en intercambios mediados por teléfono.
El proceso iterativo y cooperativo de realización de prototipos ayudó
a Berg et al. (2003) a descubrir además algunos problemas de usa-
bilidad, así como obtener algunas reacciones hacia la capacidad del
dispositivo (i.e. el teléfono móvil) para ayudar al intercambio social,
los cuales se enlistan a continuación:
1. Permitir el uso y vista de contenido en grupos pequeños (de dos
a cuatro personas).
2. Permitir la combinación de fotos, sonidos, tipos y dibujos en el
mismo dibujo.
3. Proveer de memory stick individuales para guardar mensajes u
otro contenido.
4. Permitir la comunicación por parte de los usuarios acerca de su
identidad, sentimientos, estado de ánimo y otro tipo de estatus.
5. Expresar y agregar identidades de usuario.
6. Expresar lo precioso de un objeto privado.
7. Expresar sensaciones lúdicas.
Lo anterior derivó en el desarrollo de un prototipo (Berg et al., 2003)
DiseñodeInformacióneInterfacesdeUsuario