Andrés Carne de Res: ¿Un ejercicio en UX?

Rondan muchas teorías acerca del éxito detrás del Restaurante Andrés Carne de Res (ACR), algunas más locas que otras, pero todas intentando explicar como es que es un lugar que lleva alrededor de 30 años de funcionamiento en un negocio en el que algunos lugares duran 2 o 3 años. En las últimas visitas, he llegado a la conclusión de que ese éxito debe atribuirse a que cada visita a “Andrés” comprende una experiencia de usuario que en conjunto está cuidadosamente diseñada y además centrada en el cliente, en este caso el usuario. Para entender esta idea propongo el experimento de describir la visita en términos de un modelo de experiencia de usuario, para lo cual me valdré de algunos de los componentes del modelo propuesto por Jesse James Garrett en The Elements of User Experience.

Userexperiencegarrett0001
 (Figura 1: Elementos de la Experiencia de Usuario)

Aunque el libro y el modelo esta pensado para artefactos tecnológicos, el modelo se debería poder “estirar” para entender aspectos de otras experiencias, las que se tienen con un artefacto tecnológico como las que se tienen con un servicio, como el de un restaurante. La manera como un usuario experimenta una marca tiene múltiples componentes que trascienden plataformas digitales y el modelo debería estirar considerando que la siguiente definición de Garrett no es específica a un producto o servicio sino que abarca la relación de una compañía o negocio con sus usuarios, o si se quiere, clientes-usuarios:

La experiencia de usuario es la que ayuda a un cliente a formarse una buena impresión de la oferta de una compañía, la experiencia de usuario es la que diferencia a una compañía de sus competidores, y es la experiencia de usuario la que determina si su cliente regresará” (Jesse James Garrett)

http://www.flickr.com/photos/pink_tomate/2967193822/

El modelo de Garrett (Figura 1) descompone la experiencia de usuario (UX) en cinco planos, en el que las decisiones tomadas en cada plano están restringidas por tomadas en el plano inferior. Además estas decisiones se mueven de lo abstracto (abajo) a lo más concreto (arriba). El primero de estos planos es el Plano Estratégico. Este plano incorpora las necesidades de los dueños del negocio así como los beneficios que los clientes quieren obtener de la experiencia. En el “caso de estudio” (si se le puede llamar así) de ACR, indudablemente se ha considerado la necesidad de hacer del lugar un negocio rentable, pero también se ha incorporado la necesidad de un cliente de percibir que hay una optima relación de costo y beneficio en términos de calidad, buen servicio. Esta última importante si este percibe que el precio que esta pagando es alto.

El siguiente plano es el de Alcance en el que se define la funcionalidad o servicios que la experiencia proporcionara a un cliente-usuario. En un proyecto de un artefacto tecnológico, las decisiones tomadas en este plano se plasmarían en una especificación funcional que detalle lo que el sistema hace. En el caso de ACR, se puede pensar en términos de los servicios que prestan, que además han venido creciendo en funcionalidad: música y comida, un lugar y servicios para pasar los tragos, choferes para conductores embriagados, manejo distinto para celebraciones especiales (cumpleaños, etc.), un área para niños, eventos empresariales, entre otros.

La manera en que los siguientes dos planos, el de Estructura y Esqueleto se pueden usar para ilustrar este caso, me parece más difícil. El primero de estos contiene las decisiones de diseño que describen la interacción con un artefacto tecnológico, el comportamiento del artefacto en respuesta a las acciones del usuario. El plano del Esqueleto contendría decisiones acerca de la ubicación física de componentes en el artefacto, de manera que la disposición de los mismos sea la óptima para la eficiencia y efectividad en el uso del artefacto.

Hay elementos en ACR que pertenecen a alguno de estos 2 planos, pero creo que no le serviría a este experimento igualar la navegación/interacción de un artefacto tecnológico con la navegación en un espacio físico. Sin embargo, hay elementos en ACR que apoyan la experiencia y que manejan información con un fuerte componente visual (como describe el siguiente plano): áreas demarcadas e identificadas: barra, mesas, pista de baile (es más casi todo en el lugar tiene algún nombre o “etiqueta”), identificadores de mesa en los que se registran cambios de mesa, pantallas con video de las pistas de baile, mas todos los elementos que se espera en un restaurante, la cuenta, menú, utensilios, etc.

Para finalizar, el último plano de Garrett, el plano de la Superficie, contiene las decisiones de diseño que comprenden características visuales o gráfico del artefacto tecnológico o de los componentes que hacen parte de la experiencia. Este es un aspecto fuerte en ACR ya que todos los componentes visuales, a los que el usuario-cliente esta expuesto, tienen alguna particularidad y refuerzan esa “identidad corporativa” del lugar y de su marca. Muchos de los utensilios son únicos (vasos con cucharas dobladas como manijas, vasos de barro), la cuenta siempre viene en un contenedor distinto y hecho a mano (una cartuchera, un pescado de plástico con ruedas) y además estos contenedores traen una linterna y una lupa. Hay una tipografía y colores predominantes que usan de manera consistente en los medios impresos, avisos en el lugar y en la web.

http://www.flickr.com/photos/pink_tomate/2966347069/

