Tentándole (interacción)

francisco tosete | usabilidad, interacción, diseño y arquitectura de información

histórico de posts

July 29, 2007

Visibilidad, botones, funciones, colores y semiótica

Duplico los comentarios de Santi y David a propósito del botón de encendido/apagado del Nokia 6101 que me han dado pie a seguir con la reflexión (más abajo):

” 1.

“Que el mismo botón en mi móvil (un Nokia 6101) sirva para encenderlo y apagarlo es un contrasentido.

Un funcionamiento altamente misterioso para un usuario novel, e impredecible si no se ha tenido experiencia previa con otros móviles”.

No creo que sea un contrasentido. ¿Por qué hemos de tener un botón de encendido y otro de apagado?. Un mismo boton que puede hacer esas dos acciones, acciones que son discriminatorias entre sí. Me explico: mientras el móvil está apagado, solo puedes encenderlo; y mientras esté encendido solo puedes apagarlo. (Hablando de ese botón claro).

Además no creo que sea algo que al usuario le lleve a confusión dado que desde hace ya mucho tiempo el botón de encendido ha servido como botón de apagado. Incluso la televisión en blanco y negro que tenía mi abuela en el pueblo -y que solo tenía 2 canales- disponía de un botón tanto para encenderlo como para apagarlo. Y desde entonces -y supongo que anteriormente también- siempre se le asociaba un icono al botón, el dibujo de una línea vertical cruzando de fuera a dentro un círculo.

Por eso creo que cualquier usuario va a saber que para encender o apagar aquello que tenga entre manos, hace falta darle al botón.

Otra cosa es que hablemos que para apagar el ordenador (entendemos que en cualquier sistema operativo Windows) haya que ir a Inicio. Ahí ya entraríamos en la usabilidad de Windows, pero que nada tiene que ver con que el botón de encendido y apagado de cualquier aparato electrónico sea el mismo.

Salu2
Santi M.

Comment by martinpulido — July 23, 2007 @ 8:37 am | Edit This
2.

Añadele un icono significativo de ambos estados entonces encima o de que cumple ambas funciones. Haz visible que ese único botón tiene ambas funciones si no, me sigue resultando impredecible porque aunque funcione como un interruptor ni el entorno (una habitación con su interruptor) ni el dispositivo (una televisión, una radio…) es el mismo y el conocimiento que extraemos del mundo no nos permite identificar el funcionamiento de ese botón como un interruptor. En el Nokia 6101 como comentas seguimos yendo al botón de inicio/encedido para apagarlo. Poco usable ¿no? ;-)

Comment by Administrator — July 23, 2007 @ 12:41 pm | Edit This
3.

Estoy en parte de acuerdo contigo Santi, pero el comentario de Paco es clarificador. Yo veo claro el tema en un televisor, si nos fijamos tenemos un único botón para encender y apagar la tele, otra cosa es ya hablar del “stand by” que tiene mucha tela que cortar con su botón en rojo…, pero centrándonos en lo que comentaba, vemos que los botones que en los móviles sirven para encender el móvil y apagarlo, es curiosamente el de “colgar”, incluso el icono que sale es un teléfono colgando y de color rojo…, vaya, pues el rojo semióticamente me está dando otras connotaciones.

Si cambiamos de tercio, yo en mi pantalla de ordenador veo que el mismo botón sirve para encender y apagar, pero aparte de que el símbolo está relacionado con una opción de paso de corriente (on/off), me indica con color su estado, con lo que su referente visual queda reforzado a pesar de ser el mismo botón, pero si hacemos abstracción ese mismo botón ha cambiado de estado, con lo que ya “no es el mismo botón”, al menos metacognitivamente porque el referente ha cambiado su estado.

Un paralelismo muy claro con esto es la llave de contacto de un coche. El referente cognitivo lo tenemos claro (el giro activa algo en un sentido y desactiva en el otro), pero cambia su función en el momento en que está dispuesta en uno de los dos sentidos, y de esta posición creamos un nuevo modelo mental, esa llave que me ha permitido arrancar el coche, si la acciono y la giro me va a permitir apagarlo. es casi lo mismo, sí, pero con el detalle significativo y fundamental de que ha cambiado su estado (posición) entre una y otra acciones.

Definitivamente el botón de encendido y apagado de los móviles debe replantearse, quizás no añadiendo un nuevo botón, o sí y específico para realizar esa acción.

si queréis alucinar con esto os recomiendo que analicéis esto mismo que estamos hablando con mi móvil, tiene dos botones con las mismas funcionalidades, alucinante, sólo que uno de ellos es el que tiene la clave para encender o apagarlo todo…, lógico? yo no lo creo…

Modelo LG K800 Chocolate
http://www.flickr.com/search/?q=kg800

Comment by David Maniega — July 27, 2007 @ 5:02 pm | Edit This”

——————————

Continuando con el tema…

¿Dos botones con las mismas funcionalidades excepto para el apagado/encendido? ¿? ¿Por qué han replicado exactamente las mismas funcionalidades en dos botones diferentes? ¿Cuestión de diseño y estética?

