「自分の頭だけでデザインするのは
今すぐやめてください」
制作会社に入った新人の頃、
先輩に最初に言われたことが
これでした。
当時の私は
「参考を使うのはパクリだ」
という感覚があって、
真っ白なキャンバスに向かって
唸り続けていました。
結果、
1件3,000円のバナーを
3日かけても完成しない、
という状態でした。
↑画像をクリックすると、動画バージョンが見れます。
こんにちは、久保なつ美です。
プロのデザイナーほど
制作前のリサーチに時間をかけています。
以前、著名な装丁デザイナーの方たちと
ご一緒する機会があったんですが、
その方々も当然のように
世の中の作品を研究して、
良いところを取り入れて
自分の制作に活かしていました。
参考にすることはパクリではありません。
↑画像をクリックすると、動画バージョンが見れます。
プロとして稼ぎ続けるための、
正しい方法です。
今日は、私が現場で実際に使っている
参考サイト6つと、
その使い分け方をすべて公開します。
参考サイトを使う3つのメリット
まず、なぜ参考サイトを使うべきかを
お伝えします。
↑画像をクリックすると、動画バージョンが見れます。
時短・時給が上がる。
「どうしようかな」と悩んでいる時間が
カットできます。
制作が遅い人の多くは、
この悩み時間が長すぎるんですよね。
方向性が決まっていれば、
制作スピードは劇的に変わります。
クオリティが上がる。
プロの正解の構造を借りることで、
クライアントの期待を超える成果物が
作りやすくなります。
「この水準まで持っていく」
という目標があるだけで、
仕上がりが変わります。
引き出しが増える。
使わなかった案件の情報も
蓄積されていきます。
「あの時見たデザインだ」
という引き出しが、
後から役に立つんです。
参考サイト1：Pinterest（ピンタレスト）
↑画像をクリックすると、動画バージョンが見れます。
アイデア出し・方向性決めに最強
世界最大級の画像・デザインストックサービスです。
最大の強みはAIのリコメンド機能です。
1枚の画像をクリックすると、
そのテイストに似たデザインが
無限に提案され続けます。
案件別にボードを作っておくと
後から参照できて便利です。
↑画像をクリックすると、動画バージョンが見れます。
「A社様」「B社様」という名前で
ボードを作り、
参考画像を貼り込んでいく使い方が
おすすめです。
使うシーン：全案件のスタート時に。
制作の方向性を決める段階に最適です。
参考サイト2：SANKOU!（さんこう！）
↑画像をクリックすると、動画バージョンが見れます。
ホームページ・LP制作の高品質事例集
厳選された国内のウェブサイト・LPの
ギャラリーサイトです。
掲載基準が厳しいため、
クオリティの高いデザインだけが載っています。
タイプやスタイルで絞り込みができるので、
目的のデザインが見つけやすいんですよね。
↑画像をクリックすると、動画バージョンが見れます。
使うシーン：ホームページ・LP制作全般に。
高級感・信頼感を出したい案件、
コーポレートサイトを作る時に重宝します。
参考サイト3：Banner Library（バナーライブラリー）
↑画像をクリックすると、動画バージョンが見れます。
「今っぽさ」をインプットしたい時に
美しさと雰囲気を重視した
バナーが集まっているギャラリーサイトです。
「おしゃれにしてください」
「今っぽい感じで」
というざっくりしたオーダーへの
対応に役立ちます。
「可愛い」という言葉一つとっても、
ブリブリした可愛さと
大人っぽい可愛さは全然違う。
ビジュアルで合わせることが大切だと
思っています。
↑画像をクリックすると、動画バージョンが見れます。
使うシーン：おしゃれ・ブランド重視の案件に。
業界別にカテゴリーが分かれているので、
トレンドチェックにも使えます。
参考サイト4：Banner.com（バナードットコム）
↑画像をクリックすると、動画バージョンが見れます。
困った時のマニアック検索
他のサービスと違い、
「縦割り」「横割り」「テキストのみ」
といったデザイナー用語で
タグ検索ができます。
「写真なしで文字だけで見せたい」
「縦長のバナーの参考が欲しい」
という時に使います。
↑画像をクリックすると、動画バージョンが見れます。
使うシーン：レイアウトに煮詰まった時に。
特定の手法を探したい時に重宝します。
参考サイト5：サムネ（SAMUNE）
↑画像をクリックすると、動画バージョンが見れます。
YouTubeサムネイルのトレンドを確認
YouTubeのサムネイルだけを集めた
ギャラリーサイトです。
業界別にカテゴリーが分かれているので、
担当するチャンネルのジャンルに近い事例を
まとめて確認できます。
YouTubeサムネイルには
「YouTubeらしさ」があります。
文字の大きさ、インパクトの出し方——
バナーとは異なる文法があるんですよね。
↑画像をクリックすると、動画バージョンが見れます。
使うシーン：YouTubeサムネイル制作案件に。
参考サイト6：TVer
↑画像をクリックすると、動画バージョンが見れます。
クリックされるサムネイルを見たい時の穴場
これ、あまり参考サイトとして
使われていない穴場です。
テレビ番組のサムネイルは
クリック率に命をかけて設計されています。
しかも視聴数が多いものほど
ランキング上位に来るので、
「クリックされるデザイン」の
優秀な事例が自然と集まるんです。
↑画像をクリックすると、動画バージョンが見れます。
使うシーン：エンタメ系・バラエティ系の制作に。
とにかく視線を引きつけたい案件でも
参考になります。
実務での使い方：3段階リサーチ
参考サイトは、
目的に応じて使い分けると
効率が上がります。
↑画像をクリックすると、動画バージョンが見れます。
制作前——まずPinterestで方向性を決める。
10〜20枚程度の参考画像を収集して、
「こういうテイストで行こう」を
ここで決める。
この段階に15分使うだけで、
その後の制作時間が大幅に変わります。
制作中——クオリティの基準を確認する。
SANKOU!やBanner Libraryで
プロレベルのデザインを見て、
「自分の作品はこの水準に近いか」を
確認しながら仕上げます。
仕上げ・特定の手法が必要な時——
Banner.com・サムネ・TVerを
案件の性質に応じて活用します。
↑画像をクリックすると、動画バージョンが見れます。
今日ご紹介した6サイトを
今すぐブックマークしておいてください。
そして次に制作する時は、
Photoshopを開く前に
まずPinterestを開くことから
始めてみてください。
この順番を習慣にするだけで、
作品のクオリティが変わります。
▼WEBデザインのスキルを身につけてお仕事にしたいという方に、
WEBデザイナーを4500名以上育ててきた久保から
20レッスンをプレゼントします。
音声と記事でしっかり学べる超優良級のコンテンツなので
ぜひ登録して受け取ってください。
画像をクリックしてLINEに登録するとプレゼントがすぐもらえます！
WEBデザイナーとしての働き方について、
無料のオンラインセミナー（3時間）で詳しくお伝えしています。
こちらからお申し込みいただけます。
↓この記事はYouTube動画をまとめています。
動画もぜひチェックしてみてください。
久保なつ美｜Profile
日本一のWEBデザインスクール「デザスク」校長として、累計4,500名以上のプロを輩出。2015年以降、成功率日本一を誇り、東京MXの30分特番をはじめTBSや地方TVなどメディア取材も多数。WEBデザイン情報をSNSで発信し、総フォロワー数は12万人超。著書に『根性なしがWEBデザイナーに憧れて』（幻冬舎）。
