yukari karube

mail

制作物

フラワーショップ

コーディング

架空のフラワーショップのサイトを制作いたしました。

ポートフォリオサイトを制作した際に第二案として考えていたデザインカンプを元に、
モーションの実装例として制作いたしました。

  • 概要

    • 制作時期/期間

      • 2022/12
      • PCのみではございますが、実装に関しましては一日で行いました。

    • 担当分野

      • コーディング(HTML,SCSS,GSAP)

  • 制作のターゲット、サイトコンセプトについて

    • ターゲット

      • 30代女性
      • 毎週違う花を自宅に飾りたいと思っている
      • 高級感がある洗練されたデザインが好きで、金銭的にも少しゆとりがある
      • 安価なものより、少し高くても良いものを取り入れたいと思っている(食にもこだわる)

    • サイトコンセプト

      • 洗練・非日常

  • 実装のポイント

    • こだわった点

      • クリック可能な領域をホバーした際にはマウスストーカーの表示が「View」などに変わるようにしました。
      • メインビジュアルの下のセクションについては読んでほしい箇所だったため、スクロールでその領域に到達すると画面が固定されるようにし、
        「少しの間固定させたいが、スクロールしていることは分かる」ようスクロール量に合わせて右下に画像が表示されるよう工夫しました。