Tag Archives: métodos y procesos de diseño

Sitio web de la Biblioteca Franciscana

Ahora que la web puede accederse desde una PC, una laptop, un SmartPhone o una tableta, se nos presenta una paradoja a los diseñadores: debemos creer en la estructura semántica del contenido de las páginas, pero también hay que cuidar más que nunca la presentación de la información considerando tanto al usuario como el dispositivo a usar.  Últimamente me ha llamado la atención estos sitios que aprovechan las ventajas del CSS para ajustar sus layouts dependiendo de su resolución, así que aproveché experimentar con un proyecto de rediseño web que tenía  pendiente: La Biblioteca Franciscana.

Mi solución es bastante artesanal y no tiene nada de sofisticada. Aunque hay artículos bastante completos sobre el tema, yo había leído alguna vez que tenía que ver con el viewport, y entre los resultados de mi búsqueda di con el uso del parámetro media y los CSS Media Queries. En los siguientes recursos está cómo emplear diferentes hojas de estilo dependiendo del medio:

http://css-tricks.com/6206-resolution-specific-stylesheets/

http://css-tricks.com/6731-css-media-queries/

http://www.w3.org/TR/css3-mediaqueries/

http://reference.sitepoint.com/css/mediaqueries

http://www.css3.info/preview/media-queries/

http://coding.smashingmagazine.com/2010/07/19/how-to-use-css3-media-queries-to-create-a-mobile-version-of-your-website/

http://www.thecssninja.com/css/iphone-orientation-css

En cuanto al diseño web, siempre tuve una preferencia por layouts fijos por tener un mayor control del espacio en ventana y por tomar en cuenta la resolución estándar de un usuario potencial. Nunca me había preocupado porque la información quedara bien acomodada en diferentes resoluciones; es un reto interesante conservar la estética reticular y mantener un flujo de lectura adecuado para cada resolución. Este tipo de soluciones requiere que tengamos una actitud algo quisquillosa y obsesiva, así como trabajar cada layout hasta quedar satisfechos.

Justo por el cambio de "paradigma" de fijo a adaptable, y ante una especie de "bloqueo ante la hoja en blanco", no quedaba conforme en (regresar a) maquetar primero en algún software de diseño, así que lo trabajé directo en pantalla. Un pro de esta decisión es que vas viendo "en tiempo real" como quedan las cosas en diferentes navegadores y resoluciones. Un contra es que podemos perder el control fácilmente —sobretodo si dejamos el proyecto un día o dos. Es importante hacer anotaciones en papel y documentar en las hojas de estilo para que recordemos por qué tomamos ciertas decisiones. En este proyecto, me resultaron —a mi juicio— muchas hojas de estilo y fui redundante en ciertas reglas, dejándolas en cada hoja porque no sabía como iba a verse "el final" en todas las resoluciones; algo así como "un cambio por aquí y luego ajusto por acá".

Con un layout fijo no considero útil que tengamos muchas hojas de estilo, pero dadas las múltiples resoluciones, parece ser necesario un mayor número de "enlaces". Un colega me sugirió hacer importaciones, pero al final descarté esta opción porque según hojeé, afecta el rendimiento:

http://www.stevesouders.com/blog/2009/04/09/dont-use-import/

Otro punto importante es verificar la compatibilidad de los CSS Media Queries. Originalmente estaba muy feliz —tipo the Oatmeal— porque IE se comportaba decente; pero por no leer, me llevo la sorpresa de que fuera de IE 9, simplemente no funcionan:

http://caniuse.com/css-mediaqueries

Ante esta situación, decidí dejarle un layout fijo a todos aquellos usuarios que tuvieran de IE 8 para abajo y tomando como resolución estándar 1024 px de ancho.

Luego está el asunto del iPhone y del iPad. Hay que poner una línea de código que indique qué va a pasar cuando el navegador sea Safari. Esta línea asocia la variable "ancho" empleada en el CSS Media Query con el "ancho" del iPad, iPod o iPhone —según sea el caso. Además, resulta que cuando pasamos de modo landscape a portrait, o viceversa, se hace un zoom medio raro y es posible que los textos se desplieguen de diferente tamaño a como los observamos en una computadora de escritorio. Para validar todo lo anterior está como referencia el siguiente recurso:

http://stackoverflow.com/questions/2977550/iphone-safari-css-rotation-bug

