AI研修・開発事業を手掛ける株式会社SUN様のコーポレートサイトのコーディング（WordPress構築）を担当させていただきました。

法人営業の際に活用するサイトということもあり、「信頼性」と「高級感」を兼ね備えたデザインに仕上げております。

💡コーダーとしてのこだわりポイント

• GSAP＆ScrollTriggerを活用した出現アニメーションとオープニングアニメーション
• スクロールを一時停止させ内容を印象づけるピン止め効果
• 高級感を演出する繊細なアニメーション表現
• 独創的なボタンのホバーアニメーション
• SVGを用いて動画にマスク処理を施し、テキストの塗りつぶしに動画を使用
• 五件づつお知らせを追加表示するボタンの作成
• 背景動画は特定のセクションまでスクロールすることで起動する

まとめ

本案件では、初めて本格的なGSAPアニメーションを実装いたしました。ScrollTriggerを用いたピン止め効果や、洗練された出現アニメーション、印象的なオープニングアニメーションなど、様々な動きを取り入れることで、サイトの魅力を一層引き立てています。

ご覧いただくことで、サイトの持つ上質な雰囲気と専門性を感じていただけましたら幸いです。

デザイン：あーちゃん(@a_chan4design)

ディレクション：りょー(@Ryo_web_cording)

コーディング：こんかい(@konkai_web)