ワンクリックに命がけのWEB・ホームページ制作会社「エムハンド」

インバウンドサイトを作るときに知っておきたいこと

かっこいいグラフや表が簡単に!インフォグラフィック作成WEBサービス5選+

  • WEBデザイン

スマホの普及に伴って、文字情報が読まれにくくなってきました。また、画像を含むコンテンツの方が文字だけのコンテンツよりもシェアされやすいことは、調査結果などからも報告されています。WEBコンテンツやブログ記事、SNSなどで、伝えたい情報をわかりやすくビジュアル表現する「データビジュアライゼーション」が、以前にもまして重要になっています。

プロに作成をお願いするという手もありますが、ブログの更新や常に新しいデータを掲載していくようなメディアでは、自分たちできれいなグラフやビジュアルをつくりたいと思うことも多いと思います。そこで今回は、デザイナーではない人でも使えて、納得のクオリティのグラフや表、インフォグラフィックを作れるWEBサービスをご紹介したいと思います。

おすすめグラフ&インフォグラフィック作成サービス

Infoactive

01https://infoactive.co/

Infoactiveは、ブラウザ上でデータを入力してインフォグラフィックを作成できるサービス。使いたいデータが入ったGoogle Driveスプレッドシートを取り込んで、そのデータをもとにグラフや地図、チャートなどをつくることもできます。この連携機能は大変便利で、スプレッドシートのデータに変更を加えたら、Infoactiveで作成されたインフォグラフィックスも自動的にアップデートされるしくみになっています!

操作もシンプル。テキストを加えたり、グラフの色やスタイル、デザインを変更したりといった作業も、スクリーンに出てくるアイコンをクリックして簡単に行えます。作成したインフォグラフィックスはブログやサイトに取り込むことができるので、WEBで使用するインフォグラフィックの制作にうってつけのサービスです。


デモ動画(英語)

Piktochart

02http://piktochart.com/

Piktochartでは、最初に「インフォグラフィックス・レポート・バナー・プレゼンテーション」の4つの中から、制作したいものを1つ選ぶようになっています。さらに制作方法として、豊富なテンプレートを活用して制作する方法と完全にゼロから作る方法のどちらかを選択します。このサービスでも、Google Driveに保存されたスプレッドシートやCSVの読み込みに対応しています。

デザインパーツやチャートの種類が豊富。背景を複数の中から選択できたり、チャートの中に使用するシンボルを変更できたり、など誰でも簡単にクオリティの高いインフォグラフィックスを作成することができます。作成したインフォグラフィックスの書き出しは、様々なサイズでのJPEGやPNG画像での保存に対応。有料プランになるとPDFでの書き出しや高解像度での画像保存も可能になります。もちろん、外部WEBページへの埋め込みや共有リンクの生成も行えます。

使い方の紹介記事

「プレゼンまで時間がなくても大丈夫!Piktochartの使い方とデザインの基本1」


デモ動画(英語)

infogr.am

04https://infogr.am/

infogr.amも、デザインクオリティの高いグラフやインフォグラフィックを作成できるWEBサービス。様々な形式のグラフの他、散布図、バブルチャート、ピクトリアル、ヒエラルキーチャート、テーブル、プログレスチャート、ワードクラウド、ツリーマップなど、非常に多くの図表やインフォグラフィックを作成できルのが特徴です。無料で使用できるテンプレートには限りがありますが、その中でも十分にクオリティの高いビジュアル作成が行えます。

このサービスでは、インフォグラフィックスの中に画像や動画を配置することも可能。動画のインフォグラフィックは注目されているので、要チェックですね。外部WEBページへの埋め込みやリンク共有は無料でも可能ですが、データのダウンロードに関しては、有料プラン(Pro)の契約が必要になります。


デモ動画(英語)

iChart

05http://icharts.net/

iChartsは、シンプルで見栄えの良いインフォグラフィックスを作成するのに向いています。作成できるグラフは、横棒グラフ、縦棒グラフ、円グラフ、面グラフ、線グラフ、複合グラフなど。iChartsであらかじめ作成したチャートをインフォグラフィックに挿入することもできます。

作成方法としては、データを手入力する方法、Excelなどにまとめたデータを読み込む方法、あらかじめ備えられているデザインテンプレートを選んで、それをもとにデータを加工する方法など、さまざまな方法が用意されています。外部WEBページへの埋め込みやリンク共有は無料版でも行え、手軽に使い始めることができるサービスです。


デモ動画(英語)

日本語版のグラフ作成サービス

Eegraph(イーグラフ)

06https://eegraph.com/

グラフ作成のオンラインツールは英語のものが多く、これまで紹介したものも英語版になっています。そんな中で貴重な日本語サービスが、このEegraph。CSV、TSVのデータを取り込んだり、数値を入力したりしてグラフを作成。PNG、JPEG、PDF、SVGで保存することができます。会員登録すれば無料でも利用できます。

ビジュアルのクオリティ的にはエクセルのグラフとそれほど変わらない感じですが、操作はわかりやすく、データの管理や編集、プレビュー、保存、画像の書き出しなどがブラウザから一元的に行えるので便利です。

