ポートフォリオ用に作成した架空の英語教室のサイトです。
しょーごログさんのコーディング課題(中級Ex)として提供されたものを提出後、ポートフォリオ用にカスタマイズしたものです。
オリジナル化した後1回目の提出ではいくつか指摘がありましたが、再提出にて問題なしとの評価をいただけました。
カスタマイズについては下記の通り進めました。
使用したツール
- Figma(サイト全体の構成)
- Photoshop(画像の加工)
- Visual Studio Code
カスタマイズの内容
- 元のデザインが採用サイトで、かっちりとした作りだったのを活かし、英会話教室のサイトとした。
- ターゲットは、さらなるスキルアップを目指す20代の男女を想定。
- 信頼性や知性を感じつつも、新しい一歩を踏み出せそうな前向きな明るさを感じられるカラーとして、2024年のトレンドカラーに上がっていた「Hello!Blue!」を取り入れた。
工夫した点
- コースの一覧部分ではマウスポインタを当てると少し拡大表示するなど、動きをつけることを意識した。
- 学校名や学校の理念、コース詳細などはChatGPTを活用することでスムーズに進めることができた。
- 入力フォームについては、自動入力機能や入力値に応じたキーボードの指定を行い、できるだけ入力しやすいフォームになるように心がけた。
ギャラリー