1部屋で、ひと息。
2森を、歩く。
3海まで、出かける。
あわせて引く
2
4
ピン留めスクロール
Pinned Scroll
ふだんの言い方画像は止まって文章だけ進むスクロールで絵が切り替わる固定したまま進む
片側を画面に留めたまま、スクロールに合わせてもう片側の内容を進める演出。
見分けるポイント
- 写真や図は画面に留まり、文章だけがスクロールで流れる
- 文章の進み具合に合わせて、留めた側の絵が切り替わる
- 順を追った説明や、物語のような見せ方に向く
AIへの伝え方
変更する場所：機能を順に紹介するセクション。 機能紹介のセクションを、ピン留めスクロールにしてください。左半分に画像を position: sticky で画面の中央に留め、右半分に3つの説明を縦に並べてスクロールさせてください。それぞれの説明が画面の中央に来たら、左の画像をその説明に合ったものへ0.4秒のフェードで切り替えてください。スマートフォンでは、画像と説明を交互に縦へ並べてください。 変更は指定した箇所に限定し、それ以外のレイアウト・文章・配色は維持してください。スマートフォンでも要素がはみ出さず、文字や操作を妨げないようにしてください。
コピーした文章を、お使いのAIに貼り付けてください。
「動き」の言葉
触れたとき、現れるとき、スクロールしたときの動き。
207語すべてを、見た目から引く