ファーストビューであるtopの背景に動画を差し込むことで動きを出し、【私について】の部分でパララックスを使用することで奥行きを持たせました。 また、topから文章があるセクションに行く際にスクロールすると背景動画にクリーム色(#FFFBF2)のオーバーレイがかかっていく仕様にして可読性を上げました。 パララックスはモバイル端末だと動きが心地悪くなってしまうためモバイル端末を検知しオフできるように設定しております。
MV以降の自己紹介は簡易的にして詳しくご覧いただく場合は【and more】よりご覧いただけるようにして、スキル・作品集へ早く目がいくような設計を心がけました。
年表はPCは横スクロール、モバイル版は縦スクロールで設定し見やすさを意識しました。
TOPにデザインカンプのコラージュを配置することにより、まずはサイトのイメージを掴んでいただくよう意識しました。デザインカンプ部分は縮小表示されていて見づらい部分もあるためクリックすると拡大表示されるようにしております。
横向きのサイトにチャレンジしよう!と、デザインカンプ作成時は横向きの仕様でしたがコーディング作業の際、ウィンドウ幅を狭めた際の横幅の設定がうまくいかず泣く泣く断念しました・・・今後リベンジしていきたいです。