Sesgos cognitivos en diseño web: anclaje, encuadre, aversión a la pérdida y opciones por defecto

Hace poco revisábamos con un cliente la página de suscripción de su newsletter. Había dos versiones del mismo texto: «Recibe cada mes recetas de temporada» y «No te pierdas las recetas de temporada de cada mes». El contenido era idéntico. Sin embargo, todos en la sala sentimos que no eran lo mismo; una sonaba a regalo y la otra a recordatorio.

Ese pequeño escalofrío ante dos frases equivalentes es un sesgo cognitivo en acción. Los sesgos son atajos que usa la mente para decidir rápido, y producen desviaciones previsibles en nuestros juicios. Están presentes en cada web, en cada precio y en cada botón, lo sepamos o no, porque cualquier diseño tiene que presentar la información en algún orden, con algunas palabras y con alguna opción ya marcada.

En esta guía nos centramos en cuatro sesgos que aparecen constantemente en el diseño digital y que tienen detrás experimentos muy sólidos: el anclaje, el encuadre, la aversión a la pérdida y el efecto de las opciones por defecto. Para cada uno contamos de dónde viene, cómo aparece en una web y cómo usarlo a favor de la persona que decide.

01Qué son los sesgos cognitivos y por qué importan en diseño

En 1974, Amos Tversky y Daniel Kahneman publicaron en Science un artículo titulado «El juicio bajo incertidumbre: heurísticos y sesgos». Proponían que, para juzgar con rapidez, usamos reglas simples (heurísticos) que suelen funcionar bien, pero que en ciertas situaciones producen errores sistemáticos (sesgos). Ese artículo es la base de lo que hoy llamamos economía conductual.

Los sesgos están ligados al pensamiento rápido y automático que Kahneman llamó sistema 1, y que explicamos en la guía sobre sistema 1 y sistema 2. Cuando alguien navega por una web, la mayor parte del tiempo funciona en ese modo, así que los sesgos influyen mucho en lo que ve, recuerda y elige.

Para quien diseña, tiene dos consecuencias:

• →Es imposible diseñar de forma neutra. Siempre hay un primer precio, un mensaje en positivo o negativo, una casilla marcada o vacía. La pregunta útil es cuál de esas opciones ayuda más a decidir bien.
• →Conocer los sesgos permite detectar fricciones invisibles. A veces una web no convierte porque el encuadre del mensaje provoca dudas o porque el primer número que ve el usuario le descoloca.

02El efecto anclaje: el primer número manda

Lo que demostró la investigación

En el experimento clásico de Tversky y Kahneman (1974), los participantes veían girar una ruleta trucada que se paraba en 10 o en 65. Después estimaban el porcentaje de países africanos en la ONU. Quienes habían visto el 10 respondían de media un 25 %; quienes habían visto el 65, un 45 %. Un número claramente irrelevante arrastraba la estimación.

El efecto se ha replicado en muchos contextos: precios de viviendas valorados por agentes inmobiliarios, sentencias judiciales, negociaciones salariales. El primer número disponible sirve de punto de partida, y desde ahí ajustamos de forma insuficiente.

Cómo aparece en una web

• →El orden de las tarifas. Mostrar primero el plan más completo hace que los demás parezcan razonables; empezar por el más barato convierte cualquier subida en un salto.
• →Rangos en presupuestos. «Proyectos desde 3.000 €» ancla de forma distinta a «Proyectos entre 3.000 y 12.000 €».
• →Precios de referencia. El precio anterior tachado funciona como ancla. En España, si anuncias una rebaja, el precio de referencia tiene que ser el más bajo de los últimos 30 días, por la transposición de la Directiva Omnibus.

Lo que funciona es usar anclas verdaderas y útiles: un precio de referencia real, una comparación honesta con alternativas o el valor de lo que resuelve el servicio. El anclaje y el resto de recursos de precio los desarrollamos en la guía de psicología del precio.

