グラフィックデザイナーの私がオススメする「インフォグラフィック」の勉強になるWebサイト、本、動画

グラフィックデザイナー、デザイン講師の私がオススメする、学生や初心者の方に向けたインフォグラフィックの勉強になるWebサイトや本、動画をご紹介します。

インフグラフィックとは?

インフォグラフィック(Infographic)とは、情報をビジュアル的に表現したグラフィックデザインの一形態です。テキスト、図形、アイコン、チャート、図表などの要素を組み合わせて、複雑なデータや情報を視覚的に理解しやすくするために使用されています。

現在、インフォグラフィックは幅広い分野で利用されており、ニュース記事、レポート、プレゼンテーション、教育資料など、さまざまなコンテンツで活用されています。

【Webサイト】

ビジュアルシンキング

https://visualthinking.jp/

インフォグラフィック・デザイナー、櫻田潤さんによるWebサイト。

「作り方を学ぶ」というページで、インフォグラフィックスとは何か?ということや、制作する時のポイントなどをわかりやすく解説されています。

https://visualthinking.jp/category/how-to/

まずはこちらのコンテンツに一通り目を通してみて下さい。

「インフォグラフィック」というページでは櫻田さんがプライベートワークとして制作されたインフォグラフィックスの作例を見ることができます。
https://visualthinking.jp/category/infographic/

TUBE GRAPHICS

http://www.tubegraphics.co.jp/

インフォグラフィックスデザイナー、木村博之さんのWebサイト。

トップページ左のサイドバーから、ダイアグラム、チャート/グラフ、マップ、ピクトグラム、など、主に本や新聞に掲載されたインフォグラフィックスの作例を見ることができます。

インフォグラフィックって何?|仕事百科 はたらくVIVIVIT

https://hataraku.vivivit.com/career/infographics/

ポートフォリオサイト、VIVIVITによる記事。
インフォグラフィックとは何か?どんな種類があるか?を学生にもわかりやすくまとめられています。

【本】

たのしい インフォグラフィック入門

櫻田 潤(著/文), ビー・エヌ・エヌ新社

たのしいインフォグラフィック入門

たのしいインフォグラフィック入門

櫻田 潤
2,178円(12/03 19:43時点)
Amazonの情報を掲載しています

ビジュアルシンキングの櫻田 潤さんによる著書。
ピクトグラムと図解の作り方を解説しているインフォグラフィックの入門書です。
Kindle版もあるので入手しやすいと思います。

インフォグラフィックス―情報をデザインする視点と表現

木村 博之(著/文), 誠文堂新光社

インフォグラフィックス―情報をデザインする視点と表現

インフォグラフィックス―情報をデザインする視点と表現

木村 博之
3,080円(12/03 19:43時点)
Amazonの情報を掲載しています

TUBE GRAPHICSの木村 博之さんによる著書。
インフォグラフィックの分類から木村さんが実際のお仕事で制作された作例まで、非常に充実した内容になっています。
とてもいい本なのですが、現在、新品で入手するのが難しいのでメルカリなどで中古で探すのが良いと思います。

【動画】

Illustrator グラフを作成する方法

https://youtu.be/mlH3Lr0jhtY

Illustratorのグラフ機能で棒グラフを作る方法を解説されています。

Illustratorのグラフ機能はかなりクセがあるのですが、こちらの動画は非常にわかりやすく解説されています。

下記も合わせてみると良いと思います。

Illustrator グラフのデータを修正する方法

https://youtu.be/seTFAG_9gts

本ブログでも、以下の記事でIllustratorのグラフ機能の使い方を解説しています。

Adobe Illustratorのグラフ機能を使って棒グラフを作る方法

インフォグラフィックに興味がある方は、ぜひ、今回ご紹介したWebサイトや本を読んでみて下さい!

Header: 200 DegreesによるPixabayからの画像

Dumb Ways to Die/「間抜けな死に方」をアニメにしたメルボルン鉄道の広告キャンペーンがとても面白い!

広告デザインについて調べていたところ、有名な広告として「Dumb Ways to Die」というメルボルン地下鉄の広告がしばしば登場しました。非常に面白いキャンペーンだったので備忘録としてまとめておきます。

“Dumb Ways to Die”は、2012年にオーストラリアで生まれた公共サービスの広告キャンペーンです。