A mi me divirtió mucho esta idea de presentar el mejor layout dado el ancho del iPod, iPhone o iPad. Sin embargo, siendo sinceros y "usables", la desventaja de jugar con diferentes acomodos de la información es que rompemos con la navegación (browsing) del usuario. Cuando alguno de estos dispositivos se rota 90 grados, debido a este re-acomodo, el usuario pierde vista la información de su interés. Lo anterior es más evidente en el caso del iPod/iPhone. Cognitivamente, lo que hacemos es "resetear"  el flujo de interacción; definitivamente algo no bueno para ningún usuario. En este proyecto, la mayoría de la información es estática y aquella que podría cambiar o agregarse durante el año, estará ubicada en la parte superior de las páginas correspondientes.

Una colega me señaló que estos ajustes automáticos no siempre convenían si trabajamos en una computadora de escritorio  —o en una laptop con pantalla grande — porque quizá el re-acomodo de la información podría perjudicarnos cuando llevemos a cabo una tarea más compleja, donde trabajemos con la información proveniente de diversas ventanas. Se me hizo un punto válido; por ejemplo, yo mismo he copiado y pegado información de una página web a Word o Excel. En este tipo de situaciones, debería de haber una opción para "fijar" el layout.

Por último, no olviden visitar http://ciria.udlap.mx/franciscana/ para enterarse de qué conferencias y exposiciones habrá en dicha biblioteca. Saludos :)

Rediseño de un formulario web

En el diseño de información, los formularios pueden ser complicados de resolver porque a pesar de parecer aburridos, se necesitan tomar buenas decisiones sobre cómo podría darse el flujo de lectura, el entendimiento de los campos, atender a cuestiones de legibilidad, definir jerarquías visuales, en algunas ocasiones el manejo de color y elementos gráficos, y en general preveer un buen flujo de trabajo (es decir, la "interacción" con el formulario).

En un proyecto reciente, me topé con un formulario web para búsquedas avanzadas. El texto en el formulario ya estaba previamente aprobado. En este caso, mi asignación fue realizar un posible ajuste visual al contenido del formulario.

El formulario original:

Formulario de búsqueda avanzada del catálogo de marcas de fuego de la UDLAP - BUAP antes de su rediseño

El formulario en realidad son dos: uno tiene que ver con la búsqueda por "Procedencia" y/o "Institución" y el otro con la búsqueda avanzada por "Identificador de la marca". Sin duda, una forma directa de resolver esta situación es a través de una "división visual" que rompiera la lectura tan vertical que se tenía originalmente.

La parte de "Procedencia" y/o "Institución" resulta complicada por si misma: ¿cómo sabes qué campo es más importante?, ¿se llena uno? ¿se llenan ambos? Al final se decidió que el usuario, en su curva de aprendizaje, aprendiera a trabajar esta sección sin "ayudas visuales" adicionales — como poner una leyenda al estilo: "A ver mi estimado usuario, o llenas uno o llenas los dos, etc".

De la parte de "Buscar en", "Tipología" y "Ordenar resultados por", me surgió la duda si debía cada sección acomodarse horizontalmente. Eso daría una dinámica de trabajo de ir bajando un renglón/bloque a la vez. Sin embargo, esa opción no podría ser adecuada porque al menos en "Buscar en", las 8 opciones la convierten en impráctica. El cambio que sí se realizó fue que las opciones por defecto en "Búscar en", "Tipología" y "Ordenar resultados por" sean más evidentes para el usuario poniéndolas de primero.

Este es el resultado del formulario:

Formulario de búsqueda avanzada del catálogo de marcas de fuego de la UDLAP - BUAP después de su rediseño

Aunque los cambios realmente no son drásticos, puede observarse que con un acomodo más reticulado y manejo del aire compositivo en adición a las cuestiones planteadas arriba, el formulario se ve más consistente y quizá sea más usable. Afirmación, que por su naturaleza, sólo se puede validar a través de una prueba de usabilidad :)

Factor sorpresa en publicidad

Siempre ha sido una monserga promocionar un producto o servicio, porque es necesario que quede en la mente de las personas como algo deseable, algo que se desea consumir. La publicidad tiene sus jugarretas interesantes para incrustar esta idea de deseo y/o tomar acción.

En repetidas ocasiones he notado que cierto tipo de publicidad apela a la inteligencia del consumidor. Hay un comentario, una actitud en los personajes o algo en el mensaje publicitario que hace que el espectador ponga una cara de "¡Ja! Si las cosas son así, qué tontos" o de "Soy más listo porque se mejor lo que conviene que los mismos personajes que aparecen en el anuncio".