インフォグラフックの魅力を伝えるギャラリーサイト

infogra.me

07https://infogra.me/ja

最後に、今回のテーマであるグラフやインフォグラフィックの作成サービスとは異なりますが、データのビジュアル化を考える時に参考になるサイトとして、インフォグラフィックのギャラリー「infogra.me」をご紹介しておきたいと思います。

「世界最大級のインフォグラフィック&ビジュアルコミュニケーション」をコンセプトに、インフォグラフィックやデータビジュアリゼーションを共有し、世界に伝えるプラットフォームとして運営されています。数多くのインフォグラフィックを見ることができるだけでなく、誰でも無料で公開することもできます。

日ごろ目にするインフォグラフィックは英語のものが多いのですが、ここなら日本語のインフォグラフィックが多数。見ているだけでもイマジネーションが刺激されますので、ぜひ参考にしてください。

今回のまとめ

今回は、グラフやインフォグラフィックの作成サービスをご紹介しました。ExcelやGoogleスプレッドシートのデータを読み込んで、手軽にクオリティの高いビジュアルが作れるなら、もっと積極的に活用していこうと思った方も多いのではないでしょうか?もちろん、WEBサイトやブログだけでなく、企画書やプレゼンテーションでも重宝します!

サービスの基本的な部分はよく似ていますが、操作感やビジュアルの好みは、個人個人によって変わってくると思います。無料版を試してみて、ご自分にあったサービスを見つけてください。

<関連記事>

見る人もつくる人も楽しい!ソーシャル時代に再注目のインフォグラフィックス

多目的利用が鍵?集客サイトでインフォグラフィックを使う効果とは?

この記事に関連する記事

カテゴリー

アクセスランキング

月間

  1. 1

    いまさら聞けない!フリック、スワイプ…スマホ操作の基本用語まとめ

  2. 2

    【WEBデザイン10選】これぞ進化系!今どきのレスポンシブWEBデザインサイトまとめ

  3. 3

    【保存版】アツイ視線が集まる激戦区!女性向けWEBメディア50選

  4. 4

    今どきの幼稚園・保育園ホームページ研究。32サイトに見る傾向と課題とは?

  5. 5

    【WEBデザイン10選】シンプルでわかりやすい「1カラム」サイトまとめ

  6. 6

    「プッシュ通知はアプリのもの」は過去の話。簡単にできるブラウザでプッシュ通知する方法

  7. 7

    【WEBデザイン10選】コンバージョンUPにも!パララックスを効果的に使ったLPまとめ

  8. 8

    【WEBデザイン10選】雑誌風デザインを上手く取り入れたWEBサイトまとめ

  9. 9

    【WEBデザイン10選】背景に動画を大胆に使った日本のサイトまとめ

  10. 10

    【事例に学ぶ】話題の新興SNS、Instagramを集客に使うコツ

総合

  1. 1

    いまさら聞けない!フリック、スワイプ…スマホ操作の基本用語まとめ

  2. 2

    【保存版】アツイ視線が集まる激戦区!女性向けWEBメディア50選

  3. 3

    【WEBデザイン10選】これぞ進化系!今どきのレスポンシブWEBデザインサイトまとめ

  4. 4

    初めてでもできる!iPhone動画編集アプリ【厳選4つ】

  5. 5

    【WEBデザイン10選】コンバージョンUPにも!パララックスを効果的に使ったLPまとめ

  6. 6

    【事例に学ぶ】話題の新興SNS、Instagramを集客に使うコツ

  7. 7

    【WEBデザイン10選】シンプルでわかりやすい「1カラム」サイトまとめ

  8. 8

    【WEBデザイン10選】背景に動画を大胆に使った日本のサイトまとめ

  9. 9

    今どきの幼稚園・保育園ホームページ研究。32サイトに見る傾向と課題とは?

  10. 10

    【WEBデザイン10選】雑誌風デザインを上手く取り入れたWEBサイトまとめ

エムハンドブログ編集部

  • 編集長みつむね

    得意分野はWEBマーケティング/コンテンツ編集。「インバウンドブログ」立ち上げから編集に参加。

  • 伊藤 高啓

    SNS運営からWEB広告/マーケティング業界を経て、鳴り物入りでエムハンドブログ編集長に就任。

  • 新棚幹太

    雑誌出版社を経てフリー編集者に。東京生まれ、京都暮らし4年目のオールラウンドライター。

  • 島田

    某グルメ雑誌の編集長を経て、業界違いのWEBへ転身。独自の視点で個性的な記事を手がける。

  • ヨネクラ

    WEBメディアの立ち上げに参加したくエムハンドライティングチームに参加。早稲田大学出身。

  • キクチ

    京都大学卒業後、京都大学院工学研究科に進学。研究を続けながらライター業に従事。

  • 池田仮名

    週末Webプランナー。情報システムの発展によって変化していく人の心や共同体のありかたに興味。

最新記事

  • M-HAND 士業
  • M-HAND 歯科
  • Logonic
  • M-HAND TechnicalBlog

ワンクリックに命がけのホームページ制作会社「エムハンド」