BiNDとLiVEでホラー映画の公式サイトを作ってみる

暑い日が続きます。暑過ぎます。
如何お過ごしでしょうか。お相手は既に夏バテ中のコウで御座います今日は。

実は近々公開予定のWebフォントに関するとあるサイトがありまして、其処に掲載するサンプルBiNDサイトを制作中なのですが、副産物的に面白いサイトが出来ましたので此方でお披露目したいと思います。
と云いますか、サイトの監修をしているF女史(ホラーが苦手)に見せたところ一発NGで池尻デイズ行きを言い渡されました。お気持ちはよくワカリマスが。

と云う訳で、夏に因んでちょっとホラーな趣旨の映画オフィシャルサイトを想定して作ってみました。
BGM付きなので音量にお気をつけ下さいませ。(スマートフォン環境では音は流れません)

サインプルサイトを見る

先ずメインの画像ですが、スライドショー機能「SHiFT for WebLiFE*」の「ページ背景」→「背景がスライドショー(センタリング)」を使用しています。
スライドショーを用いる事で廊下の不気味な写真が時間と共に赤く変わり人の顔が浮かび上がって来ます。

img_01

テキストは全て「TYPE for WebLiFE*」によるWebフォント「マティス」を使用しています。
タイトル部分にグレーのシャドウを薄く敷く事で、文字が滲んだ様な効果が出て、より一層不気味さが演出出来たと思います。
レイアウトや文字装飾はCSSを用いて表現しています。つまりカスタムタグで御座います。

img_021

BGMは以前「”エクソシスト”とか”かまいたちの夜”みたいな曲」と云うよく解らないオーダーで私が作曲したものをLiVE連携機能「LiVE Connect」で貼付けました。
サウンドのon/offも搭載されているのでユーザービリティ的にも親切な作りだと思います。

img_03

こんな感じでBiNDでも意外とインパクト重視なサイトが作れるものだなぁと改めて感じた次第です。
近日公開される本編のサンプルサイトはもっと爽やかな作りとなっておりますが、実は基本的なフォーマットは全く一緒だったりします。
サンプルサイトデータをプレゼントする話も社内で出て来ておりますので、楽しみにしていてくださいね。
現状Webフォントは最大150書体ですが、今後も増えて行く予定で、近々デザイナー愛用の有名フォントの追加もあるとか。そちらもお楽しみに。

因みにタイトルやキャッチコピーは弊社PMが、フライドポテトの皿をケチャップの海にしたPGにツッコミを入れたお話に由来しておりまして、ホラーとは何ら関係は御座いません。背景に浮かび上がって来る顔はそのPMの顔となっております。
それではまた次回お逢い致しましょう。

BiNDup GuideBook

Web作成サービス「BiNDup」の最新ガイドブック。サイトを外注せず自作する方のために制作から集客までできることをまとめました。

今すぐ資料をダウンロード

あわせて読みたい