A Practical Guide To Naming Things — Smashing Magazine

Often, the root of the problem lies in the chosen nomenclature falling into one of two extremes. Names can become overly generic, making it exceedingly difficult to discern their exact purpose or context within a larger system. Conversely, they can be made too specific, stripping away the necessary flexibility and reusability required for scalable digital architecture. Addressing this dilemma requires a deliberate examination of how industry professionals approach naming conventions, taxonomic structures, and the valuable resources available to streamline these decisions.

A Practical Guide To Naming Things — Smashing Magazine

How To Name Things

For developers and designers seeking fresh inspiration when naming HTML classes, cascading style sheet properties, or JavaScript functions, resources like Paul Robert Lloyd’s Classnames project offer a compelling way to think outside conventional coding terminology. Rather than relying on repetitive or improvised tags, the platform provides meticulously organized, thematically grouped lists of words designed to inspire better semantic choices.

The site curates terms that effectively describe behavioral traits, relational similarities, structural ordering, grouping, and associations. Beyond traditional technical vocabulary, it introduces thematic collections drawn from domains such as nature, art, theater, music, architecture, fashion, and publishing. By tapping into these diverse fields, practitioners can find evocative and precise words that bring clarity and character to their codebases without sacrificing structural integrity.

A Practical Guide To Naming Things — Smashing Magazine

How To Name Colors

Determining the appropriate name for a specific color value is another notorious hurdle in digital design. To alleviate this challenge, David Aerne maintains an expansive repository of color names known as color-names, which currently catalogs over 30,000 unique color designations sourced from diverse historical references and thousands of individual user contributions.

Supplemented by interactive tools like the Color Parrot picker and name search utilities, this repository serves as an invaluable reference for developers and designers alike. Having a standardized yet expressive vocabulary for color tokens ensures that teams can reference visual elements consistently across design files and production code without resorting to arbitrary hex codes or confusing numeric scales.

A Practical Guide To Naming Things — Smashing Magazine

How To Name Layers and Groups

Within design tools, the chaotic state of untitled layers and haphazardly named groups can severely hinder collaboration and file maintenance. Javier Cuello has sought to resolve this by outlining a comprehensive set of naming best practices aimed at bringing consistency and scalability to layers, groups, and UI components.

According to Cuello, an effective name possesses a logical structure, remains concise, carries clear meaning, is universally understood by all team members, and strictly avoids reliance on temporary visual properties. By outlining clear operational principles regarding do’s and don’ts, these guidelines help teams navigate the intricate details required when organizing sizes, colors, groups, layers, and components within modern design files.

A Practical Guide To Naming Things — Smashing Magazine

How To Name Design Tokens

Scaling a design system across multiple brands and products introduces complex architectural hurdles, particularly when establishing a flexible design token taxonomy. This exact challenge was faced by the team at Intuit, the parent company behind major financial and productivity platforms such as Mailchimp, QuickBooks, TurboTax, and Mint. To unify these diverse offerings, the organization engineered a robust token system capable of transcending individual brand themes to serve as a foundational infrastructure.

Nate Baldwin detailed the creation of this taxonomy in a comprehensive case study, examining the underlying pain points of their legacy systems, the strategic criteria established for the redesign, and the eventual implementation of the new architecture. The insights shared from Intuit’s journey offer critical takeaways for engineering and design teams aiming to construct resilient, adaptable token systems that can withstand multi-brand expansion.

A Practical Guide To Naming Things — Smashing Magazine

Frequent Names For UI Components

When teams find themselves stuck in endless debates over what to call a recurrent interface element, examining established design systems can provide an immediate compass. To prevent designers and developers from endlessly scouring the web, Iain Bean compiled the Component Gallery, a comprehensive repository that documents interface components drawn directly from real-world design systems.

The gallery features extensive examples across more than fifty distinct user interface components, ranging from foundational items like accordions to accessibility utilities like visually hidden text. Crucially, the collection also highlights alternative names that these components commonly go by across different organizations, serving as both a practical dictionary and a cross-system benchmarking tool. Additional visual resources, such as Name That UI, further assist practitioners by providing a visual glossary of standard interface patterns.

A Practical Guide To Naming Things — Smashing Magazine

How To Name New Features

While technical nomenclature impacts code and design files, the names assigned to user-facing features directly influence product adoption and discovery. Features frequently suffer from poor utilization not due to a lack of utility, but because they lack discoverability and intuitive framing. Product adoption requires a deliberate sequence where a feature must first be discovered, understood, tried, learned, and ultimately integrated into a user’s existing workflow.

In her practical guide on the subject, Erin Gannon emphasizes that successful feature names must be anchored firmly in user needs and problem-solving. Rather than relying on internal corporate jargon, effective feature names signal the tangible value or outcome—the job-to-be-done—by tapping directly into the language users themselves employ. Soliciting feedback from users and describing functionality in their own terms ensures that the final nomenclature resonates immediately upon encounter.

A Practical Guide To Naming Things — Smashing Magazine

How To Name Variables (Taxonomy Map)

Managing a complex, multi-brand ecosystem requires rigorous variable structuring, a reality expertly demonstrated by the Vodafone UK Design System team. Their publicly shared Variables Taxonomy Map breaks down the complete anatomy and categorization of design tokens into a meticulously coordinated system of collections within Figma.

The mapping framework illustrates the four essential collections required to sustain the system, mapping the deliberate connections between tokens as they flow from foundational brand primitives and semantics down to specific page implementations. Built upon foundational methodologies established by industry experts like Nathan Curtis, such taxonomic maps empower every stakeholder to instantly understand a token’s origin, intended context, and application purely through its structural naming convention. Additional community toolkits and token inventories, such as those curated by Romina Kavcic, provide further structural frameworks, including four-level spreadsheets that grant teams a bird’s-eye view of their token architecture without losing track of individual themes or modes.

A Practical Guide To Naming Things — Smashing Magazine

Naming Products or Services

Beyond code and interface elements, arriving at the right name for an overarching product or service remains a formidable strategic hurdle. Open-source repositories like Onym serve as centralized hubs organizing methodologies, brainstorming prompts, vetting frameworks, guides, sprints, and etymological resources. By compiling tools, cautionary tales, and expert literature, these resources encourage multidisciplinary teams to explore alternative avenues of creative and strategic thinking during the foundational phases of product development.

Wrapping Up

Ultimately, the most effective name is one that is universally understood and actively utilized by both the product team and the end users. A significant amount of operational time is frequently squandered when cross-functional colleagues discuss identical concepts using divergent dialects—translating distinct terminology across designer, developer, product manager, and user vocabularies. This linguistic fragmentation is a primary driver of workplace friction and confusion.

A Practical Guide To Naming Things — Smashing Magazine

When feature adoption lags or system integration stalls, the underlying friction can often be traced back to unclear or conflicting nomenclature. Cataloging and addressing naming conflicts in a dedicated backlog is a vital maintenance practice that reduces ambiguity, minimizes frustration, and fosters smoother collaboration across modern technical and creative teams.

Share:

Azzam Bilal Chamdy writes for Tech Maze.

Leave a comment