『みんなの転職「体験談」。』

『みんなの転職「体験談」。』

『みんなの転職「体験談」。』は、20~50代ビジネスマン男女の、 「転職したいけれど、迷いや不安で行動を踏み出せない」を 解決し、
より良い将来を目指した一歩を踏み出していける為の、 生々しい体験談情報やナレッジを提供するWebサービスです。

MENU

「Webデザイナーになりたい!」未経験からWebデザイナーになるには?

[最終更新日]2017/10/27


30

若い年代だけでなく、「Webデザイナーになりたい」という想いを持たれる方は近年増えてきています。

実際、Webデザイナーを求める企業は、IT・Web系の会社のみならず、「自社製品・サービスをインターネット上で紹介していきたい」、または「デジタル化していきたい」といった需要から、非常に多くなってきています。

目次

 

1)Webデザイナーってどんな仕事?

Webデザイナーの仕事は、その名の通り、「Webページのデザイン」です。──ですが、これだけだとイメージも付きにくいですよね。

具体的には、社内のWebディレクターやクライアントからWebデザインに関する依頼を受け、その依頼に沿って制作・開発を行っていきます。

どのような依頼があるかというと、大きくは以下のようなものがあります。

  • (1)Webページ全般または基本レイアウトの制作
  • (2)挿入図やグラフ、バナーなどの画像の制作
  • (3)イラスト制作

「上記3点がすべて出来ないといけない」という訳ではありませんが、特に1点目と2点目は押さえておいた方が良いでしょう。

Webページ全般または基本レイアウトの制作

Webページの基本デザインの制作またはページそのものを作る仕事です。

みんなの転職「体験談」。を例に説明してみましょう。

 

みんなの転職「体験談」。のページデザイン依頼書(一部)

例えばみんなの転職「体験談」。では、とあるページのデザイン指示書を以下のように制作しました(※一部のみを抜粋しています)。
ちなみに、こちらの制作書はExcelで創られています。

 

実際に出来上がったページ(一部)

実際に出来上がったページは、現在の「みんなの転職「体験談」。」Webサイトから直接確認することができますので、興味がありましたら、チェックしてみてください。↓

Q.「収入」と「やりがい」、仕事に求めるのはどちらの方が割合が高い?

価値観・考え方
260views
20

「私はこっち」という方をClickしてください!
※ 個人情報が特定されることはありませんのでご安心ください。




指示書からWebページに表示される迄の基本の流れとしては、以下になります。

  • 1) 全体のページデザインをPhotoShop等の画像編集ソフトで作成
  • 2) 天秤などイラストが含まれる場合は、その分はIllustrator等のイラスト制作ソフトで作成
  • 3) 1~2の内容を元に、Webページで表示できるようにHtml、CSS、JSなどのプログラム言語を使って構築していく

──つまり、ここでのWebデザイナーの仕事としては、PhotoshopやIllsutratorといった画像編集ソフト、イラスト制作ソフトはじめ、Html、CSS、JSといったプログラムの構築まで、幅広い業務が求められてくるということですね。

その他、ページが完成されるまで依頼元(ディレクターやクライアント)に途中状態のチェックをしてもらいます。完成後に「イメージと全然違う」と言われないように、段階ごとに共有していくことがとても重要です。


挿入図やグラフ、バナーなどの画像の制作

Webデザイナーは、ページ全体の制作だけでなく、部分に特化した制作依頼も多くあります。
特に、最近では自社商品・サービスをインターネット広告で紹介するWebバナーを、Webデザイナーに制作してもらう企業も多くなってきました。

 

挿入図やWebバナーの例

図やバナー上で使用される文章(キャッチコピーやリード文等)や写真画像は、主に指示側のディレクターやクライアントから素材として渡されるケースが多いです。

Webデザイナーはそれら素材を組み合わせて、一つの画像(「クリエイティブ」と呼ばれることがあります)を制作していきます。
制作の工程で使用されるツールは、Photoshopなどの画像編集ソフトがメインです。


イラスト制作

