レイアウトデザイナー – 画面配置を自由自在に | VtigerCRM
UI/UX デザイン

レイアウトデザイナー

画面の「使いにくさ」を、あなたの手で解消する。

エンジニアに依頼する必要はありません。
入力項目の並び順、関連情報の表示位置、不要なフィールドの非表示。ドラッグ&ドロップの直感的な操作で、チームが最も働きやすい画面レイアウトを設計できます。

レイアウト編集: 顧客詳細
基本情報
Drop Here
住所情報
電話番号
ドラッグ&ドロップ
直感的な画面設計

入力フォームの最適化

必要な情報を、見やすい場所に

Layout Editor

重要な入力項目を探して、スクロールしていませんか?

デフォルトの画面構成が、自社の業務フローに合っているとは限りません。
Vtigerのレイアウトデザイナーは、「見やすさ」と「入力しやすさ」を自由にカスタマイズできる機能です。

配置の自由度

入力フィールドの並び順をドラッグ&ドロップで入れ替え。よく使う項目を一番上に配置し、スクロールの手間を省きます。

ブロックでの整理

「基本情報」「契約詳細」「アンケート回答」のように、関連する項目をブロック(グループ)にまとめて整理できます。

不要な項目の非表示

使わない標準フィールドを非表示にしたり、必須項目に設定したり。入力画面のノイズを減らし、データの品質を高めます。

機能ハイライト

主な特徴

項目設定: 契約日
必須項目にする (Mandatory)
簡易作成ビューに表示 (Quick Create)
読み取り専用 (Read Only)

フィールド属性の詳細設定

各入力項目(フィールド)に対して、細かい振る舞いを設定できます。 「必ず入力させたい(必須)」「ポップアップ作成画面にも表示したい(クイック作成)」「一括編集を許可する」など。 データの品質と入力の利便性を両立させるためのチューニングが可能です。

関連リスト(タブ)の整理

顧客データの詳細画面下部には、「商談」「チケット」「請求書」などの関連情報がタブ形式で表示されます。 レイアウトデザイナーを使えば、これらのタブの表示順を変更したり、使わないモジュールのタブを非表示にしたりできます。 重要な情報に素早くアクセスできるよう、導線を整理しましょう。

関連モジュール整理
必要なタブだけを表示・並び替え
関連リストの並び替え
商談 (Deals)
お問い合わせ (Tickets)
資産 (Assets)

ブロックによる情報の構造化

基本情報
新規ブロック追加
+ フィールドを追加

情報のグルーピング(ブロック)

入力項目が多い場合、それらを意味のあるグループ(ブロック)に分けることで、視認性が大幅に向上します。 新しいブロックを作成し、既存のフィールドを移動させたり、ブロック単位で表示・非表示を切り替えたり(折りたたみ)することが可能です。

レイアウト変更の3ステップ

1. モジュール選択

編集したい機能(連絡先、商談など)を選びます。

2. ドラッグ&ドロップ

項目の位置を調整し、不要なものを隠します。

3. 保存・反映

保存ボタンを押すだけで、全ユーザーに即時反映。

活用シーン

使いやすい画面が、入力率を高めます。

営業入力の簡素化

商談の作成画面で、営業担当者が必ず入力すべき項目だけを上部にまとめ、あまり使わない詳細項目は下部のブロックに隠すことで、入力スピードを向上させます。

サポート情報の整理

問い合わせチケットの画面で、「顧客の契約情報」や「過去の購入履歴」を表示する関連タブを一番見やすい位置に移動。オペレーターが情報を探す時間を減らします。

多言語・多地域対応

海外拠点向けのレイアウトでは、「ZIP Code(郵便番号)」の位置を変更したり、現地特有の税金情報を入力するカスタムフィールドを追加したりして最適化します。