SlideShare una empresa de Scribd logo
1 de 181
Descargar para leer sin conexión
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
por Omar Sosa Tzec
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
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.
v
v
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
v
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
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
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
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
Introducción
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
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
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
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
6   Preliminares
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
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
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
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
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
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
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
Preliminares
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
“The arts are the science of
enjoying life.”
John Maeda, 2003.




 6                 DiseñodeInformacióneInterfacesdeUsuario
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
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
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
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
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
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
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
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
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
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
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
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
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
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
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
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
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
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
UDLAP Visual Calm Technology, Semiotic Engineering and Rhetoric for GUI Design
UDLAP Visual Calm Technology, Semiotic Engineering and Rhetoric for GUI Design
UDLAP Visual Calm Technology, Semiotic Engineering and Rhetoric for GUI Design
UDLAP Visual Calm Technology, Semiotic Engineering and Rhetoric for GUI Design
UDLAP Visual Calm Technology, Semiotic Engineering and Rhetoric for GUI Design
UDLAP Visual Calm Technology, Semiotic Engineering and Rhetoric for GUI Design
UDLAP Visual Calm Technology, Semiotic Engineering and Rhetoric for GUI Design
UDLAP Visual Calm Technology, Semiotic Engineering and Rhetoric for GUI Design
UDLAP Visual Calm Technology, Semiotic Engineering and Rhetoric for GUI Design
UDLAP Visual Calm Technology, Semiotic Engineering and Rhetoric for GUI Design
UDLAP Visual Calm Technology, Semiotic Engineering and Rhetoric for GUI Design
UDLAP Visual Calm Technology, Semiotic Engineering and Rhetoric for GUI Design
UDLAP Visual Calm Technology, Semiotic Engineering and Rhetoric for GUI Design
UDLAP Visual Calm Technology, Semiotic Engineering and Rhetoric for GUI Design
UDLAP Visual Calm Technology, Semiotic Engineering and Rhetoric for GUI Design
UDLAP Visual Calm Technology, Semiotic Engineering and Rhetoric for GUI Design
UDLAP Visual Calm Technology, Semiotic Engineering and Rhetoric for GUI Design
UDLAP Visual Calm Technology, Semiotic Engineering and Rhetoric for GUI Design
UDLAP Visual Calm Technology, Semiotic Engineering and Rhetoric for GUI Design
UDLAP Visual Calm Technology, Semiotic Engineering and Rhetoric for GUI Design
UDLAP Visual Calm Technology, Semiotic Engineering and Rhetoric for GUI Design
UDLAP Visual Calm Technology, Semiotic Engineering and Rhetoric for GUI Design
UDLAP Visual Calm Technology, Semiotic Engineering and Rhetoric for GUI Design
UDLAP Visual Calm Technology, Semiotic Engineering and Rhetoric for GUI Design
UDLAP Visual Calm Technology, Semiotic Engineering and Rhetoric for GUI Design
UDLAP Visual Calm Technology, Semiotic Engineering and Rhetoric for GUI Design
UDLAP Visual Calm Technology, Semiotic Engineering and Rhetoric for GUI Design
UDLAP Visual Calm Technology, Semiotic Engineering and Rhetoric for GUI Design
UDLAP Visual Calm Technology, Semiotic Engineering and Rhetoric for GUI Design
UDLAP Visual Calm Technology, Semiotic Engineering and Rhetoric for GUI Design
UDLAP Visual Calm Technology, Semiotic Engineering and Rhetoric for GUI Design
UDLAP Visual Calm Technology, Semiotic Engineering and Rhetoric for GUI Design
UDLAP Visual Calm Technology, Semiotic Engineering and Rhetoric for GUI Design
UDLAP Visual Calm Technology, Semiotic Engineering and Rhetoric for GUI Design
UDLAP Visual Calm Technology, Semiotic Engineering and Rhetoric for GUI Design
UDLAP Visual Calm Technology, Semiotic Engineering and Rhetoric for GUI Design
UDLAP Visual Calm Technology, Semiotic Engineering and Rhetoric for GUI Design
UDLAP Visual Calm Technology, Semiotic Engineering and Rhetoric for GUI Design
UDLAP Visual Calm Technology, Semiotic Engineering and Rhetoric for GUI Design
UDLAP Visual Calm Technology, Semiotic Engineering and Rhetoric for GUI Design
UDLAP Visual Calm Technology, Semiotic Engineering and Rhetoric for GUI Design
UDLAP Visual Calm Technology, Semiotic Engineering and Rhetoric for GUI Design
UDLAP Visual Calm Technology, Semiotic Engineering and Rhetoric for GUI Design
UDLAP Visual Calm Technology, Semiotic Engineering and Rhetoric for GUI Design
UDLAP Visual Calm Technology, Semiotic Engineering and Rhetoric for GUI Design
UDLAP Visual Calm Technology, Semiotic Engineering and Rhetoric for GUI Design
UDLAP Visual Calm Technology, Semiotic Engineering and Rhetoric for GUI Design
UDLAP Visual Calm Technology, Semiotic Engineering and Rhetoric for GUI Design
UDLAP Visual Calm Technology, Semiotic Engineering and Rhetoric for GUI Design
UDLAP Visual Calm Technology, Semiotic Engineering and Rhetoric for GUI Design
UDLAP Visual Calm Technology, Semiotic Engineering and Rhetoric for GUI Design
UDLAP Visual Calm Technology, Semiotic Engineering and Rhetoric for GUI Design
UDLAP Visual Calm Technology, Semiotic Engineering and Rhetoric for GUI Design
UDLAP Visual Calm Technology, Semiotic Engineering and Rhetoric for GUI Design
UDLAP Visual Calm Technology, Semiotic Engineering and Rhetoric for GUI Design
UDLAP Visual Calm Technology, Semiotic Engineering and Rhetoric for GUI Design
UDLAP Visual Calm Technology, Semiotic Engineering and Rhetoric for GUI Design
UDLAP Visual Calm Technology, Semiotic Engineering and Rhetoric for GUI Design
UDLAP Visual Calm Technology, Semiotic Engineering and Rhetoric for GUI Design
UDLAP Visual Calm Technology, Semiotic Engineering and Rhetoric for GUI Design
UDLAP Visual Calm Technology, Semiotic Engineering and Rhetoric for GUI Design
UDLAP Visual Calm Technology, Semiotic Engineering and Rhetoric for GUI Design
UDLAP Visual Calm Technology, Semiotic Engineering and Rhetoric for GUI Design
UDLAP Visual Calm Technology, Semiotic Engineering and Rhetoric for GUI Design
UDLAP Visual Calm Technology, Semiotic Engineering and Rhetoric for GUI Design
UDLAP Visual Calm Technology, Semiotic Engineering and Rhetoric for GUI Design
UDLAP Visual Calm Technology, Semiotic Engineering and Rhetoric for GUI Design
UDLAP Visual Calm Technology, Semiotic Engineering and Rhetoric for GUI Design
UDLAP Visual Calm Technology, Semiotic Engineering and Rhetoric for GUI Design
UDLAP Visual Calm Technology, Semiotic Engineering and Rhetoric for GUI Design
UDLAP Visual Calm Technology, Semiotic Engineering and Rhetoric for GUI Design
UDLAP Visual Calm Technology, Semiotic Engineering and Rhetoric for GUI Design
UDLAP Visual Calm Technology, Semiotic Engineering and Rhetoric for GUI Design
UDLAP Visual Calm Technology, Semiotic Engineering and Rhetoric for GUI Design
UDLAP Visual Calm Technology, Semiotic Engineering and Rhetoric for GUI Design
UDLAP Visual Calm Technology, Semiotic Engineering and Rhetoric for GUI Design
UDLAP Visual Calm Technology, Semiotic Engineering and Rhetoric for GUI Design
UDLAP Visual Calm Technology, Semiotic Engineering and Rhetoric for GUI Design
UDLAP Visual Calm Technology, Semiotic Engineering and Rhetoric for GUI Design
UDLAP Visual Calm Technology, Semiotic Engineering and Rhetoric for GUI Design
UDLAP Visual Calm Technology, Semiotic Engineering and Rhetoric for GUI Design
UDLAP Visual Calm Technology, Semiotic Engineering and Rhetoric for GUI Design
UDLAP Visual Calm Technology, Semiotic Engineering and Rhetoric for GUI Design
UDLAP Visual Calm Technology, Semiotic Engineering and Rhetoric for GUI Design
UDLAP Visual Calm Technology, Semiotic Engineering and Rhetoric for GUI Design
UDLAP Visual Calm Technology, Semiotic Engineering and Rhetoric for GUI Design
UDLAP Visual Calm Technology, Semiotic Engineering and Rhetoric for GUI Design
UDLAP Visual Calm Technology, Semiotic Engineering and Rhetoric for GUI Design
UDLAP Visual Calm Technology, Semiotic Engineering and Rhetoric for GUI Design
UDLAP Visual Calm Technology, Semiotic Engineering and Rhetoric for GUI Design
UDLAP Visual Calm Technology, Semiotic Engineering and Rhetoric for GUI Design
UDLAP Visual Calm Technology, Semiotic Engineering and Rhetoric for GUI Design
UDLAP Visual Calm Technology, Semiotic Engineering and Rhetoric for GUI Design
UDLAP Visual Calm Technology, Semiotic Engineering and Rhetoric for GUI Design
UDLAP Visual Calm Technology, Semiotic Engineering and Rhetoric for GUI Design
UDLAP Visual Calm Technology, Semiotic Engineering and Rhetoric for GUI Design
UDLAP Visual Calm Technology, Semiotic Engineering and Rhetoric for GUI Design
UDLAP Visual Calm Technology, Semiotic Engineering and Rhetoric for GUI Design
UDLAP Visual Calm Technology, Semiotic Engineering and Rhetoric for GUI Design
UDLAP Visual Calm Technology, Semiotic Engineering and Rhetoric for GUI Design
UDLAP Visual Calm Technology, Semiotic Engineering and Rhetoric for GUI Design
UDLAP Visual Calm Technology, Semiotic Engineering and Rhetoric for GUI Design
UDLAP Visual Calm Technology, Semiotic Engineering and Rhetoric for GUI Design
UDLAP Visual Calm Technology, Semiotic Engineering and Rhetoric for GUI Design
UDLAP Visual Calm Technology, Semiotic Engineering and Rhetoric for GUI Design
UDLAP Visual Calm Technology, Semiotic Engineering and Rhetoric for GUI Design
UDLAP Visual Calm Technology, Semiotic Engineering and Rhetoric for GUI Design
UDLAP Visual Calm Technology, Semiotic Engineering and Rhetoric for GUI Design
UDLAP Visual Calm Technology, Semiotic Engineering and Rhetoric for GUI Design
UDLAP Visual Calm Technology, Semiotic Engineering and Rhetoric for GUI Design
UDLAP Visual Calm Technology, Semiotic Engineering and Rhetoric for GUI Design
UDLAP Visual Calm Technology, Semiotic Engineering and Rhetoric for GUI Design
UDLAP Visual Calm Technology, Semiotic Engineering and Rhetoric for GUI Design
UDLAP Visual Calm Technology, Semiotic Engineering and Rhetoric for GUI Design
UDLAP Visual Calm Technology, Semiotic Engineering and Rhetoric for GUI Design
UDLAP Visual Calm Technology, Semiotic Engineering and Rhetoric for GUI Design
UDLAP Visual Calm Technology, Semiotic Engineering and Rhetoric for GUI Design
UDLAP Visual Calm Technology, Semiotic Engineering and Rhetoric for GUI Design
UDLAP Visual Calm Technology, Semiotic Engineering and Rhetoric for GUI Design
UDLAP Visual Calm Technology, Semiotic Engineering and Rhetoric for GUI Design
UDLAP Visual Calm Technology, Semiotic Engineering and Rhetoric for GUI Design
UDLAP Visual Calm Technology, Semiotic Engineering and Rhetoric for GUI Design
UDLAP Visual Calm Technology, Semiotic Engineering and Rhetoric for GUI Design
UDLAP Visual Calm Technology, Semiotic Engineering and Rhetoric for GUI Design
UDLAP Visual Calm Technology, Semiotic Engineering and Rhetoric for GUI Design
UDLAP Visual Calm Technology, Semiotic Engineering and Rhetoric for GUI Design
UDLAP Visual Calm Technology, Semiotic Engineering and Rhetoric for GUI Design
UDLAP Visual Calm Technology, Semiotic Engineering and Rhetoric for GUI Design
UDLAP Visual Calm Technology, Semiotic Engineering and Rhetoric for GUI Design
UDLAP Visual Calm Technology, Semiotic Engineering and Rhetoric for GUI Design
UDLAP Visual Calm Technology, Semiotic Engineering and Rhetoric for GUI Design
UDLAP Visual Calm Technology, Semiotic Engineering and Rhetoric for GUI Design
UDLAP Visual Calm Technology, Semiotic Engineering and Rhetoric for GUI Design
UDLAP Visual Calm Technology, Semiotic Engineering and Rhetoric for GUI Design
UDLAP Visual Calm Technology, Semiotic Engineering and Rhetoric for GUI Design

