企業・副業・フリーランスWebデザイナーに必須のスキル・あるとよいスキルまとめ

企業・副業・フリーランスWebデザイナーに必須のスキル・あるとよいスキルまとめ

Ten Tanaka

Ten Tanaka

こんにちは。Webデザインスクール「デジタルハリウッドSTUDIO by LIG(通称デジLIG)」運営スタッフの天(@10TEN10TAN10)です。

未経験からWebデザイナーになるために、独学やWebデザインスクールでなにを学べばよいのかお悩みの方もいらっしゃると思います。

今回は、Webデザイナーになるために必要なスキルを、「制作会社や事業会社に就職する」場合、「副業をはじめる」場合、「フリーランスになる」場合に分けてご紹介します。

はじめに:自分が目指すのはどんなWebデザイナー?

Webデザイナーといってもさまざまな働き方があります。就職して企業で働くWebデザイナーもいれば、本業の合間に単発的な仕事を請け負う副業Webデザイナー、独立して契約から納品後のサポートまですべて一人でおこなうようなフリーランスのWebデザイナーもいます。さらに就職して働くにも、制作会社と事業会社のWebデザイナーでは必要なスキルも役割も変わってきます。

  • 制作会社のWebデザイナー
  • 事業会社のWebデザイナー(インハウスデザイナー)
  • 副業Webデザイナー
  • フリーランスWebデザイナー

今回は上記4パターンの進路を目指す際に、それぞれで学ぶべきスキルや準備をご紹介していきます。

制作会社のWebデザイナーに必要なスキル

制作会社でのWebデザイナーは、クライアントのコーポレートサイト、採用サイト、サービスサイト、メディアサイトなどの受託制作をおこなっていきます。サービスの立ち上げやリニューアル、運用など、あらゆるフェーズでのWeb制作に携われる可能性があります。多種多様な業界の制作を担当することができ、Webデザイナーとしての経験や実績を積むのに適している働き方です。

プロジェクトのなかでの役割は企業によってもさまざまで、Webデザインのみを担当することもあれば、市場調査や要件定義といった上流工程から関わるケースもあります。クライアントワークなので、納期までに完成させるスピード感とクオリティの両立が求められます。数をこなすことで自分の引き出しを増やせるという意味でも、制作会社に就職することは、Webデザイナーとしてのキャリアを積む第一歩に適しているといえます。

必須のスキル

制作会社の場合、デザイン、コーディングと分業体制がしかれており、Webデザイナーはデザインに集中できる環境にあることが多いです。一部には、ひとりでデザインもコーディングもこなすフルスタックのWebデザイナーが活躍するような制作会社もありますが、今回は分業体制がしかれていることを前提にお話しします。

どの制作会社においても必ず身につけておかなければならないスキルは以下のとおりです。どれもデザインの見た目を作る際に必須のスキルとなります。

Photoshop

Web制作の現場で必須のスキルはPhotoshopです。Photoshopは画像編集や合成などのWebサイト制作に欠かせない写真の加工や、XDやFigmaではできないグラフィカルな表現ができるグラフィック作成ツールです。

Illustrator

Photoshopと同様に、Illustratorも習得必須のグラフィック作成ツールです。Illustratorはロゴデザインやアイコン・イラストなどのアートワーク作成に用います。

Adobe XDやFigma

ワイヤーフレーム(サイトデザインの設計図)やデザインカンプ(デザインの完成見本)の制作には、Adobe XDやFigmaなどのデザインツールを使うのが主流になってきています。IllustratorやPhotoshopのような精密なグラフィックを制作するツールとは違い、画面のデザインに必要な機能だけを搭載しているため、直感的な操作ができます。

こちらの記事では、PhotoshopとAdobe XDの使用感や機能を比較しています。

あるとよいスキル

制作会社の現場で重宝されるスキルをご紹介します。企業によっては、必須のスキルとなるケースももちろんあります。

コーディングスキル

制作の現場でデザイナー自身がコーディングをするためというよりは、エンジニアとの円滑なコミュニケーションのために、HTML/CSSの知識があるとよいでしょう。コーディングについてある程度の知識がないと、どうしてもあとの工程のことが考えられていない、Webに不向きのデザインになってしまいます。なかにはコーディングスキルが応募の必須条件となる企業もあるため、持っておくことで就職の選択肢も広がります。

