Webディレクターになるには?調べるなら【ディレタマ】 » 「Webディレクターとは?」なんでも事典 奥深きWebディレクターの世界 » Webディレクターの身近な職種図鑑 » Webデザイナー(Webデザイン)の
仕事・年収・キャリア

Webデザイナー(Webデザイン)の
仕事・年収・キャリア

Webディレクターと一緒に仕事をすることも多い「Webデザイナー」。
この記事では、Webディレクターにとって身近なIT系制作職「Webデザイナー」に注目し、Webデザイナー(Webデザイン)の仕事内容から、年収目安、キャリアパス例を調査しました。
WebデザイナーからWebディレクターになる方法についても紹介します。

目次

Webデザイナーの役割とは?

インターネットの世界には実に多くのWebサイトがあふれています。そのWebサイトがどんな情報を発信しているか、なんの企業のWebサイトなのかによって、そのデザインは大きく異なります。
Webデザイナーの仕事はその名のとおり、Webサイトのデザインをすること。Webサイト全体のレイアウトに関する決定権を持つのはもちろん、配色やその使用ルール、フォント、アイコンやイラストなどのWebサイトを構築する細かな要素・パーツのデザインもすべて考え、サイトに反映させる仕事です。

クライアントの要望を聞き、Webディレクターと相談しながらタ―ゲットや戦略、コンテンツ内容などから全体の見た目や世界観づくりを考えていきます。
同時に、ユーザーにとっても使いやすいようなデザイン設計を実現するスキルが必要です。

Webデザイナー(Webデザイン)の仕事とは?

Webサイト制作はいくつもの段階を踏んで進めていきます。Webデザイナーが大きく関わることになるフローと、その仕事内容を解説していきましょう。

ヒアリング

クライアントやWebディレクターからヒアリングを行い、デザインするWebサイトのターゲットや戦略提案、サイトコンセプト、コンテンツの内容から、全体のデザインコンセプトを決めていきます。

などなど。Webディレクターと協議しながらサイト全体の世界観を考えていきます。

デザイン企画・提案

情報が集まり、デザインコンセプトが決まったら、レイアウトを作成します。いわゆるワイヤーフレームや構成案とも呼ばれるものです。
レイアウトの段階ではデザインの作り込みは不要。あくまでも「どこにどんな要素が入るか」を示す図のようなものです。このレイアウトはWebディレクターが描くこともあります。

レイアウトがOKとなったら、いよいよデザイン。Photoshopやillustratorなどの画像制作ソフトのスキルが求められる場面です。
まず始めに、デザインのトーン&マナー(トンマナ)を作成します。トンマナは、例えばメインカラー、ベースカラー、アクセントカラーなどの配色をはじめ、フォントや文章の組み方、ボタンや枠などの形や、ヘッダー・フッター・サイドナビなどの共通パーツなど。

複数のデザイン案を提案する場合は、クライアントにそれぞれの案の違いがしっかり分かるような、メリハリのあるものを作成します。
そのWebサイトのターゲット層や、掲載するサービスや商品の特徴についてもしっかり考えながら、より適したデザインはどのようなものかをじっくり考えていきます。

デザイン制作

デザインのトンマナが決定したら、決定したデザインに合わせ、細かなアイコンやイラスト、ロゴ、写真、その他装飾など、必要となる素材を細部まで作成していきます。
「ボタンやテキストリンクにオンマウスした際に色が変わるようにしたい」などのアクションを入れたい場合は、切り替わったとき用のデザインパーツや指示も別途用意が必要です。

デザイン全体が完成したら、Webディレクターやクライアントなどの関係者にデザインチェックを依頼します。
このとき、画像やPDFデータで共有する場合もありますが、クリックしたときのアクションやスライダー画像のイメージなどがわかるよう、XDを使用して、実際のWebサイトに近い見え方で共有するように求められることもあります。

パーツがそろったらWebサイトが公開できるように構築していく流れとなりますが、Webデザイナーがコーディングや指示ディレクションまで任されることも。
そのため、WebデザイナーにはHTMLやCSSの知識も必要です。

完成した各ページはテストアップして挙動を確認後、Webディレクターやクライアントへ提出。チェックバックでデザイン面での修正箇所があれば修正を行います。
その後、再校を提出・反映して、問題がなければ晴れて本番環境に公開となります。

Webデザイナーの年収とは?

