SHINOBLOG

WEBデザイナーを目指す人向けブログ

ソフト・ツール 仕事の内容 仕事の流れ 技術・能力

WEBデザイナーって何やるの?仕事内容を具体的に解説

投稿日:2018年9月27日 更新日:


  • WEBデザイナーってどんな仕事するんだろう?
  • やってみたいけど、今から勉強してできるようになるのかな…?

こんにちは、フリーランスWEBデザイナーのSHINOBUです。

WEBデザインの仕事って、なんとなくイメージはできるものの、実際の業務内容まではあまりわからない…という方も多いのではないでしょうか。

この記事では、
・WEBデザイナーの具体的な仕事内容
・仕事をする上で必要な知識
・未経験でもできるのかどうか

という部分をお伝えしていきます。

では、本題へ!!

そもそもWEBデザイナーとはどんな仕事か?

WEBデザイナーを簡単に説明すると、普段みなさんが目にするようなWEBサイトの「見た目」をデザインする人です。
デザインだけでなく、マークアップ(HTMLやCSSという言語でコードを書く)もWEBデザイナーの仕事として扱われることがあります。

WEBデザイナーの年収は、平均すると他の業種と大差はないかと思われます。
技術職なので、下積み時代は月収20万を切ることも多く、他業種で新卒がもらう金額と比較しても少々下がる場合がほとんどかと思います。

一方で、実績を積めば働き方の自由度が増し、収入は同年代の平均的な金額を大きく上回るケースも珍しくありません。伸び代はかなりあると思います。
気になる収入の話は、以下の記事で詳しく書いています。
>>WEBデザイナーって稼げるの?給料・収入のリアルな話

今はITの時代ということもあり、当面の需要は尽きることはないと思われます。
ただWEBデザイナーが増えている現状もあるので、ライバルが多いのも事実です。どんな仕事でも競争はあるので、将来性を心配して「やめておこう」となる必要はないかと思います。

しっかり勉強すれば未経験からでも十分に仕事をしていける職種であり、趣味のように楽しんで仕事をしている人も多い職業なので、ハマる人はドハマりします。(私もその1人です。)

WEBデザイナーの具体的な仕事内容

では、WEBデザイナーの具体的な仕事内容を、案件の流れに沿って説明していきます。

ヒアリング・構成の検討

クライアントから、作りたいWEBサイトの概要をヒアリングします。

例えば、ある企業がサイトをリニューアルするとします。
「ポップでかわいく」や「青っぽいクールな感じで」などの全体的なイメージももちろん大切ですが、デザインを考える際はさらに深掘りしていきます

目的は社長の交代に伴うイメージの刷新
  ↓
ヒアリングをしてわかったことは、新社長が大切にしている考え方は「新しいことに果敢に挑戦する」というチャレンジャースピリット。
  ↓
先進的なイメージをベースに「奇抜さ」「情熱」を感じさせるデザインを検討する

というように、クライアントの情報をより魅力的に伝えられるよう、レイアウトや構成を検討していきます。

ワイヤーフレームやカンプの作成

構成をもとに大まかなデザイン案(ワイヤーフレーム)を作成します。大まかにでも骨組みを形にするとイメージしやすいので、クライアントとデザインを固めていく際のたたき台として使用します。
場合によっては、ワイヤーフレームよりもう少しデザインを作り込んだプロトタイプ(カンプ)を作成し、スピーディに進めていくこともあります。

デザインワーク・修正対応

この段階でようやく、デザインに落とし込む作業に入ります。
装飾や配色、写真素材の選定など、いわゆる「デザイン」の作業です。ワイヤーフレームやカンプをもとに細部まで作り込んでいきます。
クライアントとコミュニケーションを取りながら、追加・修正をしていきます。

コーディング

広義のWEBデザインは、コーディング作業を含めることもあります。
※デザイン専門で、コーディングには触れないデザイナーもたくさんいます。

コーディングとは、HTMLやCSSといった言語を使いながら、パソコンやスマートフォンで表示される形に変換していく作業です。

納品チェック

デザイン通りコーディングできているか、ブラウザで正しく表示されているかを確認します。
普段みなさんが使うようなGoogleのChrome(クローム)やAppleのSafari(サファリ)、さらにはFirefoxやInternet Explorer(IE)など利用者が多いブラウザ全てで表示されていることをチェックしていきます。

WEBデザイナーになるために必要なスキルと知識

では、これまでお伝えしてきた作業を行うためにはどんなスキルや知識が必要なのか。

なんか自信なくなってきた…

そんな方も、心配いりません。
WEBデザイナーになったからといって、初めから先述のような流れを1人で全て行うわけではありません。

では、詳しく見ていきましょう。

ワイヤーフレーム作成〜デザインワーク

