モーダル？ドロワー？トースト？
UIの用語を12カテゴリで検索・確認
画面づくりの言葉を12カテゴリ・約50語にまとめた用語集です。キーワード検索かカテゴリの絞り込みで、知りたい言葉をすぐ確認できます。
デザイナーや開発者への依頼、AIへのプロンプト、ノーコードツールの設定画面などで「あのポップアップみたいなやつ」を正しい名前で伝えたい時に便利です。初学者の学習用にも使えます。
Webデザイナー・UI/UXデザイナーを目指す方、HTML/CSS/JavaScriptを学ぶフロントエンド初学者、NotionやBubbleなどのノーコードを使う方に向いています。デザイナーやエンジニアへ依頼するディレクター・企画担当、AIでサイトやアプリを作る方にも役立ちます。部品の正式名称を知っておくと、依頼や検索、AIへの指示の精度が上がります。
説明は一般的な使われ方に基づく簡易的なものです。サービスやフレームワークごとに呼び名が違う場合があります。すべての用語に、実際に触れるデモを付けています。モーダルを開く、表を並べ替える、要素をドラッグするなど、動きを体験すると名前と見た目が結びつきやすくなります。
Q. モーダルとドロワーの違いは？ A. モーダルは中央に出る確認用の窓、ドロワーは画面の端からスライドして出るパネルです。