Nombrar elementos es una tarea compleja que influye en cómo pensamos y cómo comunicamos ideas. En diseño y desarrollo, la elección de nombres para colores, componentes, tokens y variables impacta directamente en la claridad y la eficacia del trabajo en equipo.
El problema más común es optar por nombres demasiado genéricos, que no transmiten el propósito exacto, o demasiado específicos, que limitan la reutilización y la flexibilidad. Entonces, ¿cómo acertar a la hora de nombrar? Para responder, analizamos varias herramientas y consejos prácticos.
Inspiración para nombrar clases HTML, propiedades CSS y funciones JavaScript
El sitio Classnames ofrece listas temáticas de palabras ideales para nombrar elementos en código, que estimulan a pensar fuera de los términos habituales. Incluye conjuntos de palabras que no suelen asociarse con programación, pero que pueden aportar creatividad, como términos de la naturaleza, la música o la arquitectura.
Cómo elegir nombres para colores
David Aerne mantiene un repositorio con más de 30.000 nombres únicos para colores, recopilados de múltiples referencias y contribuciones de usuarios. Además, ofrece un selector y buscador que facilita encontrar el color apropiado y su nombre, lo que resulta muy útil para diseñadores y desarrolladores que buscan denominaciones precisas y originales.
Nombrar capas y grupos con sentido
Javier Cuello propone buenas prácticas para asignar nombres a capas, grupos y componentes. Para él, un buen nombre debe tener estructura lógica, ser breve, comprensible para todo el equipo y no relacionarse con propiedades visuales. Destaca la importancia de evitar confusiones mediante reglas claras que contemplen tamaños, colores y agrupaciones.
More Read
Taxonomía flexible para tokens de diseño
El equipo de Intuit, empresa matriz de productos como Mailchimp y QuickBooks, desarrolló un sistema de tokens de diseño que funciona para múltiples productos y va más allá del tema de marca. Nate Baldwin detalla en un estudio de caso la evolución del sistema, sus criterios y retos, ofreciendo valiosas recomendaciones para construir taxonomías sólidas adaptadas a diferentes contextos.
Frecuentes nombres para componentes de interfaz
Cuando la búsqueda de nombres se dificulta, consultar sistemas de diseño consolidados es una buena forma de encontrar denominaciones comunes. Iain Bean creó la Component Gallery, una colección con ejemplos y variantes para más de 50 componentes UI, desde acordeones hasta elementos visualmente ocultos, facilitando el proceso de nombrar y diseñar.
Nombrar nuevas funcionalidades
La adopción de nuevas características suele estar condicionada por su fácil descubrimiento y comprensión. Erin Gannon explica que un buen nombre debe reflejar las necesidades y problemas del usuario, señalando la utilidad del elemento. Además, recomienda usar el lenguaje propio de los usuarios, preguntándoles cómo describirían la función para garantizar que el nombre sea natural y efectivo.
More Read
Cómo nombrar variables en sistemas complejos
El Vodafone UK Design System ofrece un ejemplo excelente con su Variables Taxonomy Map, que detalla la anatomía y clasificación de tokens mediante cuatro colecciones interrelacionadas: marca, primitivas, semánticas y páginas. Esta estructuración permite entender el uso y significado de cada token solo por su nombre, siguiendo propuestas de expertos como Nathan Curtis.
Herramientas para nombrar tokens de diseño
Romina Kavcic desarrolló una herramienta que guía desde el entendimiento de qué son los tokens de diseño hasta cómo estructurar un sistema propio, definiendo categorías, estados y roles para crear nombres flexibles y coherentes. Complementa este recurso con una hoja de inventario capaz de filtrar y organizar tokens para facilitar su gestión.
Nombrar productos o servicios
Para encontrar el nombre ideal de un producto o servicio, Onym es un repositorio open source que reúne herramientas para brainstorming, análisis de etimologías, guías, casos prácticos y hasta agencias especializadas. Resulta un recurso integral para profesionales que necesitan apoyo durante el proceso creativo.
Referencias útiles sobre nomenclatura
Se destacan numerosos enlaces de interés para nombrar desde botones y clases hasta componentes e iconos, incluidos:
- Guías sobre copy para UI y nomenclatura de clases y colores.
- Taxonomías de tokens y convenciones para sistemas de diseño.
- Diccionarios visuales y catálogos de componentes.
- Mapas de variables y cheatsheets de nombres.
- Herramientas organizativas y marcos de referencia para equipos multidisciplinares.
Importancia de nombrar bien
Un nombre efectivo es aquel comprendido y uniformemente empleado por diseñadores, desarrolladores, gestores de producto y usuarios. Las diferencias en lenguaje pueden generar frustraciones y errores. A menudo, una baja adopción de productos o funciones está vinculada a una mala denominación. Además, es vital detectar conflictos de nombres y gestionarlos para evitar confusiones futuras y promover una colaboración más fluida.
Extras y formación recomendada
Aprovechando la evolución tecnológica, Vitaly Friedman presenta «Design Patterns For AI Interfaces», un curso en vídeo con ejemplos prácticos y formación en UX para interfaces de inteligencia artificial, accesible mediante inscripción y con opción de vista previa gratuita.
