Webサイトにはひとつひとつ、それぞれの個性にあったデザインが必要ですから、デザイナーは常に新しいデザインの提案が求められますし、個性にあったデザインアイデアをストックしておく心掛けが必要ですよね。そのため、デザインのネタ帳はいくつあっても多すぎることはない!? 今回は、デザインのアイデアやサンプルが見つかるサイトなどを紹介します。
オンライン上のWebデザインのコンテスト
世界でも選りすぐりのWebデザインを探すには、コンテストのサイトをチェックするのは手っ取り早いかもしれません。
世界的にも知名度の高いWebデザインアワード：awwwards
awwwardsは、2009年からオンライン上で展開されているWebデザインのコンテストサイトです。世界40か国でコンファレンスが開かれるなど、知名度も高いアワードになっています。デザインを応募するのは自由にできて、年に1回のベストオブザイヤーには授賞式も。
本家のサイトでは毎日トップページに新しい優良デザインサイトが紹介され、それぞれデザイン・UI・クリエイティビティ・コンテンツの4つの視点で審査とコメントも紹介されます。ブラウザのホーム画面にしておくと毎日1度は新しいデザインに触れられますね。
UI・UXに注目したデザインアワード：CSS DESIGN AWARDS
CSS DESIGN AWARDSも、オンライン上のアワードサイトです。CSS Design Awardsは、個人・企業にかかわらずWebデザインのUI・UXとイノベーションを審査軸にしています。こちらも毎日トップページが更新されます。アーカイブからはノミネート一覧が掲載の近い順に閲覧できます。
UIに絞ったデザインギャラリー
分かりやすいWebサイトを目指すなら、デザインだけではなくどんなUIかも重要です。これらのギャラリーはサイトの見え方を動画でチェックできるのが特徴です。
アプリのUIを複数提案：Mobile Patterns
Mobile Patternsは、UXデザインのアイデアを主眼としたUI・UXパターンのアイデアサイトです。既存のアプリをベースにして、あるUIに対して複数の提案が登録されています。動作がビデオで表示されるのでインタラクティブなデザインエクスペリエンスを想像しやすくなります。サンプル数も豊富です。
モバイル・デスクトップ両方のUIをコレクション：UI Movement
UI Movementは、モバイル・デスクトップ両方を対象にしたサイトのUIをコレクションしているギャラリーサイトです。UIならではの動きを確認しやすいように1つ1つビデオを掲載しています。
ヒーローイメージやトップページのUIだけでなく、サービスサイトのサイトフローをビデオで確認できるのは、UIのレファレンスとしては興味深い機能です。
色、書体など専門性に特化したギャラリー
色やフォントなどの特定の目的があって、デザインのヒントを得たいときは専門性に特化したギャラリーをチェックしてみましょう。
欧文書体のトレンドをチェック：Typewolf
Webフォントが普及して、ホームページのフォントもだいぶん自由に選ぶことが可能になってきました。TypewolfはWebデザイナーが立ち上げたデザイナーがサイト制作で使うとき目線でフォント使いの観点からキュレーションしたWebデザインサイト。ピックアップしたサイトデザインと、レビュー、そして使用フォント名ももちろん掲載されています。
直感的に選ぶカラーパレット：Color Hunt
Color Hunt は、様々な目的のためのカラーコーディネーションを提案しているサイト。サイト全体がカラーパレットのようなイメージです。4色の構成で色面の広いもの→狭いものの組み合わせで構成されています。クリックでカラー番号もすぐに確認できます。
マテリアルデザインが見つかる：Material Design Blog
Material Design Blogは、Googleの推奨するデザインガイドライン「Material Design」に関するデザインやUIに注目したサイト。「ボタンの動き」や「パーツ」などテーマごとにさまざまなポートフォリオサイトからデザイン例を紹介しています。本文は英語ですが、ビジュアルメインなので読めるかどうかの心配はほぼ無し。スマホサイトやスマホアプリのデザインのインスピレーションに役立ちそうです。
フロントエンドデザインのSNS：CodePen
CodePenは、Webサイトのフロントエンド開発と確認環境として使える開発系のサイトです。また、ソースコードをiframeでブログなどに埋め込むことで、ソースとプレビューを記事の中で掲載することもできます。
開発と同時に、登録したデザインをポートフォリオとして利用できるので「Project」のメニューから利用者のデザインやプロジェクトを閲覧することもできます。「Challenges」のコーナーでは毎週お題が提供されているので指定のタグ付けしてサイト内コンテストに応募することも可能です。
最先端のデザインが詰まったおすすめギャラリー
クリエイターによるギャラリーサイトやSNSと連動しているギャラリーが増えています。習慣的にチェックできるようになるのでお勧めです。
世界のクリエイターの新作がチェックできるDribbble
Dribbbleは、デザイナーやクリエイターのポートフォリオ用SNSとしておなじみのサイトです。トップからブラウズしていくのもいいですし、カテゴリからジャンルを分けて巡回チェックしてもよし。SNS型なので、サインアップすれば、気になるクリエイターをフォローして新しい作品をいつもチェックすることもできますし、もちろん自分の作品を世界に向けて公開することも可能！
ブランドやファッションサイトの参考になる：site inspired
site inspiredは、Webデザイナーが個人的にキュレーションしているWebデザインのピックアップサイト。数千のアーカイブがあり、「スタイル」「タイプ」「プラットフォーム」とフリーキーワードでのデザインの絞り込み表示が可能です。インパクトもあり、写真をうまく使ったブランドサイトなどの参考になりそうなサイトが多く集められています。
いかがでしたか？ 普段のデザイン業務に新しいひらめきを与えてくれるようなサイトが新しく見つかりましたか？
BiNDupはデザインにこだわれるCMSですが、カラーコーディネートも簡単にできるCSSデザイン機能「Dress」がさらにバージョンアップ。まだお試しでない方はぜひ、一度チャレンジしてみてください。
BiNDupを無料で使ってみる
BiNDの制作事例を見る
POINT
- 最新のデザイントレンドのフォローアップにはギャラリーサイトを利用しよう
- 毎日更新のアワード系サイトは優れたデザインのチェックに便利
- 特定の目的や書体などにフォーカスしたギャラリーサイトもある