【個人サイト向け】おしゃれな素材の探し方【2023】
「おしゃれな素材の探し方がわからない」
「理想の素材のイメージはできるけど具体的な検索キーワードがわからない」
「自分の好みをイメージできない」
そんな方向けの記事です。
この記事の大まかな流れ
- Pinterestで理想のイメージを発見する・固めていく
- freepikの絞り込み検索を理解する
- freepikで英語のキーワードを知る
- 英語のキーワードでUnsplashを検索してみる
この記事で分かること
- 個人サイト（≒Webサイト）素材の探し方
- 特に全画面背景画像やヘッダー画像
- ほぼ無加工で画像を利用することを想定
この記事で分からないこと
- 同人誌やポスターやpixiv表紙など、固定レイアウト（複数ベクター配置や文字入れ）デザインまでは、この記事でカバーしていません
- 和風や和柄、伝統的なデザイン、日本のサブカル系（アニメや漫画など）のデザインも不向き
1. Pinterestアプリ
Pinterestへアクセス
↓
スマホにアプリをインストール
ブラウザ版もありますが、スマホではアプリがおすすめ。今から説明する「シェア」機能がスムーズになります。
2. Pinterest設定ヒント
① 言語設定はEnglish(UK)
ウィキペディア記事によると、イギリスの方がユーザー年齢層が若いとのこと。私は何年もUK設定でPinterestアプリを利用していますが、
「若い女性に人気のアイデアやインスピレーション」
こういったイメージを探すなら、言語設定はEnglish (UK) で問題ないと思います。
「英語はわからない」ひとは、諦めて英語のキーワードと向き合ってください。おしゃれな素材を探すためです。具体的な手順は今から説明しますので、気楽にこの記事を読んで、とりあえず試してみてください。
② ボードの名前も英単語にしてみる
Pinterestアプリの「ホーム」に流れてくるイメージをできるだけ調整するためです。
実際に効果があるかどうかわかりませんが、日本語のピンはイメージと違うことが多いので、私は英単語でボードの名前を統一しています。
3. Pinしていく
「何の英単語で検索すればいいかわからない」場合は、とりあえず以下をコピペしてPinterestアプリ内検索してください↓
instagram template ideas
→検索結果URL
webデザインのトレンドや“おしゃれ”っぽさを探すなら、とりあえずInstagramのテンプレート系から見つけると、より早く見つかると思います。
好きなデザインをどんどんピンしてください。
4. キーワードを見つける
「instagram template ideas」で検索してスクロールすると、
「aesthetic instagram template」
というRelated searchesが提案されました（私のアカウントの場合）
この「aesthetic」をメモしておきます
5. freepikのおすすめ利用法
次にfreepikへアクセスします。
① スマホブラウザは50%縮小表示
iOSは画像【freepik使い方①】を参考にしながら、Safariブラウザの表示倍率を50%縮小します。
縮小表示すると、
❶ 各画像の全体の印象や構図を把握しやすく、
また、
❷ 画面内にたくさん画像表示できるため、
効率的に検索できます。
② 言語はEnglish
Pinterestやfreepikは英語圏のサービスです。両方とも日本語表示可能ですが、タグなどは翻訳が雑なことが多いです。
理想の素材を探す際は、雑翻訳されたタグだと、こまかなニュアンスを反映させにくいです。
freepikはページ最下部で言語変更できます。
③ Authorは@freepikに限定
freepik公式アカウントが投稿した素材を絞り込み検索できます↓
https://www.freepik.com/author/freepik
【freepik使い方②】参照
freepik公式アカウントの素材は、
- 流行りをおさえたデザインが投稿されやすい
- 適切なタグ付けやタイトル付けがされている
- →そのため、検索しやすい
- freepik公式アカウント以外は投稿作品が削除されることがある
freepik初心者の方はぜひ公式アカウント限定で探してみてください。
6. freepikの絞り込み検索
とりあえず以下の単語でfreepik公式アカウント内を検索します
aesthetic background→検索結果URL
次に絞り込み検索していきます。
検索フォーム右端のアイコンをタップ
→【freepik使い方画像③】
絞り込みの中身について順に説明します
Sort by
→【freepik使い方画像④】
通常は「Most relevant」で良いですが、流行り廃りの激しいデザインは「Last year」がおすすめ。
たとえば「gradient」はすごく“流行りっぽさ/古っぽさ”が出ます。難しい。gradientをMost relevantで絞り込むと少し古い投稿が出てきます。Last yearだと最近のおしゃれな素材が出ます。
「vintage flower」などはMost relevantでも問題ありません。
Category
→【freepik使い方画像④】
Webサイトの背景/ヘッダー画像を探すなら、
【Vectors】イラスト系
【Photos】写真
この2つから選ぶことになります。
License
→【freepik使い方画像④】
とりあえずFreeから探すと思います。「このシリーズいいな」と思ったら一部がPremiumのことが多いです。
AI generated
→【freepik使い方画像④】
最近追加された機能です。私はまだ使ったことはありません。
Color
→【freepik使い方画像⑤】
Vectorsを探すときは特にすごくよく使います。かなり精度が高いです。
People
→【freepik使い方画像⑤】
CategoryでPhotosを選択すると表示される選択肢になります。Webサイト背景やヘッダー画像としては「No people」を選ぶことが多いかと思います。
File type
→【freepik使い方画像⑥】
スマホでDLするならJPG一択かと思います。実際は、ほぼ全部のVerctorとPhotoにJPGが含まれます。Webサイト素材探しならば必須の絞り込みではありません。
Orientation
→【freepik使い方画像⑥】
ラテ式CSS用の全画面背景写真ならばVerticalがおすすめ。
おすすめ背景紹介の「Background Image」では、写真5枚中4枚がVerticalです。Verticalで絞り込み検索して探しました。
ラテ式CSSベースのサイトトップは、スマホ閲覧の場合、画面の上半分がサイト名レイアウトです。
つまり、全画面背景画像は上半分が目立つ、注目しやすい。
Horizontalはスマホ閲覧だと必ず左右がトリミングされます。横長の写真は、必ずしも中央上部にオブジェクトがあるとは限りません。
正方形の写真素材はあまり見かけません。
縦長の写真は、上半分にオブジェクトや構図の中心が集まっているものを見つけやすいです（※私個人の体感）
Vectors（イラスト系）はSquareだとテクスチャやパターン（模様）を見つけやすいので、よく絞り込みにSquareを使います。
Style
→【freepik使い方画像⑥】
すごく便利なのでぜひ使ってください。イラスト系（Vectors）で重宝します。
私がよく使うのはGradientとWatercolorそしてHand drawn。
ひとひねりさせたいときはGeometric。
Flatもよく使います。
その他
Freepik's choiceは使ったことがありません。@freepik公式アカウントで絞り込み検索しているので、使う機会がありません。
Quick editも使ったことはないですが便利そうだなあとは思っています。全画面背景画像やヘッダー画像探しにはそこまで必須ではないと思います。
7. freepikをpin
では、適当に絞り込みます。
検索キーワードは引き続き↓
aesthetic background
【Sort by】Most relevant
【Category】Vectors
【License】Free
【Color】グレー
【Style】Hand drawn
→検索結果URL
色はグレーで絞り込むと落ち着いた印象のものが出やすいのでよく適用しています。
Free Vector | Free vector watercolor hand drawn background with plants
↑の作品が気になったので詳細ページへ飛びました。
ここでとりあえずpinします。
→【freepik使い方画像⑦】
- freepikで気になる素材を見つける
- とりあえずPinterestでシェア（ボードに保存）する
- 気になる素材を集めたボードができる
- むやみにfreepik素材をダウンロードせずに済む
- Pinterestボードに集めることで、素材同士を見比べやすい、選別しやすい
- Pinterestボードの各ピンから「似ているピン」を探せる
という流れになります。
8. freepikのタグ
さきほどの作品ページのタグ一覧をチェックします。
watercolor water
hand painted
artistic background
abstract watercolor
watercolor background
hand painted background
art background
paint background
watercolor art
watercolor
ink background
water paint
paint art
abstract paint
watercolor paint
ink
paint
paint stain
abstract art
art
manchas
watercolor stain
ink stain
hand drawn abstract
hand paint
ink in water
background
abstract background
hand drawn background
abstract
artist
hand art
water abstract
hand drawn
water background
すごい数のタグです。ですが、このタグこそfreepikのメリットなのです。このタグ一覧で「英語の検索キーワード」を覚えていきます。
暗記する必要はありません。気になる素材を見つけたら、タグをメモしていってください。
私がよく使うキーワードはこうなっています↓
abstract hand drawn watercolor minimalist pattern
freepik投稿作品ページで利用するのは、このタグ一覧と、
「More in this series」
という関連ページです。似た雰囲気の素材を同時に探せるのでおすすめ。
→【freepik使い方画像⑧】
9. freepikの注意点
freepikはリンクウェアです。Webサイトで利用する際は必ずfreepikへリンクしてください。
どうやってリンクすればいいかはfreepikのFAQにまとまっています。
非会員はダウンロード制限があります。無料会員になると、すこし制限が緩和されます。
むやみにDLしないためにも、Pinterestのピン保存を利用して、目的の素材を絞り込む/選別するのがおすすめです。
10. Unsplash
では、さきほどの「aesthetic」でUnsplashを検索してみます。
設定言語はもちろんEnglishです。
ブラウザ縮小表示50%にします。素材を探しやすいです。
Unsplash検索フォームに「aesthetic」まで打ち込むと、検索候補に「aesthetic wallpaper」が表示されました。そのまま選択、検索。
検索結果URL
→1500+ Aesthetic Wallpaper Pictures | Download Free Images on Unsplash
残念ながら、Unsplashは検索性能が乏しいです。タグ検索は限られた単語のみ、3単語以上はごく一部のみしか反映されないようです。色選択も人の有無も未実装。
そうなると、1〜2単語で目的のイメージを絞り込むしかありません。
そこでPinterestです。理想のイメージに近い単語をある程度ざっくり絞り込む。
次にfreepik。正確にタグづけされているので、的確な検索キーワードを拾いやすい。色やデザインスタイルの絞り込みも可能。
さきほどのUnsplash検索結果「Aesthetic Wallpaper」は、まあまあイメージに近いです。おしゃれ。透明感がある。
Portraitを選べるので、縦長写真で絞り込みます。
気になった写真を見つけました。詳細を開きます。
a vase filled with baby's breath sitting on top of a bed photo – Free Tehran province Image on Unsplash
ここでもまたShareでPinterestを使います。どんどんpinしてPinterestボードを埋めていきましょう。
同ページのRelated tagsを確認します
Tehran Province
Iran
Tehran
Hd Aesthetic Wallpapers
Aesthetic Flowers
Flower Bouquet
Bouquet
Baby Breath
Babybreath
Beige Color
Aesthetic Backgrounds
Hd Aesthetic Wallpapers
Home Design
Home Interior
Home Decor
Vintage Backgrounds
Beige Tones
Homedecoration
Beige Background
Homedesign
Free Pictures
やはり「Aesthetic」という単語が目立ちます。意味は「美的」。
しかし、素材探しする際に、まず一発目で「美的」と検索することは少ないと思います。
Collections
Unsplashはおそらくコレクションのほうから見つけ出すことになると思います↓
1500+ Aesthetic Wallpaper Pictures | Download Free Images on Unsplash
11. Unsplash日本語版
ためしに「美的壁紙」でUnsplash日本語版を検索してみます
→ 1500 以上の美的壁紙写真 | Unsplashで無料の画像をダウンロード
英語版と検索結果はほぼ同じ。先ほどと同じ写真も見つかりました。
ベッドの上に座っている赤ちゃんの息で満たされた花瓶の写真 – Unsplashの無料テヘラン写真
タグも確認します
テヘラン
テヘラン州
イラン
花束
花束
審美的な花
家の装飾
ベージュの背景
ホームデザイン
Hd美的壁紙
美的背景
ベージュ色
ベビーブレス
赤ちゃんの息
屋内で
まくら
リビングルーム
花の画像
花の画像
ソファー
無料の写真
日本語だと、タグだけでは探しにくそう、ですよね…？
ちなみに「きれいな壁紙」でUnsplash日本語検索すると、荘厳な風景がたくさん出てきます。確認すると、beautiful wallpaperの日本語訳が「きれいな壁紙」になっていました。
12. FAQ
自分の好みがわからない
Pinterestで気になるものをpinしてください。どんどん好みのイメージが見つかります。
本当に何もかも方向性すらわからない場合は、
- 海外インテリアブランド
- 国内インテリアブランド
- コスメブランド
- 洋菓子メーカー
このあたりから「家に飾りたい」「スマホのホーム画面にしたい」と思うパッケージや商品を探すのがおすすめ。
Webサイトの背景/ヘッダー画像向けならば、
- ずっと見ていたいと思う
- 見るとリラックスできる
- 家に飾れたら嬉しい、幸せになれる
そんな基準で探すのもおすすめ。わからないときは、私のおすすめ背景画像「Background Image」の配布元freepikページへ飛んでみるのもいいかもしれません。
それをPinterestでpinしていけば、似たような素材が見つかるはずです。
「かわいい」など漠然とした
イメージしかない
「かわいい」という単語をもっと掘り下げるならPinterstがおすすめ。
手順で説明したとおり「Instagram template」という単語を含めてPinterest検索すると、なんかかわいい感じのデザインアイデアが見つかります。
そこから自分の「好き」を集めてpinしていきましょう。
イメージはあるが検索キーワード
がわからない
今までで説明した手順をくりかえして、キーワード探しをがんばってください。
英語です。英語からキーワードを選ぶと他サービスでも探しやすくなります。
おわりです！
おしゃれ素材探し、がんばってください！
