ピクトグラム作成実習

職業訓練校

オリジナル作品を作ろう

受講日:2025年02月24日

作品を作る時の注意点
  • 第三者も扱えるようなデータにする。
  • 求められるスピード感を意識する。
  • 作業時間としてカウントされるのは、実際に手を動かしている時間。ビジネスの場では、デザインやテーマを考える時間には、直接的な金銭は発生しないものと認識しておく。

ピクトグラムとは?

  • デフォルメして、目的を瞬時に伝えるのが目的。
  • 言語や国籍に関係なく、イラストだけで目的や意図を伝える。

イラストロゴとの違い

違いピクトグラムイラストロゴ
何を伝える?意図・目的・場所企業のコンセプト・サービス・商品
役割分かるように伝える売れるように具現化する
文字極力なし多少あり
(社名・ブランド名)

ピクトグラムを作る時のポイント

誰もが見てそう思わせる

ピクトグラム作成のコツ

  • 実際にピクトグラムを作る時の作業時間は目安5分
    考える時間は別にして、手作業の時間。
    5分くらいで表現できるシンプルなものという事。
  • 文字に頼らない
    時間を表したい時→時計に置き換えるなど、なるべくイラストに変換してデザインする。デフォルメした上で分かりやすくする!
  • 仕事の時は、ユニバーサルデザインを意識する。
    細かいデザインや色を多く使うものは避ける。
ピクトグラム作成のポイント
  • 実際に使ってみたイメージ
  • デザインをそぎ落とした時の見やすさ
  • 情報の伝わりやすさ
  • 使う色は最大3色
共通のデザインルールを持たせる
  • 共通のルールを作ると統一感が出やすい。
    線の太さ間隔の開け方角丸カーブを揃える
  • 共通の世界観
    1つの施設や企業といったテーマ
線幅のルールを決めておく
  • 基本的に線幅は同じで統一するが、メリハリが必要な場合もある。
  • 線幅のルールを決めておく。
    例)普通の線→2mm、強調したい線→4mm

特徴を掴むコツ

特徴を掴む。特徴を箇条書きにしてみる

例)サッカー:ボール、蹴る、シュートする
   野球  :ボール、バット、打つ、投げる

重複する特徴がある場合、差別化できる項目の組み合わせで唯一性を見出し、それをイラスト化していく。

テーマを1つ考えると作りやすい

例)使用場所:神社、公園

ピクトグラムの参考サイト

ガイドラインの引き方

操作方法
  1. 定規を出す:Ctrl+R。
  2. ガイドラインを出す:定規から用紙までカーソルをドラッグ。
  3. 0地点を任意の箇所に変更:定規の縦軸と横軸がクロスしている部分からカーソルをドラッグ。

ガイドラインの単位について

プロパティから単位を変更できるが、
基本的には、印刷→ミリ、WEB→ピクセルを使う。

ガイドラインの編集方法
  • ガイドラインを非表示にする:表示>ガイド>ガイドを隠す
  • ガイドラインを動かす:表示>ガイド>ガイドのロック解除
    ※動かした後は必ず再度ロックする。

方眼紙・テンプレートの作り方

今回のテーマ:1つの作品を5cm×5cmの作品テンプレートを作る。

  1. 十字キーでオブジェクトの移動幅設定を等間隔にする。
    編集>環境設定>一般>キー入力(十字キーの移動の幅)
    例)50mmのオブジェクトを5mm間隔で配置したい場合、
    50mm(オブジェクトサイズ)+5mm(配置間隔)=55mmで設定
  2. オブジェクトを配置する。
    2個目を設置:オブジェクトをコピー>alt+十字キー
    3個目以降を設置:Ctrl+Dで繰り返し
  3. オブジェクトをガイドライン化する。
    表示>ガイド>ガイドを作成

ピクトグラム作成に便利なillustratorの機能

ツール

ツール役割
パペットワープツール図形の一部を曲線で変形させる
線幅ツール線にニュアンスを与える
リフレクトツール図形を反転させる

機能

機能役割
線のプリセット線幅ツールの設定をストロークに適用
リピートオブジェクトオブジェクトをパターン化繰り返す

パペットワープツール

  • できる事:図形の一部を曲線で変形させる事ができる。
  • 曲線状に曲がるので、角処理は別のツールで行う。
パペットワープツールの使い方
  1. 動かしたい箇所と、動かしたくない箇所をツールで選択。
  2. いらない箇所をdeleteで削除。
  3. 動かしたい箇所をクリック&ドラッグで変形する。

実際にピクトグラムを作ってみた

受講日:2025年02月26日

作品:リゾートホテルのピクトグラム

作品について
  • 作成時間 :1つあたり平均30分程度
  • 使用ツール:illustrator
  • 12月に新婚旅行でタイのプーケットに宿泊して、リゾートホテルに思い入れができたので、それをテーマに作成しました。ホテルの予約サイトにあったアイコンや、実際にホテルで利用した施設等をもとにピクトグラムを作成しました
先生からのアドバイス
  • 特に人間の手足は細くなりがちなので、太めを意識
  • 危険・禁止のスラッシュも太めで描く。
  • 注意喚起は赤色で表す。
  • トレースと同じで、なるべく線を書くより、図形を置いて組み合わせるようにする。
  • 制作作業を開始する前に、テーマやルール、自分の作りたいものをしっかり把握して、理想のイメージ・ゴール設定しておく。

3月13日時点 修正版

修正の際に意識した事
  • 作品数を9点→12点に増やしました。
  • 人間の手足や線を太めに調整して、遠くから見ても分かるように視認性を意識しました。
  • 人間の身体と四肢が前後でかぶる箇所は白い線を入れるなどして、少しでも見やすくなるように工夫しました。
  • また前回作成した作品は、ピクトグラムというより、アイコン的な要素が強い作品が多かったので、修正版では、マッサージ、ヨガ、カヌー等、サービスやアクティビティをイラストで伝えるような意味合いの作品を追加しました。

今日の実習の振り返り

今回の実習で作成した作品
  • 良かった点:全てのアイコンの意図が伝わった
  • 反省点:一部図形の線が細すぎる箇所がある。バー、サウナの線はもう少し太い方が良い。
  • 次回までの課題線のメリハリをつけて、ブラッシュアップする。

今日の授業を受けての自主課題

  • まだ作っていない分のピクトグラムもすべて作る。(3/13完了)
  • 作成済のピクトグラムのブラッシュアップをする。(3/13完了)