学習範囲(ソフト編)

web言語ロゴ

言語学習とは別に制作に使うソフトの勉強も必要になります。
Macを使っている人であればソフトではなくアプリケーションという言い方の方がしっくりくるかもしれません。
勉強といっても言語学習のような形ではなく、操作方法を覚えるという感じです。

デザイン系ソフト

まずはデザイン系のソフトに関してです。

コーダー向けのマニュアルではありますが、コーダーでもデザイン系のソフトは使えないと問題が起きやすいです。
また、なるべく資金をかけたくない方やコーダー駆け出しの人にとってはデザインソフトが1つの大きな壁になる可能性があります。

コーダーの仕事というのは基本的にはデザイナーが作ったデザインを元にWEBサイトなどを構築していくわけですが、そのデザイナーから渡されるデザインはほとんどの確率でPhotoshopかIllustratorというソフトで作られています。
※最近ではXDで作られているデザインデータも増えてはきました。(全てAdobeのシリーズです)

この2つのソフトで作られたデータは、基本的にPCに標準で付いているペイントソフトなどでは開くコトが出来ません。
また内容を閲覧するコトは出来ても編集するコトが出来なかったりするので、基本的にPhotoshopで作られたデータはPhotoshopで、Illustratorで作られたデータはIllustratorで開く形になるのですが、この2つのソフトを利用するには毎月費用が掛かり1年間2つのソフトを使うとした場合6万位の出費になります。

資金に余裕がある人やデザイナーとしても頑張っていきたい人は使う形で問題ないと思いますが、「駆け出しで稼げるかわからないのにそういう契約は出来るだけしたくない」「デザイナーから貰ったデータを開く位にしか使わないのにもったいない」と考える人はいると思います。

そこで費用の掛からないフリーの画像編集ソフトとして行き着くのが、

というソフトになります。

Photoshopの代替としてGIMP、Illustratorの代替としてInkscapeとなります。
(根本的な違いなどについては各自でお調べください)

両ソフトとも無料とは思えないくらいの高機能なソフトではあるので、デザインからコーディングまですべて自分で行うという人であれば自分でデザインをGIMP or Inkscapeで制作しコーディングへと入って行けばよいのですが、コーディングのみの仕事を受ける場合は先程触れましたように一般的なデザイナーさんはPhotoshopかIllustratorでデザインデータを作ってきます。

一応GIMPはPhotoshopとの互換性が多少あり、InkscapeもIllustratorと互換性があるのですが、データによっては開けたり開けなかったりします。

私の経験上の話ですが、GIMPは開けない確率が高く開けても正常な形で表示されないことが多いです。
ですので、Photoshopのデータを開く場合はPhotopeaというオンラインの無料画像編集ソフトを使います。

私のブログ(Photopea psd形式のデータから画像をスライスする方法)でも紹介したことがあるのですが、Photoshopのデータはほとんどの確率で開くことが出来ます。

Inkscapeの方は、IllustratorのデータをPDF互換で保存してもらえば大抵開けるのですが、データ容量がかなり大きくなるのでPCのスペックによっては動作が重くなり操作にストレスを感じる可能性があります。

つまり、費用をかけずにコーダーとして活動していきたい場合は

  • GIMP
  • Inkscape
  • Photopea

上記3つの使い方を理解しておく必要があるというコトです。
※もちろん他にも費用をかけずに対応する方法はあるかもしれません。

あとは少し費用が掛かってしまいますが、PhotoshopとIllustratorと互換性があると謳っている有料の買い切りソフトを使う形もあります。

私自身が使っているのはAffinityのシリーズです。

Photoshopの代替としてAffinity Photo、Illustratorの代替としてAffinity Designerがあります。
ただこのシリーズでもIllustratorのデータを扱う場合は、PDF互換保存をしてデザイナーさんには渡していただく必要があります。

どちらも通常価格は2020年7月現在6,100円ですが、30%OFFや50%OFFのセールを定期的にやるので良いタイミングに当たれば約3000円で購入出来ます。

コーダーとしてPhotoshopやIllustratorを考えた際に購入を躊躇してしまう1番の問題は、使う機会がそんなになくかつ搭載されているほとんどの機能を使わないのに毎月なかなかの出費を強いられることであると思います。

その点、Affinityシリーズに限らず買い切りのモノであれば買う時だけで基本費用の発生は済みますので、選択肢の1つに入れて考えてみるのもよいと思います。