Otro que he notado es el factor de la lógica o la razón: mostrar al consumidor datos crudos para convencerlo de que es lógico o razonable las bondades asociadas al producto o servicio que se publicita.

Por otro lado, en la ciudad en la que vivo, es común que en horas pico pase alguien en los cruceros y te reparta tarjetas sobre clubs nocturnoschicas que dan masajes ejecutivos. La tarjeta casi siempre de dos vistas, incluye al frente el atractivo visual y al reverso los datos de contacto.

Como anécdota, me ha tocado ver en más de una ocasión al estar en un crucero yendo en taxi, como el chofer guarda la tarjeta dentro de un fajo de otras similares, las cuales son acumuladas en promedio durante la semana.

Ahora bien, hace un par de semanas recibí de un alumno la tarjeta que se muestra abajo. Me sorprendió la actitud de este cuate para darme dicha tarjeta en frente de sus compañeros.

Tarjeta de chica sexy en servicio

Me dije: "bueno, actúa cool. Total, de seguro le dieron muchas en el crucero". Como dejé la tarjeta asentada ahí, me preguntaron que si no la iba a ver. Sorpresa la mía al checar el reverso de la tarjeta.

Reverso de tarjeta de chica sexy

Me provocó una sonrisa. Es sobre una serie de eventos, incluyendo este documental, sobre la trata de mujeres. Oh.

Creo que en un buen rato, aún sabiendo de la existencia de la publicidad de guerrilla y BTL, no me había tocado realmente ver algo que me pareciera simple, efectivo, barato y como dicen: "creativo". De hecho, lo probé con una colega y su primera reacción fue de asombró y ofensa inmediata. Claro que también le dije que que viera el reverso y el efecto fue similar.

Este caso me pareció acertado porque no fue el típico bombardeo de mensajes publicitarios que te quieren hacer sentir más inteligente o más tonto, sino fue sacarle jugo al factor sorpresa de darle "la vuelta" a lo cotidiano; ya que hay todo un "bagaje" incrustado en el mensaje, y (¡bam!) el objetivo de la campaña es del tipo "fíjate que creías que el asunto iba por acá, pero no". Además, de que se combina con otro tipo de publicidad que he notado, que es aquel que busca crear un consciencia en el consumidor/espectador. Interesante, ¿no creen?

Semana de Arte y Diseño 2009 en la Unarte

El miércoles 15 de octubre tuve el gusto de participar en la Semana de Arte y Diseño de la Unarte Universidad del Arte, un instituto pequeño pero con un ambiente cálido y buen nivel de camaradería.

Semana de Arte y Diseño de la Unarte Universidad del Arte

La decoración de las paredes es muy particular, lo cual le brinda un carácter propio a este centro de estudios. Esos efectos ópticos me parecen geniales. ;)

Unarte

Salones para diseño de moda y arquitectura

Cafetería de la Unarte

Interior de la cafetería de la Unarte

Debido a otros compromisos, me perdí el resto de las charlas. Ya no tuve la oportunidad de escuchar a Tina Diez  y Ricardo Huitrón, dos colegas exaUDLAPs, pero estuve presente en la charla con Germán Montalvo, quien fue muy ameno en su plática y nos mostro una cantidad considerable de trabajo comentándonos para cada caso cuál había sido el proceso. Germán es bien conocido por su trabajo en cartel, aunque en esta charla nos mostró trabajo de editorial, cerámica/talavera e incluso muebles.

Las fotos las tomé con el celular. Una disculpa por la calidad de las fotos.

Germán Montalvo en la Unarte

Prototipo para la Guirnalda de Plata, presea del auditorio nacional.

Prototipo para la Guirnalda de Plata, presea del auditorio nacional.

Libro sobre Warhol

Libro sobre Warhol.

Plato de talavera.

Plato de talavera.

Portada de la revista Design Issues.

Portada de la revista Design Issues.

Agenda.

Agenda.

Ilustración de pájaros antropomorfos.

Ilustración de pájaros antropomorfos.

Broche con las mismas ilustraciones del libro.

Broche con las mismas ilustraciones del libro.

Germán hizo un par de comentarios que me parecieron muy acertados:

  • El diseño debe provenir de la realidad.
  • La gente desconoce que existe un proceso*.

* refiriéndose a proyectos de diseño.