このキャンペーンは、広告代理店マッキャン・メルボルンがメルボルン地下鉄(メトロ・トレインズ・メルボルン)のために制作したもので、電車周辺での無謀な行動の危険性を警告し、鉄道の安全を促進することを目的としています。

キャンペーンでは、グリズリーベアを棒で突く、宇宙でヘルメットを脱ぐ、インターネットで両方の腎臓を売るなど、さまざまな奇妙で危険な行為をユーモラスに表現した歌詞のキャッチーな楽曲を使用しています。

この曲には、アニメのキャラクターがこれらの活動を行い、結果的に死んでしまうというミュージック・ビデオが付属しています。

Dumb Ways to Die

この広告キャンペーンはバイラルな成功を収め、YouTubeやソーシャルメディアで数百万回再生され、その創造性と鉄道の安全に関する意識を高める効果が認められ、数多くの賞を受賞しました。

2012年11月、メトロ・トレインズ・メルボルンが開設した鉄道安全キャンペーンサイト(英語)を通じてYouTube公開された。2022年7月時点での視聴回数は2.4億回。

アニメーションを通じて鉄道事故の防止を訴えるもので、このキャンペーンにより、メトロ・トレインズ・メルボルンでの死亡事故は前年比で21%減少した[1]

2013年のカンヌ国際広告祭で5部門グランプリ、金賞18個、銀賞3個、銅賞2個の計28部門という最多の受賞を達成した。

https://ja.wikipedia.org/wiki/Dumb_Ways_to_Die

また、モバイルゲームやインタラクティブなウェブサイトも公開され、ユーザーは鉄道の安全について学んだり、自分の「間抜けな死に方」シナリオを共有したりすることができました。

Dumb Ways to Die
Dumb Ways to Die
開発元:Metro Trains Melbourne Pty Ltd
無料
posted withアプリーチ

このキャンペーンはその後、さまざまな言語に翻案・翻訳され、世界中のさまざまな交通機関で、鉄道やバスなどの交通機関周辺の安全を促進するために使用されています。

オススメの関連記事

Google Fontsで人気&定番の10種の欧文フォント

Google Fontsでは、ウェブデザイナーやデベロッパーの間で人気のあるフォントを幅広く提供しています。

今回の記事ではGoogle Fontsで人気のある定番の欧文フォントを10種、ご紹介します。

1. Open Sans

https://fonts.google.com/specimen/Open+Sans?query=Open+Sans

Open Sansは、Ascender Corp.のタイプディレクターであるSteve Mattesonによってデザインされたヒューマニストサンセリフ書体です。

このバージョンには、標準的なISO Latin 1、Latin CE、ギリシャ語、キリル文字のセットを含む897の文字セットが完全に含まれています。Open Sansは、アップライトなストレス、オープンなフォーム、ニュートラルで親しみやすい外観でデザインされました。

印刷物、ウェブ、モバイルのインターフェースに最適化され、その字形は優れた可読性特性を持っています。

https://fonts.google.com/specimen/Open+Sans/about (DeepLで翻訳)

2. Roboto

https://fonts.google.com/specimen/Roboto?query=Roboto

Robotoは二面性を持っています。機械的な骨格を持ちながら、フォルムは大部分が幾何学的です。同時に、このフォントは親しみやすく、オープンな曲線を特徴としています。

グロテスクフォントの中には、字形を歪めて硬いリズムを強いるものもありますが、Robotoは妥協せず、文字が自然な幅に収まるようにしました。そのため、ヒューマニストやセリフ系フォントが持っている、より自然な読書リズムを実現しています。

https://fonts.google.com/specimen/Roboto/about?query=Roboto (DeepLで翻訳)

3. Lato

https://fonts.google.com/specimen/Lato?query=Lato

Latoは、ワルシャワ在住のデザイナーであるŁukasz Dziedzicが2010年の夏に開始した、サンセリフ書体ファミリーです(「Lato」はポーランド語で「夏」を意味します)。2010年12月、Latoファミリーは彼のファウンドリであるtyPolandによって、Googleのサポートを受けながらOpen Font Licenseの下で公開されました。

Łukaszが活字をデザインしてきたこの10年ほどの間、彼のプロジェクトのほとんどは、特定のデザイン課題を解決する必要がありました。Latoも同様でした。元々、Latoは大手のクライアント向けの企業フォントとして企画されましたが、最終的にはクライアントが異なるスタイルを選んだため、一般向けにリリースされることになりました。