03El efecto encuadre: lo que dices y cómo lo dices

El experimento de la enfermedad asiática

En 1981, Tversky y Kahneman presentaron a sus participantes una situación hipotética: una enfermedad amenaza a 600 personas y hay que elegir entre dos programas. Cuando las opciones se describían en términos de vidas salvadas («se salvarán 200 personas»), la mayoría elegía la opción segura. Cuando las mismas opciones se describían en términos de muertes («morirán 400 personas»), la mayoría prefería arriesgarse. Datos idénticos, decisiones opuestas.

Un estudio de Irwin Levin y Gary Gaeth (1988) lo llevó al consumo: la carne picada etiquetada como «75 % magra» se valoraba mejor, incluso tras probarla, que la etiquetada como «25 % grasa».

Cómo aparece en una web

El encuadre está en cada texto. Algunos ejemplos:

Lo que funciona: encuadrar en el lenguaje de quien decide, con cifras concretas y verificables, y elegir el marco que hace más fácil entender la propuesta. La línea ética está clara: el encuadre organiza la verdad; cuando la oculta deja de ser diseño y pasa a ser engaño.

Clave: cualquier mensaje tiene un encuadre; diseñar bien es elegir conscientemente el que ayuda a entender, en lugar de dejarlo al azar.

04La aversión a la pérdida: perder pesa más que ganar

De la teoría de las perspectivas a la pantalla

La teoría de las perspectivas, publicada por Kahneman y Tversky en 1979, mostró que valoramos los resultados en relación con un punto de referencia y que las pérdidas pesan más que las ganancias equivalentes. En sus estimaciones, el impacto de perder algo era aproximadamente el doble que el de ganar lo mismo.

Un fenómeno relacionado es el efecto dotación: en un experimento de Kahneman, Jack Knetsch y Richard Thaler (1990), quienes recibían una taza pedían por venderla bastante más de lo que otros estaban dispuestos a pagar por ella. En cuanto algo es nuestro, lo valoramos más.

Conviene matizar: revisiones posteriores encuentran ratios variables, y David Gal y Derek Rucker (2018) han cuestionado que la aversión a la pérdida sea tan general como se pensaba. Es una tendencia real, pero su fuerza depende mucho del contexto.

Cómo usarla con criterio

• →Pruebas gratuitas que dejan probar de verdad. Cuando alguien ha configurado su cuenta y ha guardado su trabajo, siente ese espacio como suyo. Es el efecto dotación jugando a favor de un producto útil.
• →Mostrar lo que ya se ha conseguido. «Tienes 3 de 5 pasos completados» o «Has guardado 12 recetas» ponen en valor el progreso.
• →Contar el coste de no resolver un problema real. Una asesoría puede explicar con calma qué implica presentar tarde un modelo de Hacienda, siempre con datos verdaderos y sin dramatizar.

Lo que mejor funciona con este sesgo es usarlo para que la persona valore lo que ya tiene o lo que realmente gana. Las cuentas atrás falsas, el «solo quedan 2» inventado o los textos de rechazo culpabilizadores («No, prefiero seguir perdiendo dinero») aprovechan el mismo mecanismo en contra del usuario; la urgencia legítima tiene su propia guía, la de urgencia y escasez éticas.

05Las opciones por defecto: el poder de lo ya marcado

El caso de la donación de órganos

Eric Johnson y Daniel Goldstein publicaron en Science (2003) una comparación entre países europeos. En los que la donación de órganos requería apuntarse de forma activa, las tasas de consentimiento eran bajas; en los que todo el mundo era donante salvo que se diera de baja, eran altísimas. La diferencia no estaba en la cultura, sino en la casilla de partida.

Richard Thaler y Cass Sunstein convirtieron esta idea en el núcleo de Un pequeño empujón (2008): quien diseña la situación es un «arquitecto de la decisión», y la opción por defecto es una de sus herramientas más poderosas.

