illustratorとPhotoshopの違い

記事公開日:2016.09.18

最終更新日:2017.10.18

270 PV


Bigmacに入社し、illustrator(イラストレーター)やPhotoshop(フォトショップ)を使用するようになりました。

入社するまではPhotoshopは画像の色を変えたり、トリミングなど画像の大きさの調整のためだけにしか使用していませんでした。illustratorに関しては全く触っていませんでした。いまだにあまり使えていない私ですが、簡単にではありますが違いをご紹介します。

まずはAdobe CCについて

『Adobe CC』とはAdobe Creative Cloudの略称です。クラウド上でAdobe商品のインストールやアップデートをすることができます。今までのバージョンは、バージョンごとに販売されていたのでPhotoshopやillustratorなどそれぞれのツールが独立していました。

最新にするためにはその都度新しいツールを買い揃える必要がありました。その煩わしさをなくし、最新製品を月額で利用できるようになりました。

Photoshop

入社する前は写真編集くらいしかできないソフトだと思っていました。使い始めて写真編集だけではないと知り、今回記事にしようと思って調べてみると、かなりすごいソフトだと思いました。

Photoshopでできること

・電線や人、その他不要なものを自然な形で除去
・ぼかし機能を使い写真に躍動感を持たせる
・数枚の画像を連結させてアニメーションの作成・編集ができる
・3Dコンテンツの作成・編集ができる
・webデザイン

後半部分に関しては私が使うことはなさそうな気がする…が入社するまでは写真を綺麗にするイメージしかなかったPhotoshop…調べてさらに優秀ソフトだと感じました。

環境設定(編集→環境設定)

最初に作業しやすいよう環境を行いましょう。
▼単位の設定
Photoshopの初期の状態は定規がmm文字がpointになっているので使用するものに合わせて変更しておくことをお勧めします。webデザインの場合はpixclに変更。

▼グリッド線
グリッド線とはPhotoshop上にマス目を表示させます。

▼ファイルのバックアップ
Photoshop CCの場合、初期の状態で10分ごとにファイルが保存されるよう設定されているみたいですが5分〜1時間、自動なしと設定を変更出来ます。

illustrator

▼illustratorでできること
・印刷物制作
・ロゴや広告、アニメキャラなどイラストの作成
・グラフィックデザインの作成
・web/モバイルデザイン(アイコン作成/合成フォント)

環境設定

こちらもPhotoshop同様単位/グリット線の設定を行うと作業時困らないと思います。プロファイル選択時作業に適した単位が設定されます。

二つのソフトを比較してそれぞれのソフトに向いている作業

▼Photoshop
webデザイン
写真加工

▼illustrator
ロゴデザイン
イラストデザイン
ワイヤーフレーム
ポスター制作

▼イラストレーターでwebデザインを作成する場合の注意点

印刷物制作時によく使用されるイラストレーター。web制作で使用するときはカラー形式の設定に注意しましょう!!

カラー形式には2種類あります。

▼CMYK(色料の三原則)
C→Cyanシアン
M→Magentaマゼンタ
Y→Yellowイエロー
K→Key Plateブラック

印刷物がこの形式です。
混ぜると色が暗くなり、黒に近くなります。

▼RGB(光の三原色)
R→Red赤
G→Green緑
B→Blue青

テレビやパソコン、デジカメがこの形式です。混ぜると色が明るくなり、三色合わせると白になります。

RGBのデータをCMYKに変換する際はPhotoshopのイメージ→モードで変換ができます。(RGBをCMYK画像にした場合モニター上で色が暗くなる場合があります。)

illustratorとPhotoshopの違い

・クリッピングマスク機能においてはillustratorでは
オブジェクトの上にマスキングされ、Photoshopではオブジェクトの下にマスキングされます。

・前の作業に戻るショートカットキー
Ctrl + z。
illustratorでは複数戻ることができますがPhotoshopでは一つ前までしか戻れません。
・illustratorではワークスペース以外の場所にパーツを配置したり素材を置いて作業ができますがPhotoshopではワークスペースの中でのみ作業可能です。
・ファイルの保存速度はillustratorは早くてPhotoshopでは遅くなりがちです。
・Photoshopはラスタ画像と呼ばれる、ドット絵のような四角形の集まりで画像を表現します。そのため拡大すると、荒い表示になります。
illustratorはベクター画像と呼ばれる。点座標や線の方程式で画像を表現しています。ビットマップ画像と違い拡大しても荒くなることはありません。Photoshopで作る場合あまり拡大するとギザギザの画像になってしまうので原寸大で作成することをお勧めします。

その他Adobe製品の紹介

■Lightroom
デジタル一眼レフカメラなどで撮影した写真を管理・編集するツール。

■Acrobat DC
PDFの閲覧・作成を行うツール。

■Dreamweaver
webサイトやモバイルコンテンツを構築できるホームページ作成ソフト。

■After Effects
動画編集ツール。

Adobeは体験版がでているのでまずは体験版を使用し使ってみることをお勧めします。

Photoshop&illustratorに関する資格

▼Photoshopクリエイター能力認定試験
画像の編集・調整加工能力を認定する試験。スタンダード・エキスパートの2種類あり、スタンダードではPhotoshopの基本操作や指示通りに作業できるかが中心。エキスパートではwebデザインの基本的な知識があるかどうか、目的に対して創造的な制作ができるかどうかが判断基準となっている。

▼illustratorクリエイター能力認定試験
illustratorを使用し、提示されたテーマ・素材から仕様に従いコンテンツを制作する能力を認定する試験。こちらもPhotoshopクリエイター能力認定試験同様、スタンダード・エキスパートの2種類あり、スタンダードはillustratorの基本操作や指示通りに作業できるかが中心。エキスパートではDTP/webデザインに関する基本知識があるかどうか、デザインコンセプトや目的に応じて表現できるかが判断基準となっている。

▼アドビ認定アソシエイト
アドビシステム社が行ってる資格認定制度。この試験に合格すると世界共通の認定証が発行されるので就職や転職、仕事でのスキルアップに有利になるため人気の資格。

まとめ

いままでよくわからなかったこの二つのソフトですが、状況に応じて両方のソフトを使えることが望ましいと思いました。両方覚えるのはとても大変そうですがそれぞれの特化した部分から理解していけたらなーと…。

今現在webに関するものはPhotoshop、DTPはillustratorを使用するという感じで使ってきましたが、時間があるときに一度、illustratorでのwebデザインをしてみたいなと思いました。

このエントリーをはてなブックマークに追加

筆者

A.Haraguchi

Bigmac inc. 制作部所属。2016年3月に入社しました。 ほぼ未経験の状態で入社し、戸惑うこともたくさんありましたが、会社のメンバー達に支えられながら今に至ります。 2児の母なので休日は子供との時間にしています。一緒に料理したり、家事を手伝ってもらったり、娘達が自分でできるようになっていく姿をみることが最近の楽しみです。

筆者が最近執筆した記事