Más contenido relacionado

Destacado

2nd mobile-freidae - Community News
2nd mobile-freidae - Community News2nd mobile-freidae - Community News
2nd mobile-freidae - Community NewsUwe Kaminski
 
Atlas numero 5. Variabilidad en la tasa de hospitalizaciones por problemas de...
Atlas numero 5. Variabilidad en la tasa de hospitalizaciones por problemas de...Atlas numero 5. Variabilidad en la tasa de hospitalizaciones por problemas de...
Atlas numero 5. Variabilidad en la tasa de hospitalizaciones por problemas de...Atlas VPM
 
Cap6
Cap6Cap6
Cap6CJAO
 
Media Port 2012, Session 1: Regionalmedien Austria
Media Port 2012, Session 1: Regionalmedien AustriaMedia Port 2012, Session 1: Regionalmedien Austria
Media Port 2012, Session 1: Regionalmedien AustriaWAN-IFRA
 
Presentación selectividade 2010
Presentación selectividade 2010Presentación selectividade 2010
Presentación selectividade 2010fgsanz
 
Eduardo fernandez #bif11 keynote
Eduardo fernandez #bif11 keynoteEduardo fernandez #bif11 keynote
Eduardo fernandez #bif11 keynoteEd Fernandez
 
Memoria de la actividad del grupo Atlas VPM 2011 2
Memoria de la actividad del grupo Atlas VPM 2011 2Memoria de la actividad del grupo Atlas VPM 2011 2
Memoria de la actividad del grupo Atlas VPM 2011 2Atlas VPM
 