デザイン作業に必要なスキルは、主にツールの操作スキルです。
極論、デザインツールをある程度マスターすれば、未経験でも仕事の場に立つことができます

代表的なツールとしてよく挙げられるのは、Adobe社のPhotoshopIllustratorです。
今のところ世界的に最もメジャーなソフトと言えるので、これらをマスターすれば間違いないでしょう。

Photoshop

写真加工を得意とするツールです。芸能人の肌を綺麗に加工したり、お腹をへこましたりできるアレです。
写真加工だけでなく、デザインワークにおいてメインツールとして使っている人も多いソフトです。

Illustrator

ロゴやキャラクターなど、イラストの作成を得意とするツールです。
Illustratorをデザインワークのメインとして使う人もいるので、これは好みで分かれます。
ただ、それぞれ得意とする作業が明確に異なるため、一連のデザイン作業の中でも使い分けをするのが一般的です。

コーディング

コーディングに必要なのは、マークアップ言語の知識です。

デザインもさることながら、言語を扱うコーディングの作業は、好き嫌いや得手不得手がハッキリと分かれる印象があります。

コーディングは、主にHTMLやCSSというマークアップ言語を使って書き進めるもので、プログラミングとは少し区別されます。言語の中でも比較的易しめとされています。
独学でも十分習得できるので、そんなに心配はいりません

作業で使用するのは、テキストエディター(メモ帳のようにテキストを書くためのツール)です。
メジャーなものは、Adobe社のDreamweaverや、Windows用のTeraPad、無料で人気のSublimeBrackets(共にMac可)などがあります。

未経験からWEBデザイナーになるためには

ここまでWEBデザイナーの仕事内容についてお伝えしてきました。
そこで気になるのは、「未経験からでもできるのか?」ということだと思います。

結論、未経験からでも十分にできます。

先ほどお伝えしたように、デザインワークはツールをマスターすれば仕事ができます。センスやスキルは、どんどんと伸ばしていくものなので、「しっかりとしたデザインが作れないとWEBデザイナーになれない」なんてことは全くありません。
初めはみんな初心者です。

「デザインもコーディングも」となると、ある程度の学習期間が必要です。(がっつり取り組んで半年くらいが目安)
なので、それがハードルに感じられる方はどちらか一方からスタートして、いずれ両方カバーできるようになれば良いかと思います。

まずは、デザインかコーディングをある程度マスターすることで、WEBデザイナーはスタートします。

未経験でも、アシスタントや下積みのような立ち位置で採用してくれる企業や事務所が、意外にあったりします
そんな私も、未経験で制作会社に拾ってもらったことがスタートでした。

少しでも「やってみたい」と思った方は、まずは試しに以下のようなサイトで、未経験求人の応募条件を見てみることをおすすめします。
実際の案件なので、収入面はもちろん、仕事内容のイメージもより具体的に持つことが出来ると思います。
レバテックキャリア
レバテックフリーランス

「勉強したら意外にいけるかも?!」と思えるかもしれません。




  1. […] ナー制作もWEBデザイナーの仕事の一つです。 それぞれの作業に必要なツールの説明など、以下の記事で詳細に説明しています! >>WEBデザイナーって何やるの?仕事内容を具体的に解説 […]

  2. […] の仕事の一つです。 仕事内容の詳細や、それぞれの作業に必要なツールなどについては、以下の記事で詳しく説明しています。 >>WEBデザイナーって何やるの?仕事内容を具体的に解説 […]

  3. […] 関連記事 >>>WEBデザイナーって何やるの?仕事内容を具体的に解説 […]

  4. […] 関連記事 >>>WEBデザイナーって何やるの?仕事内容を具体的に解説 […]

  5. […] WEBデザイナーって何やるの?仕事内容を具体的に解説 […]

  6. […] にはどうしたら良いか」という部分が気になるかもしれません。 「WEBデザイナーって何やるの?仕事内容を具体的に解説」の記事などで、WEBデザイナーの仕事についてさらに詳しく書い […]

  7. […] にはどうしたら良いか」という部分が気になるかもしれません。 「WEBデザイナーって何やるの?仕事内容を具体的に解説」の記事などで、WEBデザイナーの仕事についてさらに詳しく書い […]

comment

メールアドレスが公開されることはありません。 * が付いている欄は必須項目です

おすすめ記事

プロフィール画像
 
SHINOBU

フリーランスのWEBデザイナー兼フロントエンドエンジニア。イラストレーター。
新卒は某ベンチャー営業職→半年間WEBを勉強→WEB制作会社入社→フリーランス転身。現在はIT大手のクリエイティブチームに所属しながら、プロジェクト単位で複数チームに参加。
4大卒で、デザインの勉強は25歳から。美大でもない、経験もない。そこから2年後フリーランスとしてスタートするまでのこと、そしてフリーになってからの色々なことを記録していきます。