撮影ディレクションスキル(撮影スキル)

写真素材の撮影をカメラマンにお願いする際、どういう写真を撮ってほしいのかを説明するディレクションスキルがあるとよいでしょう。もちろん自分で撮影できるに越したことはありませんが、基本的にはプロに任せるのが一般的です。ただし、予算の関係で外部のカメラマンに依頼できない際などには、撮影できる人材が重宝されます。

イラストスキル

イラストを描けることでWebサイトデザインの幅も大きく広がります。外部イラストレーターに依頼する費用が省けるため、社内での活躍の機会もぐっと増えるはず。またクライアントに提案をする際などにも、イラストを使って表現できるため、イメージを伝えやすくなります。

アニメーション制作のスキル

アニメーションを使ったWebサイトに対応するためにも、After EffectsやBlenderを使ったアニメーションを制作するスキルは重宝されます。提案時や打ち合わせ時に、Webサイトのメインビジュアルやアニメーションの参考になるものを制作できれば、クライアントがよりイメージしやすくなり、認識合わせもしやすくなります。

マーケティングスキル

Google Analyticsなどのツールを使ってWebサイトの流入を分析することで、デザインの観点からコンバージョンに貢献することができます。将来的に上流工程に携わりたいのであれば、必ず求められるスキルといえるでしょう。

Web以外の制作スキル

ロゴデザインやポスター、パンフレット制作などの知識があれば、プロジェクト全体のクリエイティブを担当することができるようになります。また、外部に発注する際にも的確な指示ができるようになるため、あらゆる場面で重宝されるでしょう。

企画・提案力

企業には営業専門のチームがあることが多いですが、デザイナーならではの提案により受注に繋がることも多いはず。クライアント提案時に、Webデザイナーがデザインのコンセプトを説明したり、ワイヤーフレーム(サイト設計図)を作成してプレゼンしたりする機会も出てきます。企画・提案力もWebデザイナーにとって大切なスキルです。自分で仕事を得られるWebデザイナーは、企業にとっても理想的な人材といえます。

事業会社のWebデザイナー(インハウスデザイナー)に必要なスキル

事業会社で自社サービスの開発に携わるWebデザイナーは、インハウスデザイナーとも呼ばれます。自社サイトのデザインや運用、メーカーのプロダクトデザインなど、役割は企業によってさまざまです。受託メインの制作会社と比較するとユーザーの声が届きやすく、自社サービスやプロダクトの成長にやりがいを感じる方に向いている働き方です。

制作会社は制作に特化したデザイナーなのに対して、インハウスデザイナーは「Web担当」など担当領域が広いケースも多く、Webサイト運用に関する知識も求められることもあります。Webデザインだけでなく、ディレクションやマーケティングなど、マルチに能力値を高めていきたいと考えている人におすすめです。

なお、自社サービスのデザイン(プロダクトデザイン)は、上流工程から制作に携わるUI/UXデザイナーとして採用されることが多く、未経験で募集しているのはまれなケースとなります。

では実際にインハウスデザイナーになるためには、どのようなスキルが必要なのでしょうか。企業が求めるポジションによって大きく異なってきますので、ここでは弊社LIGの例を中心にご紹介します。

※ 弊社株式会社LIGはWeb制作をおこなっていますが、スクール事業やゲストハウス事業などtoC事業を展開する事業会社でもあります。

必須のスキル

Photoshop・Illustrator

自社メディアのアイキャッチ画像制作をはじめ、新規事業のロゴデザイン、自社サービスのLPデザイン、バナー制作、ホワイトペーパー、メールマガジンのデザインなど、業務は多岐にわたります。ここでの必須スキルはやはりPhotoshopとIllustratorです。

あるとよいスキル

撮影スキル

求人、ブログ、その他情報発信などで何かと撮影が必要になるケースは多いので、撮影スキルがあるとよいでしょう。LIGの場合は、バナーやアイキャッチの撮影もインハウスデザイナーが担当しているので、撮影ができる人材はかなり重宝されます。

Lightroom

撮影スキルに加え、Lightroomを使った写真のレタッチスキルがあるとよいでしょう。レタッチはデザイナーにとって必須ともいえるスキルですが、なかにはLightroomではなくPhotoshopを使ってレタッチをおこなうデザイナーもいるため、「あるとよいスキル」としました。

