Webデザイナーのリアルな仕事内容!10年間の経験を公開!

Webデザイナー_リアルな仕事内容

Webデザイナーになって10年になろうとするたかつきです。
もうそんな経つのか…と自分でも思いましたが、過ぎてみると早いものです。

今回は、これから先に「Webデザイナーになろう」としている人たちに向けて、私がやってきたWebデザイナー経験を踏まえつつ、どんな業務があるかを書いてみたいと思います。

Webデザイン関連

Webデザイナーの仕事_Webデザイン業務

サイトデザイン

一番イメージしやすいものですね。
いつも見ているようなWebサイト・ホームページをデザインするお仕事です。

これまでのサイト制作は、長らく「PCサイトの制作」が一般的でしたが、近年はスマホやタブレットの爆発的な普及により、スマホサイトの制作が欠かせないものとなっています。

既にデバイス別の閲覧比率もスマホ・タブレット勢がPCを逆転していることから、スマホ・タブレットの設計を第一に考える「モバイルファースト」の考えが広まってきています。

モバイルファーストとは、Webサイトやソフトウェアの開発・運営方針の一つで、スマートフォンなどの携帯端末向けの版をパソコン向けなどより先に、あるいは同時に公開すること。また、サイトやソフトの機能や表示、操作方法を設計する際に、携帯端末での使いやすさを常に優先すること。

参考:e-words

自分のように業界経験がなまじ長くて知識が中途半端だと、未だにPCを第一に考えてしまいがちなんですけどね(汗)

ちなみに、デザイン制作の代表的なツールとしては「Photoshop」「Illustrator」「FireWorks」等が有名です。あと最近だと「Sketch」というツールが名を広めつつあります。

バナー制作

これもサイト制作に入ると言えば入るのですが、あえてサイトデザインとは切り離しました。
サイトを見ていると、会社や商品の画像広告が出ますよね。
あれがバナーと呼ばれるもので、これをクリックすることにより、お客様や自社のサービス・サイトへ誘導します。

また、単なる画像のバナー(静的バナー)だけでなく、Yahoo!トップページにもよくあるマウスオン等で拡大する「エキスパンドバナー」というものもあります。

画像サイズや容量に合わせて、いかに魅力的なものを作る事ができるかがデザイナーの腕の見せ所です。大きなバナーは比較的簡単ですが、小さいバナーはほんと職人芸の域…

どんなサイズでも、他のバナーに見劣りしないよう目立たせつつ、ユーザーに刺さる訴求・デザインを心がける事が大切です。

ロゴ制作

ロゴ制作単体での依頼は多くはなく、新規のサイト制作等と同時に作る事が多いです。
まずはコンセプト決めから始まり、ロゴに込めたい思い等を具現化していきます。

ある程度テンプレート化しつつあるサイト制作とは、ひと味違った楽しさと難しさです。
特にWebデザイナーだと、自分の作ったロゴが看板にされたりパンフレットにされ、実際に形になると嬉しいものです。

Webサイト構築関連

ウェブデザイナーの業務_Webサイトの構築

htmlコーディング

htmlとはWebサイトをWebブラウザで見る事ができるようにする言語のことです。
正式にはHyperText Markup Languageといい、この言語をもってWebサイトを構築することををhtmlコーディングと言います。

Webデザイナーであれば、ほぼ必須の能力と言えます。
習得は実際の案件を行えば3〜5件もやればコツはかなりつかめるのではないでしょうか。
最初はチンプンカンプンだと思いますが、みんなが通る道です。

覚えた方が間違いなくいいので、頑張って覚えましょう。
自分でコーディングはしなくても、最低限「理解」はしておかないといけないスキルです。

JavaScript

htmlコーディングと共によく使われるプログラミング言語です。

例えばこんなものに使われています。

  • 項目の開閉アニメーション
  • 画像のアニメーション
  • テキスト等の動的な変更
  • その他目に見える動きに関する部分

