「Stories by Freepik」超おすすめ!無料とは思えないイラスト画像サイト

Illustration by Stories by Freepik

こんにちは、アナログ子です。

突然ですが、こんな悩みを持っていませんか?

「記事は書けたのに、イラスト選びに時間がかかる…」

画像サイトを渡り歩き、こだわって探していると結構時間がかかってしまいますよね。

そこで、おすすめしたいのが「Stories by Freepik」です。

Stories by Freepikの特徴
  • 無料
  • 商用利用OK
  • 超ハイクオリティ
  • カスタマイズできる
  • アニメーション化できる

「Stories by Freepik」は、クオリティの高いイラストを無料で使うことができるサイトです。しかも、イラストの色を変えたり、動きをつけたり、細かくカスタマイズすることが可能です。

あなたのイメージにぴったりと合ったイラストへ、変えられますよ!

スポンサーリンク

欲しかったイラストが見つかる!Stories by Freepik

toppage of stories
Toppage of Stories

「Stories by Freepik」 は、クオリティの高いイラストを無料で提供しているサイトです。

海外のサイトなので、イラストは英語で探します。とはいえ、直感的な操作でいけるので、英語が苦手な人も大丈夫です。

 特徴まとめ

会員登録|不要

商用利用|可

出典の表記|要

ファイル形式|SVG、PNG

イラスト編集|可

アニメーション化|可

一番の特徴は、アニメーション化ができることです!いくつかのパターンが用意されており、アニメのようにイラストを動かすことが可能。

はじめて見たときは、本当に驚きました。ブログやWebサイトで使えば、印象づけるのに役立つと思います。

それでは、さっそく使い方を解説します。

Stories by Freepik の使い方

Stories by Freepik の使い方は、次の4ステップです。

  • イラストを選ぶ
  • カスタマイズする
  • ダウンロードする
  • 出典を表記する

①イラストを選ぶ 

まずは、下のリンクから「Stories by Freepik」へ移動しましょう。

〉〉Stories by Freepikへアクセス!

たくさん表示されているイラストの中から、好きなものを探してもいいのですが、「キーワード検索」「スタイル」「タグ」の3つの方法で、イラストを選ぶことができます。

キーワード検索で選ぶ

Search window

1つ目は、キーワード検索で選ぶ方法です。

キーワードは英語で入力しましょう!

検索窓にキーワードを入力すれば、関連するイラストだけを表示させることができます。英語が分からない場合は、Google翻訳が便利ですよ。

〉〉Google翻訳

スタイルで選ぶ

Styles

2つ目は、スタイルで選ぶ方法です。

「Stories by Freepik」 のイラストには、5つのスタイルがあります。

  • Rafiki
  • Bro
  • Amico
  • Pana
  • Cuate

トップページの左側に「STYLES」が表示されています。はじめはAll(すべて)になっていますが、スタイル名を選択すれば、スタイルごとに表示できますよ。

それぞれのスタイルを順番に見てみましょう。

Rafiki

Rafiki
Illustration by Stories by Freepik

Bro

Bro
Illustration by Stories by Freepik

Amico

Amico
Illustration by Stories by Freepik

Pana

Pana
Illustration by Stories by Freepik

Cuate

Cuate
Illustration by Stories by Freepik

5つとも同じ「Blog post」というコンセプトのイラストです。スタイルごとに特徴があって、面白いですよね。

タグで選ぶ

Tags

3つ目は、タグで選ぶ方法です。

TAGS」にタグ名が表示されています。自分の探したいキーワードのタグがあれば、クリックしてみましょう。

タグ名に関連するイラストが表示されます。

②カスタマイズする

Customize illustrations

なんと、「Stories by Freepik」 では、イラストをカスタマイズできます。カスタマイズできるのは、背景レイヤーです。

使いたいイラストが決まったら、クリックしてください。カスタマイズをしてみましょう。

この記事では、「Blog post」(Amico)のイラストを使います。

