![]() It is not entirely fair to Sketch to portray this difference without weighing some additional variables. Sketch Global/Body/Primary/Left Global/Body/Primary/Center Global/Body/Primary/Right Global/Body/Black/Left Global/Body/Black/Center Global/Body/Black/Rightįigma Global/Body (Justification and color applied locally). In the case that a style needed multiple justifications and color we could end up with six styles where Figma only requires one. The way Sketch handles both of these can quickly compound into a massive list of styles. This didn’t have the same dramatic effect on our library of text styles as the justification but still did reduce our list by around ten styles. ![]() We then apply a color style to the text separately. In Figma, by removing colors from the text styles we now have Button/Body. In Sketch we had Button/Body/Primary and Button/Body/On Primary. For instance, when you need a text style to be black in some cases, but your primary color in other cases, it adds a text style. This is a more subtle difference than justification but does cause some redundancy. In Sketch, text styles include their color. Sketch Global/H1/Left Global/H1/Center Global/H1/Right For example the following three styles can be reduced to one in Figma: In our design system - we have ten Global text styles (in addition to some component-specific text styles). This can quickly diminish your list of text styles. In Figma, text styles are independent of justifications. The naming convention that I subscribed to in Sketch: Category/Description/Description 2 (optional)/Justification A couple of examples: Global/Body/Left Global/Body/Bold/Left In some cases, I might not need multiple justifications, for example: Button/Body/Primary The button text is always center-aligned so we can drop the justification from the name. This may not seem like a huge deal - but can quickly explode out into a longer-than-necessary collection of styles. In Sketch, text styles include their justifications. There are differences between how Figma and Sketch handle text styles - and I believe Figma‘s system is superior. Using text styles in Figma offers teams a number of new ways to approach organizing text. Some of the text styles in our design system
0 Comments
Leave a Reply. |
AuthorWrite something about yourself. No need to be fancy, just an overview. ArchivesCategories |