ChatGPT搭載型チャットボット製品のLP
サイト情報
※basic認証をかけているためお手数ですが、URLクリック後ユーザー名とパスワードのご入力をお願いいたします。
サイト : https://kiyo-log.conohawing.com/CogniChat/
ユーザー名: kiyo_admin
パスワード: CogniChat_1
※クライアントから風評の懸念を考慮し、以下の条件であればbasic認証をかけた上で自身のサーバー上で公開する分には実績として掲載して構わないと許可をいただきました。
- URLを載せない
- 代表の写真を別のものに差し替える
- 会社情報をダミーのものに差し替える
- 製品名、ロゴをダミーのものに差し替える
ですので、デザインは提供されカンプ通り作成しましたが、上記の通り写真や会社情報、製品名、ロゴは私の方でダミーのものに差し替えております。
_____________________________________________________
制作概要
制作時期:2023年8月
制作時間:総計約25時間
制作内容:Figmaカンプコーディング
ページ数:3ページ
サイト構成:トップ(ホーム)/ 会社情報 / お問い合わせ
使用ツール:VScode、Figma
使用スキル:HTML、CSS、Sass、JavaScript、jQuery、GSAP
_____________________________________________________
実装した機能、工夫したこと
・画面幅に合わせてフォントサイズや余白が自動で可変するように実装
・jQuery を用いてドロワーメニュー、アコーディオンパネルを実装
・GSAPを用いてファーストビューの吹き出しを上から順番にフワッと表示させるアニメーションを実装
・Javascriptを用いてお問い合わせボタンを押した際のボタンの非活性化、ローディングと併せて4秒の待機処理を実装
_____________________________________________________
トップページ(pc)外観
_____________________________________________________