Destacado (12)

2nd mobile-freidae - Community News
2nd mobile-freidae - Community News2nd mobile-freidae - Community News
2nd mobile-freidae - Community News
 
Atlas numero 5. Variabilidad en la tasa de hospitalizaciones por problemas de...
Atlas numero 5. Variabilidad en la tasa de hospitalizaciones por problemas de...Atlas numero 5. Variabilidad en la tasa de hospitalizaciones por problemas de...
Atlas numero 5. Variabilidad en la tasa de hospitalizaciones por problemas de...
 
German Castles
German CastlesGerman Castles
German Castles
 
Cap6
Cap6Cap6
Cap6
 
WiSe 2013 | Programmierpraktikum C++ - 05_Strukturierung von Anwendungen
WiSe 2013 | Programmierpraktikum C++ - 05_Strukturierung von AnwendungenWiSe 2013 | Programmierpraktikum C++ - 05_Strukturierung von Anwendungen
WiSe 2013 | Programmierpraktikum C++ - 05_Strukturierung von Anwendungen
 
images
imagesimages
images
 
Media Port 2012, Session 1: Regionalmedien Austria
Media Port 2012, Session 1: Regionalmedien AustriaMedia Port 2012, Session 1: Regionalmedien Austria
Media Port 2012, Session 1: Regionalmedien Austria
 
Presentación selectividade 2010
Presentación selectividade 2010Presentación selectividade 2010
Presentación selectividade 2010
 
Candela 03
Candela 03Candela 03
Candela 03
 
Eduardo fernandez #bif11 keynote
Eduardo fernandez #bif11 keynoteEduardo fernandez #bif11 keynote
Eduardo fernandez #bif11 keynote
 
Memoria de la actividad del grupo Atlas VPM 2011 2
Memoria de la actividad del grupo Atlas VPM 2011 2Memoria de la actividad del grupo Atlas VPM 2011 2
Memoria de la actividad del grupo Atlas VPM 2011 2
 
China Inconmensurable
China InconmensurableChina Inconmensurable
China Inconmensurable
 

Similar a UDLAP Visual Calm Technology, Semiotic Engineering and Rhetoric for GUI Design

