DEMO / 架空の香水
香りが、降りてくる。
frural / eau de parfum
架空の香水の LP を想定したサンプルです。ボトルも空も花も、画像ファイルは使わず、 ページを開いた瞬間にブラウザの中で描いています。
↓ スクロールすると、香水と一緒に空から降りていきます
FALL
ゆっくり、斜めに。
ボトルは画面の真ん中に留めたまま、背景の空の方を上へ流して「落ちている」ことを表しています。スクロールを止めれば落下も止まり、戻せばボトルは空へ戻ります。
APPROACH
空から、草原へ。
空・山並み・草原の 3 枚の絵を、それぞれ違う速さで動かしています（パララックス）。首元から立ちのぼる香りの粒は、スクロールが速いほど多くなり、止まると少しずつ消えていきます。
BLOOM
近いところから、咲いていく。
ボトルの着地点に近い花から順に、つぼみが開いていきます。PC では 300 輪、スマホでは 150 輪。スクロールを戻すと、花はまた閉じます。
LANDING
このページについて
これは frural の Web 制作サンプルです。香水もブランドも架空のもので、販売はしていません。 商品の世界観を、スクロールひとつで体験してもらうページを作りたい方はご相談ください。