Nombrar correctamente un elemento de interfaz de usuario es útil solo cuando conduce a la interacción, el foco, el comportamiento de teclado, el cierre y la adaptación móvil adecuados. Este artículo propone un método de tres pasos para distinguir entre patrones visuales parecidos, como Tooltip, Popover y Hover Card, que pueden compartir forma flotante pero exigen reglas distintas de interactividad y persistencia.
El primer paso consiste en describir la evidencia observable: qué abre la interfaz, dónde aparece, si la página de fondo sigue utilizable, qué contenido contiene y cómo se cierra. No hace falta conocer el nombre del componente; basta con una conducta concreta, como "una tarjeta se abre al recibir foco y contiene un enlace", más útil que una etiqueta visual vaga como "ventana emergente pequeña".
El segundo paso compara alternativas cercanas. El diagnóstico mantiene dos o tres candidatas plausibles en lugar de aceptar la primera coincidencia por palabra clave y formula solo preguntas que puedan cambiar el resultado, porque elementos con forma similar pueden diferir en interactividad y persistencia.
El tercer paso consiste en copiar un brief testeable. La salida final convierte el patrón seleccionado en un contrato de implementación que registra disparador, cierre, modalidad, foco, comportamiento de teclado, ubicación, comportamiento móvil, alternativas excluidas y comprobaciones observables de aceptación. Ese brief se entrega a un agente de programación y se valida con pruebas, en lugar de confiar en la etiqueta.
El texto también distingue tres niveles de lenguaje: elemento de interfaz (término amplio para cualquier cosa visible o interactiva), componente (unidad reutilizable en un sistema de diseño) y patrón (solución repetible que conecta forma visible con comportamiento esperado).