Un servidor platicó sobre qué es arquitectura de información, ya que siendo futuros egresados en diseño estratégico, esta disciplina si al menos no se puede siempre implementar con todo el formalismo, sí es necesaria porque no sólo propone en términos del usuario, sino ejercita esa "manera de pensar" en forma estructural, muy conveniente cuando se tienen que solucionar problemas donde existe una gran cantidad de información o bien, una marcada carencia de esta.

Por mi parte quiero agradecer a Hilda Gabarrón (a.k.a. Higa) por la invitación y a los cuates estudiantes de la Uniarte por sus comentarios, retroalimentación y buena vibra.

Archivo visual de trabajos

Ahora que me han estado solicitando un archivo de los trabajos de difusión en el CIRIA UDLAP, consideré más práctico hacerlo en línea que guardar copias impresas ya que:

  1. La gente puede acceder a la muestra de trabajos y quizá opinar.
  2. Puedo descargar una copia para alguna presentación.

La muestra de imágenes está en la cuenta de flickr del CIRIA y cuya liga al set es:

http://www.flickr.com/photos/ciria_udlap/sets/72157622453148894/

También aproveché para poner en línea un par de presentaciones en SlideShare, por lo práctico de acceder a ellas si es necesario y para ir conformando un archivo de presentaciones.

Aunque es muy propio conformar portafolios en alojamientos propios, aprovecharse de las plataformas relacionadas con las redes sociales resulta no sólo cómodo, sino también bastante práctico. Sería importante reconsiderar ya dejar todo un portafolio bajo un CMS con incrustaciones de otros elementos alojados en las redes sociales. En fin…

Señalización en Guanajuato

Guanajuato es una ciudad mexicana patrimonio de la humanidad, la cual es muy particular debido a su topografía. A grandes rasgos la ciudad parece estar asentada en un bol, por lo que quedan casas prácticamente unas encima de otras, lo cual deriva en muchos callejones y aún más, existen túneles para movilizarse en carro.

Guanajuato Capital desde el funicular y Pípila

Ciudad de Guanajuato México

Vistas de la ciudad de Guanajuato.

Aunque los sitios turísticos son fáciles de encontrar, el municipio dispuso de un conjunto de páneles a lo largo de ciudad para orientar a sus visitantes. Me interesó y gustó mucho como está presentada la información, ya que de primera mano, al existir tanto recoveco, los turistas podrían pensar que es muy complicado caminar en la ciudad.

Señalización de Guanajuato Capital.

Señal turística en Guanajuato.

La primera característica que se me hizo muy acertada fue el contraste. Las señales tienen un color terracota (chedrón o copper redad hoc a la ciudad pero que además hace un buen contraste cromático con los textos, los cuales se presentan en color blanco y usando una fuente tipográfica de palo seco, muy limpia y legible. Los demás colores empleados (en el mapa y esquemas) también facilitan la lectura de la señal.

Cada panel está divido en cuatro partes claramente identificables. La primera corresponde al nombre del lugar donde se encuentra la persona. La alineación a la izquierda,  jerarquía tipográfica y el aire alrededor ayudan determinar que "ese texto" (el título) corresponde al nombre del lugar.

Señal en Guanajuato Capital

Lista de lugares importantes cercanos al sitio actual.

Debajo del texto correspondiente al nombre del lugar, se encuentra una lista de los lugares más cercanos. Su alineación a la izquierda resulta más conveniente que emplear una alineación centrada, ya que se arma una línea vertical imaginaria que agiliza la lectura de dicha lista. Esta lista ocupa una columna central en el panel, de forma que quedan dos pequeñas columnas, una a la izquierda y otra a la derecha. Dependiendo si se tiene que caminar hacia la izquierda o hacia la derecha, se coloca en la columna correspondiente una flecha de dirección (←,→,↑ ,↓) para cada elemento de la lista.

Se que suena bastante intuitivo, pero este tipo de detalles simples reafirman el sentido de orientación espacial.

Mapa topográfico en la señalización de Guanajuato Capital

Mapa de tipo topográfico en la señalización en Guanajuato.

Ya debajo se presenta un mapa, cuya intención es situar al usuario en el espacio físico. En español, francés e inglés, se le indica con etiquetas como "Frente a ti" y "Detrás de ti" la relación entre lo que observa en el mapa y el entorno que lo rodea. El camino principal se resalta con color amarillo, dando evidencia a las formas de éste; muy útil para entender "cuando dar la vuelta". También se muestran, mediante contraste cromático, los sitios importantes en el área incluyendo los de la lista. Además se marca el norte como símbolo estándar de orientación.

Tube map o Pipe map tipo Beck's London en Guanajuato Capital

Mapa tipo Beck's London Underground

Mapa esquemático a la Henry Beck de un recorrido en la ciudad de Guanajuato.

La cuarta y última sección de cada panel corresponde a un esquema conocido también como mapa de tubo,  idea formidable presentada por Henry Beck en los 30s. En éste también el usuario se orienta en cuatro direcciones (←,→,↑ ,↓), pero le brinda la ventaja de identificar rápidamente que lugares se encuentran conectados con respecto al camino principal y mediante qué calles. La legibilidad para ir del punto A al punto B sin duda se incrementa con este tipo de mapas. De nuevo, lo importante se contrasta mediante el color, tanto para el camino principal como los lugares importantes. Los textos tienen su mayor contraste en este sentido con la aplicación del color blanco.

Este tipo de iniciativas me gusta mucho en los casos en los que uno no desea tomar recorridos y la ciudad, como Guanajuato, es adecuada para caminarse. Así vas tomando en cuenta qué lugares vas vistando y cuáles han llamado tu atención, previa investigación en la red o bien con una guía en mano. Sólo espero que no acaben destruidos o bien, que no se les de mantenimiento y acaben siendo un elemento deteriorado y visualmente desagradable al paso de los visitantes de esta colonial y especial ciudad.

Problema con los speakers en Mac

Actualización:

a) Wow. Gracias por sacarme de mi ignorancia, muchas gracias por explicarme la verdadera razón :D Que bueno que escribí este post o hubiera muerto engañado; mejor evidenciar que uno se equivoca a vivir en la ignorancia. ¡¡¡Gracias por los comentarios!!!