イラストスキル

インハウスデザインにおいても、イラストを描けることで制作の幅が広がります。またデッサンの知識があることで、オブジェクトの奥行きや立体感、影の付け方などのイメージがしやすくなり、クオリティの高い制作に繋がります。

課題解決力・行動力

これはインハウスデザイナーに限らず求められる能力ではありますが、日常的に社内や自社サービスの改善に取り組むということもあり、課題解決のためにはどんな施策を打てばよいのかを考える力が求められます。また、その施策を実行し推し進めるための行動力(社内政治力)も必要になってくるでしょう。

調整力

インハウスデザイナーの仕事は、社内の他部署の人々とコミュニケーションを取って調整しながら進めていきます。自社への十分な理解や社員との密なコミュニケーションが大切です。

マーケティングスキル

インハウスデザイナーの役割は、自社のサービスやプロダクトを成長させることです。メディアのPV数やバナーのクリック率などを参考にしつつ、お問い合わせ獲得などの目的達成のためのデザインを考えていく必要があるため、マーケティングの知見が重宝されます。

コーディングスキル

LIGの場合はインハウスデザイナーがコーディングをすることはありませんが、知識として持っておくことで、自身がWebデザインをする際や他部署にコーディングを依頼する際に役立ちます。企業によってはコーディングもできるインハウスデザイナーを探しているケースもあります。

ディレクションスキル

いわゆる「Web担当」になると、自社サイトの改修など運用面までに業務が及ぶことが多く、デザインだけでなく、ディレクションやコーディングの幅広いスキルが求められるケースもあります。

企業Webデザイナーになるために必要な準備

制作会社や事業会社に就職して、デザイナーとして働くために必要な準備は以下のとおりです。

ポートフォリオの制作

採用面接では、履歴書・職務経歴書のほかに、ポートフォリオの提出が必要です。ポートフォリオとは、自分のこれまでのデザイン作品集のようなもので、実力を企業に示すための大事な資料となります。

ポートフォリオの形式は、企業から特別指定がない限りは必ずしもWebサイトである必要はなく、PDFにまとめたり、XD・Figmaなどのデザインツールで作ったりしても問題ありません。Webサイトの場合、面接当日にWi-Fi環境がないなどのトラブルに見舞われることもあるので、紙に印刷したりPDF化しておくことをおすすめします。

ただしインハウスデザイナーの募集では、社内にデザイナーがおらず、はじめてデザイナーを雇うというケースもあります。その場合は面接官が非デザイナーとなり、採用基準はデザインのクオリティというよりも、いかに会社のカラーにマッチするかが重要視されることも。志望する企業の社内体制がどのようになっているのかを事前にチェックしておきましょう。

ポートフォリオの作り方や制作に役立つ情報についてはこちらの記事を参考にされてください。

デザインの経験

ポートフォリオに載せるために、Webサイトデザイン、ロゴデザインなどなんらかのデザイン経験が必要です。なんでもたくさん作ればよいというわけではなく、自信のあるデザインを最低でも5~6つ選んで載せるとよいでしょう。もちろん超大作を1~2つ載せて転職に成功したというケースもあるので、個数に正解はありません。

また、希望している企業のテイストや求められているスキルに合わせて、都度ポートフォリオを作り替えるということも大切です。たとえば、UI系の企業であれば、UIデザインの事例を多く載せて、かつ目立つようポートフォリオの前のほうに持ってくるなどの工夫が必要です。

いずれにしても、デザイン実践の場を十分に設ける必要があります。方法としては、クラウドソーシングサービスで仕事を得る、知り合いから依頼を受ける、インターンやアルバイトとして働いて経験を積むなどの選択肢があります。

未経験可の案件も多いクラウドソーシングサービス
インターンの募集を探すのに便利なサイト

こちらの記事もおすすめです。

転職サイト・転職エージェントに登録する

ポートフォリオの準備ができれば、求人に応募が可能です。

志望する企業が決まっていれば、企業のWebサイトの採用募集ページから直接応募をしたり、知人からの紹介を受けるという選択肢もありますが、なにも決まっていない場合は、転職エージェントなどと情報を交換しながら就職活動を進めていくのがおすすめです。

