フリーランスが会社員収入を継続して得られないパターン7つ

フリーランスがウェブ制作で必要最低限のデザインスキル5つ【10分】

わたしはこれまでウェブ制作案件を8つこなしました。

デザインから案件をこなせるエンジニアになるために、illustratorやphotoshopの講座を受け結構勉強したのですが、必要最低限のデザインスキルは5つのみでした。(笑)

その他のスキルは、今までのところあまり使っていません。

どれも10分でマスターできる簡単なものなので、紹介します。

 

 

0.前提:illustrator、photoshopのソフトをもっていること。

特に自分の場合はコーディング案件をこなす場合、photoshopのツールは毎回使い(具体的に使う場面は後述)、

デザインからコーディングまで行う案件の場合はillustratorもほぼ毎回使ったので、持っておいた方が良いと思います。

頑張って無料ツールを探しましたが、設定が複雑で結局使えなかったり、怪しいソフトだったので諦めました。

AmazonセールやAdobeからより最も安く購入する方法は最後に紹介します。

 

 

1.画像の背景を透過させる or 色を変更する

案件:コーディング案件・デザイン案件

クライアントから背景付きの商品画像を渡された時に、背景を消して商品だけの画像に加工することがあります。

また、背景色を透明にする場合がよくあります。

背景を消す方法は4パターンくらいあるのですが、一番簡単なものを紹介します。

 

 

2.illustratorでロゴの配色を変える

案件:デザイン案件

サイトデザインに合わせてロゴの配色を変えることがあります。

クライアントからロゴのaiデータをもらっていることが前提です。

 

 

3.photoshopで要素の長さを測る

案件:コーディング案件

コーディングのみの案件の時は、ほとんどの場合、クライアントから「photoshopデータ」が送られてくるので、データに合わせて長さをpx単位で揃える必要があります。

photoshopのプラグインを入れて長さを測る方法もありますが、プラグインを入れること自体がまず面倒なので、この方法でパパッとマスターしてしまいましょう。

 

 

4.photoshopの画像書き出しをする

案件:コーディング案件

コーディングのみの案件の時は、ほとんどの場合、クライアントから「photoshopデータ」が送られてくるので、コーディングで実装できない部分を、「書き出し」をする必要があります。

コーディングで実装できない部分とは、例えば、「背景などの柄」や「イラスト」などです。

 

 

5.パワポ感覚で使える無料デザインツールfigmaでデザインする

案件:デザイン案件


実際にウェブデザインをする時は、figmaを使うのが最も簡単だと思います。

figmaは、無料でオンライン上で直感的にウェブデザインができるツールです。イメージはパワポ上でデザインを作成している感じです。

オンラインツールなので複数人で一緒に同じアートボードを確認、デザインもできます。

上記は実際にfigmaを使ってデザインをしているツイートです。

 

簡潔に方法をまとめると以下3ステップです。

1.figmaのページで新規登録する

フリーランスがウェブ制作で必要最低限のデザインスキル

 

2. アートボードを作成し、長方形を配置→テキストや、中身を入れていく。

フリーランスがウェブ制作で必要最低限のデザインスキル

ほとんどパワポと同じ要領で行います。左上からテキストや図形などを選ぶことができます。

ちなみにテキストの日本語フォントは以下4つのみを使うことができます。下2つは装飾フォントなので、基本的には上2つのみを使っています。英語フォントはGoogleフォントなら大体使えます。

– Noto Sans JP
– Noto Serif JP

– Nico moji
– Nikukyu

あと、テキストのフォントをfontawesomeに変えて、fontawesomeのCheet Seatからアイコンをコピペすればアイコンも使うことができます。

 

3.デザインを見てもらいたい人に共有する

フリーランスがウェブ制作で必要最低限のデザインスキル

右上の「Share」をクリックすると、リンク取得画面があらわれます。リンクをシェアしたい人に送りましょう。

 

illustratorやphotoshopを最も安く買うには?

わたしはネットで最も安く手に入れる方法をかなり調べましたが、アマゾンのセールで買ったり、illustratorとphotoshopのみを買うよりも、Adobe Creative Cloudというアドビツール全てが入ったパックを「ヒューマンアカデミー講座『たのまな』」から買うのが、年間29800円で最も安かったです。

Adobeのホームページから買うよりCreative Cloudだと3万円/年、イラレ、フォトショのみだと6000円/年安いです。1ヶ月のイラレ・フォトショの講座付きで、Adobe XD(ウェブデザインツール)など他のアドビソフトも一緒に付いてきます。Web制作初心者のためのLP制作方法(通常価格ではなく29800円で購入ができます)