Más leña al fuego directamente relacionado con los botones del LG y con todo esto. Ayer me pasó algo curioso. Los Peugeot 307 tienen climatizador bizona lo que significa que el conductor y acompañante pueden regular por separado la temperatura de sus respectivas zonas o asientos. Para ello, en el salpicadero, la gente de Peugeot ha duplicado los botones de control de la temperatura. Un control para el conductor, otro para el acompañante. Dos botones diferentes con la misma funcionalidad para dos personas y áreas del coche diferentes usándose, o no, simultáneamente. Igual que en el LG. Bien, lógico en este caso ¿no? El problema se presenta cuando viajas sin pareja. ¿Cómo controlamos entonces la temperatura global de ambas zonas desde un único mando? Bonito problema. ¿Le metemos esa función extra al botón del conductor para controlar la temperatura global del coche? Y en ese caso ¿cómo hacemos visible que el botón del conductor tiene ambas funciones? ¿y cómo saltamos de la una (control de temperatura local) a la otra (control de temperatura global) si están fusionadas en un único botón? ¿Ponemos un tercer botón para la temperatura global? ¿No existe posibilidad de controlar la temperatura global del coche? :-)

La respuesta no la he sabido hasta que esta mañana he consultado la “Guía de utilización” del coche. La solución de Peugeot ha sido poner tres botones diferentes, uno para el conductor, otro para el acompañante y otro para controlar la temperatura global al que han llamado “Auto” (por Automatic).

Peugeot 307. Imagen de la Guía de utilización. Página 46 Climatizador bizona

En el caso del Peugeot veo lógica la replicación de botones con la misma funcionalidad al controlar cada botón una zona distinta y estar puesto para dos personas diferentes. En el caso del LG no sé porqué han replicado los botones con las mismas funciones ¿se os ocurre alguna razón además de para no romper el diseño/estética basado en la replicación de la apariencia a partir del eje vertical del teléfono?

De cualquier forma creo que todos estos problemas derivan del principio de la visibilidad: Un mismo botón puede tener funciones diferentes y actuar como un interruptor entre estados de funciones pero el usuario debería recibir o tener un feedback del sistema indicándole en cada momento el estado que cumple el botón. Es un problema de plegado de información. Un clic, entramos en la función A, otro clic, entramos en la función B, un tercer clic, función C. Si tenemos una pantalla en la que mostrar los estados que se van alternando al usuario no hay problema ni conflicto en el modelo mental del usuario. La interacción es clara. Pero si no tenemos ese feedback (y en la superficie de un objeto físico no tenemos manera de que varíe su aspecto como en una interfaz digital) el modelo de interacción se rompe y funciona de manera misteriosa. Otro ejemplo de una función a la que estamos menos habituados en el móvil es la de las mayúsculas/minúsculas al escribir un sms. Un clic, primera letra de la frase en mayúscula, otro, todas las letras en mayúsculas, tercer clic, todo en minúsculas. Recibimos feedback de los estados correspondientes a través de una representación simulada de texto en pantalla en la esquina superior derecha (en mi Nokia):

  • Abc
  • ABC
  • abc

si no, tendríamos serias dificultades para saber en qué estado nos encontramos. La Web y las interfaces digitales nos permiten el desarrollo de modelos de interacción muchos más ricos y flexibles que los de las superficies físicas al poder variar dinámicamente su aspecto en función del estado: El plegado de información. Así, utilizando por ejemplo un combo desplegable podemos tener “x” funciones o valores diferentes y un box de texto que esté pegado (ver imagen de más abajo) para aceptar el valor correspondiente. El desplegable nos permite tiene la gran ventaja de que ocupa un reducido espacio de pantalla a costa de utilizar capas que se superponen. De lo contrario ocuparíamos el doble de espacio, si utilizasemos por ejemplo radiobuttons para cada valor y ya se sabe que el espacio de pantalla es lo más valioso. La gran desventaja de utilizar el combo, por supuesto, es que no quedan visibles los valores y para conocerlos, el usuario tiene que hacer clic en el desplegable. No hay visibilidad, no hay forma de conocer a priori que hay detrás del combo (aunque nos lo podemos imaginar si acompañamos al combo y al box de texto un rótulo significativo como “Seleccione la fruta” y “Cuantas piezas quiere”. Ventajas y desventajas.

Combo desplegable de fruta

Es para reflexionar sobre ello más tranquilamente, y si tenemos en cuenta el tercer aspecto que comentabas, David, la utilización de colores para marcar estados, las combinaciones que se pueden dar son muy interesantes porque las connotaciones semióticas, como apuntas, varían (no es lo mismo el color rojo, que el azul, el negro, o el verde). Habrá que seguir pensando en todo ello :-)

Comments »

The URI to TrackBack this entry is: http://tentandole.blogsome.com/2007/07/29/visibilidad-botones-funciones-colores-y-semiotica/trackback/

No comments yet.

RSS feed for comments on this post.

Leave a comment

Line and paragraph breaks automatic, e-mail address never displayed, HTML allowed: <a href="" title=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <code> <em> <i> <strike> <strong>























Get free blog up and running in minutes with Blogsome
Theme designed by Hadley Wickham