これから社会人として働かなきゃだけど
どうせならかっこよくて華がある仕事に就きたいな
デザイナーとかっていい響きだよね！でも食べていけるのかな？
デザイナーって憧れますよね？筆者もデザイナーって漠然とかっこいいなーと思っており、憧れていました。
デザイナーって一言で言っても様々種類がありましてそれこそ狭き門のデザイナーもあれば比較的ある程度の知識とスキルがあれば仕事ができるデザイナーまで幅広いです。
IT業界にもデザイナーという仕事はあるのですが、IT業界の実態を知ると、デザイナーの種類によっては、入口のハードルはそんなに高くないことがわかります。
筆者はIT業界未経験からエンジニアに転職しました。このmoriblog（モリブログ）ではIT業界経験ゼロから３０代で転職した筆者の経験からIT業界の情報や技術に関して配信しております。
デザイナーという仕事は様々あって男女共に人気が高いですが、最近ではIT業界のデザイナーである「Webデザイナー」の人気が凄いです。
IT業界ではエンジニア職（プログラマーやシステムエンジニア）について知っている方が多いと思いますが、上記のツイッターの内容のようにエンジニア以外にもデザイナーもたくさんの方が活躍されています。
IT業界のデザイナーはクリエイターと呼ぶこともあります。IT業界ではデザイナーも目指せます。
IT業界に転職や、キャリアチェンジを考えているのであれば、IT関連の職種についての情報収集が重要です。
この記事ではIT企業に未経験から転職した筆者がWEB業界のクリエーターであるWebデザイナーについて解説をしていきますのでWEB業界のデザイナーであるWebデザイナーについて知りたいという方は参考にしていただけたら幸いです。
※IT業界の情報について知りたい方は以下も合わせて読んでみてください。
IT業界のデザイナー：Webデザイナー
以前であればグラフィックデザイナーなども人気がありましたが、紙媒体がWebに切り替わっていることもあり、グラフィックデザイナーの需要が減ってきているようです。デザイン部分の考え方、構成力などは共通している部分がありますので、製紙・印刷業界からIT業界の知識にシフトできる柔軟性があればグラフィックデザイナーの方も継続して仕事ができるでしょう。
さてIT業界ではWEBを使ったシステムが多く、インターネットのブラウザ画面を使って操作するシステムが多いです。
などはWebブラウザから操作が可能なシステムになりますが、これらのサービスに関しては全てWebデザイナーと呼ばれる方々が作成されています。
現在では新型コロナウイルスの影響でリアル店舗の経済ダメージが深刻ではあるものの、Webサービスに関しては利用に制限がないので影響は少ない状況です。
今回の一件で企業やお店はリモートで完結できるWebシステムの導入が進められることが確実で、このような動きに世の中が進んでいくのは誰でも予想ができると思います。
このような状況になりますと、Web業界のクリエイターやエンジニアは更に需要が増えることが予想されリアル店舗では経営が苦しくなる状況の中Webのマーケティングは更に膨らむことが予想されますので今後Web業界に目を向けて転職を考えている方々も多くいるようです。
Webデザイナーとは
Webデザイナーとは、
個人や企業のクライアントの方に依頼された内容に従い、Webサイトのデザインを担当する職業
になります。
デザインと一言で言いましても「デザイン」というのは、絵を描ける人だけがデザインを考えたり作ったりするというわけでなくレイアウト構成や、色合い、フォントなどデザインに関しては考える要素が多くあります。
素晴らしい作品を作るのもデザイナーですが、売れる商品のデザインや、広告を作るのもデザイナーです。
Webデザイナーはクライアントの要望を聞お伺いして、その内容を実現するにはどのようなWebサイトが望ましいのかを、
などの項目を「設計」することも仕事になります。
その為単純に
絵を描くのが得意＝Webデザイナー
一概にも言えませんでして、WEBにおいてデザインを作るのはコードを各部分も多いのでプログラミングが得意な方は適性があると言えます。
Webデザイナーの仕事としてはWebサイトのデザインを担当する職業になりますが細かく見るとさまざまなスキルや知識が必要になります。
Webデザイナーの仕事内容
私たちが目にする企業のWebサイトは私たちユーザーが使いやすいようにUIを考えられて作られております。
このようなWEBサイトのデザインを実現するには、
などを把握して、考慮する必要があるでしょう。
Webサイトのデザインを担当といえど様々なプロセスを得てWEBサービスが実現されています。
Webサイトの要件を整理
まずは、クライアントから
などクライアントの要件を聞くことがスタートになります。
これはIT業界では「要件定義」と呼ばれるフェーズになります。要求定義とも言われたりするとのことですが、自分は要件定義しか聞いたことがないです。
など細かに要望を整理して要件定義書を作成してからprojectがスタートします。
新規案件の場合、要件定義の前にはコンペのような形で複数社で「提案」を行うことが多いです。
機能要件をクライアントが提示して、その内容に沿った形で各社提案を行い、見積も提出します。クライアントは
などを判断して、選定し仕事を獲得し、要件定義書を提出～
という流れになるでしょう。
デザインを行う上で必要な情報を整理するのが、「要件定義」になり、ここからさまざまな工程を辿りクライアントに納品されることになります。
「新しく販売する商品の宣伝サイトを作りたい」
という要望を受けたとしても、その化粧品がターゲットにしているユーザーの
など要件定義では考えることはたくさんあります。
もちろんWEBサービスの場合は画面だけでないので、エンジニアも参加しエンジニアも要件定義をシステムの面で考える必要があります。
ワイヤーフレームの作成
要件定義の次は「ワイヤーフレーム」の制作を行います。
ワイヤーフレームは「骨組み」という意味で、Webサイト制作の骨組みを作る工程になります。
例えば、
などを考える必要があります。
これがワイヤーフレーム作成になります。
ワイヤーフレームはユーザーのサイトの使い勝手や印象を大きく左右します。
経験のあるWebデザイナーですと、クライアントの業種がわかれば、ユーザーをどの様に誘導していくのかなども考えながら作成していくこともできます。
をこのワイヤーフレームでぶれないようにしなくてはいけません。
しっかりと要件整理ができていたとしても、ワイヤーフレームが要件からずれてしまっては、最終的なWEBサイトはお客様の要件に合わないモノになってしまいます。
デザイナーがある程度裁量をもって進められる工程ですが、どんなにサイズやフォント・写真などの素材にこだわって厳選しても、ユーザーの目線で作成せず流行りなどを追求して、独りよがりな構築を行ってしまうと、結果的にはユーザーの使い勝手の悪いものになってしまう可能性もあります。
Webサイトのデザインを構築する
ワイヤーフレームが完成したあとは、Webサイトのデザインに取りかかります。
要件定義書の内容を踏襲しながら、ワイヤーフレームに沿っていることを前提に
などの要素を配置してデザインを行っていきます。
ここでサイト全体の配色を考えることになります。
このデザイン作業では、Adobe社の
を利用するデザイナーが多いです。
実際の求人でも上記ソフトの使用経験が条件となっていることが多いです。
上記のソフトが好まれる理由は、
となっております。
Webサイトのデザインはクライアントにとって、
ヒアリングした結果が目に見えるようになる最初の段階になります。
これまでの要件定義は文章ベースですし、フレームワークや構成図なども、
IT業界の知識がないクライアントですと、どんな形になるのかがまったくイメージできていないということもあります。
デザインを見てクライアントは出て来たものに対して意見（レビュー）ができますので。
アイデアが一つだけだと、クライアントの納得した結果が出ずにやり直しの回数が多くなる可能性が高いです。
提出したデザインが「NO」の場合、
「なんとなく違うんだよね」
というふわっとした理由の場合も多いようで、
そのあと「YES」をもらうまで何度も作り直す事になってしまうので、いくつか案を作っておく必要がありますので、Adobe社のソフトを使える必要があるのです。
Webサイトのコーディング
デザインがクライアントからもOK出ましたら、実際にWEB画面に再現する必要があります。
デザインがWebサイトとしてブラウザで表示されるようにプログラミングを行うこのフェースを「コーディング」と呼びます。
WebブラウザはHTMLでコーディングしてCSSでデザインを整えることで、
などの複数のプラットフォームでもWebでアクセスした際にそれぞれに合った画面を表示させることが可能です。
もし作成したIllustratorやPhotoshop形式の「デザイン画」がNGを出されてしまった場合にコーディングを並行して進めていた場合は、HTMLとCSSで作り直す必要も出てきます。
このコーディングには時間がかかりますので、お客さんに納得してもらえるようレビューを入念に行なって後でやり直しを発生させないような準備を行っておくのが大切になります。
HTMLとは
HTMLはWebページにどのような情報を掲載するのかを、「タグ」というものを使って書いていきます。
詳しくは上記の記事に書きましたが
タグというのは
<html>"ここに表示する文字を書く"</html>
というような書き方のことになります。
htmlという拡張子がついたファイルに上記のようにタグでコーディングを行うことで、Webでアクセスした際に、画面にコーディングした内容を表示することが可能です。
HTMLはIT業界、WEB業界では必ず使いますので、知っておくべき技術の一つになります。
CSSとは
上記で紹介したHTMLはページに表示する文字などをコーディングすることで再現します。
CSSとは上記の記事でも書きましたが、WEBサイトの装飾に関わるファイルとなります。
htmlでもフォントサイズや、カラーの変更などのデザインの指定は可能ですが、ファイルが同一ですとhtmlとcssの記述が混じってしまい読みづらくなってしまうので、後の修正や改修、拡張を考えるとcssを分けてコーディングするのが基本になります。
WEBにおけるデザインはCSSが担当し
CSSはHTMLで記述した内容に装飾を加える
というものになります。
HTMLファイルはCSSファイルを読み込んで来ることで、デザインをHTMLにデザインを適用させています。
CSSはHTMLよりも多くのでデザインの指定が可能になっており、
CSSを使うことで
上記のようなさまざまな表示に変化させることができます。
ユーザーの操作によって表示を変える
というのは例えば
「マウスを乗っけたら」や「マウスを離したら」など、の操作で動きを変えることができます。
CSSは現在のWebサービスでは必ず使われている言語になります。
のでこのCSSもIT業界、WEB業界の方は知っておくべき技術の一つになります。
Webデザイナーに求められるスキル
ここからはWebデザイナーの仕事を進める上で必要になるスキルについて見ていきましょう。
Webサイトを生み出すデザイン力
クライアントがWebサイトに求められているのは、美しさだけではなくテーマに合ったデザインです。
その為、クライアントの求めるWebサイトのテーマに沿ったデザインを行う力が求められます。
重要なのはデザインにもセオリーがあってそれを理解して、初めてオリジナリティーが出せるということです。
WEBデザイナーは、WEBデザインの基本をしっかりと理解して作れる技術が求められます。。
色使いについては色彩のルールもあるでしょう。クライアントの要望のベースカラーから他の配色も決めていかなくてはいけません。
文字サイズや字体もよく使われているテンプレも存在していますし種類を把握しておくことも必要です。
コーディングなどの技術だけではなく、コーディングなどの技術はあくまでも手段になりますので、デザインの基本を理解していることが、良いデザインを生み出す力ということにつながります。
企画力
デザイン力があったとしても、クライアントからヒアリングしたWebサイトを
という「企画力」が必要になります。
企画力を身につけるには、
経験を多く積んで多くのアイデアを出す必要があります。
重要なのは企画が形になったら、複数の案にまとめて整理を行うことです。
クライアントの要望に合わせて複数の案をまとめておき、クライアントにそれぞれ納得できる説明を行えるように準備をしていきましょう。
Webサイトを作るコーディング力
デザイナーに求められるスキルの最後はWebサイトを構築するコーディング力になります。
先ほど触れましたHTMLやCSSがなければWEBページは作れません。
これらを使ったコーディングがWebの世界では必ず必要になりますので、コーディング力は必須になります。
近年はPCよりも、スマートフォンでのアクセスが多いため、スマートフォン向けのサイトをデザインすることも求められています。
WEBブラウザでの表示の場合はスマートフォンだけの表示ではなく、同じ内容がスマートフォンとPCの両方で見える必要があります。
その為現在で人気のサービスはそれぞれのブラウザによって表示の仕方を変化させるようなコーディングが必須となっています。
このようなWEBデザインのことを
「レスポンシブ対応」と呼ばれます。
コーディングの学習方法
HTMLやCSSなどのコーディング力は独学ではなかなか身につかなかったり、身につけるまでに時間がかかったりしますので、
無料でできる学習サイトなどを利用することで独学でも学習が可能です。。
上記のプロゲートは無料でさまざまなプログラミング言語や、Webの技術を学ぶことはできます。
無料枠ですと途中までしか実践することはできませんが、もっと学びたい方には月額980円で開放されます。
有料枠でも無料枠に比べて少し突っ込んだ内容にはなっていますが、基本的な技術にはなりますので、プロゲートの内容が理解できたからといって現場で確実に通用できるわけでもありませんのでご注意ください。
もしコーディングやプログラミングを学習して仕事につなげたいのであればエンジニアスクールに通うに通うことがオススメです。
エンジニアスクールではWEB系の知識や技術が基本から学ぶことができるところが多いです。
エンジニアスクールを利用することで、エンジニアやクリエイターの仲間もできて、転職にも有利になりますのでWEB業界のスキルを身につけて転職を考えているのであれば検討してみるのはいかがでしょうか？
以下記事にて、独学とエンジニアスクールを利用することのメリットとデメリットについて書いておりますので、確認してみてください。
Webデザイナーの働き方
Webデザイナーの働き方は大きく分けて3つになりますので解説をしていきます。
インハウスデザイナー
1つ目は企業の社内で自社Webサイトのデザインを行うインハウスデザイナーになります。
インハウスデザイナーは、社内Webデザイナーとも呼ばれます。
更新頻度の高いサイトを運用している場合や、商品毎のブランドサイトなど数多くのWebサイトを抱えている企業では、その都度制作を外注していては時間もお金もかかります。
なので、Webデザイナーを雇って、社内でデザインや制作を行うことにより、コストの削減と効率化を行っております。
インハウスデザイナーのクライアントは自社内におり、Webサイトを構築・運用するチームに属し手仕事を行います。
インハウスデザイナーを雇うことで、担当するWebサイトの細かな打ち合わせも行いやすいということもメリットになるでしょう。
長期間同じWebサイトを担当する可能性もありますので、気に入った商品やサービス、キャラクターのWebサイト制作に、携わりたい人は検討してみてはいがかでしょうか？
お客様先に常駐
2つ目は自社では制作できない企業に対して、制作会社の社員であるWebデザイナーを、お客様先に常駐して仕事をするというケースになります。
IT業界では派遣としてお客様先に常駐する働き方は普通です。これはWebデザイナーだけではなくITエンジニアも同様です。
この場合、さまざまな案件に応じた技術や能力がが求められ、必要であれば勉強することもできるでしょう。他にも様々な企業から派遣されてプロジェクトに参加される方も多いので、常駐先の人たちとコミュニケーションをとっていくことも重要です。
案件が終わりましたら、他のお客様先で仕事をすることになりますので、さまざまな技術を仕事を通じて学ぶことができ、Webデザイナーとしてのスキルアップができることがメリットです。
フリーランス
3つ目は独立してフリーランスで仕事を行うフリーランスのデザイナーになります。
実力があればフリーランスでも仕事を獲得することが可能となり、自分の都合の良い時間に働くことや報酬に関しても交渉が可能になり限界はなくなります。
今ではネットでも案件が獲得可能で、WEB関連の副業も多くありますので稼WEBデザイナーは稼ぎやすい職業と言えるでしょう。
ただしスキル不足の場合ですと、実績も作りづらいので、仕事獲得が困難になり、安定した収入を得ることは難しいです。
フリーランスで仕事を得るには、フリーランスのエージェントを使ったり、自分で営業をしてクライアントを見つけるということが必要になると思いますが、未経験からフリーランスにとして活動するには現実的に考えると難しいです。
どの程度のレベルのデザインができるのかということを実績をもって、アピールする必要はありますので、少なくとも今までの自分の作品などを提出して評価してもらう必要はあります。仕事を任せられるという信頼が必要ということです。
もし将来フリーランスとして独立することを考えているのであれば、
Web制作会社などで勤め経験と実績を積んだ後に転校した方が賢明でしょう。
実績のと経験に関しては
ランサーズやクラウドワークスなどを利用して、案件の数をこなして実績と経験を積むという方法もありますが、これらのサービスの中にはプロも多数いまして仕事の取り合いになっています。実績のない初心者では仕事の獲得に苦戦するのでランサーズやクラウドワークスで経験を積もうと考えている方は覚悟したほうが良さそうです。
ランサーズ
クラウドワークス
フリーランスとして活躍するには仕事を獲得するための経験や実績と、クライアントが信頼できる評価が必要ということです。
Webデザイナーになるには
Webデザイナーになるためには、
を解説していきます。
Webデザイナーになるためには資格は必要なし
Webデザイナーになるには資格は特に必要ありません。誰でもWebデザイナーと名乗ることができます。
ただし「Webデザイナーやっている者です」と名刺を作って名乗っただけで仕事がもらえるわけはありません。
Webデザイナーとして活動した実績が無いと仕事獲得は難しいです。
仕事獲得の条件としてはAdobe社のIllustratorやPhotoshopを使えることが最低条件になります。
最低上記のソフトが使え無いと、書類選考すら通らないWEB会社がほとんどです。
Adobe社はこれらのソフトの能力認定試験を行っていますので、認定試験に合格すれば評価はされるでしょう。
またWEBデザインは先に触れたとおりコーディングもすることになりますので、コーディングスキルとしてHTMLやCSSの知識やスキルは必須です。
WEBデザインの資格としては
などがありますので、これらの資格を持っていると評価されると思われます。
その他の資格としては、カラーコーディネーター検定などのデザイン関連の資格があれば良いでしょう。
Webデザイナーは未経験でも転職可能なのか？
Webデザイナーは業務未経験でも転職することはできます。
ですが企業も
「どの程度できる人なのか」
という観点でスキルチェックをします。
いくら求人に未経験OKと書いてあったとしても
というレベルでは採用してもらえることはまずないでしょう。
最低限自分でこれらのツールや技術を学び使うことは必要です。
独学ですと学習に時間がかかってしまい挫折のリスクも高いので、Webデザイナーとして転職をしたいのであれば、スクールでスキルを身に付けることが最短コースとなります。
Webデザイナーの将来性と年収は？
Webデザイナーの平均年収と将来性について紹介します。
Webデザイナーの年収
平均年収を確認しますと年齢や企業の規模本人のスキルにもよりますが、
Webデザイナーの年収は300～400万円というレンジになります。
上記はあくまでも平均ですので、在籍する企業が会社員かフリーランスかでもかなり差が出ます。
日本ではSEO対策や、アクセス解析が、できるようなWebデザイナーは少ないので、これらの付加価値としてのスキルを身につければ、もっと高い年収を獲得できる可能性があります。
Webデザイナーのキャリア
フロントエンドエンジニアのスキルである、
など、プラスアルファのスキルがあれば、より需要の高い人材になることが可能です。
上記のスキルを身につければWebエンジニアから、フロントエンドエンジニアにキャリアアップすることが可能になりますので年収アップも狙えます。
フロントエンドエンジニアに関しましてはこちらの記事を確認してください。
Webデザイナーの将来性
コロナショックにより世界はこれまで以上にWEB（インターネット）による技術需要が高まることが予想されます。
今後もパンデミックが発生する可能性はありますので、現在WEB（インターネット）の環境かで業務ができない中小企業はこれから実現に向けて動くことでしょう。
そうなりますとWebサイト制作の需要自体は増加傾向になるでしょう。
さらに通信も５Gという言葉も聞くようになりましたが、これから５G技術が発展していきますと、スマートフォンに大量のデータを短時間で送ることもできるようになることから、さらにリッチなコンテンツの需要も高まるでしょう。
こう考えると、仕事量や、年収面においても、Webデザイナーの将来性は抜群でしょう。
この記事のまとめ
これまでWEBデザイナーについて見てきました。
上記のように考えている方は柔軟な働き方が可能なWebデザイナーがおすすめです。
今後も企業は在宅での仕事に切り替えているところもありますし、これから更に伸びる業界ですので、これからWEB業界にシフトしても間違いは起こりません。
IT業界全般男性が多いのですが、
WEB系のエンジニアは女性の在籍も多いですので、IT業界が気になる女性はチャレンジしてみるのもオススメです。
企業側も女性ならではの感性に期待しているということもあり、実際に活躍されているWebデザイナーは女性が多いです。
未経験からWebデザイナーに転職することは容易ではありませんが、業界知識とスキルを身につけることでWeb業界に転職できます。
未経験からエンジニアに転職するのであれば、エンジニアスクールを使うのが一番の近道です。
プログラミングやIT知識に関する学習は時間がかかります。
プログラミングスキル・IT知識を最短で学習しプログラマーやエンジニアとして働きたいという方はエンジニアスクールやプログラミングスクールを使うことが現在では当たり前となっています。
以下のリンクにて無料から有料の「プログラミングスクール」「エンジニアスクール」についての情報をまとめて共有していますので是非参考にしてください。
未経験からエンジニアを目指す場合には業界情報や職種に関する情報、IT技術や用語など知るべきことが多くあります。以下の記事にて業界未経験のエンジニア職希望者が知るべき情報をまとめていますので是非見てみてください。
この記事が役に立った、参考になったと感じていただけましたらフォローとシェアをお願いいたします。
No tags for this post.
コメント 記事に関するご意見・ご感想・ご質問などお気軽にどうぞ！※メールアドレスは非公開です