Actividad inicial de diseño de sistema
Actividad inicial de diseño de sistemaActividad inicial de diseño de sistema
Actividad inicial de diseño de sistemaYannick Steven Lp
 
Modelo para gestión de equipos UX
Modelo para gestión de equipos UXModelo para gestión de equipos UX
Modelo para gestión de equipos UXGustavo Soto Miño
 
Actividad i 131_90006_andres_paredes
Actividad i 131_90006_andres_paredesActividad i 131_90006_andres_paredes
Actividad i 131_90006_andres_paredesAndres Paredes
 
Inteligencia Artificial memorias.pptx
Inteligencia Artificial memorias.pptxInteligencia Artificial memorias.pptx
Inteligencia Artificial memorias.pptxCARLOS GARCIA
 
El portal
El portalEl portal
El portalLiber6
 
proyecto-NUEVAHORIZONTEALTO
proyecto-NUEVAHORIZONTEALTOproyecto-NUEVAHORIZONTEALTO
proyecto-NUEVAHORIZONTEALTOevidencia2013r2
 
Trabajo de heramientas informaticas
Trabajo de heramientas informaticasTrabajo de heramientas informaticas
Trabajo de heramientas informaticasthekaival
 
interaccion en el interfaz de usuario
interaccion en el interfaz de usuariointeraccion en el interfaz de usuario
interaccion en el interfaz de usuarioAngel Lema
 
Trabajo de informatica
Trabajo de informaticaTrabajo de informatica
Trabajo de informaticathekaival
 
Ado.net entity framework
Ado.net entity frameworkAdo.net entity framework
Ado.net entity frameworkCein
 
Integracion de LabVIEW, SolidWorks y Lego Mindstorms para diseño de Brazo Mec...
Integracion de LabVIEW, SolidWorks y Lego Mindstorms para diseño de Brazo Mec...Integracion de LabVIEW, SolidWorks y Lego Mindstorms para diseño de Brazo Mec...
Integracion de LabVIEW, SolidWorks y Lego Mindstorms para diseño de Brazo Mec...Giovanni Mendoza
 
36590 proyecto educativo las tic en el aula de clases esc.nva platanal
36590 proyecto educativo las tic en el aula de clases esc.nva platanal36590 proyecto educativo las tic en el aula de clases esc.nva platanal
36590 proyecto educativo las tic en el aula de clases esc.nva platanalpablovalerocpe
 
MEMORIA DEL PROYECTO TAGSBOOK
MEMORIA DEL PROYECTO TAGSBOOKMEMORIA DEL PROYECTO TAGSBOOK
MEMORIA DEL PROYECTO TAGSBOOKpometro
 
Cartel implementacion del generador de protocolos
Cartel implementacion del generador de protocolosCartel implementacion del generador de protocolos
Cartel implementacion del generador de protocolosSaul Sanchez Cuevas
 
Presentación ppt
Presentación pptPresentación ppt
Presentación pptfearshow
 
Manual estudiante-mi tallerdigital-programacion
Manual estudiante-mi tallerdigital-programacionManual estudiante-mi tallerdigital-programacion
Manual estudiante-mi tallerdigital-programacionAndreas Deris
 

Similar a UDLAP Visual Calm Technology, Semiotic Engineering and Rhetoric for GUI Design (20)

Actividad inicial de diseño de sistema
Actividad inicial de diseño de sistemaActividad inicial de diseño de sistema
Actividad inicial de diseño de sistema
 
Modelo para gestión de equipos UX
Modelo para gestión de equipos UXModelo para gestión de equipos UX
Modelo para gestión de equipos UX
 
Actividad i 131_90006_andres_paredes
Actividad i 131_90006_andres_paredesActividad i 131_90006_andres_paredes
Actividad i 131_90006_andres_paredes
 
Tipos de Interfaces
Tipos de InterfacesTipos de Interfaces
Tipos de Interfaces
 
Inteligencia Artificial memorias.pptx
Inteligencia Artificial memorias.pptxInteligencia Artificial memorias.pptx
Inteligencia Artificial memorias.pptx
 
Sistema Operativos
Sistema OperativosSistema Operativos
Sistema Operativos
 
El portal
El portalEl portal
El portal
 
proyecto-NUEVAHORIZONTEALTO
proyecto-NUEVAHORIZONTEALTOproyecto-NUEVAHORIZONTEALTO
proyecto-NUEVAHORIZONTEALTO
 
Trabajo de heramientas informaticas
Trabajo de heramientas informaticasTrabajo de heramientas informaticas
Trabajo de heramientas informaticas
 
interaccion en el interfaz de usuario
interaccion en el interfaz de usuariointeraccion en el interfaz de usuario
interaccion en el interfaz de usuario
 
Trabajo de informatica
Trabajo de informaticaTrabajo de informatica
Trabajo de informatica
 
Ado.net entity framework
Ado.net entity frameworkAdo.net entity framework
Ado.net entity framework
 
Integracion de LabVIEW, SolidWorks y Lego Mindstorms para diseño de Brazo Mec...
Integracion de LabVIEW, SolidWorks y Lego Mindstorms para diseño de Brazo Mec...Integracion de LabVIEW, SolidWorks y Lego Mindstorms para diseño de Brazo Mec...
Integracion de LabVIEW, SolidWorks y Lego Mindstorms para diseño de Brazo Mec...
 
Plantilla proyecto TechnoMaths 3D
Plantilla proyecto TechnoMaths 3DPlantilla proyecto TechnoMaths 3D
Plantilla proyecto TechnoMaths 3D
 
