アノテーション

アノテーションとは、インタラクション（トリガーとレスポンス）の間に配置して、コンテキストや説明を提供できるドキュメントブロックのことです。これらはインタラクションフロー内に直接表示されるインラインコメントとして機能するため、以下のような場合に最適です。

• チームの引き継ぎ用のインタラクションロジックのドキュメント化

• 複雑なプロトタイプの動作の解説

• 開発者向けの実装ノートの提供

• 関係者のレビュー用のコンテキストの追加

アノテーションの作成

上部バーから

上部ツールバーのアノテーションボタンをクリックして、アノテーションを追加します。

• インタラクションパーツが選択されている場合： 選択したパーツの直下にトリガーレベルまたはレスポンスレベルのアノテーションを作成します。

• 何も選択されていない場合：インタラクションパネルの最下部にトリガーレベルのアノテーションを作成します。

• レイヤーが選択されている場合：レイヤーの選択を解除し、最下部にトリガーレベルのアノテーションを作成します。

インタラクションパーツの間

任意のインタラクションパーツの間にホバーすると + ボタンが表示されるので、[アノテーション] を選択します。これにより、その特定の位置にレスポンスレベルのアノテーションが作成されます。

アノテーションのレベル

アノテーションには2つの階層レベルがあります。

トリガーレベル

一連のインタラクションの全般的なコンテキストを提供するトリガーレベルのアノテーションです。これらは、上部バーから作成するか、レスポンスレベルのアノテーションをトリガーレベルにドラッグすることで作成できます。

レスポンスレベル

トリガー内にネストされ、特定のレスポンスやインタラクション手順を記述するアノテーションです。インタラクションパーツの間で作成するか、トリガーレベルのアノテーションをトリガーの下にドラッグすることで作成できます。

💡ヒント： インタラクションの階層内でアノテーションを別の位置にドラッグすることで、レベルを簡単に変換できます。また、ショートカットキーを使って移動することも可能です。

• 上へ移動：

  • Mac: ] または ⌥⌘ ]

  • PC: ] または Ctrl + Alt + ]

• 下へ移動：

  • Mac: [ または ⌥⌘ [

  • PC: [ または Ctrl + Alt + [

アノテーションの編集

アノテーションをクリックして、プロパティパネルでその内容を編集します。アノテーションはマークダウン形式をサポートしており、以下を行うことができます。

• 見出しの追加や強調（太字、斜体）

• リストやテーブルの作成

• 技術ドキュメント用のコードブロックの挿入

• 外部リンクの追加

フォーカスしている間は Markdown のソーステキストが表示され、フォーカスを外すと（別の場所をクリックすると）、適切なフォーマットで表示されます。