どうも、Dスケです。
Webサイトのデザインや動き、全体の構成やレイアウトを考える際に、参考になるサイトをまとめてみたいと思います。
こちらも、以前に自分でまとめた「Webカラーの参考サイト集」と同じく、まとめておくと自分で使いやすいから、という理由です(笑)。
どうしても自分の中にある経験や知識だけで進めてしまうと、似たようなアイディアしか出なくなってしまいます。
新しい制作が始まる前の参考や、普段から新しい表現・技術を情報収集するうえで、参考にしてほしいサイトたちです。
Web Design Clip
「WebDesign」とGoogle検索すると、ほぼこれが1位に出てくる不動のWebデザインキュレーションサイト。
おしゃれなデザインだったり、独特な動きをするサイトを多数ピックしています。
海外サイトもピックされていたり、LPだけでも絞り込みできたりと機能が充実。特にタグがかなり細かく設定されているので、見たいテイストのデザインにすぐアクセスできる。
サイト自体のデザインもシンプルに洗練されていて、何度も訪れたくなるサイト。
MUUUUU.ORG
こちらも色んな記事で紹介されているキュレーションサイト。「縦に長いサイトを集める」とうたっていますが、LPだけでなく、通常の構成のサイトデザインも見られます。
こちらは完全にリンク集といった感じなので、各サムネイルから各サイトに飛ばすのみ。思い切りがいいw
カテゴリ分けも、以前にも増して増えてきているので、業種・業態や雰囲気・色味など、見たい要素で絞り込むことができます。
SANKOU!
文字通り、「参考(SANKOU)」になるデザインのサイトが集められています。
掲載されているサムネイルが大きいので、パッと見の印象も分かりやすくなっています。
マウスを乗せたときのホバー時の動きが、可愛いらしいですね。
LP幹事
こちらは完全にLP(ランディングページ)に特化したキュレーションサイトですね。
ただ集めてるだけじゃなく、サイト内でPCとスマホの表示の違いがプレビューできたり、似てるデザインのLPを並べてくれるなど、細かい配慮がうれしい。
「LP幹事」というカタい名前なのに、ポップなサイトデザインというギャップも好感がもてます。
WOW! Works
福岡のデザイン会社さんが運営しているキュレーションサイト。
最初にわかりやすい選択プルダウンがあるので、調べたい目的が決まっているときには便利。
マウスホバー時の「VIEW」の表示の仕方が気持ちよくて、どんどん見たくなるUIです。
紹介しておいてなんですが、スマホサイズには対応していないサイトのようなので、早めのレスポンシブ対応もとむ!
イケサイ
「イケてるサイトデザイン」を探せるキュレーションサイト。
こちらは逆にサムネが小さいので、数は多く見られるけれど、じっくり見たいなら各サイトへ行ってねスタンスですね。
同時に、制作会社のデータや、サイト制作見積もりまで出来ちゃいます。
WEBDESIGNDAY
シンプルなデザインで並べられた、スタイリッシュな参考サイトが見られるキュレーションサイトです。
サイトのテイストに近い、シンプルでミニマルなものが多く集められている印象がありますが、果たして。
かっこいいサイトにしたい、ミニマルな雰囲気にしたいといった制作の際には、一番に訪れたいサイト。
CSS、JavaScript系の記事も多いので、一緒に勉強もできちゃうのが嬉しいです。
1GUU
「千載一遇、その出合いをここから。」というステキなキャッチコピーで収集されるデザインサイト。
大阪のデザイン会社ツルバスタジオさんが運営されています。(サイト参照)
左端に国カテゴリのメニュー、右端に業種やテイストのメニューが豊富に用意されていて、僕は初めてチリのWebサイトなど目にしました(笑)
PC表示だとキービジュアルの動きが動画キャプチャで設定されていて、サイトに行くまえにどんな動きをするページなのかが分かりやすく、見た目にも楽しい印象を受けますね。
Web Design Trends
色んなサイトデザインが集まっているわけではないけれど、Webデザインの現場でよく使われる手法や最近のトレンド、Webに関係するロゴやグラフィックのデザインについても詳しく知ることができます。
特にトレンド系記事は、毎年ちょっとずつ変わる変化の具合など、複数年にわたって読むと、参考になって面白い。
最近はあまり更新頻度が高くない……楽しみにしてます!
まとめ
いくつかのサイトを見てると気づくのが、注目されているサイトデザインは、そのキュレーションサイトでも載っている。
まぁおそらく1つが載せたら、他のサイトも慌てて載せるみたいな構図もありそうですが、それだけ注目度が高いわけなので、いろんなサイトに載っているものは、一目見ておくのがよさそうですね。
時に参考にしつつ、時にクオリティに感嘆し、時に悔しい思いをしながら、良いサイトデザインを探してみてください。
ではでは。
Dスケ