【Webデザインソフトの種類】Photoshop・Xd・illustrator。特徴と使い分けについて

Adobeグラフィックデザインソフト。フォトショップ、イラストレータ、Xdの特徴と使い分けについて解説

デザイナーが使うグラフィックソフトのシェア率No.1を誇るAdobe製品は、デザイナーの必須ソフトです。

Adobe社とは、1982年にアメリカで設立した、プロ向け画像編集ソフトの最大手企業です

Webデザインに限らず、クリエイティブなデザインといえば、Adobeのソフトの出番です。

フリーソフトのグラフィックソフトもありますが、あくまで趣味レベルのもの。プロで仕事として使うのであればAdobe一択です。

デザイナーなのにAdobeを使っていないのは、大工が釘をもっていないようなものだと思います

Webデザインスクールに通うと、まずはAdobeのグラフィックソフトの使い方から教わります。

Webデザイナーが使うのは、主にこの3つのソフトです。

  • Photoshop(フォトショップ、通称フォトショ)
  • Illustrator(イラストレーター、通称イラレ)
  • Xd(エックスディー)

Webデザイナーはこの3つのうちのどれかをメインにして、他2つをサブ的に使っています。

それぞれのソフトの特徴について、簡単に説明しますね

この記事を書いているのは、Webデザイナー歴18年の現役フリーランスです

目次

写真のデザインならphotoshop

フォトショップ画面イメージ

photoshop(フォトショップ)は、一番利用率が高いソフトです。

Photoshopの特徴
  • 写真の加工が得意
  • イラストやロゴも作れる
  • 全てのデザイン業務に対応できる

一般的なお絵かきソフトを超高性能にしたものといっていいでしょう。

鉛筆で線を書いたり、インクで色を塗ったり、消しゴムで消したりすることができ、一般人でも直感的に使うことができます。

また、フォトショップはその名の通り、写真の加工に一番向いているソフトです

Webデザインでは写真をメインに扱うことが多いです。写真の加工なしでは良いデザインはできません。

写真の切り抜き、写真の明るさの修正、写真と画像を合成するといった加工はすべてフォトショップで行います。

また、曇りを晴れにする、景色に邪魔な人を消す、太った人を痩せさせる、肌を綺麗にする、といったネットでよく見る加工も、フォトショップさえあればOK。

Webデザインスクールで、まず最初に教えるソフトがフォトショップです

フォトショップはその使いやすさから、馴染みが早く、非デザイナーの人でもとっつきやすいです。

どれか一つだけと言われたら、何でもできる「フォトショップ」をおすすめしますね。

ロゴデザインやイラスト制作が得意なillustrator

Adobe illustrator画像イメージ

Illustrator(イラストレーター)は、フォトショップとは違い、点と線でイラストを起こすグラフィックソフトです。

Illustratorの特徴
  • イラストを書くのに向いている
  • DTPデザインもやりたいならイラレ
  • 拡大してもぼやけないベクター画像

子供の頃にやった、点つなぎのドリルは覚えてますか?Illustratorはあのように、点と点をつないでイラストを起こしていきます。

フォトショップより癖があるソフトなので、初心者は面食らってしまうかもしれません。

Illustratorで描いた絵はベクター画像という画像形式になり、これは拡大してもぼやけません。(フォトショップで描いた絵は、拡大するとぼやけます)

そのため、Illustratorは、イラストやロゴを作成するのに向いています。

また、DTPデザインと呼ばれる紙の印刷デザインであるポスターや名刺等は、このIllustratorで作りますので、DTPもやりたいのであればIllustratorが必要です。

Webデザインのために作られたXd

Adobe XD画像イメージ

フォトショップとillustraotrはWebデザインのためだけにあるソフトではなく、Web以外のデザイン分野で活躍しています。

一方、XdはWebデザインを作る為に生まれてきたソフトです

Webデザインやアプリデザインを作るのに特化しているので、使ってみるとわかるのですが、本当にさくさくWebデザインのデザインカンプを作ることができます。

Webデザイナーがこれが欲しかったという機能がたくさん搭載されています。

Xdの特徴
  • 軽い!とっても軽い
  • レイアウトが簡単にできる
  • UI・UXデザインをやるならXd
  • プロトタイプも作れる

とにかく軽くて使いやすい。そして、レイアウト調整が簡単に行えます。

1番の特徴は、プロトタイプが作れるということ。