No tengo idea si los propietarios sigan metodologías, o si siquiera estén de acuerdo con este planteamiento pero podría asegurar que todo lo que el cliente observa producto de decisiones en el plano superficial podría trazarse en cada plano hasta llegar a una decisión en el plano estratégico que la soporta. Las decisiones que implementan en el plano de lo concreto redundan en éxitos en cosas más abstractas como las percepciones de un cliente. Me valgo de un ejemplo, el paquete de dulces que viene con la cuenta, que por cierto cierra la experiencia, puede trazarse al servicio de “pagar la cuenta”, y puede trazarse al plano inferior, ya que alimenta la necesidad de percibir mayor beneficio por el precio pagado.

Me pregunto que opiniones hay en este sentido ¿La Experiencia de Usuario trasciende a espacios físicos como Andrés Carne de Res?

 

Créditos Imágenes (Flickr): josephhoetzl, fabulman, pink_tomate, sinlentes, edgar_castillo

Más información acerca de Experiencia de Usuario: 

User Experience (Nielsen/Norman Group) http://www.nngroup.com/about/userexperience.html

La Experiencia de Usuario (nosolousabilidad.com) http://www.nosolousabilidad.com/articulos/experiencia_del_usuario.htm

Good example of inline form validation

Modifying a password can be very frustrating when policies and requirements are very restrictive about the valid characters a password can have and when feedback is very poor and vague (looking at you unix/linux). A good example of inline validation is provided by the Georgia Tech PASSPORT website (Personal Account Self-Service Portal). 

First, the rules for choosing a password are clearly listed and the field where input is expected clearly highlighted:

Password_1

And for the "pièce_de_résistance", as each character in a new password is entered, each of the rules being satisfied by the entered password are marked in green and the rules being violated are highlighted in red.

Password_2

The same feature works for highlighting when the re-entered password matches the one entered first:

Password_3
 
Password_4

Once all conditions are satisfied, the "Change password" button is enabled (it starts disabled) and the procedure is completed.

Password_5

I remember mentions of how inline validation may put a toll on performance and development time, but for a task that's frustrating to many (such as changing a password), getting it right the first time with feedback like this is very much worth the effort. 

Windows 7 + SSD + MSI Wind...

I bought Windows 7 in Microsoft's Online Store for my MSI Wind, to upgrade my "Windows computing experience" from WinXP. The 2GB download was rather painless, but they could've done a better job at describing the steps of the download from the get go. All the store website says is: "click here to download your installer", but in fact, installation requires getting a downloader, executing a "box" application (Microsoft speak for a zipped executable), and running the actual installer.

Anxious to test the announced Win7 performance improvements, I also decided to upgrade the HDD to an OCZ Summit SSD. The plan was to install Win7 in my existing HDD and then clone it into the SSD. From running the Win7 installer, some things to note:

  • The installer takes 15-20 minutes to extract files, in the first of 6 steps, which are listed with the current step highlighted. In over 10 different attempts, I got one of those error messages that I thought were a thing of the past: "Windows cannot install required files. Network problems may be preventing windows from accessing the file. Make sure the computer is connected to the network and restart the installation. Error code: 0x80070005".
  • The message would've made sense if I needed the network for anything, but the installer was running locally. I went online and found forum posts from folks getting this error when connected through WLAN instead of Ethernet, so I tried that. Nothing. I went online again and read about how antivirus software causes this error message to appear, did that. Nothing. After reading (and trying) about other possible causes, I decided to re-unbox the installer, and that worked. I never found out was the problem was, so much for error recovery and error messages.
Cloning the Win7 hard drive was a snap with free private-edition DriveImage XML, which let me clone just the Win7 system partition into the SSD in the first try. It did not clone the boot sector, but that was fixed by Windows Startup Repair. On first impression, startup time is quick but shutdown is very fast!. I hope performance does not degrade over time, as with Vista, we'll see...

 

Interaction Design Patterns: Vertical Stack Filtering

Vertical Stack Filters

Problem: Users want to quickly filter a number of items (listing, search result).

Solution: List all possible filter criteria or dimensions in vertical stacks, where options are grouped under a dimension and are clickable links that filter the displayed entries by the selected option. 

(Image 1) From: http://finder.library.gatech.edu/

Use when: You are working on a web application where you need to 1) display a large number of results from a search or a large list of items and 2) allow the user to filter those items with a fixed small number of dimensions (each having a fixed small number of alternatives). 

How: Create vertical stacks of labeled dimensions and list each dimension's options underneath. The options should be clickable links that filter results and display those that match the chosen option. Format and highlight the label of the dimension to differentiate it from the options. Keep the word length of the options to a maximum of 2 or 3 words. 

Provide feedback to the user when he has applied a filter by displaying the active filter close to the results. A way to do this is by listing selected options next to the dimension they belong to: "Results filtered by Dimension1:Option1, Dimension2:Option2, etc."

(Image 3) From: http://finder.library.gatech.edu/

Provide a mechanism for the user to deactivate a selected filter, next to each filter applied (Dimension:Option) and a mechanism for the user to "Start Over" or "Reset all filters".

Why: This is a quicker alternative to a table filter. It lets a user reduce the number of items displayed by immediately clicking on keywords (as opposed to  going through a drop down box). It also facilitates understanding of the available search tools by displaying all of the dimensions and options available at once.

Examples: This example is taken from online retailer Newegg and uses a vertical stack filter to narrow down a list of products, displays the active filters at the top and has an "x" link that deactivates a specific filter. 

(Image 2) From: http://www.newegg.com

 

 

(download)