【2020年版まとめ】Webデザイン・LPデザイン制作の参考サイト



【2020年版まとめ】Webデザイン・LPデザイン制作の参考サイト

デザイナーにとって、日頃からたくさんのデザインを見て自分のデザインの引き出しを増やすことはとても大切です。

また、Webデザインを勉強するとき・デザインを制作するときにも、インスピレーションを求めて参考サイトを探している方も多いかと思います。

今回は、フリーランスのWebデザイナーとして活動しているわたしが日頃チェックしているギャラリーサイトをご紹介します。 更新頻度が高く、最新のデザインが追加されているサイトのみ選びました!

ぜひ、ご自身のデザインにインスピレーションと学びをプラスしてください。

目次
  1. Webデザインギャラリーサイト8選
  2. 1.スマホファーストで探せるシンプルな構造『Responsive Web Design JP』
  3. 2.スマホファーストで探せるムダのないシンプル構造 『bookma! V3』
  4. 3.LP・スマホファーストなど自由に探せる『Web Design Clip』
  5. 4.高品質でポートフォリオも多数『MUUUUU.ORG』
  6. 5.最新デザインが多い『SANKOU!』
  7. 6.圧倒的ボリューム『S5-Style』
  8. 7.オールラウンダーなデザインギャラリー『Pinterest』
  9. 8.世界的に有名なアワードサイト『Awwwards』
  10. LPデザインギャラリーサイト2選
  11. 1.スマホファーストもOK。圧倒的な掲載数『LPアーカイブ』
  12. 2.キャッチコピーを一覧で見られる『LPadvance』
  13. バナーデザインギャラリーサイト
  14. 2.『SANKOU! banner ver.』
  15. 最後に:質の高いデザインをたくさん見ましょう

目次

  • Webデザインギャラリーサイト8選
  • LPデザインギャラリーサイト2選
  • バナーデザインギャラリーサイト2選
  • 最後に

Webデザインギャラリーサイト8選

1.スマホファーストで探せるシンプルな構造『Responsive Web Design JP』

Responsive Web Design JP

日本国内の秀逸なレスポンシブWebデザインを集めたギャラリーサイト 

Responsive Web Design JP

検索:カテゴリやタグなど自由度が高い

【おすすめポイント】 

  • スマホ ・タブレット ・ パソコンの表示を並べて見られる
  • サムネイルをクリックすると外部サイトに遷移するシンプル構造
  • 類似デザインのリスト表示

「レスポンシブ」と名乗っている通り、スマホ ・タブレット ・ パソコンの表示を一覧表示で見られます。 それぞれのデバイスでの表示を一目でチェックできるのは、とても便利ですよね!

スマホファーストのデザイン制作でイメージがわかないときは、まずこのサイトで探すと何かヒントが見つかると思います。

一覧表示の「+MORE」をクリックするとサイトの詳細紹介ページに入ります。 この詳細ページでは、類似のサイトのリストを表示してくれるので、同じ系統の参考デザインをたくさん確認したいときにとても便利です。

2.スマホファーストで探せるムダのないシンプル構造 『bookma! V3』

bookma!

感性を刺激するWebデザインギャラリー

bookma!

検索:キーワード検索のみ

【おすすめポイント】

  • スマホ ・ パソコンの表示が横並びで表示されている
  • とにかくシンプルでムダがない
  • 広告がなくスッキリと見やすい

スマホ ・ パソコンの表示を横に並べたレイアウトで、スマホファーストのデザイン制作時にもとても便利。 スマホ ・ パソコンのどちらかに絞って表示することも可能です。

カテゴリーやタグ検索が省略されていて、キーワード検索のみというシンプルな構造。 他のギャラリーサイトに慣れている人には、少し使いづらく感じるかもしれません。

しかし、掲載されているサイトは目を引く印象的な高品質サイトばかりです。 時間をかけてでもじっくりと見る価値のあるギャラリーサイトですね。

3.LP・スマホファーストなど自由に探せる『Web Design Clip』

Web Design Clip

Webデザイン制作の参考になる国内のWebデザインリンク集

https://www.webdesignclip.com

検索:豊富な検索方法で探しやすい

【おすすめポイント】

  • スマホファーストで探せる
  • LPデザインも多数掲載
  • 『国内』『世界』『LP』『スマホ』の切り替えができる

とても洗練されたクリエイティブなサイトが多数掲載されているギャラリーサイトです。

