webやデザインのインスピレーションに刺激をくれるお気に入りサイトたち

March 2, 2016

Digital

webサイトを作るとき、何かをデザインするとき。
自分の頭の中だけでは良いアイデアが出てこないことがあります。
そういう時は世界中の「素敵なモノ」を見て、
アイデアのヒントをもらったり、刺激を受けたりするのがいいですよね。
良い作品を研究したり、真似してみたり…というのもとても勉強になりますし。

特にwebの世界はどんどん新しくなっていくので、
日常的に多くの新しい情報やアイデア、作品に触れていたい。

現代に生きるわたしたちは本当に恵まれていて、
クリエイティブの手助けをしてくれるインスピレーションサイトは本当にたくさん！！
そんな中でも、わたしがよく利用しているお気に入りのものをご紹介します。

まずは大好きなPinterest

アイデアを整理するスクラップブック、Pinterest
の記事でも紹介しましたが、
料理、模様替え、贈り物…いろいろなアイデア集めに使っているPinterest。

webやデザインに関するボードももちろんあります。

思いつきのままボードを作っていったので、
こうやって見るとちょっと区分があやふやなまま使っている感が…
もうちょっとカテゴリ整理・追加したくなりました。
ロゴやアイコン、UI、イラストなども増やしたい！

国内のwebサイトギャラリー

続いては、素敵なウェブサイトのブックマークが集まっているサイトギャラリー系。
まずは国内のサービスから。

いくつもブックマークはしているのですが、お気に入りのサイトいくつか。

WEBデザイン参考サイト bookma! v3

http://bookma.org/

謎のゴリラくん？がかわいい！
サイト掲載リクエストもできる、おしゃれサイトが集まるwebギャラリーです。
検索軸が多くて、求めるサイトを探しやすい。
SNSログインで手軽にブックマーク機能・整理もできるのも魅力。

検索軸

リージョン（日本、インターナショナル、すべて）
カラー
バックグラウンドカラー
テイスト（にぎやか・たのしい、シンプル・ナチュラル、信頼・安心…etc）
カテゴリー（ECサイト、SNS・情報系、ブログ系…etc）

ブックマーク機能

TwitterログインもしくはFacebookログインで、my collection’sを利用可能。
グルーピングして整理することもできます。

Web Design Clip | Webデザインクリップ

http://www.webdesignclip.com/

豊富な検索軸と、ユーザー登録不要のお気に入り保存機能が便利。
姉妹サイトの

などもあって、目的別に探しやすくなっています。

検索軸

フリーワード検索
Main Color
Sub Color
Layout
Catecory（インテリア・雑貨、旅行・交通、飲食・レストラン…etc）
Special（特集系。現在は2016年度採用サイト特集）

ブックマーク機能

クッキー保存形式のMyClip機能あり。
ユーザー登録など必要なく手軽にお気に入りをブックマーク可能。

縦長のwebデザインギャラリー・サイトリンク集｜MUUUUU.ORG

http://muuuuu.org/

縦長レイアウトのサイトに特化したギャラリーサイト。

縦に長くオーソドックスなレイアウトでかつ、非常にデザインが優れたサイトを厳選して掲載しております

という言葉通り、高クオリティなおしゃれサイトばかり！

検索軸

INDUSTRY（インテリア・雑貨、ウェディング、キッズ・子育て…etc）
DESIGN（フラットデザイン、かわいい系、イラスト…etc）
TYPE（ECサイト、WEBマガジン、ポートフォリオ…etc）
COLOR

ブックマーク機能

なし

オシャレなウェブサイトの参考デザインリンク集 | ウェブ・ファインダー

http://w-finder.com/

サイト自体のデザインもかわいいのでお気に入り！
なのですが、昨年春から更新が止まっているのがとても残念。
更新復活しないかな、という気持ちを込めて掲載。

検索軸

カテゴリ（キャンペーン、ECサイト、リクルート…etc）
業種（デザイン・アート、エンタメ・ゲーム、ファッション…etc）
テイスト（エレガント、クール、和風…etc）
カラー
フリーワード検索

ブックマーク機能

クッキー保存形式のFavorite機能あり。
ユーザー登録など必要なく手軽にお気に入りをブックマーク可能。

やっぱりまとめサイト自体がおしゃれなものや愛着が湧くものは、よく見に行きます。
レスポンシブ対応がしっかりしていて、スマホで見やすいのもポイントかも？

海外のwebサイトギャラリー

続いては海外のサイトギャラリー。

siteInspire – Web Design Inspiration

http://www.siteinspire.com/

様々なテイスト、ジャンルのサイトがあるので使いやすい。
豊富な検索軸も魅力です。
スマホでも見やすいレスポンシブサイト！

検索軸

Styles（Cute、Dark、Minimal…etc）
Type（Blog、Corporate Site、Showcase…etc）
Subjects（Art、Travel、Food&Drink…etc）
Platforms（Behance Pro-site、Shopify、Tumblr…etc）
Search（freeword）

ブックマーク機能

ユーザー登録をすれば、Collectionとしてブックマーク可能。
Collectionは複数作れるので、グルーピングもできます。

www.siiimple.com

http://www.siiimple.com/

ミニマルデザインなサイトに特化したサイトギャラリー。
必要最低限の検索、ブックマークはなし…と機能もとってもシンプル。
シンプルなデザインが好きなのでお気に入り。
引き算のデザイン力を磨きたい。。。

検索軸

Categories（Colorful、Grid、Company…etc）
Search（freeword）

ブックマーク機能

なし

Best Website Gallery – Web Design Trends –

http://bestwebsite.gallery/

よくあるサイトのサムネイルがずらり→クリックでサイトへ、
というのではなく、ページ全体のスクショや他ページまで見れるのが良いです。
でも、リッチ画像ゆえに、ちょっと表示が遅いのが気になる時も。

検索軸

TAG（ANIMATION、NATURE、SHOP…etc）
COLOR
Search（freeword）

ブックマーク機能

なし

こうやって海外サイトをちょこちょこのぞいていると、
国内サイトにはないトレンドを感じることができて楽しいです♪

パーツやUIのアイデア

最後は、サイト全体ではなくてパーツやUI系もいくつか。

Inspiration UI

http://inspirationui.com/

404 errorやformやbreadcrumbなどなど、
パーツ別におしゃれなUIデザインを見ることができます。
ユーザー登録をすれば、likes機能を使ってお気に入りブックマークも可能。

Calltoidea

http://www.calltoidea.com/

こちらもおなじようにUIパーツ別のデザインがまとまっています。
サムネイルの見せ方がかわいい！

レスポンシブのレイアウトの変化も素敵です。

k3WAvovgpf

Responsive | ZURB Library

http://zurb.com/responsive

こんな、レスポンシブに特化したリンク集も便利です。
レスポンシブ対応のワイヤー設計をする時など、参考になりました。

他にも、ボタンやタブなどのUIアイデアを見るだけでなく、
コードまで活用できるDesign Patterns on CodePenなども便利！
そんな、webの学習や実制作時に使えるサービスはまた別の機会に。

アイデアの引き出し、どんどん増えますように

こんなふうにピックアップしたサイトだけじゃなくて、
最近流行のキュレーションサイトも、
オフラインの世界のおしゃれな雑貨ショップやカフェも、
いろいろなものがインスピレーションを刺激してくれる毎日。

びびっと来たものは自分の中にきちんとインプットして、
形を変えて素敵なアウトプットをしていきたいものです。

リアルな世界ではできるだけ収納は増やさない主義！ですが、
アイデアをしまうための収納はたくさんたくさん持っていたいなぁ( ˘ω˘ )