男性向けのかっこいい車の世界をアニメーションで表現（IRO様）

男性向けの車のメンテナンスを行っているIRO様のサイトを制作させていただきました。
通常デザイナー様からご依頼を受けることが多いのですが、今回はブランディングを得意とされているNOAU blanding様からご相談いただき、デザイナーのnobinobi design様と3組織でチームを組んでサイト制作を行いました。
その中で私は構築を担当させていただきました。

小田原のコーティング・洗車専門店...

小田原のコーティング・洗車専門店 IRO | 愛車を美しく守るプロの技 IROは小田原エリアで愛車の洗車・コーティングにこだわる専門店です。経験豊富な情熱あるスタッフが細部まで丁寧に仕上げ、お車を美しく保つための最高のケアをお届けして...

サイトの依頼内容

• 使用CMS：WordPress
• 使用テーマ：オリジナルテーマ
• 依頼ページ：全ページの実装
• デザイン：nobinobi design様が作成したデザインを構築させていただきました。
• 仕様：デフォルトの投稿や固定ページだけではなくカスタム投稿及びカスタムタクソノミーを使った実装をしております。
• アニメーション：かっこいい男性向けのサイトなので、そのカッコよさが引き立つような早めの動きのあるアニメーションを提案させていただきました。

アニメーション

FVのスライダーアニメーション

FVのスライダーは、単に画像が切り替わるだけでなく、ゆっくりと左右に動くようにしております。1枚ごとに右へ、次は左へと交互にスライドしながら切り替わることで、少し動きのある表現をしています。
ここはお客様とも細かく調整した部分です。

ローディングアニメーションおよびページ遷移アニメーション

ローディングは目を引く動きを入れたかったので、黒と赤のレイヤーが幕あけするようなアニメーションを実装させていただきました。
ローディングだけでなく似たような動きをページ遷移時にも実装させていただきました。

見出しのアニメーション

見出しにも目につくような動きを入れたかったため、赤い帯が右に消えて動くようなアニメーションを実装させていただきました。
また全体的に少し早めの表示アニメーションも入れております。