Skip to main content

Hi guys!


For those who have a product that is displayed on mobile and desktop, how did you build your design system? Do you have one single design system or one for each?


Giving that some of our platform components are quite different from one to the other we are thinking about building two design systems, but then once we’ll search for an asset we won’t be able to know from which design system it comes from.


Still getting used to Figma here, so I’m hoping you guys can help me!


Cheers,

Gaëlle

I have found this article quite helpful when I had same questions.

Figma

It’s Figma’s official best practices article, and as always, there’s not one-size-fits-all, but it gives good tips on what are the pros and cons of each approach.


I hope you’ll find it helpful as well.



“Many users will have two sets of type styles which include a type ramp for mobile and another for desktop.”



↑ This is the ONLY mention of type styles in that article.


That best practices article, while helpful in general, only barely mentions any approach to a type system across breakpoints.


No one mentions type sizes for mobile anywhere, not even design systems.


Do you try and have your H3 on Desktop become the H1 on Mobile? Or is it expected to create a type ramp for each breakpoint?


Reply