webデザイナーに転職

webデザイナーやインターネット業界に転職するには何が必要になるのか?

一時期ほどではないにせよ、今でもホームページ制作に携わるwebデザイナーなどの仕事は人気がある職業の1つです。 異業種からの転職も多いといわれていますが、実際、経験がない状態から転職するにはどうすればいいのか?どんなスキルがあればいいのか? これからwebデザイナーを目指す人がどんなダンドリで転職をすすめればより効率的に活動できるのか、という点を私の体験談をふまえながら説明したいと思います。

web制作の現場で求められる技術

ほぼ10年以上、独学でつけた知識でフリーランスのような状態で働いてきた私ですが、 2年ほど前に仕事がうまくいかなくなり一時的に転職活動→就職をしました。 わずか半年未満の就業期間でしたが、それでもweb制作の現場を経験したことで、 いままでぼんやり理解していた仕事の流れをはっきりと知ることができました。

これから転職を考えている人も、仕事の流れや必要なスキルについて知ることができれば、 より具体的に今後のイメージが出来ると思います。

さて、その仕事の流れですが私が就業していた会社では、1つのサイトに対して大体5~6名のメンバーでチームを組んでいました。 チームメンバーの内訳は、ディレクター・webデザイナー・コーダー・プログラマーといった感じです。

他の部署ではサイトの規模が大きかったりすると営業部隊がいたり、 アルバイトを10名単位で入れたり、プログラマーの人数が多かったり。 いろいろな形のチーム編成が組まれていた気がします。

分業制でサイト作成が進んでいくわけですが、各々に課されている仕事の内容は担当ごとにはっきりわかれていて、 必要なスキルもそれに習って全く異なります。

webデザイナーの仕事内容と覚えておきたい技術

webデザイナーであれば「photoshop」での作業が8割以上となる会社が多いと思います、私が働いていた現場ではその他に「fireworks」を少しだけ使っていました。 ディレクターから落とされたワイヤーフレーム(カンプ)をもとに連携をとりながら1ピクセル単位でデザインを作っていきます。

デザインを作るといっても1からキャラクターを作成するということではなく、その大半の作業はサイトの枠組みつくりです。 カテゴリーのボタンであったり、「申し込みはこちら」といったバナー作成だったりします。 口コミを扱うサイトだったので口コミを見せる部分を作るだけでも、 枠線の太さを何ピクセルにするか、また、見出しの配色やグラデーションのかけかたなどをどうするかなど考えます。

またアクセスが多そうなページでは、ページを開いた直後にぱっと見えるメインイメージを作ってより作りこんだりしますが、この場合は有料の素材サイトから 人物や背景などを選んでそれを切り抜き合成するといった作業が必要です。

そのためフォトショップの基本的な使い方はもちろんのこと、どんな素材があってどんな背景との組合せがいいのか。といった知識(スキル)もあるとスピード感のある仕事ができます。

そして、意外に作業のなかで重要なのが「文字」のデザインです。このドメイン取得への道!ではほとんど必要とされていませんが、 ちょっとした作りこまれた企業や商用サイト、またはランディングページなどは多くのメインイメージ・バナー・見出し部分を画像で作っています。 例えば、脱毛サロンのサイトだったら「施術予約がとりやすいサロンNo1!」などがそうです。

文字1つフォトショップで作るにしても、どのフォントを使うのか、シャドウをかけるのか、枠線の太さや色は、といったようにいろんな要素がからまってきます。 普通にゴシック体で色も単色でいいよということであれば楽なのですが、そういうことはまずないです。 企業のランディングページなら、たくさんの文字を画像として作るので1ページあたりにおける「文字」のデザインが10箇所も20箇所もあったりします。 さらにそれぞれの文字の色あいや形のバランスを上手くとっていくとなると、思った以上に時間も手間もかかります。

もし、これからwebデザイナーになりたいのであれば、今では単体でフォトショップは売っていないと思いますので?アドビのクリエイティブクラウドでフォトショップを月2000円ぐらいで 購入して、ここで説明した点を重点的に練習していくことをおすすめします。

HTMLコーダーの仕事内容と覚えておきたい技術

ホームページを作っていくうえでwebデザイナーと同様に必ず必要になるのがコーダーになります。そのホームページのHTMLやスタイルシートを作っていく人です。 デザイナーから渡されるフォトショップなどのデザインを元にhtmlをひたすら手打ちで入力していくことになります。

主にドリームウィーバーを利用している会社が多いような気がしますが、「Sublime Text」や「秀丸」といったテキストエディタでもまったく問題ありません。 私は「さくらエディタ」を使っているので、そのまま会社でも同じエディタを使っていました。

このコーディングですがスキルとして構築するにはどうすればいいでしょうか。 個人的にはとりあえずカンタンなものでいいので1つホームページを作ることをおすすめします。 最初はテキスト1行だけのホームページを作ってもいいと思います。私も最初はそうでした。 そこから始めて、2カラムにわけてみたり、画像を挿入してみたり、と1つ1つHTMLを打ち込んで覚えていくしかないと思います。

会社に入って覚えたことで、1番びっくりしたのはGoogleの「ディベロッパーツール」の存在でした。 このツールによってweb作成の生産性が10倍は上がりました。

webディレクターの仕事内容と覚えておきたい技術

デザイナーやコーダーのリーダーとしてチームをまとめるのが「webディレクター」になります。

ディレクターの仕事内容は、おもにホームページの枠組み作り(ワイヤーフレームやサイトマップの作成)になります。 また、円滑に作成がすすむようサイトの進捗を確認しながら各担当に指示だし、チームの人数が多くなれば誰にどの部分を作ってもらうか、どのくらいの工数(時間)で作ってもらうか、 といったことを納期を前提にして考えることになります。

例えば美容に特化したキュレーションサイトを作る場合、大まかなデザインとしてワイヤーフレームを作ってデザイナーに渡します。 この時の連携次第では出来上がりが変わってくるので、どのようにサイトイメージを伝えるのかというのも大切になります。 1回の連携で伝えきれないことも多いので、日々、デザイナーと確認しあいながら仕事をすすめていきます。