You can add an annotation by using ⌘ + Click (Ctrl for Windows and Linux users) anywhere on the screen and select “Annotation” from the top left menu.

💁‍♀️ Annotations support basic Markdown; making it easier to stylize and organize information.

When you create an annotation on a screen, you can link it to a component, as well. You can select an annotation type to describe the stage of the development—such as Behavior, Animation, API, and so on. The annotation types would help your teammates filter annotations and quickly get what they need.

The predefined annotation types are as follows:

Behavior

Explain how a certain element in a design should behave.

Requirement

Document technical product decisions as you made.

Animation

Describe the specs of an animation. You can include a GIF or link to a video.

API

Describe which API endpoints to use. You can give a high-level summary of an endpoint here; such as what properties/fields are required and add a link to your API documentation.

Tracking

Define the tracking events for analytics tools—such as Mixpanel.

☝️ Defining custom annotation types is not available yet, but we're looking to add this soon!

Related articles:

Did this answer your question?