HERO SECTION
左寄せキャッチコピー×フルスクリーン背景。
暗い背景に電子の流れを思わせるパーティクル演出を敷き、左寄せの大型タイポグラフィを配置したヒーロー領域の解説です。CTAボタンはホバー時にグラデーションが充填されます。
SCROLL DOWN
暗い背景に電子の流れを思わせるパーティクル演出を敷き、左寄せの大型タイポグラフィを配置したヒーロー領域の解説です。CTAボタンはホバー時にグラデーションが充填されます。
画面を左右に2分割し、片方にクローズアップ画像、もう片方に見出しと説明文をまとめたスプリットスクリーンレイアウトの解説です。
スクロールに応じて左右が逆方向に動くパララックス効果を添え、静的な2分割構成に奥行きを持たせています。
上部にアイコン、中央にタイトルと説明文を配置した縦積みカードの解説です。
ホバー時にカードがわずかに傾くティルトエフェクトのマイクロインタラクションの解説です。
3列均等のグリッドで反復させ、複数の要素を並列に比較しやすくした構成です。
縦のラインに沿って円形アイコンを配置したステップ表現の解説です。
各ステップにタイトルと説明文を添え、上から下へ順序立てて読ませます。
最後のステップまで縦一列で完結させるシンプルな構成です。
マイナスアイコンで展開中であることを示し、見出しの下に本文を表示する開閉式レイアウトの解説です。回答エリアは高さのアニメーションで滑らかに開きます。
プラスアイコンで折りたたみ中であることを示すクローズ状態の解説です。クリックでアイコンが切り替わり、本文が展開します。