Webクリエイターの転職に強い求人サイト・エージェント

副業Webデザイナーに必要なスキル

本業は別にあり、副業としてWebデザインの仕事をする働き方です。クライアントから直接仕事を受けて、バナー制作やLPのデザインなどの案件を請け負います。

Webデザイナーはパソコンひとつあればはじめられるお仕事なので、企業で働く社会人や主婦の方に人気の副業です。在宅でできる仕事を探している、またはWebデザイナーとしての実績作りのためにまずは副業からはじめたいという方にもおすすめの働き方です。

必須のスキル

なにをして稼いでいくかによって、必須のスキルは変わってきます。

Photoshop

文字や写真で構成されたバナーは、基本的にはPhotoshopを習得していれば作成可能です。簡単な図形はPhotoshopでも作成可能ですし、イラストについても画像素材を使うことでカバーできます。

Illustrator

画像素材を使わずに自分でイラストやアイコンを作りたい場合や、ロゴ制作をする場合には、Illustratorが必要になってきます。

Adobe XD・Figma

LP制作やWebデザインをする場合には、上記2つのスキルに加えてAdobe XDやFigmaのスキルが必要となります。

あるとよいスキル

どんな案件が獲得できるかは、自分のスキル次第で変わってきます。持っているスキルが多いほど選択肢は広がり、さらにスキルを磨けば磨くほど高単価の案件も受注できるようになります。

コーディングの知識

Webサイトデザインの仕事をしたいのであれば、HTMLやCSSなどの最低限のコーディングの知識は持っておくとよいでしょう。できることが増えることで単価アップにも繋がります。

マーケティングスキル

成果の出るバナーを制作するためには、マーケティングの知識があるとよいでしょう。バナーやLPの場合、デザインとしての美しさよりも、ターゲットやテーマに対して適切であるかという点が重視されます。

コピーライティング力

バナー制作においては、デザインのインパクトもさることながらキャッチコピーも重要です。感情に訴えかけるような詩的なものというよりは、具体的でわかりやすい簡潔なコピーを考える力が求められます。

商標権や著作権の知識

ロゴ制作はバナー制作よりも単価が高いぶん、商標権などのおさえておくべき知識が多くなってきます。たとえば、商標登録できないフォントを使ってロゴを作ってしまうなど、クライアントにも迷惑がかかるミスを犯してしまう可能性もあります。デザインに関連する商標権や著作権を学んだ上で制作しましょう。

契約書周りの知識

契約書のリーガルチェックも、はじめはすべて自分でおこなわなければなりません。トラブルを避けるためにも、最低限の法的知識を得ておくようにしましょう。

お金周りの知識

副業やフリーランスの場合、請求書の作成についても自分でおこなう必要があります。さらに収入が20万円を超える場合は、確定申告が必要です。

こちらの記事でも副業に必要なスキルをご紹介しています。

フリーランスWebデザイナーに必要なスキル

個人事業主として独立して働くWebデザイナーです。Webサイト制作をすべて一人で完結させるフルスタックタイプのWebデザイナーもいれば、Webデザインのみを請け負うデザイン特化型のタイプもいます。また、UIデザイナーとして企業のなかで働いたり、Web制作にとどまらず紙媒体のデザインも扱うハイブリッドタイプもいます。

いずれも高いスキルや経験、人脈が必要となるので、未経験からいきなりフリーランスのWebデザイナーとして働くのはめずらしいケースといえます。

副業Webデザイナーの場合、本業ではできないことにチャレンジしたい、プラスアルファで稼ぎたいという側面が強いのに対し、フリーランスの場合は本業として稼がなくてはならないため、ときに自分には合わない仕事をやらなくてはならないケースもでてくるでしょう。

必須のスキル

フリーランスの場合は、自分が特化させたいスキルが必須のスキルとなります。さまざまなタイプの方がいるとは思いますが、ここではWebデザインを中心におこなうフリーランスとして習得しておきたいスキルをご紹介します。

Webデザインスキル

言うまでもなく、Photoshop、Illustrator、XD・FigmaなどWebデザインに必要な基本スキルは押さえておきましょう。

コーディングの知識