メニューバーの切り替えひとつで、LPデザインやスマホデザインの一覧に切り替えられます。 『国内』『世界』『LP』『スマホ』それぞれの中でカテゴリやタグ・カラー・レイアウトなどの検索ができるため、自分の見たいものをピンポイントで探し出すこともできますね。

詳細ページでは、サイドバーエリアで類似のサイトのリストを表示してくれます。 同じ系統の参考デザインをたくさん確認したいときにとても便利ですね。

4.高品質でポートフォリオも多数『MUUUUU.ORG』

MUUUUU.ORG

クオリティが高い縦に長いサイトを厳選して集められている

http://muuuuu.org/

検索:カテゴリ分けが細かい

【おすすめポイント】

  • カテゴリ分けが細かくて検索しやすい
  • 実務の参考になる高品質のサイト
  • ここ見れば何かあるだろうという安心感

厳選された縦長サイトのWebデザインギャラリーサイト。 ページ移動なくスクロールで見られ、ストレスなく多くのサイトを見やすい構成になっています。

カテゴリ分けがとても細かく、具体的に探しているデザインの分野が決まっているときには非常に便利です。

また、ポートフォリオサイトも多数掲載されているため、ポートフォリオサイトの参考サイトを探している人にもおすすめです。

安定して高品質なギャラリーサイトなので、このサイトを見れば何かインスピレーションが得られるという安心感があります。

5.最新デザインが多い『SANKOU!』

SANKOU!

質の高い厳選の最新サイトが掲載されている

SANKOU!

検索:豊富なタグとフィルターで最強の検索力

【おすすめポイント】

  • 検索タグがかなり豊富
  • フィルター機能で組み合わせ検索が可能
  • 更新頻度がかなり高い

国内のセンスのいいデザインを高頻度で掲載しているギャラリーサイト。

「ステキなバナー・ボタン・メインビジュアルあり」 「奇抜・めずらしい・派手な配色」 など少しユニークなタグも用意されています。 検索にはフィルター機能があり、複数タグを組み合わせて検索できます。

他のギャラリーサイトでは見つけられなかったデザインが、簡単に見つけられるかもしれませんね。

かわいいデザインの参考になるサイトが1番多く掲載されているため、個人的にとてもお世話になっているサイトです。

6.圧倒的ボリューム『S5-Style』

S5-Style

とにかく圧倒的な掲載数とクオリティの高さ

S5-Style

検索:AND・OR検索が可能で自由度が高い

【おすすめポイント】

  • 圧倒的な掲載数の多さ
  • AND・OR検索で検索しやすい
  • お気に入りのサイトを登録できる

掲載されているサイトもこのギャラリーサイトも、とにかくハイセンスでおしゃれなデザイン。 最新のクリエイティブなサイトをたくさん見たいときに、とてもおすすめ。

更新頻度は高くはありませんが、掲載数は圧倒的に多くクオリティが高いため、すべてを見るには相当な時間がかかるほどです。

AND・ORでの検索が可能なので、自分の見たいデザインをピンポイントで探せるのが魅力。

一覧のサムネイルのスターのアイコンをタップするだけで、そのデザインをお気に入りに登録できます。 ログインの必要もないので、とても手軽ですね。

7.オールラウンダーなデザインギャラリー『Pinterest』

Pinterest

国内外のユーザーが画像を投稿していく定番サイト

Pinterest - ピンタレスト

検索:キーワード検索

【おすすめポイント】

  • ユーザー投稿型で幅広い内容
  • お気に入りをまとめて『ボード』としてグループ化できる -ジャンルもデザインの幅も広い
  • LPデザイン・バナーデザインも豊富

デザイン検索にとどまらず、さまざまな画像が検索できる定番サイト。 無料登録が必要ですが、膨大な画像量に登録の価値は十分あります。

気に入った画像は自分の「ボード」としてグループ化して管理できます。

Webデザインはもちろん写真やイラスト、パッケージデザインなどジャンルが幅広く多くのインスピレーションを得られるサイトです。

手軽に国内外の膨大な画像を探せるため、デザインに迷ったときはまず1番に見て欲しいサイトです。

8.世界的に有名なアワードサイト『Awwwards』

Awwwards

世界的に有名なWebデザインアワード。

Awwwards

検索:フィルター機能で組み合わせ検索が可能

【おすすめポイント】

  • 全世界の優れたデザインのみが掲載されている
  • ユーザーの投票によるサイトの点数表示
  • お気に入りのサイトを登録できる

