illustratorとPhotoshopの違い

web制作

2016.09.18

社会人となりillustrator（イラストレーター）とPhotoshop（フォトショップ）を使用するようになりました。

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

1 まずはAdobe CCについて
2 カラー形式には２種類あります。
3 illustratorとPhotoshopの違い
4 その他Adobe製品の紹介
5 Photoshop＆illustratorに関する資格
6 まとめ

まずはAdobe CCについて

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

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

Photoshop

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

Photoshopでできること

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

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

環境設定（編集→環境設定）

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

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

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

illustrator

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

環境設定

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

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

▼Photoshop
webデザイン
写真加工

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

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

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

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

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

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

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