A short talk explaining what a design system is: a library of UI components in design tools (Sketch, Figma, Photoshop) plus coded components (React, HTML/CSS). The speaker cites Bootstrap and Google’s Material Design as examples and notes that implementing a design system ensures consistent interfaces across products (e.g., Gmail, Maps), which sets user expectations about element placement and actions.
Design system has in it a library. And that's usually a library of components, both in a design medium like UI kits and applications like Sketch or Figma or Photoshop or things like that. And also generally have code components, too. So some version of coded components, whether that's a REACT library or that's HTML and CSS or whatever languages those are. And so you can think about something like Bootstrap is a component library and can be used as a design system. A lot of people are familiar with the idea of material design, which is Google's design system, that if you open up the Gmail app or the Google search app, or whether it's on your phone or on a desktop computer or wherever it is, all of those, they look consistent. At least they do now. A lot of them do now over the last couple years. And that's because Google has been implementing that design system in all of their products. So that whether you use Gmail or you're using Maps, you know where the search bar is going to be, you know where the action button's going to be, you know all of those things are consistent so that you can set expectations when.
