TechAcademy（テックアカデミー） Webデザインコース Webデザイン Photoshop Photoshopで円を点線で描く方法を現役エンジニアが解説【初心者向け】
Photoshop

Photoshopで円を点線で描く方法を現役エンジニアが解説【初心者向け】

初心者向けにPhotoshopで円を点線で描く方法について解説しています。最初に楕円形ツールを使用した円の基本の作成方法を説明します。次にツールの線オプションを使った点線の描画方法を見ていきましょう。

テックアカデミーマガジンは受講者数No.1のプログラミングスクール「テックアカデミー」が運営。初心者向けにプロが解説した記事を公開中。現役エンジニアの方はこちらをご覧ください。 ※ アンケートモニター提供元：GMOリサーチ株式会社　調査期間：2021年8月12日～8月16日　 調査対象：2020年8月以降にプログラミングスクールを受講した18～80歳の男女1,000名　 調査手法：インターネット調査

Photoshopで円を点線で描く方法について、TechAcademyのメンター（現役エンジニア）が初心者向けに解説します。

なお本記事は、TechAcademyのオンラインブートキャンプPhotoshop講座のカリキュラムをもとに執筆しています。

 

田島悠介

今回は、Photoshopに関する内容だね！

大石ゆかり

どういう内容でしょうか？

田島悠介

円を点線で描く方法について詳しく説明していくね！

大石ゆかり

お願いします！

目次

1時間でできる無料体験！

 

基本的な円の描き方

Photoshopで円を描く場合、基本的には楕円形ツールを使用します。

まずツールバーから楕円形ツールを選択します。

次にキャンバス上でマウスをドラッグすると円が作成されます。

※Shiftキーを押したままドラッグすると、真ん丸な円を描くことができます。

 

[PR] Webデザインで副業する学習方法を動画で公開中

点線の描き方

Photoshopで点線を描く場合は、ツールの線オプションを使用します。

ここではペンツールを使用した方法で紹介しますが、描かれた直線のデータの線の種類を変更するので基本的にツールの使用方法は共通のものになります。

まずはじめにツールバーからペンツールを選択し、画面上部の線オプションから点線を選択します。。

次にキャンバス上で線を描くと、点線で描かれます。

 

円を点線で描く方法

それでは、最後に今回のテーマである円を点線で描く方法について紹介します。

Photoshopを使用して円を点線で描くには、まず先ほど円を描いた楕円形ツールを選択し、画面上部の線オプションから点線を選択します。

線オプションの設定が完了後、楕円形ツールで点線の円を描くことができます。

 

コラム

実は私も！？独学で損する人の特徴

「スクールは高いから独学で成功する」という気持ちの方は多いと思います。
もちろんその方が金額は低く抑えられるでしょう。
ただ 独学には向き不向きがあり、実はスクールが向いている人も大勢います。

そんな方のために参考として、 テックアカデミー卒業生がスクールを選んだ理由 をご紹介します。

  • ・困って挫折しそうなときに、質問や相談できる相手がいる環境で学んでいきたいなと思った
  • ・わかった気になっているだけだったので、自分を追い込む環境に置いた方がいいと感じた
  • ・スクールのカリキュラムで市場に求められるスキルを学ぶべきと思った

少しでも当てはまる部分があれば、 スクールが向いているかもしれません。
お試しのつもりで、まずは一度 無料相談 に参加してみませんか？

現役エンジニア・デザイナーに何でも気軽に相談できる30分 を すべて無料で できます。
無理な勧誘は一切ない ので、お気軽にご参加ください。

今なら相談した方限定の割引・参加特典付き！ 無料相談はこちら

まとめ

今回は、Photoshopで円を点線で描く方法について紹介しました。

今回紹介した内容は、直線や円だけでなく線を引くものに関しては全て共通して使用できます。

また、円を点線で描くことで、写真の一部などを点線の円で囲うというような事が、様々な場面で活用できるので今回の記事を参考にしっかりとマスターしましょう。

 

監修してくれたメンター

菅繕久

現在はフリーランスのエンジニアをしていてプログラミング歴は8年目になります。
普段は Python、FileMaker等を使って様々な業務で活用できるIoTプロダクトRPAツールを作成しています。
開発実績としては、業務自動化ツール(在庫管理・発注・ファイル操作 etc)、電子カルテシステム、ロボット用プログラムなどがあります。
TechAcademy ではPythonコースを担当しております。

 

大石ゆかり

内容分かりやすくて良かったです！

田島悠介

ゆかりちゃんも分からないことがあったら質問してね！

大石ゆかり

分かりました。ありがとうございます！

 

TechAcademyでは初心者でも1週間でフォトレタッチをマスターできるオンラインブートキャンプ Photoshop講座を開催しています。

現役デザイナーに毎日チャットで質問することができます。

初心者・未経験でもできる。まずはテックアカデミーに相談しよう

プログラミングを独学していて、このように感じた経験はないでしょうか？

  • ・調べてもほしい情報が見つからない
  • ・独学のスキルが実際の業務で通用するのか不安
  • ・目標への学習プランがわからず、迷子になりそう

テックアカデミーでは、このような 学習に不安を抱えている方へ、現役エンジニア講師とマンツーマンで相談できる機会を無料で提供 しています。
30分間、オンラインでどんなことでも質問し放題です。

「受けてよかった」と感じていただけるよう 厳しい試験を通過した講師 があなたの相談に真摯に向き合います。

「ただ気になることを相談したい」
「漠然としているがプロの話を聞いてみたい」
こんな気持ちでも大丈夫です。

無理な勧誘は一切ありません ので、まずはお気軽にご参加ください。
※体験用のカリキュラムも無料で配布いたします。（1週間限定）

今なら参加者限定の割引特典付き！ 無料相談を予約する

記事を検索

関連するキーワード

関連する記事

Photoshopでレイヤーマスクを描画する方法【初心者向け】

Photoshopでレイヤーマスクを描画する方法を初心者向けに解説した記事です。 レイヤーマスクを使用することによってレイヤーの一部を非表示にしたり、表示...
Photoshop

Photoshopで消しゴムツールを使う方法【初心者向け】

Photoshopには「消しゴムツール」という、その名の通り、画像を消せるツールがあります。 今回はその使い方を初心者向けに解説します。 このツール...
Photoshop

意外と便利！Photoshopで顔写真にモザイクをかける方法

Webサイトに載せる写真などで、写っている人を認識させないなためにモザイクをかけることはないでしょうか？ Photoshopでは「フィルター」機能を使うこ...
Photoshop

Photoshopで吹き出しを表示させる方法【初心者向け】

Photoshopで吹き出しを表示させる方法を初心者向けに解説した記事です。 吹き出しはPhotoshopのカスタムシェイプの機能を使うことで、画像に簡単...
Photoshop

Photoshopで360度パノラマ写真を作成する方法【初心者向け】

Photoshopでは、撮影が難しいパノラマ写真を編集によって簡単に作成することができます。 使うのは、「Photomerge」という自動合成機能。簡単な...
Photoshop

Photoshopで画像を塗りつぶす方法【初心者向け】

Photoshopの基本的な操作を初心者向けに解説する記事です。 Photoshopの「塗りつぶしツール」を使用すると、同じ色合いの範囲や選択した部分を指...
Photoshop

あわせてよく読まれている記事

初心者でもすぐにできる！Photoshopで円を描く方法

