Other||elephant_admin

「侵食感」を存分に表現したbacterのWebサイト紹介

SHARE THIS ARTICLE

先週公開した記事「映像のジャンルではなく、“作風”を示したかった」bacterの原点を振り返るではbacterという取り組みの原点や歴史を振り返りました。今回はその中で少しだけ触れたWeb制作へのこだわりと、メディアとしてのbacterについて、より詳細にお伝えできればと思っています。

世界的なデザインアワードでいくつも賞を受賞している

実はこのbacterのWebサイトは、下記のような世界的なデザインアワードで賞を受賞しています。

Awwwards – Honorable Mention
CSS Design Awards – Special Kudos
・DesignAwards Asia – Design Of The Day
・CSS Winner – Site of the Day

(Web制作を担ってくださったのは株式会社LIGさんです)

Web制作前のキックオフの段階で「かっこいいサイトにしたい」「これまでにない、何年先も先端にいるようなサイトしたい」など抽象的で難題なオーダーをさせていただいたのですが、制作していただいたこのサイトがまさか世界的に評価されるとは。

想いとこだわりの詰まったWebサイトなので私たちにとっても喜ばしいことです。

重要視したのは「侵食感」を表現すること

クリエイターによりフィルタリングされた作品は、独自の解釈と想像力、
無数の技術により、姿、形を変えて人々の感覚に侵食していく——

このコンセプトの元、細菌を意味する「バクテリア」から「bacter」は名付けられています。

細菌のようにじわじわと作品が広がっていく「侵食感」は、Webサイトの各所で表現されています。

■トップページの渦の侵食感

浮かんでは消え、消えては浮かぶ文字——「Creative Infection」。

画面上でカーソルを動かすと、回転する渦が追随してきます。まるで生き物のようにじわじわと動く様は、「侵食感」を追求していただいたポイントです。

■ 世界観を表現したオリジナルのBGM

bacterを開くと流れてくる特徴的なBGMは、オリジナルで制作していただいたものです。こちらも無限に侵食されていく様を表現しており、上述した渦のモチーフもこのBGMに合わせて鼓動する表現が盛り込まれています。

よかったらトップページでカーソルを動かしてみたり、BGMとの連動を確認してみたりして楽しんでください。

■ 画面遷移にもこだわりがある

PROJECTやMAGAZINEから各コンテンツページへ遷移など画面遷移には、画面の四方からじわじわと黒い煙のようなもので覆われていく「食っていく」表現が採用されています。没入感を大事にした表現です。

メディアとしてのbacter

毎月、映像作品を公開しているbacterですが、作品や制作にまつわる記事もあわせて公開しています。

どんな想いやこだわりをもって映像を作ったのかディレクター本人が記事を書いて伝えたり、ディレクターインタビューを実施ししたりしています。記事をご覧いただくと、その作品に込められた意味、こだわりも感じられより楽しんでいただきやすいかもしれません。

サイト内の「MAGAZINE」のコーナーでご紹介しています。


映像作品や記事はもちろんのこと、bacterのこだわりが随所に詰まったWebサイトもあちこち楽しんでもらえたらうれしいです。

Web制作をしてくださったLIGさんも、サイトリリース後にこんな記事も書いてくださっています。(ゼロをイチにしていく苦しみが綴られています!)

最高のアンサーにまたアンサーしたい。エレファントストーンさまの制作について綴る。