BiTT開発
BiTT開発
2016.04.26
#3
WEBデザインをはじめよう

まず何を揃えればいい?Webデザイナーになるなら必須のツール&参考書籍はこれ!

トミー

こんにちは。デザイナーのトミーです。
これからWebデザイナーを目指す人、またWebデザインへの興味を深めたい人向けにお届けしています、LIGデザイナー陣による連載「Webデザインをはじめよう」。前回は、「Webデザイナーの仕事」についてご説明しました。

今回は、Webデザイナーの必須ツールについてご紹介します。

▼もくじ

【PC編】「Windows?」それとも「Mac?」

買うパソコンはWindowsがいいのか、それともMacがいいのか、悩まれる方も多いのかなと思います。

印刷系のデザイナーだとMacを使うことが多いのですが、WebデザイナーはWindowsを制作に使う人、Macを使う人がいますので、どちらでも大丈夫です! Webデザイナーが使う上で、こんなところが違うよという特徴をみてみましょう。

WindowsとMacの特徴

Windows:ユーザーと同じ環境で作業できる

Windowsユーザーは多いため、実際のユーザーと同じ環境で制作できるのが利点です。ユーザーと同じ環境で作業ができることは、実際のサイトの見え方が自分のPCの環境と近いということになります。

Mac:ディスプレイ解像度が高い

Macは標準のディスプレイ解像度が高いので、表示の視認性が高いです。発色もいいので、キレイに見えます。

PCのスペック

RAM(メモリ)とCPUは高ければ高いほど高性能。後述するデザイナー必須ツール、Photoshop CC(2015)/ Illustrator CC(2015)はRAM(メモリ)8GB 以上を推奨しているので、RAM(メモリ)8GB以上を選ぶと快適です。
最近では、ノートPCのスペックが向上しており、また勉強会などでノートPCは必須になってくるので、これから学びたい人はノートPCをメインマシンにするのも良いと思います。ノートPCの場合は、1920-1080pxの外部モニタがあると作業しやすいです。

【ツール編】Photoshop / Illustrator / Dreamweaverってなに?

Photoshop

Photoshop

ビットマップ形式の画像を加工・編集するツールです。フォトレタッチや、Webサイトやモバイルアプリなどのデザイン制作に使用します。

Illustrator

Illustrator

ベクターグラフィックのツールです。Webでは、ロゴやアイコン、タイポグラフィ、イラストを制作するときに使用します。
ベクターグラフィックスとは、描画情報を表現したデータのことです。ビットマップ画像と違い元はデータなので、拡大縮小しても表示が荒れません。制作しているときに、データを意識することはありませんのでご安心ください。LIGブログのロゴやアイコンなどもベクターグラフィックスを利用しているので、「 キリッ! 」と見えていると思います。

Dreamweaver

Dreamweaver

コーディングをWebデザイナーがやるか否かという問題はありますが、 Dreamweaverは視覚的にコーディングをすることができるので、Webデザイナーが使う最初のエディタ、Webオーサリングツールとして使用することが多いです。エディタ系のツールは種類が豊富なので、習得に合わせて個人が選択してツールを選ぶことが最近の流れです。エディタだけだと入門として下記あたりが良いと思います。

Photoshop/Illustrator/Dreamweaverについては、ぜひ下記記事も参考にしてみてください。

【番外編】オススメの参考書

「ゼロから始めます!」
そんな入門者の方にオススメしたい参考書をご紹介します。僕がWebデザイナーになったときに、よく言われていたのが、「最初はリファレンス・TIPS系と読み物系を分けて読むようにするといいよ」ということです。

リファレンス・TIPS系では作業ベースでのスキルをつけて、読み物系ではデザインの概念を学びましょう! 今回はツールのご紹介なので、リファレンス・TIPS系の参考書籍をご紹介します。

Photoshop 10年使える逆引き手帖

Photoshop 10年使える逆引き手帖【CC/CS6/CS5 対応】 (ああしたい。こうしたい。)

Photoshop 10年使える逆引き手帖【CC/CS6/CS5 対応】 (ああしたい。こうしたい。)

  • 著者藤本 圭
  • 価格¥ 2,592(2016/03/14 17:04時点)
  • 出版日2014/11/14
  • 商品ランキング10,035位
  • 単行本368ページ
  • ISBN-104797377054
  • ISBN-139784797377057
  • 出版社SBクリエイティブ

Illustrator 10年使える逆引き手帖

Illustrator 10年使える逆引き手帖【CC/CS6/CS5 対応】【Mac OS X & Windows 対応】 (ああしたい。こうしたい。)

Illustrator 10年使える逆引き手帖【CC/CS6/CS5 対応】【Mac OS X & Windows 対応】 (ああしたい。こうしたい。)

  • 著者高野 雅弘
  • 価格¥ 2,592(2016/03/14 17:05時点)
  • 出版日2014/06/23
  • 商品ランキング85,235位
  • 大型本344ページ
  • ISBN-104797377062
  • ISBN-139784797377064
  • 出版社SBクリエイティブ

効率的なサイト制作のためのDreamweaverの教科書

効率的なサイト制作のためのDreamweaverの教科書

効率的なサイト制作のためのDreamweaverの教科書

  • 著者鷹野雅弘
  • 価格¥ 2,678(2016/03/14 17:05時点)
  • 出版日2010/08/10
  • 商品ランキング194,496位
  • 単行本(ソフトカバー)304ページ
  • ISBN-104839935394
  • ISBN-139784839935399
  • 出版社毎日コミュニケーションズ

次回予告

いかがでしたでしょうか。
Webデザイナーの入門編として、必須ツールをご紹介しました。

まずは、Photoshop / Illustrator / Dreamweaverが基本ツール。どのツールがどんな機能を持っているか理解できたら、次回はWebデザイナーが実際にどういったものを制作しているのか、理解していきましょう。それでは、また!

※次回は4/28(木)公開予定です。

キャリアアップ
「Studio上野でWebクリエイターを目指す!」