「求人ボックス 給料ナビ」が公開している「Webデザイナー」の平均年収は444万円でした。月給は37万円、初任給は22万円程度が相場とのことです。(2022年5月22日時点)
※データ引用元:「求人ボックス 給料ナビ Webデザイナーの仕事の年収・時給・給料(求人統計データ)」(https://求人ボックス.com/Webデザイナーの年収・時給

こちらは正社員Webデザイナー全体の平均年収の目安ですので、スキルや経験値、企業規模によっても差があります。
Webデザイナーとしてのスキルや役職、デザインを担当する分野の専門性や案件規模等、フロントエンジニア領域まで業務範囲を広げるなどすることによって、さらに上を目指せることもあります。
また、アルバイトやパートであれば平均時給は1,723円、派遣社員の場合は平均時給1,085円となっています。

なおWebデザイナーは、会社に所属せずにフリーランスで生計を立てる方や、休日や隙間時間を利用した副業としてWebデザイナー業をしている人も多い職種です。
フリーランスの方であれば、クラウドソーシングサービスに登録し、そこから自分のスキルや得意分野、執筆条件に合ったWebデザインの業務を探す方が多いですが、クラウドソーシングサービスに掲載されている案件は報酬金額の幅が非常に大きいため、注意してチェックしましょう。
請け負う業務の報酬条件によってフリーランスのWebデザイナーは年収が大きく変わってきます。

Webデザイナー(Webデザイン)の仕事のやりがいって?

Webデザイナーは、自らが考えて作ったデザインがWebサイトという1つの完成物となり、世の中に公開され、多くの人から見てもらえる・使ってもらえる喜びを感じられる職種です。
価値あるクリエイティブに携わる仕事がしたい方にはうってつけの職業。とくに、自身が立てたデザイン戦略設計で見事に成果が出たときには大きなやりがいを感じられます。

また、多種多様な業種・業界のデザイン制作を行える職場であれば、日々様々なジャンルのデザインを手掛けられることに、飽きのこない楽しさを感じられるでしょう。

Webデザイナー(Webデザイン)に必要なスキル

プログラミング言語

HTMLやCSS、JavaScriptといった言語は、Webサイトの見た目を形成する上で必要です。
これらの知識がない状態でデザインをすると、コーディングしづらいデザインを作り上げてしまう可能性が高まります。
自分でコーディングをする際に苦労するのはもちろん、Webコーダーを困らせてしまう原因にもなり得るでしょう。

Photoshop・Illustrator

プロのWebデザイナーがデザイン業務を行う上で必須となる画像編集ソフトです。Webデザイナーを名乗るなら必ず使用できなければならないと言っても過言ではありません。
これらのソフトを使ってできることや操作方法は、最優先で覚えるようにしましょう。

WordPressのカスタマイズ

企業、個人に関わらず、インターネットの世界に公開されているWebサイトの4つに1つはWordPressで運営されているといわれています。
デザインをする上で直接の関係は薄い分野かもしれませんが、この知識があるとWeb業界での就職活動で大きな強みになることは間違いありません。
ポートフォリオ用にWebサイトを制作する際に、カスタマイズの方法を合わせて覚えておきましょう。

サーバーの知識

制作したファイルをインターネット上に公開するためには、FTPソフトを使ってサーバーにファイルをアップロードする必要があります。
サーバーに関する専門的な知識までは不要ですが、基本設定の知識はあると役立つでしょう。

SEO

SEOとは「検索エンジン最適化」のことです。Yahoo!やGoogleなどの検索エンジンでキーワード検索を行った際、検索結果の上位にWebサイトを表示させるための施策を意味します。
SEOの仕組みを知るとともに、世間がどんなサイトを求めているのかを知っておくと良質なコンテンツを制作するのに役立つでしょう。

Webマーケティング

SEOにも通じる部分ですが、Webサイトの質を高めるためには良質なコンテンツが必要です。Webサイトを使って集客するためにはなにが必要かを考えるWebマーケティングの知識も、今後Web業界で活躍していく中でとても重要になるでしょう。
Webデザイナーとして充分活躍したあと、ほかの職種にステップアップしたいときに大きな強みになりそうですね。

Webデザイナーに向いている人

Webデザイナーはクライアントの要望に応えつつ、ユーザーの使いやすさを追求しなければなりません。
その両者のことを考えながらデザインを構築する能力が求められます。また、クライアントからヒアリングなどを行ったり、その話の中から意図を汲み、ビジュアル化してわかりやすく伝えるなど、コミュニケーション力や咀嚼力、発想力が重要になります。

また、デザイン作業は意外とコツコツと細かく、孤独な作業も多いため、そのような状況で集中できるタイプの人が適しているでしょう。
デザインを通じた価値提供を仕事にしたいという意欲がある方や、そのためにビジュアライズ、UI/UX、ブランディングなど、常に勉強や研究を怠らず、吸収する姿勢がある方もWebデザイナーに向いています。

Webデザイナーになるには?

Webデザイナーは実務経験のない未経験者OKの求人も多くありますが、PhotoshopやIllustratorを使ってデザインができたり、趣味でWebサイトのデザインを手がけたことがあるなど、ある程度のスキルは求められる条件があることがほとんど。
まずはWebデザインに関する知識とスキルをつけてから、選考に応募することが望まれます。

充分なスキルがあればフリーランスのWebデザイナーとして食べていくことも可能ではありますが、Webデザイン業務未経験者や経験が浅いWebデザイナーの方の場合であれば、まずはWebサイトの制作会社やWebメディアを運営するなどしている事業会社に入社し、実業務の中でスキルと実績をためていくほうが良いでしょう。
企業の中でWebデザイン業務を担当し、デザインスキルやWeb周りの他職種の業務の知識も蓄えつつ、それでもフリーランスへの夢が諦めきれなければそこからのスタートでも遅くはありません。

Webデザイナーのキャリアパス例

Webデザイナーになったら、その先の未来としてどのようなキャリアパスが考えられるのでしょうか。一般的に多いものを3つ解説します。

Webディレクターや
Webプロデューサー職を目指す

WebディレクターはWebサイト制作全体を指揮し、制作に関わるさまざまな職種を統括する管理者的ポジション。Webデザインの知識も必須です。
Webデザイナーがこれまで培ってきたデザインに関する知識を活用しつつ、さらに多職種の業務内容やスキルを得ていくことができれば、ゆくゆくはWebディレクターにステップアップし、Web制作の上流工程から制作に携わり、実制作がスタートすれば現場を統括する役割を担うキャリアパスが目指せます。

そのほか、Webデザイナーはデザイン作成を通じて多職種と関わる機会も多いもの。
Webサイト制作の全体を見渡せる場面も多いので、それを活かしてプロデューサーやプランナーを目指すのも選択肢のひとつでしょう。

幅広い分野で活躍できる
デザイナーを目指す

とにかくデザインが好きなのであれば、Webサイト以外のデザイン業務でも知見や経験を増やしていくと良いでしょう。広告や商品パッケージ、動画のデザインディレクションなど、デザイナーを必要とする業界や案件は豊富に存在します。
デザイナーとしての力をつけていくことで、いちプロジェクトのデザインをトータルでディレクションし制作の現場責任者を務める、アートディレクターやクリエイティブディレクターといった職種・ポジションを目指す道も開けます。

媒体によってユーザーの目を惹くデザインは異なるもの。
しかし、まったくの初心者がゼロからアートディレクターを目指すよりは、Webデザイナーの経験がある人が目指すほうが有利でしょう。
Webサイトのデザイン以外に目を向けたことがない方は、一度アートディレクターの仕事について調べてみてもよいかもしれません。

フリーランスとして独立する

デザインのために必要なレベルのコーディングならできる、という状況であれば、そのコーディングスキルをさらに伸ばし、Webデザインからフロントエンジニア業務までこなせる制作者になるキャリアパスもあります。

Webデザインの知見に加え、充分なコーディングスキルをつけることができれば、フリーランスとして独立し、Webデザイン&エンジニアとして仕事を獲得していくことができる可能性も。
ユーザーにとってより使いやすく質の高いWebサイト制作をするために、最良なデザイン&コーディングを行うことが出来れば、需要のあるフリーランス人材として実績を積んでいくことができるでしょう。

Point
Webデザイナーから
Webディレクターになるには?

WebデザイナーからWebディレクターへのキャリアアップ・ジョブチェンジを選択する人は多くいます。
Webサイト制作チームの一員としてWebデザインを行っていると、Webサイト制作業務の一連の進行フローを体感したり、それぞれの制作スタッフの役割を知ったり、コーディングやサーバーなどの基礎知識まで、自然と身に就いていることが多いはずです。
これらはWebディレクターであれば知っておかなくてはいけない知識なので、日々のWebデザイン業務の中で学ぶ知識や経験はすべてWebディレクターになっても役立てることができるでしょう。

また、サイトのレイアウトを考えたり、ターゲットを深堀りし、デザインコンセプトやUI等を考えていく力も、Webディレクターとして戦略設計やコンテンツ設計を行う際に、非常に役に立ちます。
一方でWebディレクターになると、プロジェクト全体を見渡した進行管理や品質管理、コミュニケーションなど、業務領域がぐっと広がります。
新しく身につけないといけないスキルや知識は何か自己分析し、足りない部分は積極的に勉強していきましょう。

なお、Webディレクターは業務未経験者を募集している企業も多くあります。未経験でも採用OKの会社に転職するのも選択肢のひとつです。
Webデザインの業務経験がある求職者は優遇される可能性が高いので、履歴書や選考では存分にアピールしましょう。

未経験からWebディレクターに
なれる会社をくわしく知る!

新人Webディレクターの働く現場に突撃!
デスクでカメラ目線で微笑むさとゆり
先輩とミーティング中のさとゆり
構成ラフ考え中… 先輩とミーティング

「Webサイト制作ってどう進めているの?」
「Webディレクターはどんな仕事をするの?」
 これを読めばイメージが掴めます!

クライアントの課題解決のために、市場を分析、ターゲットを設定して企画を練り、コンテンツを創るWebディレクター。…と言われても、「Web制作がよくわからないから、いまいちイメージが湧かない!」という皆さんに、新人Webディレクターの一日を追いかけながら、Web制作の現場やWebディレクターの仕事の一部をご紹介します♪

hello 新人Webディレクターさとゆり
新人Webディレクター

さとゆり

前職はラジオディレクター兼ライター。Web業界未経験でWebディレクターになり丸1年♪ガッツと取材力が武器!

デスクでカメラ目線で微笑むさとゆり
先輩とミーティング中のさとゆり
構成ラフ考え中… 先輩とミーティング