先日、Wordpressテーマのデザインカスタマイズ参考にするため以下のような記事をまとめました。
上記にある参考サイトは、ソースコードつきのものですが、なかには「サイト要素デザインの参考になる見た目さえわかれば良い」という場合もあると思います。
前の記事を書いたときに、そういったギャラリーサイトが結構あったので、自分用にまとめてみたものを紹介したいと思います。
今回は、Wordpressテーマカスタマイズに使える手軽なものから、かなり凝ったサイトを作るときにも参考になるギャラリーサイトのまとめです。
目次
Croppy（クロッピィ）
Webデザインや配色をサポートする新サービス | Croppy（クロッピィ）
WEBデザイナーのためのパーツ別スクラップブックサービス。
以下のパーツごとにデザインを見ることができます。
- ヘッダー
- ロゴ
- グローバルナビ
- イメージ
- 見出し
- バナー
- サイドバー
- ボタン
- フッター
ブブンデザインアーカイブ
Webデザインの“ブブン”を集めたブブンデザインアーカイブ 公式サイト
デザイン性に優れたウェブサイトのパーツをアーカイブした見本集。パーツ別はもとより、業種別にもカテゴライズされています。
以下のパーツごとにデザインを見ることができます。
- タイトルロゴ
- プライマリナビゲーション
- グローバルナビゲーション
- メインビジュアル
- 見出し
- 文字装飾
- アクセント
- サイドメニュー
- ログインフォーム
- タブ
- テーブル・表
- 地図
- 特集バナー・内部リンク
- Twitterアイコン・バナー
- RSSアイコン・バナー
- フォーム
- アイコン
- ＜前へ 次へ＞
- 検索窓
- パンくずリスト
- トップへ戻る ボタン
- フォントサイズ変更ボタン
- 問合せ・送信・購入ボタン
- 電話番号
見出しデザイン.com
見出しデザイン.com -Webデザインの“見出し”を集めたサイト-
見出しのデザインのみを集めたWEBデザインギャラリー。
フッターデザイン.com
フッターデザイン.com -Webデザインの“フッター”を集めたサイト-
主に日本国内の、いろいろなWEBサイトのフッター部分を集めたギャラリー。
Logolog－ロゴログ
Logolog－ロゴログ│カッコイイ、クール、オシャレなロゴデザインのリンク集
ロゴデザインやロゴ制作のためのリンク集。カッコイイ、クール、オシャレ、ポップ、3Ｄ、キュート、いろいろ目的にあわせたロゴデザインの参考に。
ファビコンギャラリー.com
ファビコンギャラリー.com -Webサイトのファビコンを集めたサイト-
いろいろなWEBサイトのファビコンを集めたギャラリー。
レトロバナー
広告バナーのギャラリーサイト。サイズや色、業種、テイストからバナーを絞り込むことができます。
バナーデザインギャラリー
バナーデザインギャラリー | Banner Design Gallery
投稿情報を基に、かっこいいバナー、かわいいバナー、クリエイティブなバナーなどをまとめて一覧できる、バナー専門のギャラリーサイト｡
バナーデザインアーカイブ
バナーデザインアーカイブ｜バナーのデザインをまとめてチェック！
インターネット上に存在する様々なバナーを収集するサイト。
iconDrop
iconDrop｜デザインから探せるiOSアプリアイコンギャラリー
サイトのパーツではないですが。iOSアプリのアイコンギャラリーサイト。アップルタッチアイコンデザインの参考などに。
MephoBox（海外）
MephoBox | Web Design and Web Inspiration
以下のパーツデザインの参考に。
- 404ページ
- 新着投稿一覧ページ
- アートワーク
- 背景
- ボタン
- カレンダー
- コメント
- フッター
- タイポグラフィ
- フォーム
- ヘッダー
- ログイン画面
- ロゴ
- ナビゲーションメニュー
- ページネーション
UICloud（海外）
WEBパーツの検索ができます。カテゴリ一覧からパーツを絞り込むことも可能です。
カテゴリは、以下のように細かく分けられています。
Elements of Design（海外）
Elements of Design: Web Design Gallery
40種類以上のパーツカテゴリからデザインを絞り込むことができます。ショッピングカート、カルーセル、コードのシンタックスハイライター、言語選択ページ、クーポン、ローディングページ、引用文、ツールチップ、などの他にはないようなデザインの参考によさそうです。
UI-Patterns.com（海外）
50種類以上のパーツカテゴリからデザインを絞り込むことができます。
CSSbake（海外）
CSSbake » the perfect ingredients for baking a website
カテゴリーがあるパーツは以下です。
- 404ページ
- アーカイブページ
- 背景
- ボタン
- コメント
- フッター
- フォーム
- ヘッダー
- ナビゲーション
- ページネーション
- ポストデータ
- ショーケース
- サイドバー
Ui Parade（海外）
Ui Parade – User interface design inspiration & design tools
ユーザーインターフェースを便利にするパーツデザイン集です。ダウンロードできるものもあります。
以下のようなパーツがあります。どちらかというとWEB開発者向け。
- ボタン
- フォーム
- UIキット
- アイコン
- 音量調節などのノブ
- プレイヤーデザイン
- モーダルフォーム
- ナビゲーション
- プログレスバーなど
- スクローラー
- 検索ボックス
- スライダー
- スイッチ
- その他インターフェイス
House of Buttons（海外）
いろいろなボタンデザイン集です。
その他サイトギャラリー
パーツごとではないですが、サイト全体のデザインの参考になるギャラリーサイトです。主に国内のものだけ。
通常サイト
フリーランスWebデザイナー
日本で活動しているフリーランスWebデザイナーのHP紹介
S5-Style
Webデザインのリンク集・ポータルサイト
MUUUUU.ORG
縦長のwebデザインギャラリー・サイトリンク集
bookma! v3
WEBデザイン参考サイト
WONDER BOOKMARKS
WEBデザインリンク集
I/O 3000
Webデザインギャラリー
ランディングページ集めました。
WEBデザイナーのためのランディングページのリンク集
Good Design Web
WEBデザインリンク集
イケサイ
ウェブデザイナーのWEBデザインデータベース
Responsive Web Design JP
日本国内の秀逸なレスポンシブWebデザインを集めたギャラリーサイト
Web Design Clip
Webデザイン制作の上で参考になるクリエイティブの高いWebデザインのリンク集
現代デザイン
技術的、デザイン性に優れたウェブサイトを掲載しているリンク集
81-web.com
Webサイト制作に役立つ優れたデザインの国内サイトを集めたギャラリー＆リンク集
Choicely
デザインの優れたWebサイトや便利なWebサービス、クオリティの高いWordPressテーマなどのインスピレーションギャラリー
STRAIGHTLINE™
WEBデザインギャラリー＆リンク集
straightline bookmark
Webデザインリンク集・ソーシャルブックマーク
週刊ウェブデザイン
WEBデザインや、WEB開発のためにWebサイトリンク集
ウェブセレクション
Webデザインの参考になるサイトを集めたリンク集
WEBdeDB
WEBデザインの評価・リンク集
モバイル
iPhoneデザインボックス
優れたiPhoneサイトデザイン集
モバイルデザインアーカイブ
モバイルサイトデザイン集のモバイルデザインアーカイブ
まとめ
パーツデザインを探せるサイトだけでも色々あるので、これだけあれば目当てのデザインも必ず見つかると思います。
僕のような、WEBデザインが苦手で、普段プログラムコードばかり書いているタイプの人間にとっては、サイト作成時に、これらのサイトはとてもありがたい存在です。いろいろなデザインを見てインスピレーションをもらうにはもってこいです。
ただ僕の場合、どれだけインスピレーションを得ても、そんな高度なデザインを使いこなす場面がなかったり、どうやって実現すればいいのかわからなかったりすることも多々あります。けれど、「こういうこともできるんだ！」ということを知るだけでも、大きな進歩ではないかと思います。