初心者の方でもPhotoshopの使い方がわかる記事です。 今回のテーマは「円を描く方法」です。 Photoshopの線で丸を書くこともできますが、あまり綺麗にはならないですよね。   Photoshopでは「楕円形選択ツール」を使うと、さまざまな形や色の円を正確に描くことができます。 「基本的な描き方」と「形を指定して描く」方法の2つに分けて紹介します。 目次基本的な円の描き方点線の描き方円を点線で描く方法まとめ監修してくれたメンター (※今回の作業はすべてAdobe PhotoShop CCのバージョンで行っています)   田島悠介 今日は楕円形選択ツールの基本的な使い方を勉強してみよう。 大石ゆかり 田島メンター！！ 選択ツールっていうのはどこから選べばいいんですか～？ 田島悠介 Photoshop画面の左にあるツールバーにあるアイコンをクリックして選択するよ。 もしこのメニューが表示されていない場合は、上部メニュー「ウィンドウ」の「ツール」にチェックを入れよう。 大石ゆかり 分かりました！   基本的な円の描き方 まずは基本的な描き方を覚えていきましょう。 画面左のツールバー内の選択アイコンを右クリックして「楕円形選択ツール」を選びます。   円を描きたい場所に、以下のようにドラッグします。 ドラッグした範囲が広いほど大きな円になります。 上部メニュー「編集」→「境界線を描く」を選択します。   表示されたウインドウで円の線の設定を行います。 今回は線の幅と色、描画位置を設定してみます。 幅：円を描いた時の線の太さです。 カラー：クリックするとカラーピッカーが表示され、線を好きな色に指定できます。 位置：どこに沿って線を描くか基準となる位置を指定できます。 設定できたらOKボタンを押すと線が描かれます。   線が描かれたら、上部メニュー「選択範囲」→「選択範囲を解除」をクリックして完成です。   正円を描きたい場合は、「楕円形選択ツール」で選択範囲を作成するときに「Shiftキー」を押しながらドラッグしましょう。 縦横比が固定され、正円を描くことができます。 田島悠介 Shiftキーを使ったやり方は「長方形選択ツール」のときにも有効だよ。 押しながら選択すると必ず正方形になるんだ。 大石ゆかり まん丸にしたいときはこんな方法があるんですね。 田島悠介 選択範囲ツールからは線での描画だけでなく、中を塗りつぶすこともできるよ。 次の方法を見てみよう。   塗りつぶした円の描き方 線で描いた円でなく、塗りつぶした円を描いてみましょう。 選択範囲を作成した状態で、上部メニュー「編集」→「塗りつぶし」を選択します。   ウインドウが表示されたら、内容に「描画色」を選ぶと、その時選択されている色で塗りつぶすことができます。 OKボタンをクリックすれば完成です。   塗りつぶした円を描くことができました。 [PR] Webデザインで副業する学習方法を動画で公開中円の形状を指定して描く方法 基本的な円の描き方を覚えたら、次に形を指定して描いてみましょう。 「楕円形選択ツール」選択時に上部オプションバーに表示される「スタイル」という部分を操作・入力することで、指定した大きさや形に描画できます。   「縦横比を固定」を選び、幅と高さの比率を入力します。 今回は幅2：高さ1としています。   選択した範囲の大きさに関わらず、設定した幅・高さの比率が反映された円になります。 先ほどShift＋ドラッグで正円を作りましたが、ここの設定で比率を1：1にしておけばShiftを押すことなくいくつでも正円を描くことが可能です。   次は、「スタイル」から「固定」を選択してみます。   ここでは幅と高さの長さをpx値で入力します。 今回は幅100px：高さ200pxとしてみました。   すると、ドラッグして作成される円の選択範囲が、指定した大きさで完全に固定されます。 この方法は、全く同じ形の円をたくさん描きたい時などに便利です。   田島悠介 楕円形選択ツールの基本的な使い方は分かったかな？ 大石ゆかり 縦横の比率や、大きさそのものを固定することもできたんですね。 田島悠介 こういうシンプルなツールの中にも、便利なオプションが色々あるのでしっかり活用しよう。 大石ゆかり 普段から意識するようにしてみます。ありがとうございました！   コラム 実は私も！？独学で損する人の特徴 「スクールは高いから独学で成功する」という気持ちの方は多いと思います。 もちろんその方が金額は低く抑えられるでしょう。 ただ 独学には向き不向きがあり、実はスクールが向いている人も大勢います。 そんな方のために参考として、 テックアカデミー卒業生がスクールを選んだ理由 をご紹介します。
Photoshop

Photoshopを使ってベジェ曲線を描く方法【初心者向け】

ベジェ曲線とはコンピューターグラフィックにおいて主に図形や文字を描画する際に使用されるもので、始点・終点などの座標を元に形成されています。一般的には、Adobe Illustratorを使って描くことが多いです。 Photoshopではこのベジェ曲線を「ペンツール」機能を使用することによって作成できます。 目次基本的な円の描き方点線の描き方円を点線で描く方法まとめ監修してくれたメンター (※今回の作業はすべてAdobe PhotoShop CCのバージョンでおこなっています)   大石ゆかり 田島メンター！！ベジェ曲線って何ですか～？ 田島悠介 点と点の間を滑らかな曲線になるように計算して描画されるベクター形式の線だよ。 Photoshopでは「ペンツール」で描画することができるんだ。 大石ゆかり ペンツールってなかなかよく分からなくて、あまり触ったことがないです…… 田島悠介 いくつかのポイントを押さえれば、思った通りの線が引けるようになると思うよ。 早速やってみよう。   Photoshopでベジェ曲線の図形を描画する方法 画面左のツールパネルからペンツールアイコンを右クリックし、一番上の「ペンツール」を選択します。   カンバス内の適当なところでクリックしてみましょう。   次に、少し離れたところで同じようにクリックすると点と点が直線で繋がれました。 この各点を「アンカーポイント」、間の線を「パス」と言います。   今度は別の場所で、クリックした指を離さずにそのまま下方向にドラッグしてみましょう。 すると、ドラッグした方向とその180度反対の方向に直線が出てきます。   この直線は「ハンドル」と言い、向きや長さを調整して曲線の形状を調整できます。   田島悠介 この「ハンドル」がベジェ曲線を作成するときに重要になるので操作をよく覚えておこう。 大石ゆかり 操作しようと思ったら、新しいアンカーポイントが作成されちゃいました…… 田島悠介 ハンドルを操作するときはCtrl(Macの場合はcommand)を押しながら触ることを心がけよう。 カーソルの形が変わるのでそれを目安にするといいよ。   ハンドルを回すことで曲線の形状を調整できます。 ハンドルはCtrl(command)を押しながら端の点をドラッグすることでいつでも操作が可能です。   以下のように、始点と終点が別の場所にある状態のパスを「オープンパス」と言います。   オープンパスに対して始点と終点が同じ位置にあるパスのことを「クローズドパス」と言います。   線を設定する方法 パスの上で右クリックし「パスの境界線を描く」を選択するとパスの形に沿って線を描画できます。   以下はパスに沿って線を描画した状態です。 画面左のツールパネルで描画色に設定されている色で線が描画されました。   内側を塗りつぶす方法 パスの上で右クリックし「パスの塗りつぶし」を選択するとパス内を塗りつぶすことができます。 クリックすると表示される「パスの塗りつぶし」ウインドウでは、色の設定を行うことができます。   以下はパス(クローズドパス)を塗りつぶした状態です。 オープンパスの場合は自動で始点と終点が結ばれ範囲が作成されます。   パスを選択範囲に変更する方法 パスの上で右クリックし「選択範囲を作成」を選ぶとパスの形状に沿って選択範囲が作成されます。   以下は選択範囲が作成された状態です。 塗りつぶしの時と同様に、オープンパスの場合は自動で始点と終点が結ばれ範囲が作成されます。   パスの形状を調整する方法 形状をより単純化したい時などは、アンカーポイントを少なくしてみましょう。 アンカーポイントの上で右クリックし「アンカーポイントを削除」でポイントを削除できます。   直線的な部分を滑らかな曲線にしたい時は、アンカーポイントにハンドルを追加してみましょう。 ペンツールアイコンを右クリックして「アンカーポイントの切り替えツール」を選択します。   ハンドルの作成されていないアンカーポイント上でドラッグすることで、ハンドルを後から追加できます。   アンカーポイントの位置を調整したい場合は、画面左のツールパネルから「パス選択ツール」を選びます。   アンカーポイントに合わせドラッグすると、ポイントを自由に移動させることができます。   作成したパスを全て削除したい場合は右クリックから「パスを削除」を選択します。   田島悠介 アンカーポイントとハンドル、このふたつの操作方法をよく知っておくのが基本だね。 大石ゆかり 後から図形の形を変えたいときはアンカーポイントを追加したり移動したり、ハンドルで操作したりしたらいいんですね。 田島悠介 ペンツールの操作はブラシツールと違って直感的にはあまりうまく動作しないけれど、ひとつひとつの操作やショートカットキーを丁寧に覚えていけば自由に使えるようになるよ。 大石ゆかり はい！練習してみます！   まとめ 今回は、Photoshopでベジェ曲線を描く方法を、パスの描画に着目して紹介いたしました。 円形ツールなどで描画する「シェイプ」も、実はベジェ曲線で描かれたクローズドパスの図形になります。 ベジェ曲線が編集できると、ちょっとしたパスの修正が容易に行えて非常に便利です。 アンカーポイントやパス、ハンドルの操作などはIllustratorのペンツールとほぼ共通ですので、スキルのひとつとしてぜひ習得してみてください。   [PR] Webデザインで副業する学習方法を動画で公開中Photoshopを学習中の方へ これで解説は終了です、お疲れさまでした。 Photoshopを調べたけど分かりづらい 副業や転職後の「現場で使える」知識やスキルを身につけたい Photoshopの学習や情報収集をしていて、このように思ったことはありませんか？ テックアカデミーのPhotoshop講座では、第一線で活躍する「プロのWebデザイナー」が教えているので、効率的に実践的なスキルを完全オンラインでしっかり習得できます。 合格率10%の選考を通過した、選ばれたWebデザイナーのチャットサポートを受けながら、初心者でもフォトレタッチをマスターできます。 プログラミングを独学していて、このように感じた経験はないでしょうか？ ・調べてもほしい情報が見つからない ・独学のスキルが実際の業務で通用するのか不安 ・目標への学習プランがわからず、迷子になりそう テックアカデミーでは、このような 学習に不安を抱えている方へ、現役エンジニア講師とマンツーマンで相談できる機会を無料で提供
Photoshop