Webデザイナーで「イラスト制作」まで担うシチュエーションはそれ程多くありませんが、イラスト制作自体の需要はかなり高まってきていますので、併せて紹介しておきましょう。

 

みんなの転職「体験談」。のイラスト制作依頼書(一部)

このサイト「みんなの転職「体験談」。」では、TOPページにサイトのイメージ・印象を持ってもらう為のイラストの制作をプロのイラストレータさんに依頼しました。依頼書は、以下のような感じです。

(※ はじめにイラストレータさんの絵のテイストであったり、サイトの全体イメージは伝えています。また、以下依頼書は一部を抜粋したものです。)

 

実際に出来上がったページ(一部)

※ イラストがWebサイト上でどう使われているかは、本サイトのトップページをご覧ください。

イラスト制作を行う場合は、Illustratorなどのイラスト制作ソフトを使っていきます。
また、イラスト制作も途中段階でのチェック作業はふんだんに入ります(大体、ラフ画、線画、色塗りと大きく3つのフェーズに分けてチェックフェーズを持ちます)。


イラスト制作については、通常専用のイラストレータが携わり、Webデザイナーが手掛けることはあまりありません。ですが、もしWebデザイナーを目指される方が「自身もある程度イラストが描ける」という場合は、積極的にその点もアピールしていくと良いでしょう。

なぜなら、「イラストを描ける」という人は多くの場合社内にはおらず、大抵は「社外発注」となるケースが多いからです。ディレクターからすると、依頼を社内で完結できた方がディレクション的にもコスト的にもスムーズになりますので、イラストを描けるWebデザイナーは重宝される傾向にあります。



2)Webデザイナーの仕事の流れ

制作内容は様々あれど、Webデザイナーの仕事の流れの大枠は以下のようになります。

 

1) 社内ディレクターまたはクライアントから指示・依頼内容を受ける

社内ディレクター、または直接クライアント(顧客)から、制作してほしい内容の依頼を受けます。
Webサイト全般のデザインなど、制作範囲が大きい場合は通常「仕様書」や「設計書」が渡されます。

Webデザイナーはこの際に、指示・依頼内容を正確に理解し、その他納期や途中確認(チェック等)の進め方を確認し、依頼者と意思の齟齬が無いようにします。

 

2) 制作スケジュールを立てる

Webデザイナーのほうで制作スケジュールを立てます。
完成するまでの工程を整理し、途中依頼者とどのタイミングでチェック・確認していくかもスケジュールに落とし込んでいきます。

 

3) デザイン制作

デザイン制作フェーズです。

 

4) チェック・確認、修正作業

一定の段階ごとに、依頼者(社内ディレクターやクライアント)に進捗状況を確認してもらい、修正事項が無いかを見ていきます。修正依頼があった場合は、対応します。

 

5) 納品

依頼者から「これで問題ありません」とOKをもらえたら、制作完了です。
完了後は、依頼者から指定された形式(ファイル形式であったり、各画像のサイズ・大きさ等)で成果物を提出します。


特に重要となってくるのが、1)の「指示内容の確認」フェーズと、4)の「チェック・確認」フェーズです。どんなにスキルのあるWebデザイナーであっても、依頼元と認識がずれていたら、満足してもらえる成果物を制作するのは不可能です。

初回と各フェーズにて、しっかりと依頼者とコミュニケーションを取りながら、相手の真に求めるニーズをくみ取りながら、デザイン制作をしていく──といったイメージですね。



3) Webデザイナーの仕事のやりがい・魅力

Webデザイナーの仕事は、デザインという形で実際に成果物が目に見えやすいこともあって、やりがいも感じられやすい職業と言えるでしょう。

具体的に、どんなときに「Webデザイナーをやっていてよかった」と感じられるようなやりがい・魅力を感じているのか、代表的なポイントを3点、紹介しましょう。


作品を世の中に発信していける

Webデザイナーのやりがいでまず挙げられるのは、「クリエイターとしての働き方」です。
クリエイターは、自身が思っていること、感じていることを「作品」として形にし、世の中に出していけます。そして、その行為自体を大きなやりがいを感じられる人こそが、クリエイターたる所以とも言えます。

