デザイン /

マンガっぽい表現を使ったWebサイトまとめ

実制作でマンガっぽいデザインをする機会があり、探したところまとめられているサイトが意外と少なかったので今回のテーマにあげさせていただきました。
あくまで「っぽい」なので、イラストを全面に出したようなデザインは避け、写真や素材を使って「マンガっぽさ」を出しているサイトを集めました。

それでは早速行ってみましょう!

  
浪人ヴォーカル 超特急コーイチの大学受験チャレンジ
  浪人ヴォーカル 超特急コーイチの大学受験チャレンジ  

進学塾のスペシャルサイト。
コミカルな演技の写真とマンガっぽい吹出しやコマ割りのようなレイアウトなどでマンガっぽさが出ています。侍の和なイメージとマンガの墨文字があっていますね。

  
日新焼そばU.F.O スペシャルサイト
  日新焼そばU.F.O スペシャルサイト  

日新の焼そばU.F.O スペシャルサイト。
こちらもコミカルな演技が効いてますね。吹出しに入っている言葉もどことなく、少年ジャンプ的な雰囲気が漂っています。ターゲット層にヒットしそうなデザイン。

  
ママンカ市場
  ママンカ市場  

下北沢にあるコミュニティ的な市場、ママンカ市場のWebサイト。
コラージュ写真に落書きをしたようなテイストで、今までふたつが「ジャンプ的」であったのに対し、もう少しイラストよりというか、女性的なあしらいになっています。小さな人の切り抜きにもひとつひとつ落書きがされているのが良いですね。

  
面白法人カヤック
  面白法人カヤック  

面白法人カヤック。
ここはマンガっぽいデザインで有名ですね。Hover時や目立たせないところなどに効果的にマンガテイスト(集中線やキラキラ、擬音など)を使い、アクセントとしてうまく取り入れています。また、text-shadowをうまく使って文字の輪郭線を取っているのも参考になります。これもジャンプ系ですね。

  

番外編

  

マンガ風デザインをする際に良さそうな商用利用可の素材などをまとめてみました。
※実際に使用する際は各サイトの利用規約をご覧のうえ、自己責任でお願いします。

 
フリーデザイン素材「漫画祭りだよ!バキバキ!」
  漫画祭りだよ!バキバキ!  

擬音や集中線などのフリー素材集。クオリティーが高く、何よりアウトラインデータなので加工が楽!

  
ジョジョフォント
  ジョジョフォント  

読んで字のごとく、ジョジョっぽいフォントです!

  
マンガ素材辞典β
  マンガ素材辞典  

マンガ風の素材を集めたサイト。数がたくさんあるので使える!

  

まとめ

  

いかがだったでしょうか?
マンガ風デザインは使いどころによっては安っぽく見えてしまったり、ふざけすぎた印象を与えてしまうかもしれませんが、うまく使うことで、非常にインパクトのあるデザインになると思います。
ぜひ参考にしてみてください!

この記事を書いた人

斧山洋平

PAGE TOP