ものづくり補助金・小規模事業者持続化補助金など各種補助金申請の支援サービスをはじめました

百貨店キャンペーンサイト制作のコーディング支援

Webサイト
Javascript
Client

D 様

Role
フロントエンド

百貨店のキャンペーンサイト制作のコーディング支援をさせていただきました。

お得意様だけに招待があるキャンペーンを、店舗でタブレットを利用して直接お客様にご案内するようで、タブレットとスマートフォンをメインとしたWebサイトになります。

制作環境について

制作期間

約1.5ヶ月

担当

フロントエンドコーディング

主な言語・ツール・サービス

  • html(Pug)
  • CSS(Sass)
  • Javascript

コメント

キャンペーンサイトということで、演出を多く取り入れた制作になりました。

最初に表示されるウェルカム画面ではVimeo APIを利用した動画を流し、演出のSKIPボタンを押すとトップページの背景にウェルカム画面の動画の続きが背景として表示されます。

ファーストビューはタップ感知でその下のコンテンツが斜めに迫り上がるように出現する演出なのですが、ファーストビューにかけたマスクの値を変化させて表現しました。

他にもスクロールアニメーションでタイトルとギャラリーが表示され、表示後に文字を1文字ずつ回転させたりと特別なキャンペーンに相応しいリッチな演出に仕上がりました。

 

お問い合わせContact

やりたいことも課題も、
ぜひお気軽に聞かせてください。

「まだ決まっていない」
「相談からはじめたい」という方も
アイディア段階から一緒に
想造させていただきます。