図形が描ける！HTML5のcanvasの書き方【初心者向け】

HTML5で使うcanvasの書き方について、テックアカデミーのメンター（現役エンジニア）が実際のコードを使用して初心者向けに解説します。 ブラウザ上で絵を描くアプリなどもcanvasで作ることができるので、活用の幅は広いはずです。 HTMLとJavaScriptで作ることができるので、ぜひ書き方を覚えておきましょう。 目次基本的な円の描き方点線の描き方円を点線で描く方法まとめ監修してくれたメンター そもそもHTMLの記述方法がわからない場合は、 HTMLの書き方について解説した記事を読むとさらに理解が深まります。   canvasとは canvasとは、図形を描画するためのHTMLタグで、HTML5の策定時に新たに追加されました。 HTML5以前は、図形をWebで表示させるために、画像などを読み込むかFlashなどで描画するのが一般的でした。 しかしcanvasタグの登場により、HTMLとJavaScriptで簡単に描画することができるようになったのです。   canvasタグを使うのに必要な知識 簡単とはいえcanvasタグを用いてWeb上に図形を描画するには、以下に示すとおり、HTML / CSS / Javascriptの基本的な知識が必要です。   HTML Webページを作成するにはお馴染みのHTMLですが、役割はWebページの個々の内容（要素）をタグで囲み文書構造をブラウザに伝えることです。 canvasタグもHTMLの要素の一つなので、まずはHTMLの理解が必要になってきます。 CSS CSSの役割は、HTMLで作成した要素のレイアウトや見た目を制御することです。 canvasタグの背景色やページ全体のデザインを決めるために必要になってきます。   JavaScript Javascriptの役割は、HTMLで作成した要素を動かしたり、クリック等のユーザー操作に伴って表示を変えるなどの処理（イベント）をプログラムで制御することです。 canvasタグ内の図形を描画するのもJavascriptです。   以降では、Javascriptでcanvasの描画を行う方法を解説します。   [PR] Webデザインで副業する学習方法を動画で公開中canvasで図形を描画する方法 canvasで図形を描画するには、まずHTML内に以下の例のようにcanvasタグを書きます。 <canvas id="id名" width="横幅のpx値" height="縦幅のpx値"></canvas>   さらにHTML内にscriptタグを追加し、その中にグラフィックを描画するための命令を書いていきます。 canvasの描画方法はたくさんあるため、ここでは線を書く方法を紹介します。 // line_canvasという変数を定義し、canvas要素を取得する var line_canvas = document.getElementById("id名"); // 2Dグラフィックの描画に必要な各種設定（コンテキスト）を取得する var line_ctx = line_canvas.getContext("2d"); // 描画開始位置を初期化する line_ctx.beginPath(); // 開始位置に移動する line_ctx.moveTo(20, 20); // 線を引く line_ctx.lineTo(80, 80); // 描画を終了する line_ctx.closePath(); // 実際に線を引く line_ctx.stroke();   以上、ぱっと見複雑ですが一つ一つの工程を見ていくと何をしているのか理解できると思います。   コラム 実は私も！？独学で損する人の特徴 「スクールは高いから独学で成功する」という気持ちの方は多いと思います。 もちろんその方が金額は低く抑えられるでしょう。 ただ
HTML

最もよく使われるデザインの3大ツールを比較してみた！