ただし、クリエイターはアーティストとは違います。「自分が思うものをそのまま作る」のではなく、「誰のためのデザインか」を考え、クライアントやエンドユーザーのことをしっかり見据えて、形にしていくことが大切です。

そのうえで、依頼してくるディレクターや社外のクライアントから、「彼らの目的を達成し、最大限満足してもらえるためにはどうすればよいのか」を熟考し、最適な形でアウトプットしていくことがWebデザイナーの役目であり、そして腕の見せ所でもあります。


新しい感性・視野を感じられる機会が多い

Webデザイナーは、「デザインが、それを観る人々の感情にどのような変化を与えるか」という点に向き合っていきます。その為には、豊かな感性や人間性もまた求められるでしょう。

また、デザインという言語化できない領域と向き合っていく機会は、人として「新しい感性・視野」を感じる機会にも繋がります。
そしてそれは、自らの人生をより味わいのある、豊かにしていく行為とも直結していくでしょう。


デザイナーとしての向上・スキルアップを感じられる

「自身のデザインスキルをどんどん高めていきたい」という気持ちを強く持たれている方は、Webデザイナーを主業務とすることによって、その要望はおのずと叶えていけるでしょう。

もちろん、Webデザイナーの仕事は簡単なものではなく、「なかなか良いデザインが生まれてこない」であったり、「クライアントの要求レベルが高い」など、悩むことや苦しいことの多いでしょう。ですが、そういった悩みや苦しみ自体が、あなたのデザイン力を高めていくきっかけにもなるのです。

また、Webデザイナーは、独立して自身で会社を興したり、フリーランサーとして活躍する方も多くいます。
Webデザイナーを極めていく道のりは、同時にこれから先の未来や夢を切り開いていくことにも繋がっていく──ということですね。

デザイナーとしての向上・スキルアップが、同時に将来の可能性が大きく広がっていくこともまた、Webデザイナーのやりがい、魅力とも言えそうです。



4)Webデザイナーに転職する際に、必須となるスキル・条件は?

デザイン・レイアウトの基本知識は押さえておくのがベスト

  • 「誰のためのデザインか」を常に念頭に入れる。
  • 基本的なグリッド(レイアウトの規則性)を意識する。
  • カラーは基本多く使いすぎない。ベースカラー、メインカラー、アクセントカラー+αで4色前後を目指す。
  • それぞれの色が与える印象や、補色(対立する色彩)関係を理解しておく。
  • リーダビリティ(可読性)とレジビリティ(明瞭性)を意識したデザイン・レイアウトを意識する。
  • 余白を効果的に使う。
  • 文字を配置するときはカーニング(文字間のスペースを調整すること)を意識する。
  • 行間隔・文字間隔に読みやすさおよび規則性を持たせる。

上記はデザイン・レイアウトについて考えていく際に基本となる考え方の一部です。
「初めて聞いた」という項目があったり、「聞いたことの無い単語が入っている」という方は要注意かもしれません。

これまで「なんとなく」であったり、完成の赴くままにデザイニングをされてきた、という方は一度書籍などを通してデザイン・レイアウトの基本知識は押さえておいた方が良いでしょう。


Photoshopの扱いは必須。その他、Web制作における基本知識はしっかりマスターを

Webデザイナーの多くは業務用ツールとしてAdobe製品の「Photoshop」(画像編集ソフト)を使用します。

その他、業務内容によって「Illstrator」や「SAI」(イラスト制作ソフト)であったり、「Dreamweaver」(Webサイト・Webページ制作ソフト)、データ管理やプレゼン説明用にExcelPowerPointを使用することもあるでしょう。
各企業の要求レベルにも依りますが、まずはPhotoshopを「使いこなせる状態」にしておくこと、その他Excel、PowerPointなどのデスクワーク一般で使用されるオフィス系ソフトは使えておいた方が良いでしょう。


