Starting your docs

Get started documenting your design system in Interplay

Overview

Interplay allows you to bring all of your design system artefacts into a single place.

You can document React and Figma components side-by-side, manage design tokens and author content and guidelines to align your whole team around a single source of truth.

Quickstart guide

1. Create a design system in your Interplay workspace

If you haven’t already done so, sign up for an Interplay account at https://app.interplay.io and create your workspace. (Alternatively you may have been invited to an existing workspace.)

On the workspace dashboard, create a design system.

 

2. Click + to create a new content tab

In your design system, click the + in the top bar to create a new Tab, and give it a name.

Notion image
 

3. Start adding content!

To create content, click the placeholder and start typing:

Notion image
 

Type a forward slash ‘/’ to use different types of content blocks:

Notion image
 

Once you have added design tokens or components to Interplay, you can insert those into your content in the same way

Notion image
 

…or you can embed content from Storybook and Figma:

Notion image

4. Organise content with Sections and Pages

On the left hand side of your tab you can organise your content into Sections and Pages

Notion image

A Section is a group of pages that has its own overview/landing page.

  • To create a new Section, click on the plus at the top of the navigation pane.
  • Click on the + within the section to create new pages.
  • Drag-and-drop the sections and pages to organise your content
 
Did this answer your question?
😞
😐
🤩