イラストを効果的に取り入れたWebサイト5選

ブログ

2019.05.08 Webデザイン

イラストを効果的に取り入れたWebサイト5選

最近、イラストを活用したWebサイトが増えてきていますね。

イラストがかわいいだけで、ついついそのサイトに魅入ってしまいます。

そこで今回は、イラストを効果的に取り入れた魅力的なWebサイトをご紹介していきたいと思います!

Glad Cube

Glad Cube

こちらはコンサルティング会社のWebサイトとなっています。

アイソメトリックという技法を用いたイラストを使用しています。

アイソメトリックとは

  • 「アイソメトリック・プロジェクション(Isometric Projection)」を略した言葉で、日本語では「等角投影法(等角投影図法)」と呼ばれている。
  • 建築物や工業製品を立体的に描くときによく使われる図法。
  • 縦・横・高さの三方向を120°ずつになるようにし、パースを使わずに描く。

このようなイラストは最近よく見かけることが多いですが、立体的なイラストがアクセントとなって魅力的ですよね。

特にこちらのサイトは素材感など細かいところにもデザインが組み込まれていて、見ていてとても楽しい仕上がりとなっています。

IT企業やコンサルティング会社様などで、抽象的な事象をわかりやすく視覚化し、なおかつ親近感を持たせたい!というときにはぴったりのイラスト表現ではないでしょうか。

HOPPIN’ GARAGE

HOPPIN’ GARAGE

全面にイラストが散りばめられていて、見ごたえのあるサイトとなっています。
フォントなどもイラストのテイストに合わせてとてもかわいいです。

男性の頭の中からイラストがバーンっと出てくるときは何が起こるんだ!?という期待感もありますね。
スクロールするとイラストがどんどん出てきて楽しい!

キャッチコピーとマッチしたイラストのアイディアで、思わず参加したくなるようなサイトに仕上がっています。

FESSI

FESSI

こちらは社交ダンス教室のWebサイトです。
ダンスを楽しむ2組の男女のイラストが描かれています。

静止画だけでもフラットでお洒落な雰囲気が漂っていますが、なんとこちら、イラストにカーソルを合わせると男女が踊り始めるんです!

なめらかにダンスしているので、ついじっくり魅入ってしまいますね。

色使いも上品で、2つのコースの分類が分かりやすく視覚化されています。ユーザーから見ても楽しく使いやすいサイトとなっているのではないでしょうか。

HATCH

HATCH

これまで紹介してきたイラストとは少しタッチの異なるイラストを使用しているサイトですね。
どこか昔のディズニーを彷彿させるイラストとなっています。

このようなモノクロのイラストはポップになりすぎず、シックにまとめられると思います。
特にこのサイトのイラストは、それだけでも成り立つようなクォリティの高いものなのでWebサイトとしての重みが増しているような気がします。

アニメーションになっていて、ストーリー性があるのでずっと眺めていたくなりますね。

Renoca

Renoca

こちらは車を扱っているFLEXという会社の特設サイトですね。

いままでのイラスト表現とは少し違い、写真を加工してイラストっぽく見せているのかなと思います。

クラシックな雰囲気というか、ヴィンテージ感があふれていておしゃれなサイトに仕上がっています。
シンプルかつかっこいいのはさることながら、車がきちんと主役になっていて、とても素敵です!

イラストを使ってみたいけどポップな雰囲気にはしたくない、という場合、このような手法を使ってみるのもありではないでしょうか。

おまけ

STRIPE Int´l

STRIPE Int´l

こちらはストライプインターナショナルという会社のWebサイトです。

長場雄さんというイラストレーターさんのイラストが使用されています。
実は私、長場雄さんのファンでどうしても今回紹介したかったので取り上げさせていただきました(笑)

有名なイラストレーターさんのイラストが使用されているのを見ると、やっぱりテンションが上がりますし、さらに雰囲気がマッチしているとWebサイトとしても魅力も増しますよね!

このサイトにはこのイラストレーターさんがぴったりだ!と思ったらお願いしてみるのも手かも?(笑)

まとめ

いかがでしたでしょうか?
今回はイラストをうまく取り入れたWebサイトについてご紹介して参りました。

イラストを効果的に使うことによって、親近感を持たせることができたり、ブランディングに役立たせることができます。

ぜひ参考にしてみてくださいね!

CONTACT
お問い合せ・お見積りはこちらから
  • 03-6279-3013 お問い合わせは 月~金 10:00~19:00

  • メールでのお問い合せはこちら