【AdobeXD】デザインを簡単に共有する方法。クラウド共有、パスワード設定など
susan すーさんのweblog
【海外サイト中心】webデザインで参考にしたいギャラリーサイト10選
susan
記事内に商品プロモーションを含む場合があります
様々なインスピレーションを得ることはデザイナーにとっては必要なことです。
また、デザインをする上で何か参考になるサイトがあると心強いです。
本記事ではそんな要望に応えるべく、webデザイナーがぜひ知っておきたい、webデザインをする際に参考にしたいサイトを10個厳選し紹介していきます。
Webデザイナーにおすすめのパソコンはこちら！
Webデザインが学べるおすすめのスクールに関しては【初心者用】Webデザインが学べるスクール！おすすめの10校を徹底比較で詳しく紹介していますので、興味ある方はぜひチェックしてみてください。
あわせて読みたい
【初心者用】Webデザインが学べるスクール！おすすめの10校を徹底比較
おすすめのフリーランスデザイナーエージェントに関してはフリーランスのデザイナーが登録しておくべきエージェント8選！おすすめはどこ？で詳しく紹介していますので、興味ある方はぜひチェックしてみてください。
あわせて読みたい
フリーランスのデザイナーが登録しておくべきエージェント8選！おすすめはどこ？
そもそもギャラリーサイトとは？
ギャラリーサイトとは、主に画像、動画、アートワーク、またはその他の視覚的なコンテンツを展示するためのウェブサイトです。
ギャラリーサイトは、個々のアーティストや写真家、デザイナー、企業、またはコミュニティによって作成され、その作品を公に展示し、共有するためのプラットフォームとして機能します。
ギャラリーサイトの特徴
特徴
- 画像や動画中心のビジュアルフォーカス
- カテゴリやタグなどで検索できる
- 作品の詳細情報を見ることができる
- フィードバックやコメントを見ることができる
画像や動画中心のビジュアルフォーカス
ギャラリーサイトは主に視覚的なコンテンツに重点を置いており、テキストよりも画像や動画を優先的に見ることができます。
これは、サイトの目的が視覚的な作品を展示することにあるためです。
カテゴリやタグなどで検索できる
ギャラリーサイトでは、作品を効果的に検索し、表示するための仕組みが提供されています。
これには、スライドショー、グリッドビュー、カルーセル、カテゴリやタグによる分類、フィルタリングやソート機能などが含まれることがあります。
作品の詳細情報を見ることができる
各作品には通常、作品の詳細情報が提供されます。
これには、作品のタイトル、作成者、作成日、使用された技術や材料、作品の説明や背景ストーリーなどが含まれることがあります。
フィードバックやコメントを見ることができる
視聴者が作品に対してフィードバックを提供したり、作品を評価したり、または作品を共有したりする機能を備えています。
これには、コメントセクション、評価ボタン、ソーシャルメディア共有ボタンなどが含まれることがあります。
ギャラリーサイトの目的と用途
ギャラリーサイトはさまざまな目的と用途で使用されます。
以下その具体例です。
ギャラリーサイトの用途
- デザイン制作のインスピレーションとしての活用
- ポートフォリオとしての使用ができる
- サイトによっては商品の販売が可能
- コミュニティの形成ができる
- 仕事が受注できるサイトもある
デザイン制作のインスピレーションとしての活用
ギャラリーサイトはデザイナーが新たなインスピレーションを見つけるためのリソースでもあります。
最新のデザイントレンド、色彩スキーム、タイポグラフィ、レイアウトのアイデアなど、様々な視覚的要素について学び、自身の作品に応用するための新しいアイデアを得ることができます。
以下、ギャラリーサイトがインスピレーションの源としてどのように活用するかの参考例です。
活用例
- デザインのトレンドを追跡できる
- 色彩やパターンのインスピレーションをもらえる
- レイアウトとタイポグラフィのアイデア
- 他のデザイナーから学ぶ
デザインのトレンドを追跡できる
ギャラリーサイトは最新のデザインのトレンドを把握するための素晴らしいリソースです。
何が流行しているのか、何が視覚的に魅力的であるのかを学び、自分の作品にこれらの要素を取り入れることができます。
色彩やパターンのインスピレーションをもらえる
ギャラリーサイトは色彩スキームやパターンのアイデアを探すのに役立ちます。
様々な色の組み合わせやパターンを見ることで、あなたのデザインに新たな視覚的要素を取り入れるアイデアを得ることができます。
レイアウトとタイポグラフィのアイデア
ギャラリーサイトは異なるレイアウトスタイルやタイポグラフィのアイデアを得るために利用できる場所でもあります。
他のデザイナーがどのように情報を整理し、テキストを使用して視覚的に魅力的なデザインを作成しているのかを学ぶことができます。
他のデザイナーから学ぶ
ギャラリーサイトは、他のデザイナーの作品を見て学び、それらの作品からインスピレーションを得るのに最適です。
他のデザイナーが同じデザインの課題にどのように対処しているのかを見ることで、自分自身の作品に新たな視点を取り入れることができます。
ポートフォリオとしての使用ができる
アーティスト、写真家、デザイナーなどのクリエイターはギャラリーサイトを利用して、自分の作品集（ポートフォリオ）を公開することもできます。
これにより自分が持ってるスキル、スタイル、創造性を世界中に示すことができます。
サイトによっては商品の販売が可能
ギャラリーサイトはオンラインストアとして機能することもできます。
アーティストやクラフトマンは自分の作品を直接販売するためにギャラリーサイトを利用することがあります。
コミュニティの形成ができる
ギャラリーサイトは特定のテーマやトピック（例えば、特定の種類の写真やアート）を共有したいユーザーグループによって作成されることがあります。
ユーザーは自分の作品をアップロードし、他のメンバーの作品を評価やコメントすることでコミュニティを形成することができます。
仕事が受注できるサイトもある
海外にはなってしまいますが、いくつかのギャラリーサイトでは仕事の応募もしています。
海外案件を獲得できるサイトに関してはこちらの記事がおすすめ
参考にしたいギャラリーサイト10選
ここではデザイナーがインスピレーションを得ることができる、おすすめのギャラリーサイトを10個選び紹介していきたいと思います。
ギャラリーサイト10選
| サイト名 | 言語 | 参考にできるもの | 仕事の受注 |
|---|---|---|---|
| Awwwards.com | 英語 | Webデザイン | ○ |
| Dribbble | 英語 | Webデザイン、アニメーション、ブランディング、イラスト、DTP、プロダクトデザイン、フォント、アプリデザイン | ○ |
| Behance | 日本語・英語 | Webデザイン、ブランディング、UI/UX、イラスト、グラフィックデザイン、ファッション、モーショングラフィック、写真、建築 | ○ |
| 日本語・英語 | Webデザイン、ブランディング、UI/UX、LPデザイン、イラスト、グラフィックデザイン、モーショングラフィック | × | |
| SANKOU! | 日本語 | Webデザイン、UI/UX、LPデザイン、アプリデザイン | × |
| Web design inspiration | 英語 | e-commerce、 コーポレートサイト、WordpressのテーマなどのWebデザイン | × |
| siteinspire | 英語 | Webデザイン | × |
| Best Website Gallery | 英語 | Webデザイン | × |
| CSS néctar | 英語 | Webデザイン | × |
| Landbook | 英語 | LPデザイン | × |
AdobeXDの学習におすすめの書籍
Awwwards.com(アワーズ・ドットコム)
Awwwards.comは、ウェブデザインとデジタル体験に焦点を当てたプロフェッショナルなコンペティションサイトであり、世界中のデザイナーやデベロッパーが自身のウェブサイトを提出し、認知度を上げるためのプラットフォームとなっています。
同サイトは、革新的でクリエイティブなウェブデザインの評価、認識、普及を目指しています。
Awwwards.comの特徴
- 国際的なコンペティション
- 評価基準
- 賞と認識
- インスピレーションと学習リソース
国際的なコンペティション
ウェブデザイナーや開発者、エージェンシー、スタートアップなど、世界中から最先端のウェブサイトがAwwwards.comに提出されます。
これらのサイトはユーザー投票と専門家パネルによる評価を受けます。
評価基準
Awwwardsでは、デザイン、クリエイティビティ、ユーザビリティ、コンテンツなどの複数の基準に基づいてウェブサイトが評価されます。
これにより、ウェブサイトが全体的にどのようにパフォーマンスを発揮しているかが明確になります。
賞と認識
最高のウェブサイトは「サイト・オブ・ザ・デイ（Site of the Day）」、「サイト・オブ・ザ・マンス（Site of the Month）」、「サイト・オブ・ザ・イヤー（Site of the Year）」など、様々な賞を受賞する可能性があります。
これにより、優れたウェブデザインを持つエージェンシーや個々のデザイナーに、より広範な認識と認知度を提供します。
賞
- 「Site of the Day」
- 「Site of the Month」
- 「Site of the Year」
インスピレーションと学習リソース
Awwwards.comでは、最新のデザイントレンド、テクニック、テクノロジーなど、ウェブデザインと開発に関する幅広いリソースを提供しています。
これにより、訪問者は新たなアイデアを得たり、スキルを向上させたりすることができます。
URL: Awwwards.com
Dribbble(ドリブル)
Dribbbleは、デザイナーが自分の作品を公開し、フィードバックを受け取ったり、他のデザイナーとつながったりするためのオンラインコミュニティプラットフォームです。
デザインに従事する多くのプロフェッショナルたちにとって、Dribbbleはインスピレーションを得たり、新たなトレンドを追ったり、自分の作品を世界中に公開するための重要な場所となっています。
Dribbbleの特徴
- デザインの公開とフィードバック
- デザインのインスピレーション
- コミュニティとネットワーキング
- 求人とフリーランスの機会
デザインの公開とフィードバック
Dribbbleはデザイナーが自身の作品を公開し、フィードバックを得る場所となっています。
ユーザーは作品を「ショット」（Dribbbleに投稿される小さなスクリーンショットやイメージ）としてアップロードし、他のデザイナーからのコメントや「いいね」を通じてフィードバックを受け取ります。
Dribbbleへの作品の投稿は、招待制となっています。これはDribbbleが高品質の作品を維持し、コミュニティの品質を保つための制度です。ただし、デザインの閲覧のみなら無料なので安心してご利用できます。
デザインのインスピレーション
Dribbbleはデザインのインスピレーションを得るためのリソースとしても利用されます。
ユーザーは他のデザイナーの作品を閲覧し、新たなアイデアやトレンドを探求することができます。
webデザインの他に参考にできるもの
- アニメーション
- ブランディング
- イラスト
- プリント
コミュニティとネットワーキング
Dribbbleは強力なデザインコミュニティを形成しており、デザイナー同士で交流することができます。
また、ユーザーは他のデザイナーをフォローすることで、そのデザイナーの最新の作品を確認することができます。
求人とフリーランスの機会
Dribbbleではデザインに関する求人情報が掲載されています。
また、フリーランスのデザイナーは自分のプロフィールを公開し、クライアントに自身の作品を見せることで仕事の機会を探すことができます。
URL: Dribble
Behance(ビハンス)
Behanceは、クリエイティブプロフェッショナルが作品を公開、共有、発見するためのオンラインプラットフォームで、Adobe Inc.が運営しています。
ユーザーは、自分のデザイン、イラスト、写真、動画、3Dモデリングなどの作品をポートフォリオとして展示し、他のクリエイターと交流したり、フィードバックを得たり、新たな仕事の機会を見つけたりすることができます。
Behanceの特徴
- クリエイティブ作品の公開
- コミュニティとネットワーキング
- ジョブボード
- クリエイティブなインスピレーション
クリエイティブ作品の公開
Behanceは、プロが作成した作品を公開し、クリエイターのポートフォリオを作成・管理するためのツールを提供しています。
作品は詳細な情報と共に公開され、視覚的に魅力的なレイアウトで表示されます。
コミュニティとネットワーキング
Behanceは、全世界のクリエイティブプロフェッショナルから成る活発なコミュニティを形成しています。
これにより、ユーザーは他のクリエイターからのフィードバックを得ることができ、同じ興味を持つ人々とつながることができます。
ジョブボード
Behanceは、クリエイターが新たな仕事やフリーランスの機会を見つけることができるジョブボードも提供しています。
クリエイティブなインスピレーション
ユーザーは、世界中から集まった数百万もの作品からインスピレーションを得ることができます。
また、Behanceはトレンドや新しいクリエイティブなアイデアを発見するための有力なリソースとなっています。
URL: Behance
Pinterest(ピンタレスト)
Pinterestは、ユーザーが画像（ピン）を共有、保存（ピンする）、そして発見するための全世界で利用されているソーシャルメディアプラットフォームです。
ユーザーは他のユーザーのピンを見たり、自分のピンを作成したり、類似したテーマや関心事に基づいたピンのコレクション（ボード）を作成したりすることができます。
Pinterestの特徴
- 視覚的なインスピレーション
- アイデアの保存と整理
- コンテンツの発見と探索
- ブランドとのつながり
視覚的なインスピレーション
Pinterestは、レシピ、DIYプロジェクト、ファッション、インテリアデザイン、写真、アートなど、あらゆるテーマの視覚的なインスピレーションを見つけることができます。
アイデアの保存と整理
Pinterestのボード機能は、ユーザーが特定のテーマやプロジェクトに関連するピンを保存し、整理するのに役立ちます。
ユーザーは、参照するためにアイデアを保存したり、特定のテーマについてのアイデアを集めたりすることができます。
コンテンツの発見と探索
Pinterestの検索と推奨機能は、ユーザーが新しいコンテンツやアイデアを発見するのを簡単にしてくれます。
ユーザーは特定のキーワードを検索したり、関連するピンを探索したりすることができます。
ブランドとのつながり
企業やブランドは、製品やサービスを宣伝し、顧客とつながるためにPinterestを利用します。
ユーザーは、お気に入りのブランドや商品の最新情報を追跡するためにこれらのアカウントをフォローすることができます。
URL: Pinterest
Figmaの学習におすすめの書籍
SANKOU!
SANKOU!は日本のサイトで、国内のサイトでもよりすぐりのものをかき集めた、クオリティの高い参考サイトです。
コーポレートサイトやECサイトといったサイトのタイプ別でソートできたり、音楽、ホテルなどサイトのジャンル別、もしくは白、青といった色でソートすることもできます。
SANKOU!の特徴
- 多彩な日本のWebデザインが掲載されている
- カテゴリでの検索が可能
- 最新のデザインが紹介されている
- フォント検索サービスも提供
- デザインの時期が掲載されている
- お気に入り登録機能
- クレジット表示されている
多彩な日本のWebデザインが掲載されている
実用的なものから遊び心のあるものまで、多種多様な日本のWebデザインを3,328件以上掲載しています。
カテゴリでの検索が可能
ユーザーが目的に合うサイトを効率的に探せるよう、サイトを多数のカテゴリで分類しています。
最新のデザインが紹介されている
制作会社の実績、検索エンジン、SNS、メディアなどから最新のWebデザインを探して紹介しています。
フォント検索サービスも提供
商用可能な有料・フリーフォントの検索サービス「SANKOU！font」も提供しています。
デザインの時期が掲載されている
各サイトの掲載日を表示しているので、特定の時期のデザインを参考にすることができます。
お気に入り登録機能
気に入ったサイトをお気に入りページに登録できます（ブラウザのCookieを削除するとリセットされます）。
クレジット表示されている
サイトの制作者情報を掲載しています。
URL: SANKOU!
Web design inspiration(ウェブデザイン・インスピレーション)
Web design inspiration(ウェブデザイン・インスピレーション)はwebデザインに特化した海外のサイトです。
一番の特徴としまして、webサイトやスマホ、タブレットなど、デバイスごとのデザインを閲覧できることが挙げられます。
またwebデザインの他に、WordPress用テーマなどのデザインも見ることもできます。
Web design inspirationの特徴
- サイトの種類ごとにデザインを見ることができる
- カテゴリ分けとタグ付けによる検索
- 頻繁に更新されている
- デザインの詳細な分析が可能
サイトの種類ごとにデザインを見ることができる
このサイトは、商業サイト、アーティスティックなサイト、eコマースサイト、ブログなど、様々な目的と業界のウェブサイトのデザインを集めています。
カテゴリ分けとタグ付けによる検索
提供されるデザインは、業種、色、スタイル、UIパターンなどにより、分類されタグ付けされています。
これにより、特定の要素や特性に基づいたインスピレーションを迅速に検索することが可能です。
頻繁に更新されている
サイトは頻繁に更新され、最新のウェブデザイントレンドとテクニックが常に反映されています。
デザインの詳細な分析が可能
選ばれた各デザインは、デザインの要素、使用されている色、使用されているフォントなどについての詳細な分析とともに紹介されています。
siteinspire(サイト・インスパイア)
SiteInspireは、優れたウェブデザインの実例を収集し、共有するための海外のオンラインプラットフォームです。
Webデザイナーやクリエイティブなプロフェッショナルにとって、インスピレーションを得るための重要なリソースとなっています。
SiteInspireの特徴
- 優れたウェブデザインのコレクション
- カテゴリとフィルタリング
- クリエイティブなインスピレーションの提供
優れたウェブデザインのコレクション
SiteInspireは、さまざまな業界やカテゴリにわたる優れたウェブデザインの実例を収集しています。
デザインのクオリティや視覚的なインパクトの高さが評価され、優れた作品が選ばれています。
カテゴリとフィルタリング
サイトはカテゴリ別に分類されており、ウェブデザインの特定のジャンルやテーマに絞った作品を探すことができます。
また、デザインの要素や特定の機能に基づいて検索やフィルタリングを行うことも可能です。
クリエイティブなインスピレーションの提供
SiteInspireは、デザイナーやクリエイティブなプロフェッショナルにとって、新しいアイデアやトレンドを発見するための貴重な情報源です。
他のデザイナーの作品を見ることで、独自のアイデアを刺激し、自身のプロジェクトに活かすことができます。
URL: Siteinspire
Best Website Gallery (ベスト・ウェブサイト・ギャラリー)
Best Website Galleryは、優秀なウェブデザインの実例を収集し、展示するための海外のオンラインプラットフォームです。
このサイトは、インスピレーションを得るためにデザイナーや開発者が利用することができます。
Best Website Galleryの特徴
- 優秀なウェブデザインのコレクション
- カテゴリとフィルタリング
- デザインの評価とコメント
優秀なウェブデザインのコレクション
Best Website Galleryは、デザインの品質やクリエイティブなアプローチが評価されたウェブサイトの実例を集めています。
デザインの優れた要素やユーザーエクスペリエンスの革新的なアイデアが採用された作品が選ばれています。
カテゴリとフィルタリング
サイトはカテゴリ別に分類されており、特定のテーマや業界に関連する作品を探すことができます。
また、デザインのスタイルや要素に基づいてフィルタリングを行うことも可能です。
デザインの評価とコメント
Best Website Galleryでは、ユーザーが作品に評価やコメントを付けることができます。
これにより、他のデザイナーや開発者からのフィードバックを得ることができ、デザインの向上や意見交換が促進されます。
URL: Best Website Gallery
CSS néctar (CSSネクター)
CSS Nectarは、世界中のウェブサイトの中から特に優れたデザインを持つものを選び出し、そのウェブサイトを展示するためのギャラリーサイトです。
CSS Nectarの特徴
- 審査プロセスがあるためクオリティが高い
- コミュニティによる投票ができる
- グローバルな視点を持つことができる
審査プロセスがあるためデザインのクオリティが高い
提出されたウェブサイトは、デザイン、ユーザビリティ、クリエイティビティなどに基づいて審査され、高評価を受けたものだけがCSS Nectarに掲載されます。
コミュニティによる投票ができる
CSS Nectarのユーザーは、気に入ったウェブサイトに投票することができます。
これにより、そのウェブサイトがどれだけ評価されているかを他のユーザーが確認することができます。
グローバルな視点を持つことができる
CSS Nectarは世界中のウェブデザインを取り扱っているため、様々な文化や視点からのデザインを一元的に見ることができます。
URL: CSS Nectar
Landbook (ランドブック)
Land-bookはランディングページデザインに特化したオンラインギャラリーサイトです。
Webデザイナーや開発者、マーケティングプロフェッショナルがランディングページに特化した優れたデザインのアイデアやインスピレーションを得るための重要なリソースとなっています。
Land-bookの特徴
- ランディングページデザインに特化
- 業種などのカテゴリ分けされたデザイン
- 審査プロセスを経た高品質なデザインが掲載されている
- テンプレートが販売されている
- コンポーネントごとでの検索もできる
ランディングページデザインに特化
Land-bookは特にランディングページデザインに焦点を当てており、そのためのさまざまな業種、テーマ、スタイルのデザインを展示しています。
これにより、訪問者はランディングページ作成のための多様なデザインアイデアを一元的に確認できます。
業種などのカテゴリ分けされたデザイン
Land-bookでは、ランディングページデザインがカテゴリー別に整理されています。
これにより、訪問者は特定の業種やスタイルに焦点を絞ってデザインを探すことができます。
審査プロセスを経た高品質なデザインが掲載されている
Land-bookに掲載されるランディングページデザインは、一般的に非常に高品質で洗練されたものであり、そのための審査プロセスを経ています。
これにより、最新のランディングページデザインのトレンドやベストプラクティスについての理解を深めることができます。
テンプレートが販売されている
Webflowで利用できるテンプレートが販売されているので、購入することで気に入ったデザインをテンプレートとして利用することができます。
Webflowに関する記事はこちら
コンポーネントごとでの検索もできる
ヘッダーやフッターなどのコンポーネントごとでの検索も可能。
URL: Landbook
まとめ
今回は参考サイトの中でも優秀なサイト10個を厳選いたしました。
webデザイナーとして日々いろんなデザインを目にし、参考にすることは非常に大切です。
ぜひこれらのサイト、参考にしてみてください。
Webデザイナーにおすすめのパソコンはこちら！
Webデザインの勉強をしたい方はこちらの記事がおすすめ！
Webデザイナー用のエージェントをお探しの方はこちらの記事がおすすめ！
副業案件をお探しの方はこちらの記事がおすすめ！
ABOUT ME
30代web業界未経験
→オーストラリアにIT留学
→現地インターンを1年半経験
→フリーランスwebデザイナー・エンジニアとして活動
→月収80万円達成！
