こんにちは。LIGでデザイナーをしています、マチルダです。
最近、ぐっと気温も下がり秋らしくなってきましたね。カロリー摂取を抑えるためご飯を豆腐に置き換えていたのですが、食欲の秋到来に伴い耐えられなくなってきました……。気を引き締めていきたいと思います。
そんなことはさておき。Webデザインをする際に、自分で写真やイラストなどの素材を作ることがありますが、案件によっては、クライアントさんから写真やイラストの素材をいただけるケースもありますよね。そんなときは、できる限り「素材」を引き立てるデザインを心がけているのですが、これがなかなか難しい……!(そして楽しい!)
ということで本日はそんなイラスト素材、それも「アニメーションイラスト」に焦点をあてて、素材を活かしつつWebサイトのデザインとしても素敵なサイトをご紹介いたします^^b
『GRAVITY DAZE』公式サイト
http://www.jp.playstation.com/scej/title/gravitydaze/ps4/
PlayStation®4のソフト『GRAVITY DAZE』の公式サイトです。重力を操る(!)という主人公の「キトゥン」を縦横無尽に操作するゲームということで、メインビジュアルで主人公がふわふわ浮いていたり、途中のコンテンツが斜めになっていたりとゲームの世界観を魅力的に表現しています。フラットデザインとグラデーションがキャラクターを引き立てており、とても素敵です^^
▼ 「重力を操る」という世界観をだす斜めのデザイン
西尾維新 公式サイト
小説家・西尾維新さんの公式サイトです。アナログなイメージの原稿用紙と、デジタル感のあるアニメーションを組み合わせ、なんとも不思議で独特な世界観を演出しています。ライトノベルス界隈ではとても有名で、アニメの原作を数多く手がける作家さんということもあり、著作一覧での原稿用紙の上にキャラクターがいる表現が、作家さんの個性を引き出していて参考になります^^
▼ 原稿用紙 × キャラクター
『すべてがFになる』 公式サイト
TVアニメ『すべてがFになる』の公式サイトです。シリーズの累計発行部数が390万部を突破している、森博嗣さんの理系ミステリー小説が原作となっています。いきなり180°回転するメインビジュアルと、エッシャーの騙し絵を想起させる背景は、「密室殺人」がテーマとなっている本作の世界観に一気に引き込まれます。
鉛筆画調で描かれている登場人物の線があることで、サイト全体にメリハリがついていて勉強になりました^^
▼ 「密室殺人」を連想させるエッシャーの騙し絵のような背景
「Clearasil×KAGEROU PROJECT」コラボ企画サイト
スキンケアブランドのClearasilとカゲロウプロジェクトのコラボ企画サイトです。こちらのサイト、一番下までスクロールすると……なんとサイトがジャックされてしまいます! また、キャラクターたちが商品の使い方をレクチャーしてくれるのですが、普通の商品説明よりもなぜか引力があり全部読んでしまいました……。
イラストにあった配色やフラットなデザインもさることながら、こういったキャラクターを活かした企画がとっても素敵です^^
▼ だんだんサイトがジャックされていきます……!
『ピンポン』公式サイト
松本大洋さん原作の『ピンポン』のTVアニメ公式サイトです。残念ながら放送は終わってしまいましたが、サイトは残っています。横スクロールで流れるイラストがとても素敵です。キャラクターをホバーすると名前、クリックするとアニメーションがフルスクリーンで再生される、とてもダイナミックな表現で作品の魅力が伝わってきます^^
今回の記事と全然関係ないのですが、松本大洋さんの『竹光侍』も面白いので、興味のある方はぜひ。
▼ フルスクリーンで再生される、迫力たっぷりのアニメーション
まとめ
いかがでしたか? もとの素材を活かしつつ、Webならではのデザイン表現で演出しているサイトは、見ているだけでもとても勉強になりわくわくしました^^ 今後も素敵なサイトを見つけたら発信していきますので、末長くよろしくお願いいたします!
最後までお付き合いいただき、ありがとうございました。それでは、また!
・
・
・
【株式会社LIGについて】
わたしたちは年間150を超えるWebサイトをリリースしている、東京上野のWeb制作会社です。もちろん、アニメイラストを活かした制作実績も!Webサイト制作のご相談はこちらより、お気軽にお問い合わせください。
LIGはWebサイト制作を支援しています。ご興味のある方は事業ぺージをぜひご覧ください。