本稿は、Designmodeのブログ記事を了解を得て日本語翻訳し掲載した記事になります。本記事は、デザイナー、ライターであるJake Rocheleau氏によって投稿されました。   絶えず拡大し続けるデザインの世界に初めて入った人にとって、この世界は理解しにくいと思えるかもしれません。あまりにも多くのツールやテクニックがあるため、何から始めたらいいか分かりにくいかもしれません。 最も広く使用されているのデザインソフトウェアは、Adobe Photoshop、Adobe Illustrator、Sketchです。 このガイドでは、これらの3大ツールを比較しながら、デザインの一般的なタスクにおける活用方法をご紹介します。どれも優れたツールですが、それぞれ長所と短所があります。タスクごとに最適なツールを知っていれば、デザインの学習や作業は、はるかに効率的になると思います。   目次 UIデザイン アイコンのデザイン 写真の編集 グラフィックデザイン デジタルペインティング   UIデザイン インターフェースのデザインは、通常、Webサイトやモバイルアプリを対象としますが、ゲームのUI、インタラクションデザインの画面を対象に含むこともあります。 過去数年においては、PhotoshopがUIデザインにおける第1位のツールでした。Photoshopを使用すれば、ベクター形式のアイコンとテクスチャ素材の背景を組み合わせて、1つのレイアウトを作成することも可能です。   また、本来Photoshopは、画像編集のソフトウェアパッケージ（スイート）ですが、Adobe社によってFireworksの開発終了が宣言されたため、Photoshopの需要は一層高まっていました。 こうした状況で新たに登場したのがSketchです。Sketchのアプリの最初のリリースは、2010年後半のことでした。それ以来、Sketchの学習コミュニティ、無料サイトなどが拡大しています。 Sketchの使い方 現在では、UIデザインツールの覇者はSketchです。Sketchは、WebとモバイルのUIデザインに特化したソフトウェアパッケージです。パタン、テクスチャ素材、ベクター素材などを組み合わせた編集は、Photoshopで行うよりも簡単です。 唯一の短所は、対応OSがMac OS Xのみであるため、Windowsのユーザーは利用できない点です。 UIのデザインにIllustratorを好んで使う人もいますが、機能が不十分に思えます。Illustratorは、インターフェースに求められるピクセルパーフェクトなデザインを実現できるソフトウェアではありません。一方Sketchを使えば、ベクター素材とピクセル単位のデザインを組み合わせて、インターフェースを作ることも可能です。シェイプとベクターの編集、レイヤーの編集もより簡単に行うことができます。   もし、UIデザインのためのソフトウェアを探しているとしたら、Sketchが明らかにベストな選択です。しかし、OSがWindowsの場合にはSketchは選択できないので、Photoshopがベストな選択になります。PhotoshopでもSketchと同じような作業ができますが、Sketchを使った方が、UIデザインのワークフローは円滑に進みます。 現在Photoshopを使っていてSketchに乗り換えようか迷っている人は、「Sketchに乗り換えた理由と気に入っている点」を解説したSagi Shrieber氏による記事などが参考になると思います。 またもし、試しにSketchでデザインの作業をしてみたいという方は、Sketchのサイトで提供されているフリートライアルやチュートリアルを活用することもできます。 Sagi Shrieber氏による記事 Sketchによるヘッダーのデザイン例 Sketchによるログインフォームのデザイン例 Sketchによるニュースレターのデザイン例 Sketchのフリートライアル   [PR] Webデザインで副業する学習方法を動画で公開中アイコンのデザイン アイコンのデザインは、ベクター形式で進められることがほとんどです。多くのデザイナーは、まずアイデアを紙に書き出して、次にそれをデザインソフトウェアに取り込むことでトレースします。私の経験からいうと、ペンツールによる直感的な描写が可能なIllustratorが良いと思います。 私はPhotoshopのペンツールもよく使っています。Photoshopは、アイコンをトレースしたり、デザインをマッピングする際に優れたツールとなります。ただし、Photoshopで作成したベクター素材をIllustratorで編集するのは簡単なことではなく、その逆もしかりです。しかしどちらかというと、IllustratorからPhotoshopへ編集を移行する方が、ワークフローはスムーズになると思います。   Illustratorではアイコンの細かな編集が可能で、Photoshopのパスパレット（paths palette）を使うよりも、レイヤーの編集が容易になります。 Sketchにも、アイコンのデザインに使える優れたツールが備わっています。操作性はIllustratorととよく似ていて、オンラインのチュートリアルなどを利用して練習を積めば、基礎を学べると思います。Sketchにおける重要な機能は、シェイプ（shape）を結合するときに使える、結合ボタン（Union button）です。これはちょうどIllustratorにおけるパスファインダー（Pathfinder）と似ていて、リアルな質感のアイコンをデザインするには欠かせないツールです。 ベクター形式のアイコンのデザインに関しては、Illustratorがベストな選択です。 しかし、Sketchも基本的な機能を備えていて、アイコンのデザインに使うには優れたツールでしょう。   写真の編集 Adobe Photoshopが特に優れているのは、写真の編集です。独自のアイデアからフォトバッシュ（photobashing：複数の写真や画像を組み合わせて、ペイントなどを加え、新たな1つの画像を作成するデザイン技法）をするとしても、古い写真をレタッチするとしても、Photoshop1つあれば全てのデザイン作業を完了できます。 Photoshopには、赤目の修正機能、部分編集に使える複製（duplicate）＆パッチツール、カラーやテクスチャのブレンドモード、選択したサイズで画像をエクスポートする機能など、豊富なツールが備わっています。 このような機能に関しては、IllustratorやSketchは到底敵いません。 Photoshopの代替ツールとして、AffinityやGIMPなどもありますが、Photoshopと同じようなワークフローを実現できるツールはほぼないといえます。 タスクによっては、アイコンのデザインはPhotoshopで行い、インターフェースのデザインはIllustratorで行うなど、複数のツールを切り替えて使うのが良い場合もあります。しかし写真編集に関しては、IllustratorやSketchを開く必要はありません（Photoshopだけで十分です）。 Photoshopは写真編集のソフトウェアパッケージとして25年の歴史があり、ベストなツールとして選ばれ続ける理由があるのです。   コラム 実は私も！？独学で損する人の特徴 「スクールは高いから独学で成功する」という気持ちの方は多いと思います。 もちろんその方が金額は低く抑えられるでしょう。 ただ 独学には向き不向きがあり、実はスクールが向いている人も大勢います。 そんな方のために参考として、
Webデザイン

在宅でできる副業おすすめ職種20選【月5万円稼ぐ方法】