36590 proyecto educativo las tic en el aula de clases esc.nva platanal
36590 proyecto educativo las tic en el aula de clases esc.nva platanal36590 proyecto educativo las tic en el aula de clases esc.nva platanal
36590 proyecto educativo las tic en el aula de clases esc.nva platanal
 
Pea
PeaPea
Pea
 
MEMORIA DEL PROYECTO TAGSBOOK
MEMORIA DEL PROYECTO TAGSBOOKMEMORIA DEL PROYECTO TAGSBOOK
MEMORIA DEL PROYECTO TAGSBOOK
 
Cartel implementacion del generador de protocolos
Cartel implementacion del generador de protocolosCartel implementacion del generador de protocolos
Cartel implementacion del generador de protocolos
 
Presentación ppt
Presentación pptPresentación ppt
Presentación ppt
 
Manual estudiante-mi tallerdigital-programacion
Manual estudiante-mi tallerdigital-programacionManual estudiante-mi tallerdigital-programacion
Manual estudiante-mi tallerdigital-programacion
 

Más de Omar Sosa-Tzec

Digital Wellbeing Technology through a Social Semiotic Multimodal Lens: A Cas...
Digital Wellbeing Technology through a Social Semiotic Multimodal Lens: A Cas...Digital Wellbeing Technology through a Social Semiotic Multimodal Lens: A Cas...
Digital Wellbeing Technology through a Social Semiotic Multimodal Lens: A Cas...Omar Sosa-Tzec
 
Delight in the User Experience: Form and Place
Delight in the User Experience: Form and PlaceDelight in the User Experience: Form and Place
Delight in the User Experience: Form and PlaceOmar Sosa-Tzec
 
Delight by Motion: Investigating the Role of Animation in Microinteractions
Delight by Motion: Investigating the Role of Animation in MicrointeractionsDelight by Motion: Investigating the Role of Animation in Microinteractions
Delight by Motion: Investigating the Role of Animation in MicrointeractionsOmar Sosa-Tzec
 
Critical Design Research and Constructive Research Outcomes as Arguments
Critical Design Research and Constructive Research Outcomes as ArgumentsCritical Design Research and Constructive Research Outcomes as Arguments
Critical Design Research and Constructive Research Outcomes as ArgumentsOmar Sosa-Tzec
 
Creative Data and Information Visualization: Reflections on Two Pedagogical A...
Creative Data and Information Visualization: Reflections on Two Pedagogical A...Creative Data and Information Visualization: Reflections on Two Pedagogical A...
Creative Data and Information Visualization: Reflections on Two Pedagogical A...Omar Sosa-Tzec
 
Teaching Design, Information, and Interaction: Reflections, Foundations, and ...
Teaching Design, Information, and Interaction: Reflections, Foundations, and ...Teaching Design, Information, and Interaction: Reflections, Foundations, and ...
Teaching Design, Information, and Interaction: Reflections, Foundations, and ...Omar Sosa-Tzec
 
Visualizing Data Trails: Metaphors and a Symbolic Language for Interfaces
Visualizing Data Trails: Metaphors and a Symbolic Language for InterfacesVisualizing Data Trails: Metaphors and a Symbolic Language for Interfaces
Visualizing Data Trails: Metaphors and a Symbolic Language for InterfacesOmar Sosa-Tzec
 
Communicating design-related intellectual influence: towards visual references
 Communicating design-related intellectual influence: towards visual references Communicating design-related intellectual influence: towards visual references
Communicating design-related intellectual influence: towards visual referencesOmar Sosa-Tzec
 
Design tensions: Interaction Criticism on Instagram’s Mobile Interface
Design tensions: Interaction Criticism on Instagram’s Mobile InterfaceDesign tensions: Interaction Criticism on Instagram’s Mobile Interface
Design tensions: Interaction Criticism on Instagram’s Mobile InterfaceOmar Sosa-Tzec
 
Interacciones Encantadoras: Interfaces de Usuario desde una Perspectiva Semió...
Interacciones Encantadoras: Interfaces de Usuario desde una Perspectiva Semió...Interacciones Encantadoras: Interfaces de Usuario desde una Perspectiva Semió...
Interacciones Encantadoras: Interfaces de Usuario desde una Perspectiva Semió...Omar Sosa-Tzec
 
My fascination with the visual: meaning, persuasion, and delight
My fascination with the visual: meaning, persuasion, and delightMy fascination with the visual: meaning, persuasion, and delight
My fascination with the visual: meaning, persuasion, and delightOmar Sosa-Tzec
 
Visual Design for Interface and Experience Design
Visual Design for Interface and Experience DesignVisual Design for Interface and Experience Design
Visual Design for Interface and Experience DesignOmar Sosa-Tzec
 
Affordances, Constraints, and Feedback in User Experience Design
Affordances, Constraints, and Feedback in User Experience DesignAffordances, Constraints, and Feedback in User Experience Design
Affordances, Constraints, and Feedback in User Experience DesignOmar Sosa-Tzec
 
User Experience Design, Navigation, and Interaction Flows
User Experience Design, Navigation, and Interaction FlowsUser Experience Design, Navigation, and Interaction Flows
User Experience Design, Navigation, and Interaction FlowsOmar Sosa-Tzec
 
Introduction to Human-Computer Interaction and Interaction Design
Introduction to Human-Computer Interaction and Interaction DesignIntroduction to Human-Computer Interaction and Interaction Design
Introduction to Human-Computer Interaction and Interaction DesignOmar Sosa-Tzec
 
Takeaways from the course Visual Design for User Experience
Takeaways from the course Visual Design for User ExperienceTakeaways from the course Visual Design for User Experience
Takeaways from the course Visual Design for User ExperienceOmar Sosa-Tzec
 