また、Webに関する基本知識も抑えておいた方が良いです。例えば、以下のようなことをしっかり押さえてWebデザイナーになるのと、知らずになるのとでは結果大きな開きが出てくるでしょう。

  • 現代では、PC・スマホなど閲覧するデバイスに応じて表示を最適化するレスポンシブ対応が主流
  • Webサイト構築時は、多くの場合WordPress(WP)、MovableType(MT)といったCMS(コンテンツマネジメントシステム)を利用する
  • 一般的にWebサイト上で使用する画像の解像度は 72dpi
  • PC向けWebサイトでは、横幅1,000pxl前後を、スマホ向けWebサイトでは、640~700pxlを目安に作成
  • CSSとJavaScriptでは、JavaScriptのほうが演出できる幅は広がるが、サイズが大きくなりがち(読み込みが遅くなる)。

注: 上記情報はWebに関する基本情報の一部です。また、情報は常に新しい内容に書き換わっていきますので、「これだけを知っていれば大丈夫」というものではございませんので、ご了承ください。

このあたりは書籍で覚えていくのも大切ですが、ご自身でWebサイトを構築しながら覚えていくのも効果的です。実務経験が無かったとしても、「基本は抑えている」状態であれば、仕事を依頼する側からしても安心感を持ってもらえるものです。



常に多くのWebサイト、Webサービスに触れ、かつ新しい情報、技術に敏感であること

Webデザイナーは、常にデザインをアウトプットしていく仕事ですが、その分世の中の動きを頻繁にインプットしていくことが求められます。
日頃から様々なWebサイト、Webサービスを見ておく習慣を持っておくと良いでしょう。

それから、Webに関する新しい情報、技術にも敏感であることが重要です。

例えば、Webサイトを運営するうえで必ず意識することになる「SEO(”Search Engine Optimization” の略であり、GoogleやYahooの検索サイトの結果表示を最適化すること)。──SEOに関するトレンド情報は、数ヶ月単位で変わっていきます。1年前のSEO情報が、現在はあまり意味をなさないということは、多くあります。

また、2012年頃からWebでの動画が多くのユーザーに受け入れられているというところから、「Web動画マーケティング」という言葉がもてはやされ、Webサイト上に動画やアニメーションを取り入れたサービスは増え続けています。

つまり、Web業界における技術やトレンドは日進月歩。「極めた」と思ったスキルも、驚くほどのペースで陳腐化されていきます。Webデザイナーをプロの生業とするとしたら、そのスピード感にもついていこうという、常に向上していくスタンス・行動も求められます。


ディレクターやクライアントのニーズを掴み、満足してもらえるための「コミュニケーション力」

最後に紹介しておきたいのが、「コミュニケーション力」。

Webデザイナーに限らず、どの職種においても求められるスキルではありますが、Webデザイナーは「顧客の求めるニーズ」をしっかり【ヒアリング】して、かつ自身の考えや提案を分かりやすく伝えるための【トーキング力】、【プレゼン力】も求められます。

せっかく高いデザイン力を持っていても、コミュニケーションへの働きかけが低ければ、高い価値発揮を続けていくのは難しいでしょう。

コミュニケーション力は、実務と共に培われていくところも大きくありますので、「高いコミュニケーション力が無いとWebデザイナーになれないのでは…」と思う必要はありません。ですが、少なくとも「仕事相手とのコミュニケーションを大切にすること自体が、より良いデザインを創出していくことに繋がる」という意識と、働きかけを持つことが大切です。


5) Webデザイナーへの転職を成功する為のアプローチ

まずはポートフォリオを作ろう

「Webデザイナーになりたい!」と思って転職活動を始めるとしたら(社内での異動願いも同様)、まずはご自身のこれまで手掛けたデザインのポートフォリオを作っておきましょう。

ポートフォリオに載せるものは、実務で扱ったものだけでなく、プライベートで制作したものでも構いません。

要は、相手に「Webデザイナーとして任せられる」と思ってもらえるためには、あなたが現在どのようなデザイン・クリエイティブを手掛けられるかを見セル必要があり、相手もそれがないと判断が付かないのです。

