旅館　架空サイト

担当範囲：

HTML CSS Sass JavaScript (jQuery)

制作期間：

2週間

使用ツール：

XD

実装機能：

• レスポンシブ対応
• ヘッダーの上部固定
• KV画像をズーム演出付きで自動切り替え
• Aos.jsを使用したフェードインアニメーション
• Swiperを使用したページネーション付きカードスライダー
• 宿泊予約モーダル、flatpickrによる日付選択
• お知らせのタブ切り替え
• Google Mapsの埋め込み
• パンくずリストの構造化マークアップ

制作概要：

和の空気感を表現するため、速度やタイミングを微調整し柔らかなフェードインアニメーションを実装しました。

FLOCSSをベースとしたCSS設計によりメンテナンス性を意識した設計を行いました。