Latoを制作する際、Łukaszは矛盾する可能性のある優先順位を慎重にバランスさせることを心がけました。彼は、本文で使用すると非常に「透明」な印象を与え、大きなサイズで使用すると独自の特徴を発揮する書体を作りたいと考えました。特に、大文字に見られる古典的なプロポーションを用いて、字形に親しみやすい調和とエレガンスを与えました。同時に、洗練されたサンセリフの外観を作り出し、Latoが2010年にデザインされたという事実を明らかにしました。

https://fonts.google.com/specimen/Lato/about?query=Lato (DeepLで翻訳)

4. Montserrat

https://fonts.google.com/specimen/Montserrat?query=Montserrat

ブエノスアイレスの伝統的なモンセラット地区に位置する古いポスターや看板に触発されたJulieta Ulanovskyは、この書体をデザインし、20世紀前半の都市のタイポグラフィの美しさを再現しました。

都市の発展により、その場所は変わってしまい、元の姿には戻ることはありません。しかし、この特別でユニークなデザインは永遠に失われることはありませんでした。このプロジェクトのインスピレーションとなった文字には、仕事、献身、ケア、色彩、コントラスト、光と生命、昼と夜の要素があります。これらは、街を美しく演出するための要素となっています。

モンセラットプロジェクトは、モンセラットの文化を救い出し、SIL Open Font Licenseというライセンスのもとで自由に共有するという考えから始まりました。

https://fonts.google.com/specimen/Montserrat/about?query=Montserrat (DeepLで翻訳)

5. Raleway

https://fonts.google.com/specimen/Raleway?query=Raleway

Ralewayは、優雅なサンセリフ書体ファミリーです。最初はMatt McInerneyによって1つの細いウェイトとしてデザインされましたが、2012年にPablo ImpallariとRodrigo Fuenzalidaによって9つのウェイトのファミリーに拡張され、さらにIgino MariniによってiKerned(字間調整)されました。その後、2016年には徹底的な見直しが行われ、イタリックスタイルも追加されました。

https://fonts.google.com/specimen/Raleway/about?query=Raleway (DeepLで翻訳)

6. Source Sans Pro

https://fonts.google.com/specimen/Source+Sans+Pro?query=Source+Sans+Pro

Source® Sans Proは、アドビの初めてのオープンソース書体ファミリーであり、Paul D. Huntによってデザインされました。この書体は、ユーザーインターフェイスでの使用に特化したサンセリフ書体です。

https://fonts.google.com/specimen/Source+Sans+Pro/about?query=Source+Sans+Pro (DeepLで翻訳)

7. Ubuntu

https://fonts.google.com/specimen/Ubuntu?query=Ubuntu

Ubuntu Font Familyは、2010年から2011年にかけて開発された、マッチングされた新しいライブレ/オープンフォントのセットです。この開発は、Canonical Ltd.によってフリーソフトウェア・コミュニティとUbuntuプロジェクトを代表して支援されました。Dalton Maagが技術的なフォントのデザイン作業と実装を担当しています。

最終的なTruetype/OpenTypeフォントファイルと、デザインファイルは、オープンライセンスの下で共有され、自由に実験、修正、共有、改良することが奨励されています。

新しいUbuntuフォントファミリーは、Ubuntuの個性をすべてのメニュー、ボタン、ダイアログで体感できるようにすることを目指して開発されました。このサンセリフ書体は、OpenTypeの機能を利用しており、デスクトップやモバイルの画面上で鮮明に表示されるように手動でヒントが追加されています。

Ubuntuフォントファミリーには、世界中のさまざまなUbuntuユーザーが使用するすべての言語が含まれており、Ubuntuの哲学である「すべてのユーザーが好きな言語でソフトウェアを利用できるようにする」という考えと一致しています。そのため、Ubuntu Font Familyプロジェクトは、さらに多くの言語をカバーするために拡張される予定です。

https://fonts.google.com/specimen/Ubuntu/about?query=Ubuntu (DeepLで翻訳)

8. Poppins

https://fonts.google.com/specimen/Poppins?query=Poppins


ジオメトリックなサンセリフ書体は、俳優たちが世界の舞台で活躍して以来、人気のデザインツールとなっています。その中でもPoppinsは、この長い伝統に新たに加わった書体のひとつです。Poppinsはデーヴァナーガリー文字とラテン文字の両方に対応しており、国際的な視点でこのジャンルを捉えています。