Introduction to Visual Design for User Experience
Introduction to Visual Design for User ExperienceIntroduction to Visual Design for User Experience
Introduction to Visual Design for User ExperienceOmar Sosa-Tzec
 
Sometimes a sign, sometimes a figure
Sometimes a sign, sometimes a figureSometimes a sign, sometimes a figure
Sometimes a sign, sometimes a figureOmar Sosa-Tzec
 
Principios de Diseño Visual para Interacción Humano-Computadora
Principios de Diseño Visual para Interacción Humano-ComputadoraPrincipios de Diseño Visual para Interacción Humano-Computadora
Principios de Diseño Visual para Interacción Humano-ComputadoraOmar Sosa-Tzec
 

Más de Omar Sosa-Tzec (20)

Digital Wellbeing Technology through a Social Semiotic Multimodal Lens: A Cas...
Digital Wellbeing Technology through a Social Semiotic Multimodal Lens: A Cas...Digital Wellbeing Technology through a Social Semiotic Multimodal Lens: A Cas...
Digital Wellbeing Technology through a Social Semiotic Multimodal Lens: A Cas...
 
Delight in the User Experience: Form and Place
Delight in the User Experience: Form and PlaceDelight in the User Experience: Form and Place
Delight in the User Experience: Form and Place
 
Delight by Motion: Investigating the Role of Animation in Microinteractions
Delight by Motion: Investigating the Role of Animation in MicrointeractionsDelight by Motion: Investigating the Role of Animation in Microinteractions
Delight by Motion: Investigating the Role of Animation in Microinteractions
 
Critical Design Research and Constructive Research Outcomes as Arguments
Critical Design Research and Constructive Research Outcomes as ArgumentsCritical Design Research and Constructive Research Outcomes as Arguments
Critical Design Research and Constructive Research Outcomes as Arguments
 
Creative Data and Information Visualization: Reflections on Two Pedagogical A...
Creative Data and Information Visualization: Reflections on Two Pedagogical A...Creative Data and Information Visualization: Reflections on Two Pedagogical A...
Creative Data and Information Visualization: Reflections on Two Pedagogical A...
 
Teaching Design, Information, and Interaction: Reflections, Foundations, and ...
Teaching Design, Information, and Interaction: Reflections, Foundations, and ...Teaching Design, Information, and Interaction: Reflections, Foundations, and ...
Teaching Design, Information, and Interaction: Reflections, Foundations, and ...
 
Visualizing Data Trails: Metaphors and a Symbolic Language for Interfaces
Visualizing Data Trails: Metaphors and a Symbolic Language for InterfacesVisualizing Data Trails: Metaphors and a Symbolic Language for Interfaces
Visualizing Data Trails: Metaphors and a Symbolic Language for Interfaces
 
Communicating design-related intellectual influence: towards visual references
 Communicating design-related intellectual influence: towards visual references Communicating design-related intellectual influence: towards visual references
Communicating design-related intellectual influence: towards visual references
 
Design tensions: Interaction Criticism on Instagram’s Mobile Interface
Design tensions: Interaction Criticism on Instagram’s Mobile InterfaceDesign tensions: Interaction Criticism on Instagram’s Mobile Interface
Design tensions: Interaction Criticism on Instagram’s Mobile Interface
 
Interacciones Encantadoras: Interfaces de Usuario desde una Perspectiva Semió...
Interacciones Encantadoras: Interfaces de Usuario desde una Perspectiva Semió...Interacciones Encantadoras: Interfaces de Usuario desde una Perspectiva Semió...
Interacciones Encantadoras: Interfaces de Usuario desde una Perspectiva Semió...
 
My fascination with the visual: meaning, persuasion, and delight
My fascination with the visual: meaning, persuasion, and delightMy fascination with the visual: meaning, persuasion, and delight
My fascination with the visual: meaning, persuasion, and delight
 
Visual Design for Interface and Experience Design
Visual Design for Interface and Experience DesignVisual Design for Interface and Experience Design
Visual Design for Interface and Experience Design
 
Affordances, Constraints, and Feedback in User Experience Design
Affordances, Constraints, and Feedback in User Experience DesignAffordances, Constraints, and Feedback in User Experience Design
Affordances, Constraints, and Feedback in User Experience Design
 
User Experience Design, Navigation, and Interaction Flows
User Experience Design, Navigation, and Interaction FlowsUser Experience Design, Navigation, and Interaction Flows
User Experience Design, Navigation, and Interaction Flows
 
Introduction to Human-Computer Interaction and Interaction Design
Introduction to Human-Computer Interaction and Interaction DesignIntroduction to Human-Computer Interaction and Interaction Design
Introduction to Human-Computer Interaction and Interaction Design
 
Takeaways from the course Visual Design for User Experience
Takeaways from the course Visual Design for User ExperienceTakeaways from the course Visual Design for User Experience
Takeaways from the course Visual Design for User Experience
 
Introduction to Visual Design for User Experience
Introduction to Visual Design for User ExperienceIntroduction to Visual Design for User Experience
Introduction to Visual Design for User Experience
 
Sometimes a sign, sometimes a figure
Sometimes a sign, sometimes a figureSometimes a sign, sometimes a figure
Sometimes a sign, sometimes a figure
 
Principios de Diseño Visual para Interacción Humano-Computadora
Principios de Diseño Visual para Interacción Humano-ComputadoraPrincipios de Diseño Visual para Interacción Humano-Computadora
Principios de Diseño Visual para Interacción Humano-Computadora
 
HCI Seminar Fall 2015
HCI Seminar Fall 2015HCI Seminar Fall 2015
HCI Seminar Fall 2015
 

Último