その判断をしやすくしていく為に、またご自身のデザイン力とその可能性をアピールしていく為にも、現時点でご自身が見せられる最大限のポートフォリオの作成をしておくことが大切です。


Web系・クリエイター系に強い転職サービスを利用するのがベスト

業務経験あり未経験に関わらずWebデザイナーに転職される際は、Web系・クリエイター系に強い転職サービスを利用することを強くお勧めします。

理由は、Webデザイナーと一言で言っても企業が求めるありかたはそれぞれであり、そして皆さんの求める「Webデザイナー」の在り方とマッチするかは、まさに「相性」によるところも大きく、その相性を見極める第三者の存在があるかないかで、転職後に待ち受ける未来の様相も大きく変わってくるからです。

Web系・クリエイター系に強い転職サービスを利用すれば、キャリアコンサルタントの密なサポートによって、より皆さんにあった企業を見つけられやすくなるでしょう。また、これからのキャリアプランやステップアップについても有益なアドバイスを受けられることもあるでしょう。

以下、Web系・クリエイター系に強い転職サービスとして代表的なところを3点程紹介しておきます。
ちなみに、どのサービスも無料で転職への相談・サポートを受け付けていますので、ご興味・ご関心を持たれた方は、一度相談レベルででも、ご利用されても良いかもしれません。


Webデザイナーを目指す際に、オススメの転職サービス

質の高いサービスが評判!未経験業界へのキャリアチェンジもしっかりサポートしてくれる──WORKPROT(ワークポート)

サービス名 WORKPORT(ワークポート)
特徴 「WORKPORT」は、IT・インターネット業界をはじめ、様々なジャンルの転職サービスを提供している総合人材転職エージェントサービスです。
「ひとつでも多くの可能性を追求できる、専門性の高い転職支援サービスを提供する」というポリシーを掲げ、書類の添削から面接サポート、年収交渉までトータルでサポートしてくれる、心強い転職サービスです。
企業名 株式会社ワークポート(2003年3月)

Web・ゲーム系の求人に強いことで評判の転職サービス!20代~40代まで、幅広い年齢層で転職成功実績多数──Geekly(ギークリー)

サービス名 GEEKLY(ギークリー)
特徴 ギークリーは、I​T​・W​E​B​・ソーシャルゲーム業界を専門とした転職支援サービス。大手を中心に非公開求人数は2​0​0​0​以上!
独占求人案件も多数扱っており、転職希望者のスキルや経験を元に、多角的に分析してのマッチングが人気です。
企業名 株式会社GEEKLY(ギークリー)(2011年8月)

業界大手の転職サービス 全国、全業界にわたる情報の網羅性が高く、IT求人にも強い!──DODA(デューダ)

サービス名 DODA(デューダ)
特徴 全国対応、かつ国内トップレベルの膨大な求人数!

すべての業種・職種を網羅した求人情報だけでなく、キャリアアドバイザーの良質なサポートで、転職成功者の実績も多数の、初めに登録しておきたい鉄板の転職サービスです。
企業名 パーソルキャリア株式会社(1989年6月)

6) まとめ 「Webデザイナーに興味ある」という方は、早いタイミングでの行動を

ここまでお読みになられて、如何でしたでしょうか。

もし皆さんが、本気で「Webデザイナーで活躍したい!」と思われていたとしたら、いち早く「実務で携わっていくこと」をお薦めします。

理由は、Webデザイナーとして経験・スキルを積んでいくとしたら、やはり実務での経験が圧倒的に効果的だからです。

また、年齢が上がれば上がるほど、企業からはWebデザイナーとしてのスキル面だけではなく、ディレクション力やマネジメント力も求められるようになり、その分求人の敷居は高くなっていきます。そういった意味でも、早め早めの行動が望ましい、ということですね。


この記事が、皆さんのこれからの働き方、キャリアパスを描いていく上で、少しでもお役に立てられることを、心より願っております。

この記事の作成者:みんなの転職「体験談」。事務局


良かったら、評価のご協力をお願いします!
この記事が参考になったら、
にチェックしてください!
1 Star2 Stars3 Stars4 Stars5 Stars
(平均5.00
Loading...