Use Matter
Once your preview environment is ready, you can start interacting with Matter in your project. The interface is divided into two main panels:
Left panel — a chat where you send prompts to Matter (similar to ChatGPT).
Right panel — a live preview that reflects changes in real time.
Ideas
You can work with multiple chats, called Ideas.
To create a new Idea, click the plus icon in the upper-left corner.
To view all Ideas, click your project name in the navigation menu: project-name/idea-name
Versions
Within an Idea, each change you make is stored as a version.
The version count is shown in the upper-left corner of the Preview panel.
You can roll back to any previous version at any time.
Restoring an older version will also remove all subsequent messages in that Idea’s chat.
How it works
Your Matter project is a Git repository mirrored from the original and hosted in the cloud.
Each Idea is a separate branch.
Each version inside an Idea is a commit.
This allows you to track generated changes and merge them back into the original GitHub repository by creating a pull request.
Preview options
The right-side Preview panel supports several views:
Preview — the default live preview. From here, you can take a screenshot or copy a shareable link for teammates.
Summary — a description of the changes included in the current version.
Changed files — a diff view showing code changes compared to the previous version.
Prompt options
When sending prompts to Matter, you can also:
Attach a file.
Reference a Figma mockup (after connecting to Figma).
Mention a teammate to invite them into the chat for collaboration.
Collaborate with teammates
When you @mention someone who’s not yet registered in Matter, you’ll be prompted to invite them via email. If the person is already registered, they’ll receive the alert only in their Matter account. That’s why we strongly recommend setting up the Slack integration — this way, all mentioned teammates get notified directly in Slack, and no mentions go unnoticed.
Chatting with Matter and people
When you @mention a teammate in chat, the conversation switches from you and Matter to you and your teammate.
In this mode, Matter cannot see your messages.
To switch back and address Matter again, simply mention @Matter.
General coding guidelines
You can provide Matter with general rules or instructions that apply to your entire project. Matter will take these into account for all tasks, so you don’t need to repeat them in every prompt.
In your prompt input field, click the Coding Guidelines icon.
In the pop-up window, enter your instruction using plain language. You can use Markdown tags for complex formatting.
Click Save when finished.