Poppinsのラテン語のグリフ(アンパサンドなど)は、一般的なものよりも構築的で合理的なデザインが多く見られます。特にデーヴァナーガリーのデザインは新しく、このジャンルで初めてウェイトの幅があるデーヴァナーガリー書体となっています。ラテン語と同様に、デーヴァナーガリーも純粋な幾何学、特に円に基づいています。

各字形はほぼ単線で構成されており、均等な組版のバランスを保つために、必要に応じてストロークの継ぎ目に光学的な補正が加えられています。また、デーヴァナーガリーの基本文字の高さとラテン語のアセンダーの高さは等しく設定されており、ラテン語の大文字はデーヴァナーガリー文字よりも短く、ラテン語のエックスハイトはやや高めに設定されています。

https://fonts.google.com/specimen/Poppins/about?query=Poppins (DeepLで翻訳)

9. Playfair Display

https://fonts.google.com/specimen/Playfair+Display?query=Playfair+Display

Playfairは、過渡期のデザインです。18世紀末のヨーロッパの啓蒙時代において、広い羽ペンから尖ったスチールペンが一般的な筆記具として普及しました。印刷技術やインク、製紙技術の進歩に伴い、高いコントラストと繊細なヘアラインを持つ文字が印刷されるようになり、手書きの文字との差異が広がっていきました。

このデザインは、当時の時代精神にふさわしく、特定のデザインを復活させたものではありませんが、John Baskervilleのデザインや「Scotch Roman」のデザインから影響を受けています。トランジショナルジャンルのディスプレイ(大判)デザインであり、Georgiaと組み合わせて本文を書くことが、機能的にもスタイル的にも可能です。

https://fonts.google.com/specimen/Playfair+Display/about?query=Playfair+Display (DeepLで翻訳)

10. Merriweather

https://fonts.google.com/specimen/Merriweather?query=Merriweather

Merriweatherは、スクリーン上で快適に読みやすいテキストフェイスとしてデザインされました。その特徴は、非常に大きな文字の高さ、やや凝縮された字形、穏やかな斜めのストレス、頑丈なセリフ、そしてオープンなフォームです。

さらに、このセリフファミリーには、ウェイトやスタイルと密接に調和するサンセリフ版のMerriweather Sansも存在します。

https://fonts.google.com/specimen/Merriweather/about?query=Merriweather (DeepLで翻訳)


これらのフォントは、その汎用性、可読性、美しさによって人気を博しており、ウェブサイト、アプリ、プレゼンテーションなど、さまざまな種類のデジタルメディアで広く使用されています。

フォントはすべて無料で利用でき、ウェブサイトやプロジェクトに簡単に組み込むことができます。

気になったフォントがあった方は各フォントのリンクよりぜひダウンロードして使ってみて下さい。

美しい欧文フォントの教科書

美しい欧文フォントの教科書

1,980円(12/03 17:13時点)
Amazonの情報を掲載しています

デザイナーが複数のデザイン案をクライアントに提案することによる4つのメリット

先日書いた「捨て案」の記事からもう一歩踏み込んで、そもそも、クライアントに複数の案を見せることにどんなメリットがあるのかを書いてみます。

クライアントに複数のデザイン案を提案することで、いくつかのメリットがあります。

1. 様々な選択肢を提供することができる

複数のデザイン案を提示することで、クライアントに様々な選択肢を提供することができます。

これにより、クライアントは様々なアプローチを比較検討し、最終的に最もニーズに合ったものを選択することができます。

2. デザイナーのクリエイティビティを発揮できる

複数回の提案により、クライアントは、デザイナーがそのプロジェクトに時間と思考を費やし、ユニークでクリエイティブな解決策を考え出すことに投資していることを知ることができます。

これは、デザイナーとしての信頼と自信を築くのに役立ちます。

3. クライアントの満足度を高める

複数の選択肢を提示することで、クライアントがプロジェクトの最終結果に満足する可能性が高まります。

自分たちのニーズが満たされ、最終的なデザインに自分たちの意見が反映されたと感じられる可能性が高くなります。

4. 障害となる可能性を回避

場合によっては、1つの提案ではクライアントのニーズをすべて満たすことができない、あるいはクライアントのビジョンと一致しないこともあります。

複数の提案を行うことで、デザインプロセスにおける潜在的な障害物を回避し、プロジェクトを確実に軌道に乗せることができます。

