よく使われる素材の名前を覚えておくとデザインがはかどります！
こんにちは！広告会社でデザイナーをしている、かじゅうです！
この記事では、Webデザインで頻繁に使われる素材と英語での検索キーワードを紹介します。
素材を探すときは、日本語だけではなく英語の名称を知っていると探せる素材の幅が増えるのでオススメです。また、Webデザインを学ぶ際には、良く使う素材から覚えると効率的です。
- Webデザインの定番素材一覧
- 日本語と英語対応の名称表
- 参考デザインあり
Webデザインでよく使う定番素材と英語検索キーワードの一覧20選
Webデザインでよく使われる素材とその検索ワードを20種類紹介。
素材別に「有料素材」「無料素材」「デザインサンプル」を紹介しています。
| 素材 | 日本語 | 英語 | サンプルと素材サイト |
 | サンバースト 放射線 | Sunburst (Sun Rays) | 有料素材 無料素材 デザインサンプル |
 | ボケ | Bokeh | 有料素材 無料素材 デザインサンプル |
 | バッジ メダル | Badge Medal | 有料素材 無料素材 デザインサンプル |
 | ストライプ ボーダー | Vertical Stripes | 有料素材 無料素材 デザインサンプル |
 | レンズフレア | Lense Flare | 有料素材 無料素材 デザインサンプル |
 | ポリゴン プリズム | Polygon | 有料素材 無料素材 デザインサンプル |
 | ヴィンテージフレーム | Vintage Frame | 有料素材 無料素材 デザインサンプル |
 | 水彩 | WaterColor | 有料素材 無料素材 デザインサンプル |
 | 雷 | Electricity, Lightning | 有料素材 無料素材 デザインサンプル |
 | 紙吹雪 クラッカー | Confetti | 有料素材 無料素材 デザインサンプル |
 | カーテン | Curtain | 有料素材 無料素材 デザインサンプル |
 | 月桂樹 | – | 有料素材 無料素材 デザインサンプル |
 | 木版 | Wood Board | 有料素材 無料素材 デザインサンプル |
 | カリグラフィー | Calligraphy | 有料素材 無料素材 デザインサンプル |
 | 水 | Water | 有料素材 無料素材 デザインサンプル |
 | 花 | Flower(watercolor) | 有料素材 無料素材 デザインサンプル |
 | 布 サテン ドレープ | Silk Satin Drape | 有料素材 無料素材 デザインサンプル |
 | スプラッシュ | Splash | 有料素材 無料素材 デザインサンプル |
 | 湯気 煙 | Steam Smoke | 有料素材 無料素材 デザインサンプル |
 | コミック吹き出し | ComicBalloon | 有料素材 無料素材 デザインサンプル |
素材サイト「有料」と「無料」どっちを使う？
「有料素材」と「無料素材」の大きな違いは、素材の質にあります。
有料素材はやはり品質が良いものが多く、プロのデザイナーならなるべく有料素材を使いたいです。
しかし実際に全ての素材にお金を払うことは現実的ではありません。写真やアイコン、テクスチャなどの「無料」で使えるものは利用しても構いません。ただし、無料の素材を使う際には「商用OK」「著作権表記不要」「クオリティが高い」に注意して使いましょう。
つまり、無料の素材でも優れた素材を探すことが出来るかが大事なのです。
この記事では、「有料素材」と「無料素材」を紹介しています。案件やデザインレベルにあった素材を探していただければと思います。
| コスト重視 | 品質重視 | 時間重視 | |
| 有料素材サイト | × | 〇 | 〇 |
| 無料素材サイト | 〇 | × | × |
この記事で紹介している「有料」素材サイト
「PIXTA(ピクスタ)」人物や風景などの素材が揃う有料素材サイト
日本人の人物をはじめ、高品質な写真素材が揃う有名な有料素材サイトです。利用シーンに応じた写真が非常に豊富で、かつ写真のクウォリティーも高いのが特徴です。プロ志向で少し高い目の有料素材ですが、こだわりたい方にはおすすめです。
「Shutter Stock」写真から画像・グラフィックまですべてを網羅した素材サイト
画像、動画クリップ、音楽など、2億7,000万点におよぶロイヤリティフリー素材を利用できる、世界的に有名な巨大有料素材サイトです。前述の「PIXABAY」のスポンサーサイトでもあり、さらに高品質・広範囲の資料シーンの素材が揃っています。
この記事で紹介している「無料」素材サイト
「写真AC」日本最大の無料写真素材サイト
| 素材量 | 種類 | 金額 | ライセンス |
| 中 （特定ジャンルに強い） | 写真 | 無料（９点/１日） | ダウンロード時確認要 |
写真ACは、日本の巨大写真素材サイトです。利用には無料の会員登録が必要ですが、人物・風景・パターン画像など多くの画像が提供されています。無料版は制限がありますので、本格的に使う方は有料会員のプレミアムプランもおすすめです。
「イラストAC」日本最大の無料イラスト素材サイト
| 素材量 | 種類 | 金額 | ライセンス |
| 中 （特定ジャンルに強い） | イラスト （jpeg・png・eps） | 無料（９点/１日） | ダウンロード時確認要 |
イラストACは写真ACの兄弟サイトとなる日本最大級のイラスト素材サイトです。利用には無料の会員登録が必要。イラスト素材が多く、使いやすい素材が多いのでオススメです。
「フキダシデザイン」様々な種類の吹き出しが1000以上DL可能
| 素材量 | 種類 | 金額 | ライセンス |
| 中 | 吹き出し （jpeg・png・svg） | 無料 | ライセンスご案内 |
デザイン向けの吹き出し素材をダウンロードできる素材サイトです。様々な形の吹き出しがダウンロードできるので、ブックマーク必須です。svg形式でダウンロードできるのが地味にうれしい。
「freepik」ベクター、写真、PSDが無料ダウンロードできる素材サイト
| 素材量 | 種類 | 金額 | ライセンス |
| 多 | 写真・イラスト・デザイン素材 （ベクターあり） | 無料 プレミアム会員あり | ライセンスご案内 |
freepikは何百種類ものグラフィック素材が無料でダウンロードできる素材サイト。ベクター画像やデザイン素材など幅広く網羅しています。海外製のおしゃれなテンプレートも多くPSD、AIデータもダウンロードできます。本格的に使う方は有料会員のプレミアムプランもおすすめです。
Webデザインでよく使う定番素材と名称の一覧20選：まとめ
Webデザインでよく使う定番素材と名称を20種類紹介しました。
Webデザインの勉強は、素材から学ぶと効率的です。素材やあしらいには、効果的な使い方があります。デザインを学ぶときは、どのような素材やあしらいがどのように使われているか注目するといいと思います。
こちらの記事では、定番素材を使用したデザイン例をまとめていますので是非合わせてご覧ください。
