ツール

Web制作者が持つべきAdobe製品とは【3種のソフト使い方】

Web制作を始めると、さまざまなAdobe製品を耳にするでしょう。

  • XD
  • Photoshop
  • Illustrator

上のものはよく聞きますよね。しかし、Adobe製品なんて日常で使わないので、どのソフトが何をできるかなんて全然わかりません。

それゆえ最近は、

悩んでいる人

Adobe製品って色々あるけど、使えるようになった方がいいのかな?

悩んでいる人

僕に関係あるAdobe製品はどれなんだろう?

この記事では、こういったお悩みを解決します。

Web制作系のAdobe製品3種の用途

Web制作系で主に使われるAdobe製品は、下の3種類です。

  • XD
  • Photoshop
  • Illustrator

本章では、Web制作でよく使われるAdobe製品3種類の用途をお伝えします。

Adobe製品①:Adobe XD

Adobe XDはデザインカンプの作成によく使われます。その理由は下の通りです。

  • 心地よいUI/UXで、サイト設計がやりやすい
  • 効率よくデザインできる
  • ページの遷移を表現できる
  • Webで共有しやすく、社内共有やクライアント確認が取りやすい

AdobeXDの詳細(作業の向き不向きや優秀な機能など)については下の記事にまとめています。ご興味のある方はご覧ください。

https://kaki-lab.org/webproduction-xd/

Adobe製品②:Adobe Photoshop

Adobe Photoshopは主に画像加工に使われます。主な加工方法は下の通りです。

  • 背景画像の切り取り
  • ハイライトなどのエフェクト追加
  • 写真をイラスト風に加工

そのため、Web制作への主な関わりかたとしては、Photoshopで加工した画像を、サイトの一部に利用するなどです。

また、もう1つの主なPhotoshopの使われ方として、デザインカンプの作成があります。

XDを用いてデザインカンプを作る会社も増えていましたが、古い文化の名残りで、Photoshopを用いてデザインカンプを作る文化のあるWeb制作会社もある形です。

Adobe Photoshopの詳細(向き不向きや優秀な機能など)については下の記事にまとめています。ご興味のある方はご覧ください。

https://kaki-lab.org/webproduction-photoshop/

アドビ製品③:Adobe Illustrator

Adobe Illustratorはロゴ・アイコンの作成や、レイアウトデザインの作成によく使われます。

レイアウトデザインとは下のように、テキストとか画像をうまくレイアウトして作成するデザインです。

↑レイアウトデザインの例(僕のTwitterヘッダー画像)

※これを“レイアウトデザイン”と呼んでいるのは僕だけかもしれません…。でも、伝わればOKです。笑

Adobe Illustratorの詳細(向き不向きや優秀な機能など)については下の記事にまとめています。ご興味のある方はご覧ください。

https://kaki-lab.org/webproduction-illustrator/

結論、誰にどれが必要なのか

知りたいのは「私には何が必要なのか」だと思います。この章では僕なりの考えをお伝えします。

①“Adobe XD”が必要な人2選

AdobeXDが必要な人は、次の2人でしょう。

  • コーディングする人全員
  • Webサイト全体のデザインを行う人

XDはデザインカンプによく使われます。そのため、デザインカンプを利用して、コーディングする人は必須です。

また、そのデザインカンプを作成するデザイナーは当然持っておく必要があるでしょう。

詳細は下の記事よりご覧ください。

https://kaki-lab.org/webproduction-xd/

②“Adobe Photoshop”が必要な人

Photoshopを持っておくべき人は次の二人でしょう。

  • 画像加工に手を広げたいデザイナー
  • コーダー・ディレクター

Photoshopは画像加工を得意とするソフトです。そのため、その領域に手を広げていきたいデザイナーには最適でしょう。

また、Photoshopはデザインカンプに使われるので、デザインカンプを触る可能性のあるコーダーとディレクターも持っておいた方がよいと考えられます。ちょっとしたデータ修正の依頼が入る可能性もありますしね。

詳細は下の記事よりご覧ください。

https://kaki-lab.org/webproduction-photoshop/

③“Illustrator”が必要な人

Illustratorが必要な人は次の3人でしょう。

  • アイコンやロゴの制作にも手を広げたいWebデザイナー
  • デザインをいじることのあるコーダー・ディレクター
  • 情報発信をしたい人

画像加工をしつつ、バナーを制作しているデザイナーで、アイコンやロゴの制作にも力を入れたい方はいるでしょう。アイコンやロゴの制作はIllustratorの得意分野です。

コーダーやディレクターでもデザインを少しいじったり、簡単なバナーを作成したりすることがあるかもしれません。そういった場合に対応できるように、コーダーとディレクターにもIllustratorをおすすめしています。

※僕はコーダーとして応募して依頼された案件中で、Illustratorでの修正を依頼されたことがあります。

情報発信に関しては、僕自身がIllustratorを使用して情報発信をしているので、おすすめしてみました。Twitterのヘッダーやブログのバナーをつくるのに、非常に便利です。

詳細は下の記事よりご覧いただけます。

https://kaki-lab.org/webproduction-illustrator/

まとめ

この記事では下のことについてお伝えしました。

  • Web制作系のAdobe製品3種の用途
  • 結論、誰にどれが必要なのか

Adobe製品があると、Web制作業務の効率は爆上がりします。僕もXDとIllustratorはよく使っていて、助かっています。

ご興味のある人は一度検討してみるのをおすすめです。Adobeは7日無料体験などのキャンペーンを行っていますので、ぜひお試しを。

では、最後までお読みいただきありがとうございました。