Webデザイナーとして2017年冬アニメの公式サイトを集めてみた
2017年の冬アニメは豊作ですよね！面白いものばかりです(^-^)
さて今回は、アニメ公式サイトを集めてみました。公式では最新情報のほか、声優へのインタビューや壁紙を配布するなど、独自のコンテンツが多いのも嬉しいポイントです。
- 亜人ちゃんは語りたい
- ACCA
- 政宗くんのリベンジ
- クズの本懐
- うらら迷帳路
- AKIBA'S TRIP
- リトルウィッチアカデミア
- ガブリール
- セイレン
- 幼女戦記
- 小林さん家のドラゴン
- この素晴らしい世界に祝福を！
- ONEROOM
- CHAOS;CHILD
- アイドル事変
- 風夏
- たかな的な総評
亜人ちゃんは語りたい
パステルカラーや水玉などを使用したガーリーなデザインです。カード型のレイアウトで情報もきれいに整理されているのが分かります。
それもあり、スマホで見るとそれぞれのコンテンツの境目などがハッキリしています。
あと、僕はバンパイアちゃんが好きです。
ACCA
大きく2色に分かれていてシンプルでおしゃれな印象を受けます。アニメの作風と合っていますね。
ページが切り替わるときのエフェクトもかっこいいです！
スマホでもデザインを生かしつつ伝えるべき情報をしっかりまとめています。
政宗くんのリベンジ
開いたら３カラムで真ん中にメインイメージを用いてインパクトがあります。左にメニュー、右にtwitterやニュースと分類されていてユーザーも困らない仕様です。
ただひとつ、あえてツッコませてください。
この足なんですか！結構スペース使ってますね！？？
ご褒美ですありがとうございます！！
クズの本懐
※スマホ未対応
背景が白でほとんどメインビジュアルが占めています。各ページもあまり派手にしすぎていない、作風の特徴が見て取れます。
ただ、スマホ対応はしていませんでした。好きな作品なので見たかったけど残念！
うらら迷帳路
TBS系のアニメはヘッダーにTBS情報がくるので、自由度が低いんだろうなと思います。あまり動的な要素はないですが、キャラがかわいいので万事OKな気がしてきました。
シンプルが故に分かりやすいという利点もあります。ですがキャラクター紹介などはキャラごとにページが切り替わってしまうので独自のルールみたいなのがあるのかも？と考察してみますｗ
AKIBA'S TRIP
※スマホ未対応
AKIBA’S TRIP -THE ANIMATION- 公式サイト
衣類はがし系アニメなので開くのが楽しみだったのですが、意外にも普通のメイン画像です。黒とビビットな強い色、大胆な枠組みでアメコミ風なテイストですね。
キャラクターページなどのアニメーションも気持ちいいです。ただスマホには対応してないみたいです。
リトルウィッチアカデミア
※スマホ未対応
画像やロゴにインパクトがあっていいですね。他サイトと比べて特徴的なのは、トップページ以外は背景にぼかしがかかっていて、コンテンツとの遠近感が感じられます。
witchpedia(ウィッチペディア)という本編で出た用語などの解説ページなどもあり、アニメの内容をより深められるサイトになっています。スマホ対応じゃないのがおしい！
ガブリール
色がたくさん使われていて可愛らしく楽しいサイトになっています。他のページもいかにも萌え系！という感じで、好きな人はワクワクしちゃう、そんなサイトです。
ニュースのページにはツイッターアイコンが配布されていたり、天使悪魔診断という独自のコンテンツがあるので一度覗いてみては？？
多色配色のデザインは僕は全くできないので参考にしたいサイトです。スマホ版も然りです！
セイレン
こちらもTBSがヘッダーについてます。トップページはシンプルにまとまっています。
SPECIALのページには、ヒロイン3人の紹介マンガが載っています。更に、ヒロインのルート分岐が分かりやすく紹介されていますｗ
こちらも「うらら迷帳路」と同じような作りです。作品はアマガミとは違った良さがありますよねー。
幼女戦記
すごくこわいです。開いたらアニメーションと共に幼女がすごい目で見てきます。背景は黒っぽく、メニューは白で分かりやすい構成です。
ニュースのページには壁紙が配布されているので是非GETされてください！スマホ版でも幼女がすごい目で見てきます！！
小林さん家のドラゴン
どーんと前面にメイン画像が表示されます。配色は緑と白を基本に、ページごとにも色を持たせています。レイアウトもきれいで僕としては参考にしたいものばかりです。
京アニ作品なのでWebサイトも凝ってますね～。あ、僕は京アニ信者です。
この素晴らしい世界に祝福を！
※スマホ未対応
横幅もあまり広くなく、シンプルなサイトです。初めて見た方はキャラクターの作画がおかしいと思われるかもしれません。でもこれがデフォルトなんですｗ
そこに良さがあったりして見れば見るほどハマる、スルメ系アニメです。
シンプルなのに手抜きに見えないのは(手は抜いてないと思います！ｗ)サイトのロゴや文字組みが整っているからだと思います。でもスマホ未対応ですｗ
こちらもSPECIALページに応援バナー、ツイッターアイコンが配布されています。
ONEROOM
開いたら3人のヒロインがお迎えしてくれます。絵師カントクさんが描かれる女の子は魅力的なので、それだけで画面が映えますねｗ
でもデザインも画像の良さを殺さず、うまく色と配置を考えられているのがすごいです。スマホも対応してます。
CHAOS;CHILD
※スマホ未対応
シリアス、グロありな作品なのですが、作風に上手く合ったサイトデザインだと思います。「幼女戦記」もそうでしたが、背景が黒の場合はメイン画像にぼかしを入れて上手く馴染ませるといい感じになるようです。勉強になった！！
アイドル事変
文字や背景のデザインで上手く余白を潰してるなーといった印象です。黄色やピンクが使われていて、活発な印象を与えています。
ピンクのテキストとかをスライドインなどするとその印象をより強くできたかもしれません、とか上からすいません。
本編は、普通にアイドルが政治家やってる日本オワタアニメですｗ
風夏
レイアウトは３カラムで「クズの本懐」や「政宗くんのリベンジ」と同じです。ですがメイン画像によって大きく印象が変わってくるのを感じました。
風夏だけはメイン画像が切り替わる仕様のようです。
たかな的な総評
全体を通して、アニメはWebの世界でも進化してるんだなぁと感じました。アニメのメイン画像を使うことで一瞬でどんなサイトか分かりますねｗ
しかしながらスマホ未対応の作品も多いようです。なにか理由があると思うのですが、やはり昔よりは対応作品も増えてきたと思います。
今回はデザイン視点で紹介しましたが、いずれ何作品かに絞って技術的なところにフューチャーしたいですね！