「スキマ時間で稼げる副業はないかな…？」 「どうせなら在宅でできる副業はないかな…？」 「スキルを身につけながら稼ぐことはできないかな…？」   この記事では、在宅でできるおすすめの副業20選を紹介し、選び方、副業をする上での注意点まで解説しています。 今の会社の収入だけでは満足できていない人 会社に出勤するのが無駄だと思っている人 そんな人に向けて書きました。   この記事を最後まで読めば、あなたにぴったりの副業が見つかるでしょう。   目次基本的な円の描き方点線の描き方円を点線で描く方法まとめ監修してくれたメンター 副業で特におすすめなのはIT系の副業です。 習得に時間と労力はかかるが、しっかり力をつければ安定して稼ぐことができます。 プログラミングは今後必要とされるスキルですので、副業を機会に始めてみるとよいでしょう。 難しい印象がありますが、意外と楽しく感じる人も多いので、まずはIT系の副業について勉強してみるのがおすすめです。 プログラマー Webサイト制作 Webデザイン プログラミングで副業したい人向けに、未経験から副業プログラミングで稼ぐ方法を解説した記事もあります。 ぜひご覧ください。   1 在宅でできる副業20選 在宅でできる副業にはどのようなものがあるのでしょうか。 現在人気の副業を中心に、それぞれの特徴をまとめました。 また、スキマ時間で毎月一定収入を稼ぎたいと考えている方向けに、「現実的に副業の範囲で5万円稼げるのか」という点についても説明しています。 1.1 Webライティング Webライティングは、クライアントが指定した内容やテーマに沿って、記事を執筆する仕事です。 Webメディアをはじめとする、様々な媒体でニーズがあり、ブログや商品紹介ページの作成、最近ではYouTubeの台本などの仕事もあります。   Webでの検索は今後も増加していく一方ですので、圧倒的に将来性がある副業だと言えるでしょう。 また、時間の確保さえできれば、毎月5万円を安定的に稼ぐことが可能です。 長期間継続し、文字単価を上げることができればより少ない時間で収入を得られるようになります。   向いている人 継続的にスキルアップし、専門性を高めていける人 記事を書くために多くのWebサイトや資料を読み込むため、情報収集が苦にならない人 様々な分野に興味を持つことができる人 タイピングに自信がある人 報酬体系 文字単価に、納品した記事の文字数を掛け合わせて計算する 1文字0.5円〜3円、1件あたり2000文字〜10000文字が相場 成果報酬型のため、案件を多く受けることができればその分収入アップにつながる クラウドソーシングなどのサイトを利用すれば、案件を受注し納品することで即収入が発生 メリット 日本語の読み書きができれば、特別なスキルがいらない 本業にも通じる文章作成能力が身につく デメリット ライバルが多く、案件が取りづらい可能性がある 案件が取れたとしても最初のうちは低単価で受注することも多くなる   1.2 ブログ 自分自身で開設したブログから収益を得る仕事です。ただし、記事を更新するだけでは収益が発生しません。   主に記事に外部企業の商品広告を貼り、そこから商品を購入したユーザーがいる場合に手数料が受け取れる「アフィエイト」と、Googleのバナー広告を掲載し記事がクリックされると報酬が発生する「Google アドセンス」という2つの方法があります。   Web広告の市場規模は年々拡大しているため、今後もニーズが増え続けていくでしょう。しかし、ブログアフィリエイターの30％以上が、ブログからの収入を得られていません。月5万円を稼ぐとなると、上位20％に入る必要があるため、安定的に稼ぐためのハードルはかなり高いと言えるでしょう。 参考：特定非営利活動法人　アフィリエイトマーケティング協会　「アフィリエイトに関する市場調査　2020年   向いている人 収益化するまで記事更新を継続できる人 「これだけは他の人に負けない」といった特定の分野に精通している人 報酬体系 アフリエイトの場合、広告を通して商品を1つ購入した場合に、商品価格の数％または一定額が支払われる 報酬額は商品ごとに異なり、1件あたり100円〜数千円 アドセンスの場合、1クリック30〜40円、PV数次第で収益が変わる 記事作成後、検索に反映されるまで3ヶ月ほどかかることがほとんどのため、収益化までは少し時間がかかる メリット P V数を増やす過程で、記事のライティングスキルや集客スキルが身につく 一度稼げるブログを作ってしまえば、何もしなくても広告収入が発生するため不労所得を得ることができる デメリット 競争が激しく収益化するまでに時間がかかる   1.3 プログラマー プログラミング言語を用いて、様々なシステムやアプリケーションを作成したり、動かしたりする仕事です。   基幹システムのサーバー構築や、既存システムの開発やテストといった業務内容があります。2018年の時点で、プログラマーのようなIT人材は約20万人以上不足となっており、2025年ではIT人材は36万人の不足と試算されています。   金融や家電、自動車など様々な分野においてI Tの活用が推進されていることも追い風になっており、かなり将来性がある職業だといえるでしょう。 参考：経済産業省　2019年　I T人材需給に関する調査   1案件あたりの単価が高く、スキルが身につけば短い時間で納品まで完了できますので毎月5万を安定して稼ぐことは可能でしょう。場合によっては1案件で数十万円稼ぐこともできるのがプログラマーの特徴です。 ただし、高額な案件を獲得するには、それなりの経験が求められます。 企業で3年以上の実務経験と向上心が必要になりますが、満たしていれば時給4,000円以上も視野に入るでしょう。   向いている人 プログラミングに必要な知識は日々アップデートされているため、常に新しいことを学んで行ける人 向上心があり、前向きに取り組める人 本業でプログラミングに携わっている人 報酬体系 プロジェクトごとに異なり、1案件あたりの単価は5〜10万円以上になることが多い 高い技術が必要とされるアプリケーション作成の場合には30万円以上となることもある 知識を得るために一定時間が必要とされるため、最低3ヶ月は収益が発生しない可能性が高い メリット プログラミング言語は一度覚えてしまえば様々な分野に応用可能なため、手に職をつけることができる ニーズが高く、案件に困ることがない 一般的にスキル習得難易度が高いと思われているが地道に継続すれば未経験からも習得できる デメリット 知識を取得するまでには一定時間を確保する必要がある 案件を獲得するには企業で数年の就業経験が必要   関連記事：【副業】プログラミング未経験から稼ぐ方法を徹底解説   1.4 Webサイト制作 ホームページやLP（ランディングページ）などのWebサイト制作をする仕事です。 主にプログラミング言語を用いてコーディングをすることがメインの業務となります。 現在、企業活動を行うにあたってホームページの設置は必須といえます。   ホームページからの集客を重視している企業も多くなってきていますので、今後も必要とされ続ける職種です。スキルアップのための地道な努力さえできれば、初心者であっても毎月5万を継続して稼ぐことは可能です。 後述するWebデザインとのスキルのかけ算で単価を上げることも可能です。   案件獲得の競争が激しいという一面はありますが、ポートフォリオ作る、低単価でも実績を積み重ねる、などの工夫をすれば月5万の収益を達成できるでしょう。   向いている人 必要な知識が日々アップデートされていくため、常に新しいことを学ぶことができる人 報酬体系 クラウドソーシングから受注する場合は、1ページあたり5000円〜が相場 Word Pressのテーマ制作やコーポレートサイト全体の設計などをする場合は10万円以上になる場合も多い 知識を得るために一定時間が必要とされるため、最低3ヶ月は収益が発生しない可能性が高い メリット アプリケーション制作やシステム構築を行う場合と比べてWeb制作に必要なプログラミング知識は少なくなっているため、学習を始めて収益化するまでのハードルはやや低い YouTubeの無料教材を利用したり、プログラミングスクールを利用したりすることで効率よく学べる環境がある デメリット クラウドソーシングなどのサイトでは案件数に対して応募者が多く、競争が激しくなる可能性が高い   関連記事：【副業】プログラミング未経験から稼ぐ方法を徹底解説 1.5 Webデザイン Web上に表示されるページの見た目に関する制作を行う仕事です。 Webサービスや広告用LP（ランディングページ）の作成など業務は幅広く、クライアントの依頼を受けて、使い勝手の良い魅力あるページ構成やデザインを考えることがメインの業務となります。 自社の魅力を世間によりよく発信するために、Webサイトにデザイン性を重視する企業が増えているため需要は高まってきているといえるでしょう。 スキルアップのための地道な努力さえできれば、初心者であっても毎月5万を継続して稼ぐことは可能です。 ポートフォリオを作る、低単価でも実績を積み重ねるなどの工夫をすれば月5万の収益を達成できます。 先述したWebサイト制作とのスキルのかけ算で単価を上げることも可能です。   向いている人 新しい技術を吸収することに喜びを見出せる人 デザイン以外の幅広い業務をすることに抵抗がない人 報酬体系 クライアントにより異なり、1案件数千円〜数万円と幅広い 企業向けの場合単価が高く10万円以上の案件も多くなる 知識を得るために一定時間が必要とされるため、最低3ヶ月は収益が発生しない可能性が高い メリット Web制作に必要なスキル全般が身につく デザインに関して顧客との折衝・調整を行うことも多く、コミュニケーション能力が身につく プログラミングやUI・UXデザインに関するスキルも身につくため、副業から本業へのシフトチェンジも視野に入れつつ、仕事に取り組むことができる デメリット 仕事の依頼を受けることができるレベルに達するまで、一定の学習時間を必要とする 関連記事：【副業】プログラミング未経験から稼ぐ方法を徹底解説 1.6 イラスト制作 ロゴ、名刺、アイコン、キャラクターなどのデザインをする仕事です。 クライアントからコンセプトや完成イメージの指示を受け、デザインをしていきます。LINEスタンプやキャラクターデザイン、図解やTwitterのアイコンなど、様々な分野でイラストが必要とされており、今後もニーズは拡大していくでしょう。   初心者でスキルやセンスがない場合、案件が獲得できず1ヶ月の売り上げが数千円で終わってしまうことも多いでしょう。スキルがあっても案件が単発で終わってしまうことも多いため、常に営業・集客をしていかなければ継続して収益を上げることは難しいのではないでしょうか。   向いている人 自分のデザインスキルやセンスに自信がある人 趣味として絵を描いたりデザインすることが好きな人 報酬体系 1案件数百円〜数千円とクライアントにより稼げる金額は幅広い 企業向け案件の場合単価が高くなる スキルさえあればすぐに稼ぐことができるが、1から始める場合やセンスがあまりないと感じる場合、収益発生までは数ヶ月〜1年以上かかる メリット 案件が多数あるため、自分にあった案件を見つけやすい デメリット 案件が獲得できるかどうかが各個人のスキルやセンスに左右されやすい 良い品質で納品するために、専用のソフトウェアや機器を用意する等、初期投資にある程度の費用がかかる   1.7 ネットショップ ネット上に店舗を開き、商品を販売する仕事です。 ネットショッピングの市場規模は年々拡大しており、将来性は高いといえます。 参考：経済産業省　　電子商取引に関する市場調査の結果   継続して売り上げをあげるためには、商品ラインナップや価格など、他の店舗と比べた優位性をアピールすることが必要になってきますが、大手と比べた場合、仕入れの面で不利になることも多いため、差別化をし選んでもらうショップにするためにはかなりの努力が必要です。 全くの未経験から始めた場合、月5万というのはかなり高いハードルとなるでしょう。   向いている人 普段からネットショッピングをよく利用している人 好きな商品ジャンルがある人 SNSのフォロワーがすでに多い人 報酬体系 商品の売り上げから仕入れにかかった費用を差し引いた分が利益となる 安く仕入れることができる先を確保できていれば、利益を出しやすい 商品がすぐに売れるとは限らないため、最低3ヶ月は売り上げが入ってこない可能性がある メリット 実店舗と異なり、人件費を極力抑えて物品の販売をすることができる プログラミングの知識がなくても店舗ページを開くことができるプラットフォームも充実している ハンドメイド作品を販売し固定のファンを獲得することができれば継続した売り上げを見込める デメリット 数ある他のショップと差別化をすることが難しく、SNSなども使って集客を行わなければ売り上げが見込めない   1.8 カスタマーサポート 企業へのお客様からの問い合わせに対して、メールやチャット、電話で対応をする仕事です。 稼働時間の確保さえできれば、安定した金額を毎月稼ぐことができるといえるでしょう。   向いている人 丁寧な顧客対応が求められるため、飲食店などの接客業やコールセンターでの勤務経験がある人 報酬体系 時給制となることが多く、1時間あたり1,000円〜1,500円が相場 働いた分だけ稼げるので、比較的早く収入を得ることができる メリット マニュアルに沿って対応をする形になるため、特別なスキルがなくても始めることができる デメリット 契約上毎週一定時間働くことが求められる クレーム対応をする場合、ストレスが溜まりやすい   1.9 データ入力・文字起こし エクセルやワードにデータを入力したり、動画や音声の内容を聞き会話内容を文字にして書き起こす仕事です。 企業内で使用する顧客リスト作成やプレゼン資料の作成、YouTubeの字幕作成といった作業があります。   1件あたりの単価が低いため月5万を稼ごうとすると、相当な時間を費やす必要が出てきます。 初心者でも手が出しやすい分、スキルアップが案件の獲得や単価アップに繋がりにくいため、副業として取り組む場合一定金額で頭打ちとなる可能性が高いです。月5万稼ぐのはなかなか難しいといえるでしょう。   向いている人 淡々と作業をするのが好きな人 タイピングのスピードに自信のある人 事務職での勤務経験がある人 報酬体系 1件あたり数百円〜数千円 クラウドソーシングサイトでよく用いられる「タスク形式」の場合、1件入力するごとに数十円 入力件数や文字数が多くなればなるほど、稼げる金額は増える 作業をした分だけ収益に反映するため、比較的早く収入を得ることができる メリット 特別なスキルが不要で、仕事を始めるハードルが低い デメリット 1件あたりの単価が低く、時給換算した収入が少なくなりやすい   1.10 コンサルティング 自分が詳しい専門の分野で顧客の相談や指導をする仕事です。 主な業務としてはクライアントの悩みを解決することになります。 人の数だけ悩みがあると言われますので、需要は無くならない仕事だといえます。 コンサルタントとしての実力があればリピーターを獲得できるため、月5万円を稼ぐことは容易です。 しかし、スキルに自信がない場合や中途半端なスキルしか持っていない場合、顧客獲得に苦労する可能性が高いため、安定して稼ぐことは難しいでしょう。   向いている人 既に本業を通じて専門的な知見を持っている人 結果にコミットするプロ意識の高い人 報酬体系 相談時間やコンサルティング後の業績など結果に対して、自身で設定した報酬を受け取る メリット 初期費用が不要で、今までの経験や知識を生かすことができる 単価が高い可能性がある デメリット 本業を通じた人脈形成やSNS・ブログなどを用いた集客、ブランディングができなければ案件が獲得できない 1.11 Webマーケティング Webサービスを用いて企業の業務支援や売り上げアップのコンサルティングをする仕事です。SNSの運用代行や広告・メルマガ配信代行、SEO対策などがメインの業務となります。   実力次第で稼げる金額が変わるため、人によって月5万円を稼ぐ難易度は異なりますが、これからWebマーケティングの勉強を始める人にとってはかなりハードルが高いといえるでしょう。   向いている人 自身でブログを運営し集客に成功している人 本業でWeb広告営業に携わっている人 本業でWebマーケティングに携わっている人 報酬体系 クライアントとの契約条件により異なる 一般的には成果報酬・月額支払い・一括支払いのいずれかで契約する メリット Webサービスを使って稼ぐスキルを磨くことができる デメリット 基本的に結果にコミットできる実力が必要となるため、案件を獲得するまでのハードルが高い   1.12 動画編集 あらかじめ撮影された動画を見やすくするために、カット作業やテロップ挿入をする仕事です。企業のプロモーション動画やYouTube、ウェディングムービーなど様々な分野で動画編集のニーズは高まっています。   高いスキルは必要とされないため、月5万円程度であれば比較的短期間で稼げる可能性は高いです。ただし、その分ライバルも多く今後案件が獲得しづらくなる可能性は高いでしょう。   向いている人 細かい作業をするのが苦にならない人   報酬体系 1件あたり5,000円〜数万円で、企業向け案件の場合単価が高くなる クラウドソーシングサイトでの募集が多いため、即収入につながりやすい メリット 自分自身でYouTubeやプレゼン動画を作る際に身につけたスキルが応用できる 一定レベルのスキル取得までにプログラミングなどと比べて時間がかからない デメリット 動画制作をするためのパソコンやソフトウェアに初期投資が必要   1.13 広告動画制作 映像・写真・イラストといった素材を加工・効果付けをして動画を作る仕事です。動画クリエイターと言われることもあります。企業向けの動画広告作成については市場が拡大しており、将来性がある分野となっています。 参考：サイバーエージェント　2020年国内動画広告の市場調査   動画制作の経験があれば、広告運用等も合わせて依頼されることもあるため、1件あたりの単価も高くなりやすく、月5万円は達成可能といえます。ただし、スキルがない状態では案件獲得が難しく収益化しづらいでしょう。   向いている人 動画制作に携わったことがある人 動画編集で一定の売り上げを上げている人 報酬体系 1件あたり数万円〜数十万円 企業向けの案件については単価が高い傾向にある メリット 汎用性の高い、本格的な動画制作のスキルを身につけることができる デメリット 動画制作をするためのパソコンやソフトウェアに初期投資が必要 スキルを身につけるまでに時間がかかる   1.14 写真撮影 写真販売は、自分で撮影した写真を、ネットショップやストックフォトサービスで売って収入を得る仕事です。プロのカメラマンであれば別ですが、素人が副業として行う場合、売れ行きの良い写真を狙って撮るのはかなり難しく、安定的な収入を得ることは期待できないでしょう。   向いている人 カメラが趣味の人 日頃からよく写真を撮る人 報酬体系 1枚数百円〜数千円で販売するのが一般的 ストックフォトサービスを使うと、販売価格から40～60％ほどの手数料が差し引かれる メリット 趣味を仕事にできる 始めるためのコストがほとんどかからない デメリット 売れる写真を撮るためには専門的な学習とセンスが必要とされる   1.15 ナレーション 企業の広告やアプリゲームに使用されるナレーションを提供する仕事です。 1件あたりの単価が低いだけではなく、募集されている案件の数も多いとはいえないため、月5万円を稼ぐことはなかなか難しいでしょう。   向いている人 声に自信がある人 声優系の学校に通っていた、声優の仕事経験がある人 報酬体系 1件あたり数百円〜数千円 主にクラウドソーシングサイトやスキル販売サイトで募集している メリット 趣味を仕事にできる デメリット 1件あたりの単価が低い 編集や録音をするための機材などの初期投資が必要   1.16 オンラインの家庭教師 英語やダイエット、ビジネスなど自分の得意なことをオンラインで教える仕事です。 副業として行う場合使える時間が限られてきますので、時間単価を上げることが必須になります。 スキルがあれば時間あたりの単価を高く設定することも可能です。   しかし、人気や実力がなければ顧客数に影響してしまうため、単価を上げることが容易ではなく、月5万まで稼ぐのは難しいといえます。また、参入障壁が低いのでライバルも多いでしょう。   向いている人 人に教えることが好きな人 報酬体系 スキル販売サイトで、1時間当たりの料金を設定し募集することが多い 1時間500円〜数千円程度 メリット 販売できるプラットフォームが多い デメリット 時間を切り売りするのでスケジュール調整が難しい 参入障壁が低くライバルが多い   1.17 Twitterの懸賞 Twitter懸賞とは、Twitterのアカウントを利用して応募できる懸賞・キャンペーンのことです。 後日当選が発表される形式の懸賞の場合、フォロワー数やツイート・プロフィール内容に注意を払うことで当選確率を上げることができます。 しかし通常の懸賞と同様、運の要素が強いため月5万を安定的に稼ぐことは期待できないでしょう。   向いている人 毎日Twitterを使っている人 報酬体系 1回の抽選ごとに商品または現金が当たる メリット 主催者が発信したツイートをリツイートするだけなので、ごく短時間で参加できる デメリット 転用可能なスキルが全く身につかない 見返りの有無が確率に左右される   1.18 フリマアプリ フリマアプリで不用品を販売して収入を得る方法です。 メルカリをはじめとするフリマアプリは多数リリースされており、ユーザー数も多いため、売るものがあれば即収入につながります。特にブランド品などは高く売れやすいため月5万円を稼ぐことは可能です。   しかし、売るものがなくなった時点で出品ができませんので継続的に収入を得ることができないでしょう。   向いている人 自宅に物がたくさんある人 報酬体系 アプリを使用する場合、商品売上金額から、1商品販売するごとにかかる10％程度の手数料を差し引いた金額が収益となる 即金性が高い メリット 既に自宅にあるものを売るためコストがかからず収益を上げやすい デメリット 一時的にしか稼ぐことができない 転用可能なスキルが全く身につかない   1.19 せどり・転売 ネットショップやリサイクルショップから安く商品を仕入れて、仕入れ額よりも高く販売することで差額を利益として得る仕事です。せどりには様々な方法があり、楽天ポイントを利用したり海外から輸入したりする方法などがあります。   仕入れ商品のリサーチから梱包、販売まで全て一人で行うため仕組み化することができれば短時間で月5万円を稼ぐことはできます。ただし、価格差が取れる商品を見つけ出すまで時間がかかることも多く、競争相手も多いため、軌道に乗せるまでは時間がかかるでしょう。   向いている人 特定分野の商品に詳しい人 流行に敏感な人 報酬体系 仕入額と販売価格の差が利益となる 出品手数料や送料を考慮して価格設定をする必要がある メリット 仕組みがシンプルな商売なので、安く仕入れることができれば特別なスキルがなくても始めることができる デメリット プラットフォームごとの転売規制によって売れる商品が変わる可能性がある ブランド品の偽物販売に関わってしまうリスクがある   1.20 ポイントサイト サイト内の特定の広告をクリックして商品購入や会員登録をすることで、報酬を得ることができます。 副収入がある男性会社員の22.3%の収入源は、「ポイント・アンケートサイト」で58.1%と最多となっており人気の仕事です。 参考：新生銀行　2019年サラリーマンのお小遣い調査 月5万円を稼ぐことは十分可能ですが、一度きりの案件も多いため継続して稼ぐことはできないでしょう。   向いている人 コツコツと単純作業に取り組める人 様々な企業に個人情報を提供することに抵抗がない人 報酬体系 広告ごとに決められた達成条件を満たすと収益発生 ポイントが貯まったら電子マネーや現金に交換可能なため即金性が高い メリット クレジットカード作成や口座開設などの高額案件に取り組めば、短期間で一定の金額を稼ぐことができる 特別なスキルがなくても始めることができる デメリット 誰でもできる仕事のためスキルが全く身につかない   2 在宅でできる副業のメリット・デメリット 在宅でできる副業にはメリットだけではなくデメリットもあります。 事前に理解しておくことで、自分に合った副業を見つけることができるでしょう。 2.1 メリット 在宅でできる副業のメリットは3つあります。 それぞれ詳しく説明します。 2.1.1 メリット1　仕事内容や付き合う人を選べる 副業で稼ぐためには、自分自身の得意分野を生かして仕事をすることが重要です。 苦手なことには時間をかけず、得意なことに集中することで限られた短い時間の中で成果を上げられます。 会社で働く場合と異なり、取り組む仕事については自ら取捨選択する姿勢が大切です。 また付き合う人を選ぶことができますので、人間関係で余計なストレスを抱えることも少なくて済みます。 2.1.2 メリット2　本業以外のスキルが身につく 副業に取り組む過程で、本業以外の実用的なスキルを身につけることができます。 副業にもよりますが、成果報酬として1件あたりの対価が設定されていることがほとんどのため、必然的にスキルを身につけることになります。 対価をもらいながら学ぶことができますので、学習のアウトプットの場としても最適です。 会社に頼らず自力で稼ぐ力を身につけたい、独立しても通用するスキルが欲しい、という人にとって副業は有効な手段となるでしょう。 2.1.3 メリット3　時間と場所に縛られず仕事ができる スマホやPCが1台あれば、基本的に時間や場所に関係なく作業ができます。 通勤時間がないのは、精神的にも体力的にも楽だと感じる人は多いのではないでしょうか。 また、通勤時間がなくなることで空いた時間やスキマ時間で作業を進めることもできるためより効率的に稼ぐことが可能です。 2.2 デメリット 在宅でできる副業のデメリットは3つあります。 2.2.1 デメリット1　自己管理力が必要 体調や納期管理、営業や案件の管理など基本的には全ての作業を一人で行う必要があります。 無理をして体調を崩してしまったり、急なトラブルが発生して納期に間に合わないという事態が発生した場合、各方面に迷惑をかけることになります。 基本的に余裕を持ってスケジュールを組み、仕事に取り組むことが重要です。 2.2.2 デメリット2　孤独感を感じることが多い 仕事の性質上、一人で作業する時間が多いため、孤独感を感じることが多くなるでしょう。 一人で作業をするのが苦手で、和気あいあいと仕事をしたい人にとっては厳しいかもしれません。 2.2.3 デメリット3　トラブルに巻き込まれる可能性がある 仕事の選び方次第では、トラブルに巻き込まれてしまう可能性があります。 副業はあくまで自己責任で行うため、万が一トラブルが発生した場合も自分自身で全て対処する必要があります。   特に、「簡単・高収入」を謳った副業詐欺には注意しましょう。 稼ぐどころか、高額な教材を買わされてしまったり、気付かない間に犯罪に加担してしまう可能性もあります。 仕事を受ける場合には依頼先の情報や業務内容を慎重に確認し、問題ないか見極める力が必要です。   [PR] Webデザインで副業する学習方法を動画で公開中3 在宅でできる副業の選び方 数ある副業の中でどの副業を選ぶのが良いのか、選び方についてまとめました。 3.1 目的に合わせて選ぶ なぜ副業をするのか、副業に対して何を求めているのかを明確にして取り組むことで効率よく稼ぐことができます。 以下のように目的に合わせて選ぶことが有効です。 「短期間で一定金額を稼ぎたい」：即金性の高いもの 「無理なく空いた時間を有効活用したい」：作業負担が少なく手軽にできるもの 「本業で足りない生活費の確保」：1ヶ月に稼げる金額が明確なもの 「将来の独立・起業のためスキルアップしたい 」：汎用性の高いスキルが身につくもの 3.2 最初はリスクの小さい副業を選ぶ 副業を始める際、元手がかからないものを選ぶことは重要です。 特に本業と異なる分野の仕事に取り組む場合、自分にあった仕事かどうかはスタートしてみるまでわからないことが多いです。   もし自分に合わないと判断した時に、コストをかけず始めていればすぐにやめて違う仕事をするという選択ができます。初期投資の額が大きいと、投資額を回収できなくなる可能性も高いです。   稼ぐために始めた副業で収益を上げられなかったり、負債を抱えてしまったりすると、精神的な負担が大きくなり本業にも悪影響が出てしまいます。プログラマーやWeb制作、WebデザイナーといったIT系の副業であれば、いずれも初期費用を抑えて低コストで始めることができます。 3.3 自分スキルになるものはおすすめ どの副業が良いか迷った時には、自分自身にスキルが身につく副業を選ぶのがおすすめです。 時給で働く場合やスキルが身につかない副業を続けると、時間の切り売りをするばかりで、一時的には稼げるかもしれませんが、将来的な収入アップは望めません。 副業でスキルアップができると、より高単価の案件を受注することで収入を上げていくことができます。 また、副業に取り組む中で自分の可能性に気づき、本業での成果につながったり、転職をするきっかけとなったりすることもあります。 スキルを身につけることができる副業としては、プログラマーやWeb制作、WebデザイナーといったIT系の副業がおすすめです。 今後も需要が高い分野ですので、一度スキルを身につければ再現性高く稼ぐことができるでしょう。   コラム 実は私も！？独学で損する人の特徴 「スクールは高いから独学で成功する」という気持ちの方は多いと思います。
副業・フリーランス

