FA EXHIBITION

CODING

制作期間: コーディング：2日
使用ツール: Visual Studio Code
使用言語: HTML5
CSS3(SCSS)
JavaScript(jQuery)

About

本作品は、特定のWebサイトを参考にデザインと機能を忠実に再現する「サイトトレース」に取り組んだものです。
視覚的な要素はもちろん、スクロールに応じたアニメーションの挙動や表示タイミングなど、細部の挙動まで丁寧に検証し、見た目と動作の一貫性を追求しました。
特にJavaScriptについては、動きの多い構成をいかに効率的に、かつ保守性を意識して記述できるかを重視し、無駄な処理を避けつつ滑らかなアニメーションを実現するよう工夫しています。
また、レスポンシブ対応も実装し、デバイスごとに最適な表示ができるよう設計しています。
ただ単に模写するのではなく、実際の制作工程に近い形でコードの質や構成、動作の整合性にこだわりながら実装しました。

デザインカンプはCodejump様からお借りしました。

Design