--- title: Prerequisites tags: Before You Start --- # Prerequisites to work in Design System Our Figma file system guides designers through gathering brand assets, through prototyping and MLR Prep. Figma is the design program. A user will need an account to work in the systems. A guest can reference files, but it is best to download the latest versions to fully customize the system for your brand. Links to the latest files are always available on this website. * [Figma Roles](https://help.figma.com/hc/en-us/articles/360039960434-Roles-in-Figma) * [Figma Guest vs Member](https://help.figma.com/hc/en-us/articles/4420557314967-Members-versus-guests) * [Figma Libraries](https://help.figma.com/hc/en-us/articles/360041051154-Guide-to-libraries-in-Figma) * [Figma Shared Libraries](https://www.figma.com/best-practices/components-styles-and-shared-libraries/) ## Figma File Structure The elements your team will need to create US Pharma websites are organized into components, styles, and libraries. **Components:** Components are elements of your designs that you want to reuse - you can think of them like building blocks. Components help keep your designs consistent and allow you to quickly apply changes across multiple files and projects. They can be basic elements made up of a few layers, like buttons or icons. Or more elaborate combinations of other elements, like toolbars and menus. **Styles:** Styles are sets of properties that can be applied to objects across your team's designs. You can use Styles to define attributes for color, text, stroke, fill, effects and layout grids. **Libraries:** Styles and components live in the files they are originally created in. To find and access styles and components across your files and projects, you can publish them as a library. This allows you to enable that library in your teams, drafts, or files. The Figma file structure has files and libraries for all key design stages. ![](https://hackmd.io/_uploads/rJ_jubdUc.png) **01. [Brand Identities Assets](https://www.figma.com/files/1044616065022804408/project/52605435/01-Brand-Identities-Assets?fuid=1063190158347141639)** File for brand assets: color, typography, and graphics. These assets are published as a library. **02. [Core Components](https://www.figma.com/files/1044616065022804408/project/52606169/02-Core-Components?fuid=1063190158347141639)** Components, patterns, and templates used in a material release version or sub themes. These components are published as a library. **03. [Website](https://www.figma.com/files/1044616065022804408/project/52606199/03-Website?fuid=1063190158347141639)** A space to layout responsive sitemaps, design and content. This work is shared as a library and connected to Prototype and MLR Assets. **04. [Prototype](https://www.figma.com/files/1044616065022804408/project/52606525/04-Prototype?fuid=1063190158347141639)** An interactive prototype of the website, from start to finish for all devices. **05. [MLR Assets](https://www.figma.com/files/1044616065022804408/project/52606934/05-MLR-Assets?fuid=1063190158347141639)** File to add and track assets for MLR submission. All files are available in Figma under the [US Pharma DS project](https://www.figma.com/files/1044616065022804408/team/1089191283923682843/US-Pharma-DS?fuid=1063190158347141639). Guest users can be added to the project by email invite. > Source: [Guide to Libraries in Figma](https://help.figma.com/hc/en-us/articles/360041051154-Guide-to-libraries-in-Figma)