b) Mi colega Omar V. me manda una liga donde parece estar la información pertinente: http://en.wikipedia.org/wiki/TOSLINK

Post original:

Primero, quisiera compartir tres puntos:

  1. A los que estamos involucrados en diseño, hemos escuchado alguna vez la frase "Un buen diseño es aquel que es invisible ante sus usuarios".
  2. Por otro lado, está el enfoque de Mark Weiser y su Calm Technology, del cual he comentado, y creo que muy importante: tu diseño debe disponer de todo al usuario, pero sólo lo necesario para realizar una tarea debe estar en el centro de su atencion y lo demás en la periferia.
  3. El diseño de información se encuentra en muchos objetos de todos los días, en su mayoría con instrucciones o etiquetas (textuales, verbales o visuales), y es un hecho que estamos bien adaptados a códigos cromáticos, como sucede con los semáforos o señales de peligro.

Recientemente me topé con una situación que parece conjuntar los tres puntos: el desajuste de los speakers en la lap. Tenía enchufado los audífonos; parece que al sacar el conector, moví algo por dentro y la lap se quedó como si tuviera los audífonos aún conectados; por lo tanto, los speakers no se oían.

Es primera vez que me sucede esto, pero parece que es un problema más común en las Mac de lo que pensaba. Para solucionarlo, enchufas  los audífonos de nuevo y vas girando suavemente el conector, luego los desenchufas y ¡voilá!, tus speakers suenan de nuevo. Lo comento por si alguien ocupa esta info algún día. ;)

speakers-redlight

Para indicarme que algo iba mal y dónde estaba el problema, el hueco para enchufar los speakers se puso rojo. Realmente me sorprendió y encantó este hecho, porque no tenía ni idea de que ese orificio se podría iluminar en ese color. Además fue un warning que me señalaba el lugar y no hacía tanto alarde en la pantalla o se ponía en un lugar de ésta que a lo mejor ni veía. Además, está la simple idea de manejar el color rojo para decir que algo está mal empleando una convención occidental.

Me causó el mismo impacto que cuando ví "dormir" a mi iBook G4 por primera vez: la luz se prendía y apagaba lentamente como si estuviera respirando y lo mejor aún, no pensé que hubiera una luz en la orilla de mi laptop.

Una duda que me surge con este tipo de detalles, que van más con lo funcional que con caprichos decorativos, es: si a la gente de Apple se le ocurre incorporar este tipo de características, ¿por qué en otras compañías no se toman decisiones similares? ¿será realmente algo diseñístico o cuestiones de mercadotecnia según delimitan segmentos de mercado y ofrecen lo que creen ad hoc a los diferentes nichos?

En fin...

Affordances everywhere

De acuerdo con D. Norman:

“... the term affordance refers to the perceived and actual properties of the thing, primarily those fundamental properties that determine just how the thing could possibly be used... Affordances provide strong cues to the operation of things.”