Portafolio de Diseño Gráfico por Giorgio B Huizinga
Portafolio de Diseño Gráfico por Giorgio B HuizingaPortafolio de Diseño Gráfico por Giorgio B Huizinga
Portafolio de Diseño Gráfico por Giorgio B Huizingagbhuizinga2000
 
FICHAS PARA LA PRIMERA SEMANA SALOME.doc
FICHAS PARA LA PRIMERA SEMANA SALOME.docFICHAS PARA LA PRIMERA SEMANA SALOME.doc
FICHAS PARA LA PRIMERA SEMANA SALOME.docMerlyBrisetTorneroLu
 
Plano de diseño de una Planta de tratamiento de aguas PTAP
Plano de diseño de una Planta de tratamiento de aguas  PTAPPlano de diseño de una Planta de tratamiento de aguas  PTAP
Plano de diseño de una Planta de tratamiento de aguas PTAPjuanrincon129309
 
Hospital croquis de modulo 3 con leyenda
Hospital croquis de modulo 3 con leyendaHospital croquis de modulo 3 con leyenda
Hospital croquis de modulo 3 con leyendaratc070603hmcmrha7
 
Danielarora Martinez 31061614 ARQUITECTURA GRIEGA.pptx
Danielarora Martinez 31061614 ARQUITECTURA GRIEGA.pptxDanielarora Martinez 31061614 ARQUITECTURA GRIEGA.pptx
Danielarora Martinez 31061614 ARQUITECTURA GRIEGA.pptxaurorialfonzo6
 
Historia de los estilos artísticos docum
Historia de los estilos artísticos documHistoria de los estilos artísticos docum
Historia de los estilos artísticos documminipuw
 
PRESENTACION SOBRE EL PROYECTO DE GRADO .
PRESENTACION SOBRE EL PROYECTO DE GRADO .PRESENTACION SOBRE EL PROYECTO DE GRADO .
PRESENTACION SOBRE EL PROYECTO DE GRADO .Rosa329296
 
LAMODERNIDADARQUITECTURABYBARBARAPADILLA.pdf
LAMODERNIDADARQUITECTURABYBARBARAPADILLA.pdfLAMODERNIDADARQUITECTURABYBARBARAPADILLA.pdf
LAMODERNIDADARQUITECTURABYBARBARAPADILLA.pdfBrbara57940
 
El cómic es algo serio: investigación sobre la realidad latinoamericana de la...
El cómic es algo serio: investigación sobre la realidad latinoamericana de la...El cómic es algo serio: investigación sobre la realidad latinoamericana de la...
El cómic es algo serio: investigación sobre la realidad latinoamericana de la...mariaclaramb
 
Calendario 2024 Santoral con fase lunar.pdf
Calendario 2024 Santoral con fase lunar.pdfCalendario 2024 Santoral con fase lunar.pdf
Calendario 2024 Santoral con fase lunar.pdfAsol7
 
Triptico de Sistemas anticaídas Arnes.pdf
Triptico de Sistemas anticaídas Arnes.pdfTriptico de Sistemas anticaídas Arnes.pdf
Triptico de Sistemas anticaídas Arnes.pdfMariaGabrielaSandova2
 
Sesión 02 Buenas practicas de manufactura.pptx
Sesión 02 Buenas practicas de manufactura.pptxSesión 02 Buenas practicas de manufactura.pptx
Sesión 02 Buenas practicas de manufactura.pptxMarcosAlvarezSalinas
 
Afiche Didáctico-Temático de la Modernidad
Afiche Didáctico-Temático de la ModernidadAfiche Didáctico-Temático de la Modernidad
Afiche Didáctico-Temático de la ModernidadDiosymarSuarez
 
La arquitectura griega y su legado en la historia
La arquitectura griega y su legado en la historiaLa arquitectura griega y su legado en la historia
La arquitectura griega y su legado en la historiaCamilaIsabelaRodrigu
 
Medición IRI Diseño de Pavimentos Maestria en Vias Terrestres
Medición IRI Diseño de Pavimentos Maestria en Vias TerrestresMedición IRI Diseño de Pavimentos Maestria en Vias Terrestres
Medición IRI Diseño de Pavimentos Maestria en Vias TerrestresKengYoshiIngaOchoa1
 
Gabriela Marcano historia de la arquitectura 2 renacimiento
Gabriela Marcano historia de la arquitectura 2 renacimientoGabriela Marcano historia de la arquitectura 2 renacimiento
Gabriela Marcano historia de la arquitectura 2 renacimientoGabrielaMarcano12
 
LANZAMIENTO, NUEVOS SET DE COCINA, PETROLEUM, VINTAGE, CARAMEL Y LAVANDA
LANZAMIENTO, NUEVOS SET DE COCINA, PETROLEUM, VINTAGE, CARAMEL Y LAVANDALANZAMIENTO, NUEVOS SET DE COCINA, PETROLEUM, VINTAGE, CARAMEL Y LAVANDA
LANZAMIENTO, NUEVOS SET DE COCINA, PETROLEUM, VINTAGE, CARAMEL Y LAVANDAdiawaraplast
 
Dia mundial de la salud (1).pdf triptico
Dia mundial de la salud (1).pdf tripticoDia mundial de la salud (1).pdf triptico
Dia mundial de la salud (1).pdf tripticoThaisAymeeTacucheBen
 
Anatomia.pfd29382819292829191929292929292929
Anatomia.pfd29382819292829191929292929292929Anatomia.pfd29382819292829191929292929292929
Anatomia.pfd29382819292829191929292929292929FiorellaLaura2
 
