ページコントロール

Page Control
別名: ドットインジケーター / Dot Indicator
モバイル固有のパターン

🎮 ライブデモ

📝 説明

一言で説明

複数のページ(スライド)が並んでいることを、小さなドット(点)の列で示すUI要素。現在位置がハイライトされる。

いつ使う?

カルーセル、ウォークスルー画面、写真ギャラリーなど、スワイプで切り替えられるコンテンツの枚数と位置を伝える場合。

💡 日常の言い方

写真の下にある、今何枚目かを示す小さなテンテン

🔄 似ている用語との違い

ページコントロール vs ページネーション

ページネーションは『1, 2, 3...』のように数字で明示的にページ遷移させるが、ページコントロールはドットで視覚的に表現し、主にスワイプ操作と連動する。

🤖 AIへの指示例

画像カルーセルの下部にページコントロール(ドットインジケーター)を配置して。現在の画像のドットだけ色を濃くして、スワイプに連動させて。