ローディングUIの設計 — スケルトン・スピナー・プログレスバー

スケルトンスクリーン — 最も体感が速い

コンテンツの「枠」を先に表示して中身を待つ手法。レイアウトシフトが起きず、何が表示されるか予測できるため、体感速度が最も高い方式です。

実装デモ：Skeleton Loader、Tailwind Pulse Skeleton

スピナー — 短い待ち時間に

回転インジケーターは「処理中」を最小コストで伝えます。1〜3秒程度の短い待ち時間や、サイズの予測がつかない処理に向きます。

長すぎる待ち時間にスピナーだけだと「固まった？」と不安にさせるので注意。

実装デモ：Spinner、Dots Pulse

プログレスバー — 進捗が分かる処理に

進捗率が計測できる処理（アップロード・ダウンロード）には確定的プログレスバーを。進捗が読めない処理には不定（indeterminate）バーを使います。

実装デモ：Progress Bar、Bar Loader、Progress Ring

体感速度を上げる設計のコツ

楽観的UI — 成功を前提に先に画面を更新し、失敗時だけ戻す。

最小表示時間 — ローディングが一瞬チラついて消えると逆に不快。最低 300ms 程度は表示する。

意味のある進捗 — 偽の進捗より、ステップ表示（「画像を処理中」等）の方が安心感がある。