皆様はじめまして、アニメ・ゲームをこよなく愛する
サブカル女子担当のWEBデザイナー久保です。
どうぞよろしくお願いいたします。

 

いきなりですが、最近はサブカルコンテンツがすっかり市民権を得た印象ですね。

動画サイトやSNSの普及もあり、世界中に日本のコンテンツが影響を与えているのが見てとれます。

また、スマートフォンやタブレットで携帯ゲーム・漫画・アニメーションが場所を選ばず、楽しめるようになりました。

 

みなさまは、最近話題のアニメーションにふれたことはありますか?

最近のアニメーションは番組のみならずWEBサイトにも力を入れてきているようなので

一緒に見ていきましょう!

レビュー

サイコパス

サイコパス

http://psycho-pass.com/

まず1つめのサイトは最近劇場版化したサイコパスです。

ーあらすじー

人格が数値化できるようになった未来。
刑事課に配属された常守朱(つねもりあかね)に手渡されたのは、「犯罪係数」という数値によって犯罪者を裁く銃—ドミネーターであった。

このWEBサイトは、作品のストーリーに沿った、クールで迫力のあるリッチコンテンツを構築するため、Flashを採用しているようです。

ブラウザを選ばずPC環境にて腰を据えて、しっかり伝えたいという意図が伝わってきますね。

さてそれではサイトなんですが

サイコパスの世界観を昇華させたトーン&マナーのWEBサイトに仕上がっています。

マウスカーソルにエフェクトがかかっていたり、画像をホバー時のアクションが新鮮で、

デザインだけでなくギミックにもすごく力入れてるなというのが印象的です。

サイコパスSPサイト

サイコパススマホ

http://psycho-pass.com/sp/

スマートフォンサイトは、PCサイトのデザインや世界観を損なわないように注意しつつ、

制限された環境で閲覧することを前提にストレスのない作りになっています。

 

サイコパスのWEBサイトは、見る人がアニメの中にいるように錯覚をさせるデザインでした。
作品を知らない人が訪れても、その世界観が興味が惹かれるサイト作りに成功しているのではないでしょうか

ソードアート・オンライン

ソードアート

http://www.swordart-online.net/

さて2つめはソードアートオンラインのWEBサイトを見ていきましょう。

ーあらすじー

2022年、ソードアート・オンライン(SAO)というゲーム世界に直接入り込むゲームが発売された。
主人公キリトはゲーム内で閉じ込められたことに気付いた。
脱出する唯一の方法はゲームのクリアであること、
そしてゲーム内で死んでしまった場合には現実世界での死が訪れることを告げる。

サイトに入った瞬間アニメサイトとは思えないクオリティで驚きました。

こちらもサイコパス同様、ソードアートオンラインの世界観がすごくWEBサイトに表れていると思います。

メニューをホバー時、点滅して色が変わったり、メインビジュアルを押したときにメニューが一回画面から消えたりする所など細かいところへの情熱が感じられます。

 

一番気になるメインビジュアルの動きは、ホバーした時と時間で画像の幅を変えてスライドしているように見せていますね。

ファンもそうでない方も期待感を持てるデザインです。

ソードアート・オンラインSPサイト

ソードアートスマホ

http://www.swordart-online.net/sp/

スマートフォンでこの動きをどう再現するのか気になるところでしたが、こちらは横スクロールで表現されていました。

デザイン性の高さは相変わらず変わりませんね。

 

ソードアートオンラインのWEBサイトは、メインビジュアルを大きく見せているのですが

その絵がアニメ絵とは違い、原作絵なのでアニメだけではなく原作のライトノベルをもっと見てる人に伝えたいという思いが見受けられました。

冴えない彼女の育てかた

冴えない彼女

http://www.saenai.tv/

さて3つめは、冴えない彼女の育てかたのWEBサイトを見ていきましょう。

ーあらすじー

主人公の安芸倫也は、豊ヶ崎学園の2年にして、ディープなオタク。
桜の舞う坂道で出会った少女に興味を抱き、
彼女をメインヒロインのモデルにした同人ゲームの作成を思いつく。

私見申し訳ありませんが、このアニメは私的に今期一番おすすめです!

はい。では戻ります。

このWEBサイトはメインビジュアルに桜が舞っています。

感心したのは、メインビジュアルが1枚画像かと思いきや、登場人物ごとにレイヤーが分かれていますね。

以上によって奥行きを感じさせる作りになっています。

確かによく見ると桜がキャラの後ろに隠れたりしてます。ディティールへの並々ならぬ情熱が感じられます。

まとめ

最近のアニメーションのWEBサイトは作品に負けず劣らず、凝ったものがたくさんあることは発見でした。

今後ももっと注目していきたいと思います。

普段あまり触れることのないデザイナーのみなさんも、もっとサブカルチャーに触れてみてはいかがでしょうか。

意外な新しいアイデアなどが生まれてくるかも。。。。!?