まとめ

全体として、クライアントに複数のデザイン案を提示することは、より協力的で成功するデザインプロセスを構築するのに役立ちます。

私も新人の頃は、なぜ最終的には一案しか採用されないのに、複数案を見せるんだ、、、と思っていたこともありますが、改めて思い返すと、複数案を見せていたときのほうが仕事がスムーズに進んでいました。

とはいえ、デザイン料との兼ね合いもあるので、たくさん見せれば良いというわけでは無いと思います。

なぜ複数案を作るのか?悩まれているデザイナーさんがいたら、この記事が参考になれば嬉しいです。

Header/StartupStockPhotosによるPixabayからの画像

[知っておきたい]タイポグラフィを学ぶ上で重要な5人の海外デザイナー

タイポグラフィを学ぶ上で知っておきたい、5名の海外デザイナーをご紹介します。

書体デザイナーや、文字を活用することに秀でたグラフィックデザイナーです。

アドリアン・フルティガー/Adrian Frutiger

アドリアン・フルティガーはスイスの書体デザイナーで、20世紀で最も広く使われた書体のいくつかを作ったことで知られています。

彼の最も有名な書体にはUnivers、Frutiger、Avenirがあります。

1950年代に制作されたUniversは、現代タイポグラフィーの古典となったサンセリフ書体です。

Univers

1970年代に作られたFrutigerは、可読性に優れたヒューマニズムのサンセリフ書体です。

Frutiger

1980年代に制作されたAvenirは、クリーンでモダンな印象の幾何学的なサンセリフ書体です。

Avenir

ヘルマン・ツァップ/Hermann Zapf

ヘルマン・ツァップはドイツの書体デザイナーで、20世紀を代表する書体のいくつかを生み出しました。

彼の最も有名な書体には、Palatino、Optima、Zapfinoがあります。

1950年代に作られたPalatinoは、古典的でエレガントな外観を持つセリフ書体です。

Palatino

Optimaは1950年代に作られたサンセリフ書体で、幾何学的な特徴とヒューマニズム的な特徴が融合したユニークな書体です。

Optima

1990年代に作られたZapfinoは、カリグラフィと装飾的な外観を持つスクリプト書体です。

Zapfino

エリック・シュピーカーマン/Erik Spiekermann

エリック・シュピーカーマンは、革新的で影響力のあるデザインで知られるドイツの書体デザイナー、タイポグラファー。代表的な書体として、FF Meta、FF Unit、ITC Officinaなどがあります。

1990年代に制作されたFF Metaは、幾何学的な構成が特徴的なサンセリフ書体です。

FF Meta (引用元)https://www.fontshop.com/families/ff-meta

2000年代に制作されたFF Unitは、クリーンでミニマルな印象のサンセリフ書体です。

FF Unit(引用元)https://www.fontshop.com/families/ff-unit

1990年代に制作されたITC Officinaは、高い可読性と機能性を追求したセリフ書体です。

ITC Officina

ポーラ・シェール/Paula Scher

ポーラ・シェールはアメリカのグラフィックデザイナーで、大胆で表現力豊かなデザインで知られています。

シティバンクのロゴの様に、既存の書体を有効に活用したデザインから、The Public Theater NYCのタイトルのように、オリジナル書体にも見えるデザインまで、非常に多彩な表現が特徴的です。

Citibank Identity – Fonts In Use
https://fontsinuse.com/uses/5238/citibank-identity

マシュー・カーター/Matthew Carter

マシュー・カーターはイギリスの書体デザイナーで、デジタル時代に最も広く使われている書体のいくつかを制作しています。

彼の最も有名な書体は、Verdana、Georgia、Tahomaなどです。

Verdanaは1990年代に作られたサンセリフ書体で、コンピュータ画面での可読性が高いように設計されています。

Verdana

Georgiaは1990年代に作られたセリフ体で、クラシックでエレガントな印象の書体です。

Verdana

1990年代に作られたTahomaは、小さなサイズでも読みやすいようにデザインされたサンセリフ書体です。

Tahoma

まとめ

このようにまとめて見ると、書体やグラフィックデザインにデザイナーの個性が反映されていることがわかり面白いですね。

これからも、気になった文字やデザインがあったら制作したデザイナーが誰なのか?調べてみたいと思います。

Header: stempowによるPixabayからの画像