ピクトグラムの基礎知識
ピクトグラムとはどのようなものであるかご存じでしょうか。誰でも目にしているはずのものですが、単語そのものはあまり浸透していないのが現状です。人が非常口から走り出ていくところを描いた『非常口』を示すピクトグラムなど、日常生活のあらゆる場面で利用されています。
ピクトグラムとは
ピクトグラム（pictogram）とは、情報や注意を伝えるための視覚記号です。言葉を使わず、直感的に視覚で内容を伝達できるよう、伝えたい内容を視覚的に把握できるよう図案化し単純化してあります。理解しやすい表示や案内をする必要がある場所で求められるものなので、駅や空港といった公共施設などでとくに使われています。
東京オリンピックから広まった
このピクトグラムが日本で広まったのは、1964年の東京オリンピックがきっかけでした。世界中から訪れる人々に、言語に頼らずに競技スポーツの種目やトイレや食堂といった施設の案内をする必要が生じたのです。国内のデザイナーたちが制作したピクトグラムは社会に還元されるべきであるとされ、日本だけでなく世界中に発信されました。
ちなみに、いまでは誰もが目にしたことのあるトイレのピクトグラムも、男女の図がトイレのピクトグラムと広く認識されるようになったのは、70年の大阪万博からとなります。このことから、ピクトグラムの普及には数年を要したということがわかります。
非常口のピクトグラムが生まれたきっかけ
先ほど例にも出した、もっともポピュラーなピクトグラムの1つといえる非常口のピクトグラムが生まれたのは、日本での大きな火災がきっかけでした。非常口のピクトグラムが生まれる以前の非常口の表示は、文字で非常口と書かれただけのものがほとんどでした。
しかし、72年に118人の死者を出した大阪千日デパートでの火災がおこり、翌73年には死者103人の熊本大洋デパートの火災が続き、文字だけの表示では火災などの緊急時には不十分だということがわかってきました。その後、78年に公募が実施され、ようやくいまの非常口ピクトグラムが誕生したのです。
アイコンとの違い
情報を絵で伝えるということでいえば、コンピュータOSでアプリケーションやファイルなどを表しているアイコンもあげられますアイコンとピクトグラムの違いについて解説します。
アイコンとは
ピクトグラムとの違いに触れる前に、まずアイコンの歴史を振り返ってみましょう。
先ほどふれたように、アイコンはコンピュータの分野の用語です。アメリカの複写機大手ゼロックスのパロアルト研究所で、コンピュータを容易に操作できるように70年代に開発されたのが、クリックすれば操作できるアイコンという仕組みでした。そして、84年に発売されたアップルのコンピュータMacintoshによって広く普及しました。
アイコン作成の流れ
アイコンは、そのアイコンがどういったアプリケーションなのかということや、どういった種類のファイルなのかということを示さなければなりません。もちろん文字で表示していては表現しきれないので、視覚的にわかるよう図案化することが必要です。しかし、アイコンはコンピュータの解像度で区別がつけばよいだけなので、図案化に際してはピクトグラムほど単純化ということを求められません。何のアイコンか理解させられるのであれば、解像度の制約内で装飾や色で飾ってもよいわけです。
つまり、アイコンはまずコンピュータの用語で、ピクトグラムとまったく同じ意味の言葉かというと、違います。では、アイコンもピクトグラムの一種といえるかというと、これも違うといえるでしょう。アイコンはピクトグラムのような単純化をする必要がありません。ここにピクトグラムとアイコンの違いがあります。
インフォグラフィックスについて知ろう
アイコンのほかに、ピクトグラムに似たものとして、インフォグラフィックスというものがあります。このインフォグラフィックスに関しても、どういったものか見ていきましょう。
インフォグラフィックスとは
インフォグラフィックス（infographics）とは、情報やデータを視覚的にわかりやすく表現したものです。情報（information）と図学（graphics）を合わせた造語で、情報を図形化したものといえます。イラストやグラフ、図などを使って説明することで、言葉だけで表現するとわかりづらいことも理解しやすくします。
主な分類
主な分類としては、イラストを活用したインフォグラフィックスである『ダイアグラム』などがあげられます。たとえば、香港の九龍城砦の密集具合を区画のイラストと拡大図のイラストで表現したり、デザイナーの机周りの様子とアイテムを紹介したりといった使い方ができます。
他にも縦軸と横軸をとって、情報を『表』として表したり、折れ線やチャートグラフなどもインフォグラフィックスの主だった手法です。これらの手法は地図にも活用されており、路線図などもこの手法によるものです。
ピクトグラムも使われる
インフォグラフィックスにはピクトグラムを活用した手法もあります。たとえば、グラフの文字情報の補助もしくは代わりとしてピクトグラムを利用したり、グラフそのものをピクトグラムで表現したりすると、直感的なわかりやすさが増すうえ、与えるインパクトも大きくなります。
単に情報を対比させ列べるだけでなく、ピクトグラムを活用すればより印象が強いインフォグラフィックスを制作することができます。例としては、人間の各臓器が24時間にどれだけ働いているかというデータを紹介するインフォグラフィックスがあげられます。目は23040回まばたき、心臓は10万回鼓動する、などのデータを表す際に目や心臓をピクトグラムで表現し、実際の大きさに対比したサイズで人体での位置に合わせ配置すれば、文字だけとは比べ物にならないくらい強いデザインになります。
ピクトグラム作成のポイント
ピクトグラムの概要や活用を見てきたところで、実際にピクトグラムを作成する際のポイントを紹介します。
作成の流れ
ピクトグラムは情報を言語なしで伝えるためにあるものです。例えば食堂という情報を視覚的に伝えるためには、食堂というのはどういったものなのか、つまり食堂という概念について考察を巡らせる必要があります。伝えたい食堂という概念は、食べる『場所』のことなのか、食べる『行為』のことなのか、などといった要素です。
食堂という概念を、食器という表現を用いて表す場合は、どういった食器で表現すれば伝わりやすいのかを考えます。そしてたとえば、フォークとナイフが並んでいる図案で表現すれば食堂を示すことができるか、客観的に判断する必要があります。
ここまで決まれば、あとはナイフとフォークの図案を描いて、食堂のピクトグラムとすればよいわけです。しかし、ナイフとフォークの絵であればなんでもよいわけではありません。伝わりやすいように、ピクトグラムとしてデザインをより単純化して、ようやくピクトグラムの完成です。
作成の魅力とは
より伝わりやすい表現を選択し、どう単純化して磨きをかけるかが、ピクトグラム作成での腕の見せ所です。素材をデフォルメして、かつシンプルに洗練させる。小手先の装飾などは使えない、デザインの根本を問われるような作業です。
わかりやすく伝えるための、デザイン的な肝となる特徴はいったい何なのか。たとえば、食堂ピクトグラムのナイフとフォークの例でいえば、できるだけデフォルメして単純化すべきといっても、ナイフの刃の出っ張りをあまりに強調すれば、もはや食事ナイフに見えずに誤解を生じて、食堂を示していると伝わりづらくなってしまうかも知れません。ナイフがナイフとして伝わるには、それをフォークと並べたピクトグラムにしたときに食堂を示すと認識してもらうには、どういったデザインがよいのかを考えなくてはなりません。
ここがピクトグラムのデザインの難しさであり、同時に魅力的なところともいえるでしょう。
誰でもわかるモチーフを利用
さて、伝わりやすい、よいピクトグラムを作成するには、モチーフは誰にでもわかりやすいものを選ぶ必要があります。クリスマスを示すのに、モチーフをツリーにする手もあればサンタクロースにする手もあります。より伝わりやすいのはどのモチーフかを考えなければなりません。
食堂のピクトグラムのモチーフを食器と決めたとき、ナイフとフォークでなく、箸と茶碗をモチーフにするという選択もあるわけです。しかし、老若男女に、もっといえば国際的に伝わりやすいのはどちらなのか、そういった検討がなされなければなりません。
できる限り単純化
視認性を高め、直感に訴えやすくするためには、できる限りデザインを単純化しなければなりません。たとえば、男性のピクトグラムをデザインするのに、髪型やヒゲや肌の色まで書き込むと、『男性』として認識されず、白人男性とか老人とかいった誤った情報として伝わってしまうかも知れません。
素材を削るだけ削って、シンプルにしていきます。かといって削りすぎて意味が伝わらなくなってしまってはピクトグラムとはいえません。
デザインのポイント
ピクトグラムのデザインは、単体でなく、いくつかのピクトグラムをまとめてデザインすることが多くなります。ある国や地域や施設の、そのなかで使われるピクトグラムには統一感がないとピクトグラムとして認識されづらく、情報が伝わりにくくなってしまいます。
ピクトグラムのデザインに統一感を持たせるためには、どのような手法があるでしょうか。基本的なところを見ていきましょう。
作成サイズや色の面積
まず大きさを統一しましょう。たとえば、各ピクトグラム作成時に、同じ大きさの正方形をベースにしてデザインを行います。そうすることで、サイズ感のばらつきがなくなり統一感が出ます。
それぞれのピクトグラムの線や面の面積も統一感が出るように検討しましょう。線で描かれ描画色の面積が小さくて背景色がたくさん透けて見えるスタイルか、描画色でベタ塗りされた地の色が少ししか見えないスタイルのピクトグラムかで、ずいぶん違った印象になってきます。
角や線の太さ
角の表現をどのようにするかでも印象は変わってきます。角の丸め具合が大きければ柔らかい可愛らしい印象に、角を丸くしなければしないほど硬いシャープな印象になっていきます。角の処理に統一感を持たせると、ピクトグラムにまとまった感じが強まります。
ピクトグラムの線の太さも、各ピクトグラムで同じくらいにそろえておくと、統一感を持たせることができます。余白とのバランスもそろえていきましょう。
ピクトグラムの作り方
では、実際にピクトグラムを作成してみましょう。各アプリケーションでは、どのようなツールを活用して描けばよいのか、一例を解説します。
イラストレーターでの作成
イラストレーターでは、主に図形ツールを使ってピクトグラムを作成することが多いでしょう。色などを設定し、ドラッグで大きさ形を決めていきます。アンカーポイントを追加して変形させ、必要な形をつくっていきます。
パワーポイントでの作成
パワーポイントで作成する場合は、挿入カテゴリの図形を使うと便利です。描きたい図形を選んで、ドラッグで調整します。図形を組み合わせてピクトグラムを描くことができます。図形の書式設定リボンにある図形の塗りつぶしで、図形の色を変えることもできます。
エクセルでの作成
エクセルでの作成もパワーポイントでの作成と似ています。エクセルでも図形を利用して描けます。表示にある枠線のチェックをはずして、枠線はあらかじめ非表示にしておきましょう。
フリー素材の利用も
自分で作成しなくても、ピクトグラムのフリー素材が使えるサイトも複数あります。無料サイトの素材といっても、コピーライトの記載が必要なものなど、素材ごとに扱いが違ったりすることもあるので注意しましょう。
ピクトグラムのビジネス利用について
ビジネス分析の分野でもピクトグラムが活用され役立っています。ピクト図解と名付けられたこの手法を使うことで、ビジネスにおける会社や個人の間のお金の流れなどの関係がすっきりわかりやすく視覚化されます。
ツールとしてのピクト図解
ビジネスにおける基本的関係3W1H、誰が（Who）誰に（Whom）何を（What）いくらで（How much）売っているか、を図にまとめるツールがピクト図解です。様々なビジネスモデルを理解しやすいように図示するために考案されました。
ピクト図解を用いた例
たとえば、フリーミアムモデルといったビジネスモデルもピクト図解でわかりやすく整理できます。フリーミアムとは、基本的サービスを無償で提供することで、有料サービスへと誘導しようとする手法です。多くの顧客が無償サービスを受け、つまり0円で無償サービスを購入したのち、そのなかの一部の顧客が有料サービスを購入する図を非常に少ない要素で表すことができます。
ピクト図解の描き方や使い方
ピクト図解を描く際の基本的な要素は、たった6つです。
- 個人 人間の形です。
- 企業 建物を示す長方形です。
- 商品やサービスなど売買されるもの マルで表します。
- カネ ￥マークで表します。
- 販売 先が三角の矢印をひきます。
- 支払い 矢印をひきます。
これにオプションとして2つが加わります。
- 時間の流れ Tを書き添えた矢印をひきます。
- まとめ 中カッコで表します。1つの対象に対して2つ以上のモノやカネの流れが生じていることを示します。
これだけです。
考えを整理する際、またプレゼンの場などで使われます。シンプルなので話しながらでも描くことができ、大変便利です。
まとめ
デザインにおけるピクトグラムの重要さ、ビジネスの場でも役立っている点、ご理解いただけたでしょうか。汎用性が高く、これからの広がりも期待出来るのがピクトグラムです。ピクトグラム作成に軸をおいてあなたのデザイン技術に磨きをかけるのも、よいのではないでしょうか。