また、デザイナーさんからデータを渡される時の問題を中心に話しましたが、デザインソフトが使えればそれ以外の部分でも仕事の幅は広がりますので必ず使えるようにしておきましょう。

テキストエディタ

準備の部分で少し触れましたが、コーディングをする上でテキストエディタは必須のモノになります。

何を使うかは好みだったり、その時の出会いによりますが検索で「おすすめ テキストエディタ」であがってくるテキストエディタはたいてい便利な機能が付いていますので、ある程度調べて使いこなせるようになっておいた方が良いです。

FTPクライアントソフト

コーディングした制作物を自分のPC内だけで確認するだけなら必要ありませんが、案件によっては制作したファイルを直接サーバにあげて納品として欲しいという依頼であったり、現在サーバにあるデータをダウンロードして修正して欲しいといった依頼が多々あります。

ここでは詳しく書きませんが、そのサーバにアクセスするために必要なソフトがFTPクライアントソフトというモノになります。

無料で有名なモノだと、FileZillaというソフトがあります。

こういったモノを使えるようにしておきましょう。

メールソフト

基本的にクライアントさんと対面することはあまりないのでメールやビジネスチャットツールなどを使ったやり取りが多くなります。

まずはメールソフトに関して記載していきます。

  • Gmail
  • Yahoo!メール
  • Outlook
  • Thunderbird

Windowsを使っているかMacを使っているかでまたオススメは変わってきますが、有名なのは上記4つになります。
上記のモノだけに限らず気に入ったモノを選んでよいと思います。

ビジネスチャットツール

  • Skype
  • slack
  • Chatwork

他にもたくさんこういったツールはあるのですが、基本的にはSkypeを入れておけばある程度対応出来る印象があります。
今どきSkypeだなんてと思う人もいるかもしれませんが、メインで使っていなくても、古くからあるツールなので一応インストールしているという人も多いのでとりあえず入れておくとよいです。

Office系ソフト

Windowsなら

  • Word
  • Excel
  • Power Point

Macなら

  • Pages
  • Numbers
  • Keynote

といったモノになります。

なんでも基本的には使いこなせた方が良いですが、これらはとりあえずPCに入っていればよいです。
指示書、仕様書などは「Word、Excel、Power Point」で作られていることが多いので、内容を閲覧出来ればOKといった感じです。

MacにもMac版のOffice(Wordなど)がありますが、Pagesなどにそれぞれ互換性がありますので、わざわざ入れる必要はありません。

また、仮にWindowsを使っていてOfficeが入っていなかったとしても、互換性あるフリーのソフトを使えば閲覧は可能ですし、PCにインストールしなくてもオンライン上で中身を確認出来るサービスもありますので、仕様書などの閲覧するためだけにOfficeを購入する必要はありません。

ブラウザ

  • Chrome
  • Internet Explorer11
  • Edge
  • Firefox
  • Safari

テキストエディタ同様、準備のページで少し触れましたが実際にお金を稼ぎ出すとなった場合、上記のブラウザ環境は合ったほうがよいです。

ただし、上記全部を揃えきちんとした形で確認しようと思うとWindowsとMacのPC両方必要になってきます。
もちろんどちらかのOSしかなくても様々な方法で解決するコトは出来たりします。

1番癖があるブラウザがInternet Explorer11で極端な話、Chrome以外はこれだけ確認出来ればよい気がしてしまう程です。

2020年7月現在では、Windows7のInternet Explorer11のサポートは終わっており、8や10ではまだ続いてはいますが、開発元のMicrosoft自体がInternet Explorerではなく、Edgeを推奨している状況で強制的にブラウザの変更を進めているような動きもありますので、今後完全に意識しなくてもよい日が来るのもそう遠くないとは思うのですが、国内をみるとInternet Explorer11のシェアがまだありますので、クライアントさんによってはInternet Explorer11にもしっかり対応して欲しいと言われてしまうコトはあるかもしれません。

また、今後Internet Explorer11は考えなくてよくなる可能性を考えるとOSを選べるのであればコーダーとしてはMacの方が何かと便利かもしれません。

まとめ

その他入れておいた方が制作が捗るソフトというモノもありますが、それはまた別の機会に紹介出来たらと思います。
とりあえずコーダーとして稼ぎ出す際に最低限あった方がよいモノを本ページにてあげましたので、参考にしていただけたらと思います。

Categories: