『使いやすさまで考えてるな』と感心させたい
11個のコンポーネント
ホバーで出る小さい説明テキスト
UIの説明を画面内に置かなくて済む。情報密度が高い画面で威力を発揮する。
クリックで出る情報パネル。ツールチップより大きい
ページ遷移なしで詳細を見せる。動線のスムーズさが格段に上がる。
要素の近くに出る小さな確認ダイアログ
モーダルほど邪魔じゃないけど確認はできる。さりげない安全設計。
手順の進捗を表示するUI（ステップ1 → 2 → 3）
登録フローや購入フローが一気にプロっぽくなる。ユーザーの離脱率も下がる。
入力途中で候補が自動表示されるUI
Google検索みたいなサジェスト。これがあると『体験が考えられてる』と感じる。
テキスト入力で絞り込みながら選択できるUI
選択肢が多い時にセレクトより圧倒的に使いやすい。ユーザー思いの設計。
クリックで展開/折りたたみできるブロック
情報過多を防ぐ武器。『見せすぎない設計』は上級者の証。
画面の各要素を順番に説明する吹き出しガイド
オンボーディングが丁寧 = ユーザー思いのサービス。解約率にも効く。
画面右下に出る↑ボタン。ページ最上部へスクロール
長いページには必須の親切設計。無いと不便だが、あっても気づかれにくい影の功労者。
クリックで開閉するQ&A形式のUI
FAQといえばアコーディオン。これだけでFAQセクションが完成する。
カスタムスクロールバー付きのスクロール可能な領域
ブラウザデフォルトの太いスクロールバーが消えるだけで洗練される。