URL
スキル・ツール
HTML5/CSS3・javascript(jQuery)・figma・illustrator・Photoshop
目的
ITスクールの受講希望者へサンプルとして提供するWebサイトをデザイン・コーディングまで一人で
■ローカル環境で利用するためHTML,CSSメインでPHP、WordPressなどは使用しない
■LP形式ではなく多層のサイトで
という指定あり
コンセプト
暖かく落ち着ける印象を与えられるように
デザインについて
暖かさを想起させる色とそれ以外の差を激しくならないように一致させるのに苦心した
白を2パターン使用し淡い中にメリハリをつけた
バックグランド画像をサイズに合わせず読み込ませることで、アコーディオンを開いた際に背景が擬似的に変色する効果を狙う（設備ページ）
スクロールでヘッダーの色が変わるように、スマホ用にはヘッダーではなくメニューバーを最下部に設置
スマホの閲覧者が優先して知りたいであろう料金とアクセス、電話問い合わせボタンを表示
コーディングについて
メインビジュアル及びフッターに湯気が出てくるアニメーションを実装