「インターネット上の優れたデザインやクリエイティビティ、イノベーションを称えるアワード」として海外では有名なWebデザインギャラリー。 全世界のクリエイターたちによってサイトに点数が付けられているサイトです。

いま世の中で好まれているデザインなど、トレンドの動向もチェックできますね。

フィルター機能による組み合わせ検索では、国別やアワード別といったタグもあります。 各国での流行もチェックできますね。

定期的に見るようにしておくことで、デザインセンスを磨き続けられるおすすめのサイトです!

LPデザインギャラリーサイト2選

1.スマホファーストもOK。圧倒的な掲載数『LPアーカイブ』

LP アーカイブ

LPデザインに困ったら、まず見たい圧倒的な掲載数。

LP アーカイブ

検索:カテゴリ・タグ共に豊富

【おすすめポイント】

  • LPデザインの圧倒的な掲載数
  • スマホデザインも多数掲載
  • 1日の更新数が多い
  • サイトキャッチコピーの一覧表示ができる

LPに特化したギャラリーの中で、圧倒的に掲載数が多いギャラリーサイトです。 とにかく更新頻度が高く、1日に新しいデザインが10つ追加されることもあります。 スマホデザインの一覧も見られるため、スマホファーストでのデザインにとても役立ちます。

キャッチコピーを一覧で見られる機能もあり、LPデザインの構想段階からとて も参考になるサイトです。

2.キャッチコピーを一覧で見られる『LPadvance』

LP advance

LP制作に携わる制作者目線のデザイン参考サイト

LP advance

検索:フィルター機能で組み合わせ検索が可能

【おすすめポイント】

  • 検索方法が豊富で探しやすい
  • メインビジュアルのタイプから検索できる -サイトキャッチコピーの一覧表示ができる

デザイナーだけではなく、コピーライター、プランナーのためのLPに特化したギャラリーサイトです。 制作者目線にこだわった構成で、メインビジュアル別・エフェクト効果からの検索ができます。

こちらもキャッチコピーを一覧で見られる機能もあり、LPデザインの構想段階からとても参考になるサイトです。

バナーデザインギャラリーサイト

1.『bannnner.com』

Bannnner.com

各種レイアウトの高品質なバナーを集めたバナーデザインギャラリー

Bannnner.com

検索:サイズ・レイアウトなど検索タグが豊富

【おすすめポイント】

  • バナーサイズで検索ができる
  • 横長のバナーも多数掲載

目を引くデザインが多数掲載されている、バナーに特化したギャラリーサイト。

縦長バナー・横長バナーどちらも多数掲載されており、レイアウト問わず参考になるものがとても見つかりやすいサイトです。 一覧のサムネイル の下にバナーサイズが表記されているのがとても便利ですね。

2.『SANKOU! banner ver.』

SANKOU! banner ver.

優れたバナーを集めたバナーデザインギャラリー SANKOU! banner ver. 検索:豊富なタグとフィルターで最強の検索力

【おすすめポイント】

  • 検索タグがかなり豊富
  • フィルター機能で組み合わせ検索が可能

Webデザイン参考サイトの『SANKOU!』のバナー特化のサイトです。 こちらも質の高いバナーを掲載しています。

こちらもユニークなタグが用意されていて、 「ステキな文字組」 「ステキな文字のあしらい」 など、他とは違った検索の仕方ができます。

一流デザイナーのスキルが身に付く

CodeCampの無料体験はこちら

最後に:質の高いデザインをたくさん見ましょう

デザインに携わっている人、勉強をしている人は「いつも見ている参考サイト」があるかもしれません。 しかし、トレンドや技術はどんどん進化して流れていきます。

決まったところだけから情報を集めるのではなく、あちこちの情報を集められるようにしておきましょう。

そして、デザイン勉強中の人こそ良いものを見るように意識しましょう。 良いものをたくさん見て、自分のデザインセンスを磨いていくことで今後の自分の作り出すデザインの精度が上がります。

気になるデザインのサイトが見つかれば、トレースして細部まで学ぶのもいいですね。 質の高いデザインから学ぶものは、本当に多いのです。

ぜひ、たくさんのデザインに触れて、これからのデザイン制作に生かしてくださいね!

関連記事

今村真理子
この記事を書いた人
今村真理子
\ 無料体験開催中!/自分のペースで確実に習得!
オンライン・プログラミングレッスンNo.1のCodeCamp