円の背景が広がりながらメニューを表示

• 株式会社天辻鋼球製作所https://www.aksball.co.jp/

ハンバーガーボタンや特定のアイコンを中心として、背景色が円形に拡大して全画面メニューになる動きは、シーンの切り替えをドラマチックに演出します。小さな接点から世界が広がるような高揚感があり、ブランディング重視のサイトに適しています。clip-path: circle()のアニメーションを用います。円が広がりきるのと同時にメニュー項目をフェードインさせるなど、タイミング調整が体験の質を決めます。スマホの縦長画面でも四隅まで色が届くよう、円の最大サイズ計算に注意が必要です。