Melhores práticas para nomear tokens de design

Nomear elementos no design pode parecer uma tarefa simples, mas, na verdade, é um desafio que muitos designers e desenvolvedores enfrentam diariamente. Ao criar tokens de design, componentes de interface ou até mesmo variáveis em código, o nome escolhido pode influenciar a compreensão e a reutilização desses elementos em diferentes contextos. Neste artigo, discutiremos como as melhores práticas para nomeação podem aprimorar a clareza e a eficiência no trabalho de design.

A importância de uma nomenclatura clara não pode ser subestimada. Nomes eficazes não apenas ajudam a comunicar a funcionalidade e o propósito de um elemento, mas também facilitam a colaboração entre equipes e a manutenção de sistemas complexos. Ao longo deste post, abordaremos as convenções de nomenclatura, exemplos práticos e recursos que podem ajudar na criação de nomes eficazes.

Por que a nomeação é complicada?

Um dos principais motivos pelos quais a nomeação é tão difícil é a subjetividade envolvida. O que pode parecer um nome claro para uma pessoa pode ser ambíguo para outra. Segundo

"os nomes que escolhemos às vezes são genéricos demais ou específicos demais, dificultando a compreensão de seu significado".

Essa incerteza pode levar a confusões, principalmente em sistemas de design que requerem uma colaboração constante.

Além disso, a falta de um sistema de nomenclatura claro pode ser um obstáculo significativo no trabalho em equipe. Com a equipe de designers da Adobe, por exemplo, muitos esforços têm sido feitos para criar uma nomenclatura que todos compreendam, independentemente de seu nível de experiência ou conhecimento prévio.

Convenções de nomenclatura eficazes

Uma boa nomeação deve seguir algumas convenções fundamentais. Javier Cuello sugere que um nome eficaz deve ter

"uma estrutura lógica, ser curto, significativo e amplamente reconhecido"

. Isso significa que os nomes não devem se basear apenas em propriedades visuais, mas em características que todos os membros da equipe possam entender.

Considere usar uma nomenclatura descritiva. Por exemplo, em vez de nomear um botão como "btn1", utiliza-se "botão-enviar". Esse pequeno ajuste pode facilitar a compreensão do propósito do botão, além de torná-lo mais memorável. Há também recursos como Classnames, que fornece listas agrupadas de palavras para inspirar a nomeação.

Playbook de Nomeação de Tokens de Design

Romina Kavcic desenvolveu um Design Tokens Naming Playbook interativo, que visa facilitar a nomeação de tokens. Esse Playbook cobre desde estruturas de nomeação até a criação de bancos de dados pesquisáveis e realização de workshops de nomeação. Uma prática comum é realizar sessões de brainstorming, onde os membros da equipe podem compartilhar suas ideias e discutir as melhores opções de nomenclatura.

Estabelecendo uma taxonomia flexível

Intuit, conhecida por produtos como Mailchimp e Quickbooks, desenvolveu uma taxonomia de tokens de design flexível, que vai além das características de marca. O estudo de caso de Nate Baldwin sobre o sistema de taxonomia da Intuit ilustra a necessidade de critérios claros ao desenvolver nomes que possam servir a um portfólio variado de produtos.

Esse sistema não só fornece um formato para nomear tokens, mas também estabelece conexões entre-os elementos, permitindo que todos na equipe entendam rapidamente a função de cada token apenas pelo seu nome.

Nomeação de cores no design

Cores podem ser especialmente desafiadoras para nomear devido à sua subjetividade. Jess Satell, do System Design da Adobe, aborda como a nomenclatura de cores pode ser estruturada da seguinte forma: uma combinação da classificação da família de cores com valores de brilho contínuo,

"o que torna o processo não só lógico como também escalável"

. Isso permite que a equipe mantenha um sistema coeso mesmo quando novas cores são adicionadas.

Ferramentas para nomeação

Existem diversas ferramentas que podem auxiliar na criação de nomes eficazes. O Color Parrot, por exemplo, é um bot do Twitter que ajuda a identificar e nomear cores em imagens. Essa ferramenta é útil quando a equipe busca inspiração ou referenciamento em outros recursos visuais.

Component Gallery é outro recurso valioso que agrupa componentes de interface a partir de sistemas de design do mundo real, oferecendo exemplos e alternativas de nomeação que podem enriquecer o repertório de nomes de uma equipe.

Implementando um sistema de nomenclatura

Uma vez que uma equipe tenha decidido sobre uma convenção de nomenclatura e feito uso de ferramentas úteis, é fundamental implementar adequadamente a nomenclatura em seu fluxo de trabalho. Romina Kavcic criou uma planilha do Design Token Names Inventory, que não só facilita a consistência da nomeação, mas também se integra diretamente ao Figma, economizando tempo e esforço.

Conclusão

A nomeação eficaz é uma habilidade essencial para designers e desenvolvedores, influenciando diretamente a clareza e a eficiência do trabalho colaborativo. Nomes claros e padronizados não apenas melhoram a comunicação entre os membros da equipe, mas também facilitam a reutilização e manutenção de sistemas complexos. Com as práticas e recursos discutidos neste artigo, você pode aprimorar a nomeação de seus tokens de design, componentes e variáveis.

Diante da complexidade do design contemporâneo, investir tempo e esforço na criação de um sistema de nomenclatura robusto é um passo crucial para o sucesso de qualquer projeto. Com a aplicação dessas melhores práticas, você estará no caminho certo para um design mais coerente e eficaz, permitindo que sua equipe se concentre na criação de soluções verdadeiramente criativas.

Fonte: Cosima Mielke – Best Practices For Naming Design Tokens, Components And Variables — Smashing Magazine