> ## Documentation Index > Fetch the complete documentation index at: https://help.scribe-mail.com/llms.txt > Use this file to discover all available pages before exploring further. # エディター概要 > Scribeの署名エディターを実際に見てみましょう。ツリーパネル、キャンバス、スタイリングパネル、トップバー、アクションバーがどのように連携して署名を作成するかをご紹介します。 Scribeエディターは、メール署名をデザインする場所です。Figma や Framer などのデザインツールに似た3パネル構成で、左に[ツリーパネル](/ja/editor/tree-panel)、中央に[キャンバス](/ja/editor/canvas)、右に[スタイリングパネル](/ja/editor/styling-panel)を配置しています。 ツリー、キャンバス、スタイリングパネルで構成されるScribeエディターの3ペインレイアウト ## レイアウト **ツリーパネル(左)**:署名の階層構造を折りたたみ可能なツリーで表示します。署名内のすべてのブロック(カラム、テキストブロック、画像、バナー)がここに表示されます。このパネルから、ブロックの選択、並べ替え、複製、非表示、削除ができます。 署名ブロックの階層構造を表示する左側のツリーパネル **キャンバス(中央)**:変更内容がリアルタイムで反映される署名のライブプレビューです。キャンバス上のブロックを直接クリックして選択するか、ツリーパネルから選択できます。キャンバスにはSmartfieldから取得した実際のチームメンバーのデータが表示されるため、署名の実際の見え方を確認できます。 署名のライブプレビューを表示する中央のエディターキャンバス **スタイリングパネル(右)**:ブロックを選択すると表示されます。レイアウトプロパティ、テキストの書式、色、余白、Smartfieldとの連携など、そのブロックに関するすべてのスタイリングオプションが表示されます。選択したブロックの種類に応じてオプションが変わります。 ブロックの設定オプションを表示する右側のスタイリングパネル ## トップバー [トップバー](/ja/editor/editor-top-bar)には、主要な情報とアクションが表示されます。 * **戻る矢印**:署名の詳細ページに戻ります * **署名名とステータス**:署名名、割り当てられているチームメンバーの数、現在のステータス(下書きまたは公開済み)を表示します * **テンプレート**:テンプレートライブラリーを参照し、用意されたデザインから作成を始められます * **品質チェック**:署名デザインの互換性をチェックします。クリックするとチェックリストが表示され、署名があらゆる画面サイズに応じてレスポンシブに表示されること、すべてのメールクライアントとブラウザーで動作すること、デスクトップ/モバイル/タブレットで機能すること、軽量なHTMLで素早く読み込まれること、メール作成時に正しく表示されること、すべてのプラットフォームで画像の比率が保たれることを確認できます。公開前にすべての項目が緑色で表示される必要があります。 * **プレビュー**:プレビューモーダルを開き、各チームメンバーで署名がどのように見えるかを確認できます * **公開**:デザインの変更を反映します。公開後、更新内容はインストール済みのすべてのチームメンバーに自動的に配信されます。 テンプレート、品質チェック、プレビュー、公開の操作を備えたエディターのトップバー ## アクションバー キャンバス下部のアクションバーでは、次の操作を行えます。 * **元に戻す/やり直し**:変更を一段階戻したり進めたりします * **ドラッグハンドル**:キャンバスの表示位置を調整します * **ズームコントロール**:拡大(+)、縮小(−)、または特定のズーム倍率(例:100%)の設定ができます 元に戻す、やり直し、ズームコントロールを備えたエディターのアクションバー ## 関連記事 * [アクションバー](/ja/editor/action-bar) * [ブロックを追加](/ja/editor/add-blocks) * [列と行でレイアウトを構築](/ja/editor/building-layouts-with-columns-and-rows)