Mar 16
The Layer Naming Dilemma
Designers and developers who have worked with various design tools are all familiar with the tedious and time-consuming task of naming. In fact, the design world is constantly debating whether it’s necessary to name layers at all (one, two, three, four). Some designers find it helpful for organization and collaboration, while others don’t consider it necessary.
Engineering Influence
As with many other things, naming conventions are coming to the design world from development. Naming convention — a set of rules for choosing the character sequence for identifiers, variables, types, functions, and other entities in source code and documentation.
There are several reasons why best development practices require using naming conventions:
- They reduce the effort needed to read and understand source code, making it easier to maintain and modify.
- They enable code reviews to focus on issues more important than syntax and naming standards, allowing for more efficient and effective review processes.
- They enable code quality review tools to focus on significant issues other than syntax and style preferences, improving the overall quality of the code.
Technically, you do not need to care about naming in dev, you still can build a fantastic product and solve your customer’s problem, but the end goal of naming isn’t the product. The list above has nothing to do with what users will get. The naming conventions support efficient development and the ability to read and understand code quickly.
Real-World Examples
Naming conventions in code and design tools (such as Figma, Sketch, and Principle) differ in their approach. In code, it always starts with text that can be visualized, whereas, in design, the graphical element on the screen is the source of truth. This means that even if a designer opens a prototype without the ability to view layers, they can still understand how the product or design works.
To further illustrate the importance of layer naming, consider the Apple Watch and Pixel Watch examples. While most users may not care about the inner parts of their watch or how it’s assembled, Apple and Google take different approaches. Apple focus on design down to the internal components of their devices, carefully arranging and crafting them to maximize space and efficiency while maintaining an attractive appearance. By designing its devices to be easily disassembled and repaired, Apple reduces waste and extends the lifespan of its products. This approach also enables more efficient manufacturing processes and reduces costs.
While it may take more time to build the inside of the device properly, it can save time if the device needs to be repaired or a new part needs to be added in the next iteration.
In the same way, naming isn’t a direct factor in building a successful product in both development and design, but it plays a crucial role in improving the product-building process. Proper naming conventions can benefit the team in several ways:
- Advanced prototyping tools such as ProtoPie, Principle, and Origami Studio rely heavily on naming to build functional prototypes. Naming layers correctly is necessary to ensure the prototype works as intended.
- Aligning naming conventions between design and engineering teams can enhance collaboration, making life easier for new team members who are just starting.
- Proper layer naming can improve the organization by allowing designers to identify layers based on their content quickly, making finding specific elements in design files easier. This also saves time in creating specifications and annotations for engineers, especially if you’re using plugins like EightShapes Spec.
- Collaboration between designers working in a single file becomes more efficient when they share the same naming conventions. This creates a shared language to build the product, making the process more effective.
Naming conventions can be an essential aspect of the product-building process in design and development. It may not make or break the success of a product, but it can certainly help improve efficiency, organization, collaboration, and the overall quality of the result.
Does naming always work?
Layer naming can be a useful organizational tool for designers, and it’s essential to recognize that it may not always work in every situation. One of the biggest challenges with layer naming is the time it takes to name each layer, which slows down the design process, especially when working with many layers/components.
In addition, strict layer naming conventions can stifle creativity and make it difficult for designers to develop a naming convention that works best for their specific design process. Sometimes, you may change the design of your product significantly, and layer names may no longer be relevant or accurate. These are the biggest factors that make layer naming less popular for designers who want to streamline their design process and focus on creativity and outcomes.
Speaking from personal experience, I used to overlook the importance of naming layers. I have recently begun changing my approach step-by-step. So now, I consciously try to name my layers clearly and consistently, at least in finished designs, even if it takes a little extra time.
Future of Layer Naming
With advancements in technology and machine learning capabilities, the future of layer naming should significantly improve for those who prefer to spend less time on this task.
This is an excellent example of the ML Auto Layer Naming feature by Pixelmator Pro, which has been around for more than four years.
Mizko’s layer naming prediction feature in Figma is a great concept that streamlines the design process by predicting layer names as you type.
Also, consider exploring the Figma Autoname plugin as an alternative. This plugin assists in naming frames with layers contained within them. While it does a pretty good job, it has limitations, particularly if you require specific naming conventions.
I think as the design world evolves, automation and machine learning may play an increasingly important role in helping designers streamline their workflow. Layer naming is a task that can be both tedious and time-consuming. Hopefully, soon, with the help of automation and machine learning, designers will save valuable time and mental energy.