Libro DIBUJO I digital (1).pdf, para estudiantes de nivel basico
Libro DIBUJO I digital  (1).pdf, para estudiantes de nivel basicoLibro DIBUJO I digital  (1).pdf, para estudiantes de nivel basico
Libro DIBUJO I digital (1).pdf, para estudiantes de nivel basicoJOSE645741
 

Último (20)

Portafolio de Diseño Gráfico por Giorgio B Huizinga
Portafolio de Diseño Gráfico por Giorgio B HuizingaPortafolio de Diseño Gráfico por Giorgio B Huizinga
Portafolio de Diseño Gráfico por Giorgio B Huizinga
 
FICHAS PARA LA PRIMERA SEMANA SALOME.doc
FICHAS PARA LA PRIMERA SEMANA SALOME.docFICHAS PARA LA PRIMERA SEMANA SALOME.doc
FICHAS PARA LA PRIMERA SEMANA SALOME.doc
 
Plano de diseño de una Planta de tratamiento de aguas PTAP
Plano de diseño de una Planta de tratamiento de aguas  PTAPPlano de diseño de una Planta de tratamiento de aguas  PTAP
Plano de diseño de una Planta de tratamiento de aguas PTAP
 
Hospital croquis de modulo 3 con leyenda
Hospital croquis de modulo 3 con leyendaHospital croquis de modulo 3 con leyenda
Hospital croquis de modulo 3 con leyenda
 
Danielarora Martinez 31061614 ARQUITECTURA GRIEGA.pptx
Danielarora Martinez 31061614 ARQUITECTURA GRIEGA.pptxDanielarora Martinez 31061614 ARQUITECTURA GRIEGA.pptx
Danielarora Martinez 31061614 ARQUITECTURA GRIEGA.pptx
 
Historia de los estilos artísticos docum
Historia de los estilos artísticos documHistoria de los estilos artísticos docum
Historia de los estilos artísticos docum
 
PRESENTACION SOBRE EL PROYECTO DE GRADO .
PRESENTACION SOBRE EL PROYECTO DE GRADO .PRESENTACION SOBRE EL PROYECTO DE GRADO .
PRESENTACION SOBRE EL PROYECTO DE GRADO .
 
LAMODERNIDADARQUITECTURABYBARBARAPADILLA.pdf
LAMODERNIDADARQUITECTURABYBARBARAPADILLA.pdfLAMODERNIDADARQUITECTURABYBARBARAPADILLA.pdf
LAMODERNIDADARQUITECTURABYBARBARAPADILLA.pdf
 
El cómic es algo serio: investigación sobre la realidad latinoamericana de la...
El cómic es algo serio: investigación sobre la realidad latinoamericana de la...El cómic es algo serio: investigación sobre la realidad latinoamericana de la...
El cómic es algo serio: investigación sobre la realidad latinoamericana de la...
 
Calendario 2024 Santoral con fase lunar.pdf
Calendario 2024 Santoral con fase lunar.pdfCalendario 2024 Santoral con fase lunar.pdf
Calendario 2024 Santoral con fase lunar.pdf
 
Triptico de Sistemas anticaídas Arnes.pdf
Triptico de Sistemas anticaídas Arnes.pdfTriptico de Sistemas anticaídas Arnes.pdf
Triptico de Sistemas anticaídas Arnes.pdf
 
Sesión 02 Buenas practicas de manufactura.pptx
Sesión 02 Buenas practicas de manufactura.pptxSesión 02 Buenas practicas de manufactura.pptx
Sesión 02 Buenas practicas de manufactura.pptx
 
Afiche Didáctico-Temático de la Modernidad
Afiche Didáctico-Temático de la ModernidadAfiche Didáctico-Temático de la Modernidad
Afiche Didáctico-Temático de la Modernidad
 
La arquitectura griega y su legado en la historia
La arquitectura griega y su legado en la historiaLa arquitectura griega y su legado en la historia
La arquitectura griega y su legado en la historia
 
Medición IRI Diseño de Pavimentos Maestria en Vias Terrestres
Medición IRI Diseño de Pavimentos Maestria en Vias TerrestresMedición IRI Diseño de Pavimentos Maestria en Vias Terrestres
Medición IRI Diseño de Pavimentos Maestria en Vias Terrestres
 
Gabriela Marcano historia de la arquitectura 2 renacimiento
Gabriela Marcano historia de la arquitectura 2 renacimientoGabriela Marcano historia de la arquitectura 2 renacimiento
Gabriela Marcano historia de la arquitectura 2 renacimiento
 
LANZAMIENTO, NUEVOS SET DE COCINA, PETROLEUM, VINTAGE, CARAMEL Y LAVANDA
LANZAMIENTO, NUEVOS SET DE COCINA, PETROLEUM, VINTAGE, CARAMEL Y LAVANDALANZAMIENTO, NUEVOS SET DE COCINA, PETROLEUM, VINTAGE, CARAMEL Y LAVANDA
LANZAMIENTO, NUEVOS SET DE COCINA, PETROLEUM, VINTAGE, CARAMEL Y LAVANDA
 
Dia mundial de la salud (1).pdf triptico
Dia mundial de la salud (1).pdf tripticoDia mundial de la salud (1).pdf triptico
Dia mundial de la salud (1).pdf triptico
 
Anatomia.pfd29382819292829191929292929292929
Anatomia.pfd29382819292829191929292929292929Anatomia.pfd29382819292829191929292929292929
Anatomia.pfd29382819292829191929292929292929
 
Libro DIBUJO I digital (1).pdf, para estudiantes de nivel basico
Libro DIBUJO I digital  (1).pdf, para estudiantes de nivel basicoLibro DIBUJO I digital  (1).pdf, para estudiantes de nivel basico
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.
  • 5. v
  • 6. v
  • 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
  • 8. 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
  • 18. 6 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