JavaScriptでブロック崩しを作成する方法を現役エンジニアが解説【初心者向け】

JavaScriptでブロック崩しを作成する方法について、TechAcademyのメンター（現役エンジニア）が実際のコードを使用して初心者向けに解説します。   そもそもJavaScriptについてよく分からないという方は、JavaScriptとは何なのかについて解説した記事を読むとさらに理解が深まるでしょう。   なお本記事は、TechAcademyのオンラインブートキャンプJavaScript/jQuery講座の内容をもとにしています。   田島悠介 今回は、JavaScriptに関する内容だね！ 大石ゆかり どういう内容でしょうか？ 田島悠介 ブロック崩しを作成する方法について詳しく説明していくね！ 大石ゆかり お願いします！   Canvasとは Canvasとは、グラフィックやアニメーションを描画するHTML要素です。 JavaScriptで図形を描画して動かすことで、ゲームを作成することも可能です。 また、今回はCanvasを使ったブロック崩しの作成方法を紹介していくため、その使い方を学習していきましょう。   JavaScriptでブロック崩しを作成する方法 JavaScriptにはCanvasのAPI（canvasを操作する部品）が用意あります。 CanvasのAPIを使って四角や丸を書いて、動きの処理を作成すればブロック崩しが作成できるでしょう。 CanvasのAPIは下記の3つの手順で使えるようになります。 HTMLでcanvasタグを記述する JavaScriptでcanvasタグを取得する 取得したcanvasタグ（HTMLCanvasElement）のgetContextメソッドを呼び出す 今回作成するブロック崩しは3D（立体）ではなく2D（平面）であるたる、getContextメソッドの引数には2dを指定してください。 getContextの戻り値であるCanvasRenderingContext2Dから、図形を書くためのいろいろなメソッドを呼び出すことが可能です。   [PR] Webデザインで副業する学習方法を動画で公開中実際に書いてみよう（サンプルコード） サンプルコードで下記の画像のようなブロック崩しを作成します。 HTMLでcanvasタグを記述 <canvas id="canvas" width="480" height="400"></canvas> JavaScriptで取得するためにidにcanvasという名前を設定しています。 CSSでcanvasタグの領域を黒くする canvas { background: black; } 実際には、この記述はなくても動作に影響はありません。 canvasタグの領域をわかりやすくするために黒くしています。   メインのJavaScriptのソースコードをみていみていきましょう。 let canvas = document.getElementById("canvas"); let ctx = canvas.getContext("2d"); /******************** ボールの設定 ********************/ const BALL_COLOR = 'skyblue'; //ボールの色 const BALL_RADIUS = 10; //ボールの大きさ（半径） let ballX = canvas.width / 2; //ゲーム開始時のX軸（←→）の位置 let ballY = canvas.height - 30; //ゲーム開始時のY軸（↑↓）の位置 let xMove = 2; //X方向への移動量 let yMove = 2; //Y方向への移動量 /******************** 操作する板の設定 ********************/ const BAR_COLOR = 'blue'; //板の色 const BAR_HEIGHT =
JavaScript

あなたの目的に合わせて学べるコース

副業したい方

Web制作の力を身につけ
副業までサポート

はじめての副業コース

転職したい方

未経験から16週間で
エンジニアに

エンジニア転職保証コース

スキルアップしたい方

AIも統計解析もできる
Pythonを学ぶ

Pythonコース

※ 経済産業省の第四次産業革命スキル習得認定講座で、厚生労働省指定の専門実践教育訓練給付制度の対象です。条件を満たすことで支払った受講料の最大70％（最大306,460円）が給付金として支給されます。詳しくは エンジニア転職保証コース のページ内の注意事項をご確認ください。

TechAcademyから
現役エンジニアの方へ
お知らせ

1時間でできる無料体験
挫折しない学習方法とは？
TechAcademy（テックアカデミー） Webデザインコース Webデザイン Photoshop Photoshopで円を点線で描く方法を現役エンジニアが解説【初心者向け】