Webデザインの参考になるギャラリーサイト8選
![](https://spiqa.design/knowledge/wp-content/uploads/2024/06/shindo-icon.png)
Shindo
2023.05.08
![](https://spiqa.design/knowledge/wp-content/uploads/2023/05/0502_shindo_1-1.jpg)
こんにちは、ディレクターのしんどうです。
Webデザイン制作をしていると、デザインを制作した後に「ちょっと思っていたイメージと違った」となることがあります。
それはデザインを提出した後に、クライアントからそう言われてしまうこともあれば、社内で上がってきたデザインに対してディレクター自身が思うこともあります。
さまざまな要因が考えられますが、多くはデザインの方向性についてのすり合わせが足りていないことが原因です。
では、デザインのすり合わせはどのように行えばよいでしょうか?
ディレクターが用意する資料としてワイヤーフレームがありますが、基本的にはサイトの構成を整理するものです。
デザイン案をバンバンつくって見せるというのも作業工数が多くかかってしまうので、なかなかそうもいきません。
1番手っ取り早いのは、デザインや構成がイメージに近いサイトをピックアップして共有することです。
いくつかサイトをピックアップして、「配色はこのサイトと同じ青系で〜」「全体の雰囲気はこのサイトのようにスタイリッシュで〜」と、実際に参考サイトを見せながら共有するとぐっと伝わりやすくなります。
では「どう探せばいいのか?」ですが、良いデザインのWebサイトをまとめたギャラリーサイトがたくさんあります!
今回は現役のWebディレクターが参考にしているWebデザインのギャラリーサイトを5つ紹介します。
目次
国内のWebデザインをまとめているギャラリーサイト
SANKOU!|Webデザイン制作の参考になる国内のステキなサイト集
![](http://spiqa.design/knowledge/wp-content/uploads/2023/05/gallery01.jpeg)
「探しやすい」「見やすい」「更新頻度が高い」3拍子が揃ったギャラリーサイトです。
「サイトの種類」や「業種」での絞り込みができるのはもちろんのこと、「動き・ギミック」や「テイスト・あしらい」というニッチな絞り込みもできるところが制作サイドとしては嬉しいところです…
81-web.com|Webサイト制作に役立つ、日本の優れたWebデザイン・Webサイトギャラリー&リンク集
![](http://spiqa.design/knowledge/wp-content/uploads/2023/05/gallery03.jpeg)
国内の優れたWebデザインをまとめたギャラリーサイトです。SANKOU!同様、国内の参考サイトを探す際はよく利用します。
サイト上で全体のPCデザインとSPデザインを確認することができ、外部に飛ぶことなくサクサクデザインを確認していくことができます。
Web Design Garden | 毎日更新!Webデザイン参考ギャラリーサイト
![](http://spiqa.design/knowledge/wp-content/uploads/2023/09/image-20.png)
「サイト種別」「業種・業界」「印象」「機能・要素」「色」の5つのカテゴリーからWebデザインの事例を探すことが出来るギャラリーサイト(リンク集)です。こちらは自分が探している分類のサイトから絞り込んで探していけるので、比較参考サイトを探す場合にとても重宝します。
毎日更新されているので、最新のWebサイトデザインを探したい時にも活用できます。
LPの最新デザインまとめ参考サイト|LP アーカイブ
![](http://spiqa.design/knowledge/wp-content/uploads/2023/09/image-19.png)
クオリティの高いランディングページ(LP)を集めているギャラリーサイトです。リスティング広告や楽天市場、ヤフーショッピングでランキングに入っている様なハイクオリティなLPデザインがまとめられています。
毎日更新しているので、昔のLPから最新のLPまでデザインの参考に活用することができます。
また、デザインだけでなくキャッチコピーや原稿作成の参考にすることができる点もポイントです。
国内外問わず紹介しているギャラリーサイト
MUUUUU.ORG(ムーオルグ)クオリティが高い縦長のWebサイトギャラリー
![](http://spiqa.design/knowledge/wp-content/uploads/2023/05/gallery02.jpeg)
国内外問わず、クオリティの高いWebサイトをまとめているギャラリーサイトです。
サムネイルが小さく、ページ送りもなしでどんどんスクロールして見ることができるので、スピーディに量を見たい人におすすめです。
絞り込みでは、「フラット調」「ファブリック調」「多言語対応」などかゆいところに手が届くカテゴリーがあります。
ちょうどいいWebデザインギャラリー|制作者にとってちょうどいいサイト集
![](http://spiqa.design/knowledge/wp-content/uploads/2023/05/gallery04.jpeg)
「制作者にとってちょうどいい」ことを条件にサイトをピックアップしているギャラリーサイトです。
最新トレンドや革新的な技術を取り入れているサイトはとてもかっこいいのですが、芸術的な側面が強かったりしてなかなか実案件にアイデアを落とし込むのは難しいことがあります。
こちらのギャラリーサイトでは、「デザイン」とは「問題解決」であることを前提に「ちょうどいい」サイトをピックアップしており、実用的なWebデザインのサイトが詰まっています。
サムネイルにカーソルを当てると、それぞれ「ちょうどいいポイントを見る」というページに飛ぶことができ、ピックアップした担当者さんのコメントを見ることができます!
これが大変興味深く、次々といろんなサイトのちょうどいいポイントを見たくなります。
デザインの言語化の参考にもなりますので、言語化が苦手というディレクターやデザイナーはチェックしてみてください。
WebDesignClip|Webサイト制作の参考になるWebデザインリンク集
![](http://spiqa.design/knowledge/wp-content/uploads/2023/05/gallery05.jpeg)
国内外問わず、Webサイト制作の参考になるWebデザインギャラリーサイトです。
「日本」「海外」「ランディングページ」「スマホ特化」それぞれ4つのギャラリーサイトがあり、ヘッダーのナビゲーションから行き来することができます。
絞り込みは業種の他、「Integration / Technology」としてどんなWeb技術を導入しているかで絞り込むことができ、制作サイドとしてはかなりありがたい絞り込み項目です。
色やレイアウトの絞り込みも視覚的にわかりやすいデザインになっています。
LOADING ANIMATIONS
![](http://spiqa.design/knowledge/wp-content/uploads/2023/09/image-21.png)
こちらは弊社が運営している「ローディングアニメーション」に特化したギャラリーサイトです。Webサイトの入口として世界観を演出してくれるローディング画面の参考を探すのにはピッタリです。
もちろん、掲載されているWebサイトはデザインにおいても優れているものばかりですので、アイディアに煮詰まった時の参考サイト探しにも役立ちます。
「アニメーションの動き」「デザインの雰囲気」「フリーワード」で検索をかけることが出来るので、ストレスなくWebサイトを探すことができる点もポイント。国内外問わず、素敵なローディングアニメーションを掲載していますので、是非一度ご覧ください。
ギャラリーサイトはディレクターやデザイナーのインプットに最適
ギャラリーサイトは良質なデザインのサイトがまとめられているので、たくさんのデザインに触れることで自分自身のデザインの引き出しが身についたり、デザインを見る力がついてきます。
普段からギャラリーをチェックする習慣をつけておくと、最新のトレンドやたくさんのアイデアをキャッチアップすることができるので、ぜひこまめにチェックしてみてください。