一般的にフリーランスとして活動していくには、Webサイト制作の流れを一通り把握しておく必要があります。最近は「STUDIO」などのコーディング不要なノーコードツールでの制作もできるので、コーディングの知識がなくてもWebサイト制作自体は可能です。しかし、コーダーやエンジニアと一緒にお仕事をする場合、HTML/CSSなどに関する最低限の知識がないと、意思疎通が図れずにプロジェクトの進行に支障をきたすことも。フリーランスとして個人で活動するためには、得ておくべきスキルです。

サイト公開までの流れの理解

デザインスキルやコーディングスキルだけでなく、ドメインやサーバーの契約やサイト公開までの流れも知識として持っていたほうがよいでしょう。

営業・広報スキル

基本的に仕事は自分で獲得しなくてはなりません。自分の強みをアピールするための営業スキルやSNSなどを使った積極的な自己発信が必要です。

コミュニケーションスキル

クライアントやプロジェクトに携わるメンバーとのやりとりは、すべて自分でおこなうことになります。制作物のクオリティはもちろんのこと、提案時やちょっとした会話のやりとりで生まれる印象も、その後のお付き合いを決める重要な要素となります。

あるとよいスキル

CMSの知識

ノーコードで制作ができるCMS(コンテンツマネージメントシステム)でWebサイト制作をする機会も多くあるでしょう。最低限、WordPressというCMSでの構築方法は押さえておきましょう。また、デザイン性の高いオリジナルのWebサイトを作るには、CMSをカスタマイズするための知識が必要です。WordPressはPHPという言語で構成されているので、PHPを学ぶとよいでしょう。

Webディレクションスキル

ディレクターを挟まずに、クライアントと直接やり取りをする機会もあるでしょう。クライアントからのヒアリングやプロジェクトの管理、Webサイトの情報設計など、Webディレクターの役割をこなせるようになることで、フリーランスとしての仕事の幅も広がります。

UI・UXに関する知識

見た目の美しさだけではなく、わかりやすさや操作性を意識したWebサイトづくりも重要です。UIとは「ユーザーインターフェース」を、UXは「ユーザーエクスペリエンス」を略した言葉です。ユーザーの使いやすさを意識したUIデザインと、ユーザーの目的が達成されるようなサイトづくりを目指すUXデザインの知識があることで、市場価値の高いフリーランスへとなることができます。

SEO・CROに関する知識

Webサイトからの集客を増やすためには、サイトを訪れる人を増やすためのSEO(検索エンジン最適化)に関する知識や、コンバージョン率を高めるためのCRO(コンバージョン率最適化)に関する知識が必要になってきます。このような知識を持ち合わせたWebデザイナーは市場でも重宝されるでしょう。

Web以外の制作スキル

ポスターやチラシなど、紙媒体のデザイン知識があると、Webデザインだけでなくプロジェクト全体のデザインを監修できるようになり、仕事の幅もぐっと広がります。

副業・フリーランスWebデザイナーになるために必要な準備

自分で仕事を獲得しなければならないという点で、副業とフリーランスWebデザイナーは共通しています。ここでは、副業Webデザイナー、フリーランスWebデザイナーになるために必要な準備をご紹介します。

ポートフォリオの制作

副業やフリーランス活動においても、自分の実力をアピールするためのポートフォリオは必須です。クライアントと直接会わずにWeb上でのやりとりが中心になることも多いため、URLを共有するだけでよいWebサイト形式がおすすめです。

副業やフリーランスの場合、ポートフォリオには最低限以下の情報を入れておくようにしましょう。

ポートフォリオに入れる情報
▼基本情報

  • プロフィール
  • 活動拠点
  • 経歴
  • 自分の強み
  • 使用可能なツール(年数も)
  • 稼働可能な時間

▼個別の作品情報

  • 制作時期
  • クライアント名
  • ジャンル
  • コンセプト
  • 担当箇所
  • 共同制作者
  • 制作フロー
  • 使用したツール

ポイントは、自分はデザインだけを担当したのか、コーディングまで担当したのかなど、なにを担当したのかを明記することです。

デザインの経験

企業Webデザイナーと同様に、ポートフォリオに載せるための作品づくりも必要になってきます。自分の強みをしっかりと表現できる作品であるとともに、クライアントに近い業界のデザインを中心にまとめておくとよいでしょう。