Webデザイナーが覚えるべきプログラミング言語としては、筆頭に出てくるのではないでしょうか。
これを習得していれば、かなり重宝される言語であることは間違いありません。

また、このJavaScriptを簡単に扱えるようにしたライブラリ「jQuery」は近年使わない人はいないくらいにシェアを不動のものとしました。
JavaScriptの基礎を覚えた上で、jQueryを習得すると最もスムーズかと思います。

PHP

先ほどのJavaScriptは「クライアントサイドスクリプト」と呼ばれ、主にブラウザ側で動くプログラムとなりますが、このPHPは「サーバーサイドスクリプト」と呼ばれサーバー側で動くプログラムとなります。

例えば予約システム等の構築や、その結果を表示するために使われたりします。
イメージとしては、「ブラウザ側で表示する情報をサーバーで処理・作成する」みたいなイメージでしょうか。

先述のJavaScriptと合わせて、Webデザイナーとして必要な言語は実質的にこのあたりでしょう。

ディレクション業務

ウェブデザイナーの業務仕事_WEBディレクション

Webディレクションとは、俗にいう現場監督みたいなもので、サイト制作の現場を仕切っていきます。
そしてWebディレクションを行う人を「Webディレクター」と言います。
中小企業では、デザイナーをやりつつディレクターも兼務する方が少なくありません。

例えば作業内容としては下記のようなものがあります。

電話・メール対応

お客様の応対ですね。
電話やメールだけでなく、時には実際に会って話を進める事もあるでしょう。

電話対応は苦手な方もいるかと思いますが、やればやるほど慣れるものです。
そして慣れるには電話に出ないと始まりません。
かくいう私も、最初電話に出るのが嫌すぎて怒られた経験がありますが慣れました!笑

メールも何通かやり取りをすると大体の雰囲気がわかります。
最初のうちは上司にメール内容を確認してもらい、その文面が問題ないかどうかを確認してもらうとよいかなと思います。

スケジューリング

サイト公開までの日にちの調整です。
「この日までにデザイン」「この日に公開」など今後のスケジュールを、デザイナー・クライアントと話し合い、問題のないスケジュールをつくります。

クライアントには、こちらの作業のハードさが伝わらない場合が多く、無理なスケジュールを組まれ、制作をしなければいけない場面がよくあります。
特に後半になるとスケジュールの調整もしにくいので、最初にスケジュールの調整をしっかりと行い、その中で制作を最大限急ぐといった方法が、現場の負担も少なくスムーズにいくことが多いです。

外注対応

例えば、デザインの量産や難しいコーディング等、自社で賄えないボリュームの案件が時折発生します。
そういった時に、外の制作会社やフリーランスに依頼したりすることを「外注」と言います。

最近だと簡単に外注できるサービスである「Lancers」「クラウドワークス」等のクラウドソーシングもあり便利な環境が整いつつありますが、情報漏洩の危険性もあるため会社によって外注できる幅は違います。

アクセス解析

既に公開している案件等のアクセスをGoogle Analytics等を使用し、アクセスを解析します。
例えばサイトに訪れている人の「デバイス」「年齢」「性別」その他たくさんの情報が分かります。
こういった解析から、自分のサイトに何が足りないのかを考えることができ、さらによりよいサイトにする改善作業へと繋がっていきます。

まとめ

以上のような事が、通常のWebデザイナーが実際に行う可能性のある業務です。
中には本当にデザインしかしない方もいますし、これ以上の事を一人で行う方もいます。

なんにせよ、これらのスキルは幅広く持っていた方が重宝され、自身の武器にもなりますので、積極的にチャレンジをしていけると良いかと思います。

Webの制作会社は、単純な制作だけでは経営が厳しいと何年も前から言われています。
もし今後、Webデザイナーを目指すのであれば「自社のサービス」「Webマガジン」「アフィリエイトサイト」など、多方面で強みがある会社を選ぶといいかなと思います。