Working in Projects

Overview of Projects

👉

Projects are where you do your work in Interplay. You can import code components to a project to publish a library and share your work with others via your project.

Creating a Project

You can create a new project via your Workspace dashboard in Interplay:

  • Login to your Workspace through the browser at https://app.interplay.io/
  • Click on Projects on the left hand side. You will see a list the current Projects created within your Workspace.
  • Click Create Project button (top right) and give your project a name.

Your project will be created and opened. Behind the scenes it is added to the list of Projects in your Workspace.

Navigating your project

At the top left of your screen you have the main tabs available in the project:

image
  • Interplay Home - takes you back up to the Workspace view
  • Screens and layers - view or add screens Screens
  • Components - view or use Components imported to this project
  • Tokens - view or add design tokens

At the bottom left of your screen you'll find the icons linking to Settings and History and Help.

Viewing a Project

To open an existing Project:

  • Login to your Workspace through the browser at https://app.interplay.io/ .
  • Click on Projects on the left hand side and click on the project you want to open.

Importing code components

When you first create your Project

To import your components, you need to provide a build of your components and configuration describing them. The Interplay CLI can help you create and deploy both of these. For more details, see

Once you have imported your components you will be able to manage their configuration in your project.

Managing Project Settings

To access the settings for your Project click on the Settings icon at the bottom left of your screen:

image

Viewing and Saving Project changes

Your project is made up of component configurations, design tokens and other content.

Changes your team makes in the project editor are immediately saved as pending changes so that they can be reviewed.

When reviewing your changes can commit them to your project or discard them. Committing the confirms the change to the project configuration data, and the commits form the version history of the project.

You can then mark specific commits as Versions, which makes them available to your team in your design tools.

Viewing pending changes

Click the tab to see a list of your changes:

image

You can click on each change to see more details of the change, including side-by-side comparison

Discarding pending changes

To discard pending changes you've made in the project:

  • Click on the Changes and History tab to bring up the list of project changes.
  • image
  • Right-click on the change you wish to discard and choose "Discard Change":
image

The item will be rolled back back to its previous settings.

Committing pending changes

When you commit a pending change, you are confirming the saved change into the project data.

To commit changes to the project:

  • Click on the Changes and History tab to bring up the list of project changes.
  • Use the checkboxes to select which changes you want to commit. Use the heading checkboxes to select multiple at once.
  • Enter a commit message and click Commit Changes
image

The change will be committed into the project data. If many changes are being committed, a project bar will displayed while any related navigation thumbnails are updated to reflect the update.

Viewing Project History

The commits you make are saved as a history of project changes. Here you can see the changes that have happened over time. Soon you will be able to rollback to previous versions.

To view the history

  • Click on the Changes and History tab to bring up the list of project changes.
  • At the top of the panel that appears, click "History"

The timeline of project changes will be displayed:

image

Publishing Releases

image

Publishing a release of your project makes it available in other projects and in the Interplay design tool plugins.

Releases allow you to present a controlled, named set of versions out to the consumers of your project.

Designers who have their plugin pointing to the "latest" release (default) in the plugins will receive a notification when when a new release is available. Alternatively they may choose to work with a specific published version.

To publish a new Release of your project

  • View your project history by clicking on the Changes and History tab
  • At the top of the panel, click History to show the list of previous commits.
  • Right click on the commit you want to publish and choose "Tag as Release..."

image
  • Give the release a version name and a summary description. The commit messages since the last published version are shown by default.
  • Click Publish

In the Figma plugin, you can see the available published versions under Manage Libraries. Typically designers will want to point to "latest" which means they will be using the most recent published version.