Cómo aplicarlo en una interfaz

1. 01Preselecciona lo que más conviene a la mayoría. Envío estándar si la mayoría no necesita urgencia; la talla que más se vende como sugerencia en la guía de tallas, nunca como selección oculta.
2. 02Deja sin marcar lo que exige consentimiento. El RGPD y la doctrina del Tribunal de Justicia de la UE (caso Planet49, 2019) establecen que el consentimiento para cookies o comunicaciones comerciales tiene que ser activo: casillas vacías.
3. 03Haz visible el valor por defecto y fácil de cambiar. Si el plan anual viene seleccionado, que se vea con claridad y que cambiar al mensual sea un solo toque.
4. 04Revisa los valores por defecto cada cierto tiempo. Lo que convenía a la mayoría hace un año puede haber cambiado.

06Ejemplo resuelto: la página de bonos de un centro de yoga

Un centro de yoga de Estepona nos pidió revisar su página de bonos, porque casi todo el mundo compraba la clase suelta y después no volvía. Al mirarla con estos cuatro sesgos en la cabeza, aparecieron cuatro decisiones que nadie había tomado de forma consciente.

• →Anclaje. La lista empezaba por la clase suelta a 15 €, así que el bono de 10 clases a 110 € se leía como «un número grande». Reordenamos de mayor a menor compromiso y añadimos el precio por clase de cada bono (11 € en el de diez), un ancla útil que permite comparar en la misma unidad.
• →Encuadre. El texto decía «Bono válido 3 meses». Lo cambiamos por «Diez clases para practicar a tu ritmo durante tres meses», que cuenta el mismo límite desde lo que la persona va a hacer.
• →Aversión a la pérdida. En lugar de recordar lo que se pierde si caduca el bono, añadimos en el área de cliente un contador amable de clases disfrutadas. Ver el progreso anima más que cualquier aviso.
• →Opción por defecto. El selector venía en «clase suelta». Pasó a sugerir la clase de prueba para quien llega por primera vez, con el bono de cinco como siguiente paso natural, y todo visible y fácil de cambiar.

No hubo trucos ni cuentas atrás. Solo se ordenó la información para que comparar fuera sencillo y para que cada opción se entendiera en términos de práctica, no de caducidad. El centro empezó a vender más bonos a quien ya había probado una clase, que es justo la persona a la que el bono le conviene.

07Una revisión práctica de tu web en seis pasos

Este es el recorrido que hacemos en el estudio cuando auditamos una web con la lente de los sesgos:

1. 01Localiza los momentos de decisión. Elegir plan, pedir presupuesto, reservar, suscribirse, aceptar cookies.
2. 02Anota el primer número que ve el usuario en cada uno. ¿Es un ancla útil y verdadera?
3. 03Reescribe cada mensaje clave con dos encuadres. Compáralos en voz alta y quédate con el más claro y honesto.
4. 04Revisa las opciones preseleccionadas. Cada casilla marcada debería tener una razón que favorezca a la persona.
5. 05Busca textos que jueguen con el miedo a perder. Sustitúyelos por lo que se gana de verdad.
6. 06Mide. Un test A/B o unas sesiones de usabilidad con cinco personas confirman si el cambio ayuda.

08Sesgos al servicio de las personas

Los sesgos nos acompañan siempre. Conocerlos permite dejar de diseñar a ciegas y tomar decisiones conscientes sobre qué número va primero, qué palabras usamos y qué dejamos marcado. Usados con respeto, se convierten en una forma de ponerle las cosas fáciles a quien tiene que decidir.

En SIMA aplicamos este conocimiento cuando trabajamos el diseño web y la experiencia digital, siempre de la mano de la claridad y de la ética. Si quieres revisar los momentos de decisión de tu web y ver qué sesgos están actuando en ellos, escríbenos y lo vemos juntos.