TOP

コーディング〜WordPress化

◆Topページ
・WORKS：スライダー(スライダーの画像、タイトル、タグは管理画面から変更可能)
　splideを使用しています。プログレスバーは動的に処理しています。

・PRICE：タクソノミーを使ってタブ切り替え、値段と内容はカスタムフィールドで実装

・CONTACT：Contact Form７を使用し実装

◆WORKSページ(制作実績一覧ページ)

・タグはカスタムタクソノミーを利用して動的に表示しています。

・アーカイブページあり。

◆DETAILページ(制作実績個別ページ)

◆ローディングアニメーション
・cookieを利用し、1日1回のみローディングアニメーションが動作するよう実装しています。
・ブラウザのシークレットモード、プライベートモードでページにアクセスいただくと再度ご覧いただけます。

◆スクロールアニメーション
・Javascriptを使用しています。ヘッダー中央のロゴがスクロールの大きさにに応じて回転するアニメーションです。

◆フェードインアニメーション
・SERVICE、PRICEセクションはGSAPでフェードインアニメーションを設定しています。スクロールで戻るとアニメーションが逆再生されます。

◆フリップカードアニメーション
・回転しながらフェードインするアニメーション、マウスホバー時に回転するアニメーションです。カードの表と裏で違う画像を設定することも可能です。

◆ドロワーアニメーション
・ドロワー開くとき、閉じるときにそれぞれわずかに違うアニメーションを実装をしています。フェードイン、フェードアウトのタイミングの調整ひとつでそれぞれ違った印象に仕上げています。

2-3週間