Esto es, que veamos y entendamos rápidamente con qué y cómo operar el objeto (como herramienta) para cumplir una tarea.

Cuando una affordance es buena, hace que pasemos de ser usuarios novatos a usuarios expertos con una transición suave. ¿Por qué podría ser esto? La respuesta, aunque parece tonta, tiene que ver con el hecho de que las cosas funcionen como esperamos.

Recuerdo que mi primer celular, un LG muy sencillo y bastante compacto, tenía su teclado alfanumérico distribuido en 4 filas de 3 botones cada una (como la mayoría de los celulares). La forma de los botones es tal que si lo pones de lado se ve "adentado", lo cual ayuda a identificar cada fila y visualmente brinda la sensación de que los botones son apretables. Llegó un momento después de tanto uso que ya podía escribir mensajes de texto si ver las teclas. Esta característica generó un aspecto emocional positivo con este aparato.

Justo con este ejemplo, tuve una breve pero interesante discusión con un colega de sistemas computacionales sobre los pros y contras de un teclado equivalente en una interfaz táctil, como en el iPhone. Sin duda otro tipo de affordances son necesarias.

celular-viejito

Celuar LG jubilado después de múltiples caídas.

Un ejemplo típico sobre las affordances corresponde a la puerta giratoria, donde empujamos hacia la izquierda o derecha un panel dependiendo de qué nos "dice" la puerta; es decir, si notamos algo "para empujar" o no. Es simple, pero a mi ha resultado chistoso comprobarlo. En el lugar donde trabajo hay una puerta de vidrio cuya manija es igual en ambos lados. Cuando la gente llega, tiende a "empujar" la puerta, similarmente cuando sale. El problema está en que el techo está desnivelado: cuando la gente entra no hay problema, pero cuando sale, la parte superior de la puerta "raspa" el techo, terminando la puerta "colgada" y a punto de caerse completamente. La pobre, ya va en su tercera reparación. Con frecuencia, a la gente que nos visita hay que comentarle "hacia adentro, por favor".

puerta-oficina1

El diseño da la oportunidad de jalar la puerta, pero su forma triangular (colocar tu mano en un vértice no es muy agradable) influye en que las personas prefieran empujarla.

Así, en una affordance, la forma influye y está supeditada a la función u operación a realizar, más que a un capricho estilístico. En la imagen de abajo hay un dispensador de papel y otro de jabón. El primero, aunque estilizado, no muestra con claridad cómo hacer que salga mas papel, sobretodo si lo vemos de frente (es practicamente un rectángulo). En el segundo, se ve un componente que resalta y demuestra su caracter de "apretable". Podemos pensar entonces que el contraste de forma es un factor de diseño importante entre los diferentes elementos de un objeto, especialmente en aquellos que son necesarios para la interacción con éste.

papelera-jabonera-banio

Los usuarios no son tontos, sólo desean hacer lo que quieren hacer casi de forma instantánea e intuitivamente.

garrafon-de-agua

Ejemplo de contraste para evidenciar con qué se puede interactuar.

asa-camioneta

Las hendiduras bien marcadas permiten identificar cuántos componentes hay antes de intentar manipularlos.

En los objetos físicos (derivados del diseño industrial), la affordance también se vincula con la ergonomía. Por ejemplo, cuando identificamos algo apretable, podemos saber si es factible la acción con la llema del dedo, con dos dedos o incluso con la palma de la mano. Esto además, nos brinda información subyacente sobre la accesibilidad de esa función: si podemos apretar es porque está permitido y la consecuencia no será perjudicial. Cuando no se piensa en términos de "medidas humanas" quizá no sólo es por el tamaño del producto mismo, sino porque resulta inconveniente que accedamos a esa función tan fácilmente: por ejemplo, cuando tenemos que "resetear" algo metiendo un alambre o una ajuga porque el botón es prácticamente minúsculo y se encuentra hacia dentro.

regulador-ac

Sin importar si somos diestros o zurdos, se pueden colocar los dedos cómodamente.

manija-camioneta

El tamaño del hueco evidencía que es una asa para jalar la puerta.

Las affordances están presentes tanto en objetos de diseño físcos como intangibles (como son las páginas web). Pensar que los elementos interactivos de interfaz son intuitivos/evidentes para los usaurios es una buena práctica de diseño, la cual a veces se pasa por alto y sin embargo, no sólo conlleva un resolución diseñística centrada en el usuario, sino afecta también la experiencia de uso misma y los factores emocionales asociados al objeto.

Saludos. :)