¿Mi interfaz de agente IA es usable o solo bonita?

Improv

He estado desarrollando un asistente IA conversacional para gestión de tareas. El problema es que estoy priorizando la estética visual sobre la usabilidad real. Por ejemplo, tengo animaciones suaves, sombras y microinteracciones, pero varios testers beta reportan que es confuso encontrar el historial de conversaciones o cambiar de modelo.

Quiero feedback sincero: ¿Es mejor tener una UI minimalista y funcional o una visualmente atractiva aunque requiera curva de aprendizaje? Dejo un snippet de mi componente de panel lateral:

<div class="sidebar">
  <button class="icon-btn" onclick="toggleHistory()">📜</button>
  <div id="history" class="hidden">...</div>
</div>

Podcasts

Creo que es un falso dilema. Se puede tener ambas: buena estética y usabilidad. El problema no es la animación, sino que escondes funciones clave detrás de iconos genéricos. ¿Por qué no pones un texto "Historial" al lado del icono? Y lo de cambiar de modelo debería estar en la barra superior, no en un menú oculto.

Surfing

Totalmente de acuerdo con que la usabilidad manda. He visto apps bonitas que son un martirio. Pero también he visto apps feas que funcionan bien. Para un agente IA, el usuario necesita inmediatez: que los controles sean obvios. Sugiero que hagas un test A/B: versión A con tu diseño actual, versión B con etiquetas de texto y menos adornos. Mide el tiempo que tardan en completar tareas comunes.

Improv

Gracias por los comentarios. Lo del test A/B es buena idea, lo implementaré. Sobre los iconos: pensé que era intuitivo, pero veo que no. Tal vez añadir tooltips o etiquetas al hacer hover ayude sin arruinar el minimalismo. ¿Alguna recomendación de librería para tooltips accesibles?

PC

Yo uso tippy.js para tooltips, es ligero y personalizable. Pero cuidado: los tooltips no son solución si el usuario no sabe que existen. Mejor tener siempre visible al menos un texto corto tipo "Historial (Ctrl+H)" con atajos de teclado. Para cambiar de modelo, pon un selector en el header, como hace ChatGPT.

World

Opino diferente: la curva de aprendizaje es aceptable si la interfaz es consistente y las animaciones guían al usuario. Por ejemplo, si al hacer clic en el icono de historial, el panel se desliza suavemente, eso ayuda a entender de dónde viene. El problema es cuando las animaciones son solo decorativas sin propósito funcional.

Cars

Y no olvides la accesibilidad. Esos iconos pueden no ser claros para personas con discapacidad visual o cognitiva. Asegúrate de que los elementos sean navegables por teclado y tengan roles ARIA. De nada sirve una UI bonita si un usuario con lector de pantalla no puede usarla.

Improv

Buen punto lo de accesibilidad, no lo había considerado. Voy a revisar las etiquetas ARIA y probar con un lector de pantalla. También me llevo el consejo del atajo de teclado. Voy a rediseñar el panel lateral con etiquetas visibles y un selector de modelo en el header. ¡Gracias a todos por el feedback!

Philosopher

Me alegra que hayas recogido el feedback. Solo un apunte: no te olvides de probar el flujo con usuarios reales, no solo con lectores de pantalla. A veces lo que parece accesible en teoría no lo es en la práctica. Por cierto, ¿qué tooling usas para prototipar? Yo he migrado a Figma con plugins de accesibilidad y me ha ayudado a detectar problemas de contraste y orden de tabulación antes de pasar a código.