いずれにしても、デザイン実践の場を十分に設ける必要があります。方法としては、企業Webデザイナーと同じく、クラウドソーシングサービスで仕事を得る、知り合いから依頼を受ける、インターンやアルバイトとして働いて経験を積むなどの選択肢があります。

単価の設定

仕事を得るためにはバナー1枚につき〇〇円、Webデザイン1件につき〇〇円、といった単価設定が必要です。相場感についてははじめはクラウドソーシングサービスを参考にするとよいですが、基本的にかなり安い価格で設定されているので、自分の実績とともに徐々に上げていくのがよいでしょう。

SNSを活用する

副業やフリーランスに限らず、個人がSNSを通じて仕事を獲得するのは、いまや当たり前の時代となっています。TwitterやFacebook、InstagramなどのSNSで自身の情報を積極的に発信していくことをおすすめします。プロフィール欄にはポートフォリオサイトのURLなどを記載して、自身の作品にアクセスできるようにしておきましょう。実績を発信したり、SNSでのコミュニティを利用したりすることで、得意分野の仕事も受注しやすくなります。

クラウドソーシングに登録する

「ランサーズ」や「クラウドワークス」などのクラウドソーシングサービスに登録することで、時間や場所に縛られず、インターネット上で仕事の受注ができるようになります。また、契約書のやりとりや請求書発行などの業務は、すべてサービスの管理画面上でおこなうことができるので、はじめて副業やフリーランスとして働く方にはおすすめの方法です。

さいごに:未経験からWebデザイナーを目指す方法

さいごに、未経験からWebデザイナーを目指す3つの方法についてご紹介します。

独学で勉強する

Webデザイナーは、独学でスキルを磨くことで目指せる職業です。自分自身のペースで学習を進めることができる一方で、業界の知識もない中で何を学んでいけばわからないというケースも多いと思いますので、それなりにハードルの高い学習方法でもあります。

また一人で知識を詰め込むような方法では成長に繋がらず、実際に手を動かして作品を作り、プロのWebデザイナーのフィードバックを受けながら経験を重ねていく必要があります。身近に指導してくれるようなWebデザイナーがいるのであれば、独学でも十分にスキルを磨いていけるでしょう。

未経験可の求人をしている企業で働く

まったくの未経験ではありませんが、ある程度IllustratorやPhotoshopの操作ができる場合、企業に就職して現場で学びながらWebデザイナーを目指すという選択肢もあります。未経験求人ということでアシスタント的立場からのスタートとなりますが、実績を積み会社からの信頼を得られれば、いずれ正社員へキャリアアップできる可能性もあります。

一方で、何年経ってもWebデザインには携われない……なんてことにならないよう、将来的にどんな仕事を任せてもらえるのかしっかりと話しを聞くようにしましょう。

Webデザインスクールに通う

スクールは受講に費用がかかりますが、プロのWebデザイナーから指導を受けながら体系的にWebデザインを学ぶことができます。学習のスケジュールを管理したり、求人紹介や案件紹介をおこなってくれるスクールもあるため、各方面からのサポートを受けたい方におすすめの方法です。

当スクール「デジタルハリウッドSTUDIO by LIG(デジLIG)」では、就職を目指す方や副業・フリーランスに向けた進路相談や、ポートフォリオの添削、スクール生限定のお仕事紹介などをおこなっています。デザインの学習やキャリアでお悩みの方は、ぜひ一度無料の個別説明会へお越しください!

Webデザインスクール「デジLIG」の詳細はこちら

LIGはWebサイト制作を支援しています。ご興味のある方は事業ぺージをぜひご覧ください。

Webサイト制作の実績・料金を見る

この記事のシェア数

大阪市立デザイン教育研究所、成安造形大学卒業後、京都芸術大学院を修了。在学中は芸術学を中心に多くのコンペティションに挑戦し功績を残す。カプセルトイメーカー、キャラクターライセンス事業の広報を経て、2018年にLIGに入社。デジタルエデュケーション部にてクリエイタースクールであるデジタルハリウッドSTUDIO by LIGの運営を中心にキャリアサポートを行う。

このメンバーの記事をもっと読む
未経験からWebクリエイターを目指すならデジLIGへ
個別説明会はこちら 資料請求