こんにちは、読むだけでデザインを学べる！デザイン研究所です！
フォローするだけでデザインを学べるTwitterアカウントと
毎日デザインのポイントを解説するインスタアカウントを運営しております。
こちらのブログはインスタ投稿をより深く解説した記事になります！
ピクトグラム活用していますか？文字情報だけだと分かりづらいデザインもピクトグラムがあることによって伝わりやすさがUPします。
またそれらを繰り返すことによってデザインの統一感UPも狙えるピクトグラム活用。色んなサンプルを用意したのでぜひ記事をご覧ください！
ノンデザイナー 向けのまとめ記事を作りました。ぜひご覧ください！
デザイナーではない、つまりノンデザイナーの方でも知るだけで今すぐ使えるデザインポイントというのは存在します。今回の記事ではそんな知れば今すぐ使えるデザインのポイントを紹介！ノンデザイナーの方もブログのアイキャッチ画像[…]
ピクトグラム(アイコン)のデザインは素材サイトを活用しよう！
こちらが今回のデザインサンプルです。
ピクトグラムを使って内容を紹介しています！
ピクトグラムを活用することでして分かりやさ、伝わりやすさが上がります。
今回のようなピクトグラムはWEBデザインやチラシでよく使われます。
特にポイントの解説や手順の流れなどリスト式文章にプラスで使われることが多いです！
しかもピクトグラムは無料で商用利用可能な素材が多いです。おすすめは「icooon-mono」というサイト。センスが良く無料で商用利用OKです。
6000個以上のアイコン素材を無料でダウンロードできるサイト ICOOON MONO…
ちなみにピクトグラムであっても素材サイトによっては初心者ぽさがでる場合あるので注意！心配な方はさきほど紹介したサイトを使ってみてください。
ちなみにピクトグラムは初心者は自分で作ろうとしない方が良いです
(自分で作るとかなり初心者ぽくなる、だけど頑張って作ったものだからとダサくてもそれに気付かない…)
せっかく素材サイトがあるのだからそれを利用しましょう！
こちらの記事では吹き出しに関して、プロの作った素材を使おうと紹介している記事です！
こんにちは、読むだけでデザインを学べる！デザイン研究所です！フォローするだけでデザインを学べるTwitterアカウントと毎日デザインのポイントを解説するインスタアカウントを運営しております。こちらのブログはインス[…]
ピクトグラムは今回のサンプルデザインのようにリスト式の文章に対して、文字と同じサイズで横に配置したり、文字より大きくアイキャッチとして配置したり。(次章で解説)
リスト式の文章以外では、検索を虫眼鏡で表したり、マイページを人型のピクトグラムで表したり。
これらは特にアプリのUIやスマホデザインなどに見受けられます。
単純に文章の横に・(丸)ではなく、このようなピクトグラムを使うことをぜひ試してみてください！
こちらの記事ではリスト式の文章を揃える裏技を紹介しているので合わせてご覧下さい。
こんにちは、読むだけでデザインを学べる！デザイン研究所です！フォローするだけでデザインを学べるTwitterアカウントと毎日デザインのポイントを解説するインスタアカウントを運営しております。こちらのブログはインス[…]
ちなみに少し昔の本ですがこの本で自分の図解力やピクトグラムの活用を理解したとはっきり覚えています。
とってもおすすめです！(今値上がってますが中古であれば安かったです！)
ピクトグラム(アイコン)を活用したデザイン例を紹介します
上のデザインサンプルでもピクトグラムを使ったデザイン例を並べてみました！
このようなデザイン見たことありますよね？文字情報＋ピクトグラムで分かりやすくする例をさらにご紹介します！
ピクトグラムのデザイン例を紹介！
ここからはピクトグラムのデザイン例を紹介していきます。
名刺でよく見るピクトグラム
名刺の記載文に対してピクトグラムを使うことかなりあります！
文字が並んでいるだけだと分かりづらいですがピクトグラムがあることで視覚的にグッと分かりやすくなります！
また名刺は文字サイズがどうしても小さくなるのでこのようなピクトグラムがあることで伝わりやすさが断然違いますね。
こちらの例では白のピクトグラムを楕円形で囲みました。
このようにピクトグラムはそれぞれデザインが違いますが、同じ図形(今回の場合楕円形)で囲むことにより統一感がでています！
これは反復(繰り返し)を意識したデザインです。
反復に関してはこちらの記事で詳しく解説しています！
こんにちは、読むだけでデザインを学べる！デザイン研究所です！フォローするだけでデザインを学べるTwitterアカウントと毎日デザインのポイントを解説するインスタアカウントを運営しております。こちらのブログはインス[…]
資料やLPでよく見るピクトグラム
こちらのデザインは資料やLPでよく見るポイント解説＋ピクトグラムの例です！
ピクトグラムは文字情報にプラスして使用することが多いですね。
こちらのデザインでも線の楕円形で囲むことでピクトグラムの形は違っていても統一感がでています！
こちらのデザインではピクトグラムを大きく薄く文字の下に配置した例です！
ピクトグラムが目を留まらせるアイキャッチの役割も果たしています。
効果的な境界線の使い方についてはこちらの記事で解説しているので合わせてご覧ください！
こんにちは、読むだけでデザインを学べる！デザイン研究所です！フォローするだけでデザインを学べるTwitterアカウントと毎日デザインのポイントを解説するインスタアカウントを運営しております。こちらのブログはインス[…]
このように、、、
ピクトグラムを使うことによって繰り返しによる統一感UP、視覚的に伝わりやすさUPを狙えます
ぜひ文字情報だけで伝わりづらい時はこのピクトグラムを活用してみてください。
複製の方法は様々にありますが、イラレでもフォトショでもoptionを押しながらクリックして引っ張るショートカットをよく使います！
もっとアイコン活用のポイントを使ったデザインが見たい方！
この記事で解説したアイコン活用のデザインをもっと見たい方は、、、
デザイン研究所が運営する学べるギャラリーサイト「managary」へどうぞ！
ピクトグラム(アイコン)のデザインを使うメリットはたくさんある
いかがでしたでしょうか？文字情報＋ピクトグラムのデザインを紹介しました。
実は日常でもピクトグラムはかなりの数見ることができます。例えばトイレの男女表記や標識や案内板など。
そんなピクトグラムを伝わりやすさUP、統一感UPのために自分のデザインに取り入れてみてください！
ちなみにこちらの記事はポップなデザインを作る33のテクニックを解説したまとめ記事にも含まれています。
こんにちは、読むだけでデザインを学べる！デザイン研究所です！デザイン特化のメディアでは国内最大級のTwitterとインスタグラムを運営しています。 ターゲットに合わせる、作りたいイメージを考える、そ[…]
こちらの記事はWEBデザインまとめ記事にも含まれています！WEBで使える32種類のテクニックをまとめました！
こんにちは、読むだけでデザインを学べる！デザイン研究所です！デザイン特化のメディアでは国内最大級のTwitterとインスタグラムを運営しています。 WEBデザインには色々なテクニックが散りばめられて[…]
・文字情報＋ピクトグラムで伝わりやすさUP、統一感UP！
この投稿をInstagramで見る
全国対応で短期で習得するグラフィックのデザインレッスンをやっております、詳しくはこちらをどうぞ。