ボタンをクリックすると、次の画面へ進むといった動き。Xdで作ることで、このWebサイトならではの動きをデザインカンプの時点で再現できるわけです。クライアントとやり取りする時に、このプロトタイプがあるのとないのとでは、かなり違います。

このメリットは非常に高く、特にアプリ開発のデザインで重宝されています。

一方でXDだけでは、上質なデザインを作ることはできません。

写真の加工やロゴ・イラストは、別途PhotoshopかIllustratorで作業し、XD上で読み込ませる必要があります。

デザイナーはどういうふうに使い分けているのか

自分が使いやすいと思ったソフトが一番

Webデザイナー歴が長い人はフォトショップが多い

Webデザイナー歴が長い人は、Photoshopをメインに使っている人が多いです。

なぜなら、昔はWebデザイン=Photoshopだったからです。

今Webデザイン界ではXFが主流となりつつありますが、XDはまだ新しいソフトで、ここ数年で台頭してきたソフトです。10年以上前から続けてきている人にはPhotoshopの方が馴染みが深いはずです。

また、Photoshopは、Webデザインの全てを行うことができるため、このソフトひとつで十分という人もいます。

一方、IllustratorはDTPデザインの方が主のソフトです。illustraotは、Webデザインを起こすのには昔は少々問題がありました(今はそうでもありません)

DTP出身者はイラレが多い

DTPデザインからWebデザインに移ってきた人、もしくはWebデザインだけじゃなくDTPデザインも受注している人は、Illustratorが多いです。

DTPデザインは、Illustratorが主ソフトとなるからです。

DTPデザインとは

書籍、ポスター、ショップカード、名刺といった印刷物のデザインのこと

WebデザインだけでなくDTPデザインの仕事もやりたいというのであれば、Illustratorから勉強しても良いと思います。

昔のIllustratorは、Webデザインのカンプを作成する際に1pxずれたりと癖が強くてWebデザイナーには嫌煙されがちだったのですが、近年ではそのような懸念はすっかりなくなり、むしろ個人的には、Photoshopより使いやすさを感じます。

ただし、Illustratorは写真の加工には向いていないため、写真の加工は別途Photoshopが必要です。

例えば、Webサイトデザインだけでなく、ショップカードやPOPポスター等も全て受注する場合は、Illustratorで作るのも便利です。

 

どのソフトも強みと弱みがあります。

まずはいろいろ使ってみる。そのうち、自分になじむソフトが自然に見つかると思います。

私は10年以上フォトショップ使いでしたが、ここ数年はIllustrator派になりました

Adobe以外のソフトは?

Adobe以外にもデザインソフトはあります。

ただ、プロのデザイナーなら、Adobeソフト以外は使わないようにしましょう。

現場はチームで動くことも多いので、全員同じソフトであることを求められます。

Adobe以外のソフトを使っていると、データの共有ができないので気をつけましょうね。

デザインソフトの購入方法

アドビ社製品は、現在は全てサブスクリプション制で、月額費を払うことで、常に最新のソフトを手に入れることができます。

PhotoShop、Illustratorは、それぞれ単品で購入可能ですが、単品で購入するよりお得なセットパックのAdobeCCコンプリートプランがおすすめです。

AdobeCCコンプリートプランは、この3つの他にも、動画編集ソフト「Premiere Pro」をはじめとする26種のクリエイティブなソフトが入っています。

単品で購入するよりお得なので、プロのデザイナーは皆AdobeCCプランを契約しています。

なおXdは単体購入はできません。(2023年1月に単体プランの販売終了)

そのため、2023年以降で新規でXdを利用したい場合は、AdobeCCプランを契約する形になります。

アドビ社の公式サイトから購入できます。即時使用OK。

AdobeCCは、定価より安く買う方法があります。半額近く安くなるのでおすすめ。

初期費用を安く抑えるポイント

AdobeCCは、Adobeの公式認定スクールであるデジハリ経由で契約することで、誰でも44%オフのコストダウンになります(私も含め利用者多し)

詳しくは


の記事に購入方法をまとめています。すでにAdobeCCを利用している方も乗り換えOK♪

お金がない。どれか一つだけ選ぶとしたら?

予算がなくてコンプリートプランは厳しいという場合、ひとつだけ選ぶとしたら「PhotoShop」ですね。フォトショさえあれば、全てのデザインを一通り対応できます。

こちらの記事を参考にしてみてください。

よかったらシェアしてね!
  • URLをコピーしました!
  • URLをコピーしました!
目次