色をカスタマイズ

Change color」のボタンをクリックしてみましょう。

Colors

カラーパレットが出てきました。ここで好きな色を選択し、変更することができます。

背景、レイヤーをカスタマイズ

背景は「BACKGROUND」、レイヤーは「LAYERS」のボタンで切替表示できます。

Background and Layers

上のイラストでは、「LAYERS」の「Device」をクリックしました。PCが消えてしまいましたね。

結構、自由にカスタマイズができます。

※イラストによっては、変更できないものもあります。

クマさん
クマさん

カスタマイズできるの、いいね!

③ダウンロードする

カスタマイズが終わったら、いよいよダウンロードです。イラストのファイル形式は、「SVG」「PNG」の2つです。

Download
Download PNG

ブログ記事で使う画像であれば、PNGを選びましょう。「Downlad PNG」をクリックで、ダウンロードできます。

④出典を表記する

attribuition

イラスト画像をダウンロードしたあとに、メッセージが出てきました。

イラストは出典を表記しないとダメだよ、忘れないでね!」と書かれています(たぶん、そんな感じです)

注意!

Stories by Freepik のイラスト画像は誰でも無料で使うことができますが、出典の表記をしなくてはいけません。

イラストを利用したら、「Illustration by Stories by Freepik」と記載してサイトへのリンクをつけておきましょう。

attribution

Copy and Attribute」をクリックすると、出典表記用のコードをコピーすることができます。

ライセンスについて詳しく知りたい方は、利用規約も確認しておくといいでしょう。

〉〉Stories by Freepikの利用規約

これはすごい!イラストのアニメーション化

Illustration by Stories by Freepik

Stories by Freepik では、上にある画像のようなアニメーション化ができます。イラストに動きをつけられるのですね!これはすごい!

クマさん
クマさん

動きがつくと面白いね!

アニメーション化する方法

Animate it

まずは、アニメーション化したいイラストを選びましょう。イラストの右上にある「Animate it」をクリックします。

Elements

動かしたいパーツを「ELEMENTS」で選びます。選択中のパーツは、イラスト上で色が変わります。

Animation

次に、パーツの動きを選びます。「ENTRANCE」「LOOPING」のリストの中から好きなものをクリックしてください。

スライドインしたり、クルクルと回ったり、さまざまな動きを割り当てることができます。

Reset Randomize play button

プレビューを表示する場合は、右上にある再生ボタンをクリックします。リセットやランダムに動きをつけることもできます。

  • Reset=リセット
  • Randomize=ランダムに動きをつける
  • ▶=プレビュー
Download animation

アニメーションのカスタマイズが終わったら、「Export」をクリックしましょう。ダウンロードページへ移動します。

GIF」「Video」またはHTMLファイルとしてダウンロードできます。HTMLコードはコピーもできるようになっていますよ。

あなたのサイトにストーリーを!

今回は、イラスト画像サイト「Stories by freepik」をご紹介しました。

出典表記はしないといけませんが、クオリティの高いイラストを無料で使えるのは嬉しいですよね。

バリエーションも豊富でとても使いやすいサイトです。ブログ記事などのグレードアップにぴったりですね。

いろいろなカスタマイズができるので、人とは違ったイラストを使いたいという方にもいいかもしれません。

わたしは、Stories by Freepik に出会ってから、イラスト選びが楽しくなりました。特に、アニメーション化が面白いので、おすすめです!

〉〉Stories by Freepikへアクセス!

Illustration by Stories by Freepik

こちらの記事もおすすめです

ブログ
スポンサーリンク
シェアする
アナログ子をフォローする
TRIGGER BLOG

コメント

アナログ子

こんにちは、アナログ子です。「アナログな自分から変わりたい」ブログ、HTML、CSS、WordPressなど勉強中。自分が困ったこと、気になったことを記事に書いています。好物は「焼きいも」

アナログ子をフォローする
タイトルとURLをコピーしました