Vastill
  • 制作実績
  • 仕事メニュー
  • 代表プロフィール
  • 会社概要
  • お問い合わせ
  • 制作実績
  • 仕事メニュー
  • 代表プロフィール
  • 会社概要
  • お問い合わせ
Vastill
  • Web制作

Webデザイナー(制作者)になる!仕事の内容をキャリアスタート前に知っておこう

  • 2020年9月29日
  • 平山翔樹
Total
0
Shares
0
0
0
目次
  1. Web制作って何?
  2. Webサイト制作プロセスを家の建築に喩えてみる
  3. Web制作の職業をオススメする理由
  4. Webデザイナー(制作者)仕事の内容
  5. Web制作は大きく分けて3つの仕事内容(フェーズ)
    1. 企画と設計
    2. 制作
    3. 保守運用
  6. Web制作のお仕事は最高にやりがいのある仕事!
  7. 企画と設計プロセスを学ぶ
    1. ヒアリングとプランニング
    2. 提案
    3. サイト設計
    4. コンテンツ設計
    5. ワイヤフレーム設計
    6. コピーライティング
    7. フォーム設計
    8. その他必要なものの準備(ロゴデータ・サーバー契約・ドメイン取得)
  8. いざ制作のプロセスへ!
      1. Webデザイナー(制作者)のお仕事紹介シリーズ

Web制作って何?

Webデザイナーと聞くとWebサイトをデザインするだけ、HTMLとCSSをコーディングするだけの職業に聞こえるかも知れません。しかしWebデザイナー、いやWeb制作のお仕事はそんな浅はかな職業でありません。

お客様(Webサイト制作の依頼主)の要望やゴールを理解し、Webの専門家としてのアドバイスをしつつ、機能的かつ目的を果たすWebサイトを制作し、提供すること。これがWeb制作者のミッションです。 これを達成するためには、デザインの知識、コーディングの知識があるだけでは不十分です。

ただ、デザインとコーディングの知識から学ぶことは、仕事の入り口としては良いと思います。家が建つプロセスを考えてみると分かりやすいかもしれません。

Webサイト制作プロセスを家の建築に喩えてみる

Webサイトを家を作るプロセスに喩えて見ると分かりやすいかと思います。

お客様とやり取りする担当者の人がいて、どのような家をいくらで建てたいかをヒアリングする。
(プランニング)
↓
建てる場所を決める
(サーバーとドメイン)
↓
ではこのような間取りはどうでしょうか。このような素材、このようなシステムを取り入れるのはいかがでしょうか。などなど提案を行う。
(提案)
↓
建築士に設計を依頼し、設計図を作る。インテリアデザイナーに相談し、素材や家具、取り入れるシステムを決める。
(コンテンツ設計)
↓
家全体の仕様とデザイン、家具が決まる
(ワイヤフレーム設計・コピーライティング・デザイン制作)
↓
大工さんに建築を依頼する
(デザイン制作・コーディング)
↓
電気や水道などのライフライン工事を依頼する
(サーバーへのアップロードと動作確認)
↓
家の受け渡し
(サイトの公開・サイトの管理情報譲渡・納品)

大工という職業と比べるわけではありませんが、デザインとコーディングは、Webサイト制作というお仕事の中の一つに過ぎず、設計やコンサルティング、コピーライティングなどをすべて含めて、初めてWeb制作というお仕事が成り立つのです。

繰り返しにはなりますが、デザインとコーディングの仕事の入り口としては良いと思います。プロデューサーが作り上げた指示書やワイヤフレームを見て、どのようにサイトを設計しているのか、どんな提案をしたのか、どんな目的を果たすためのサイトなのかを考えてデザインとコーディングに取り組むのと、何も考えずにデザインとコーディングを行うのとでは得るものが違ってきます。

Web制作の職業をオススメする理由

Web制作のお仕事は、デザインやコーディングなどの技術的なお仕事ではなく、ビジネスやマーケティング、人間心理の理解力、コミュニケーション能力、柔軟な対応力、提案力、コピーライティングスキルなど、トータルなスキルが必要なお仕事です。筆者のような飽き性でオールマイティな人にはピッタリのお仕事です。色々とやることがありますから。

もちろんデザインセンス、アートセンス、写真のセンス、そして多少のバックエンド開発知識(プログラミング)も重要になってきます。さらにお客様は大体企業さまが多いですから、色々なビジネスを知ることもできるし、人脈も多種多様に広がっていく、非常に面白い職業がWeb制作なのです!

Webデザイナー(制作者)仕事の内容

さてWeb制作の仕事の内容を詳しく見ていきましょう。 制作するWebサイトの種類は沢山ありますから*、まずは一般的であるコーポレートサイト、要するに企業サイトを制作する場合の仕事内容を見ていきましょう。

また、ここで紹介している各工程では、簡潔に内容を紹介しています。実際の作業の紹介は、各工程ごとに別記事で詳しくまとめたいと考えていますので、この記事ではあくまでもWeb制作のお仕事の全体像を把握するため、としていただければと思います。

(*企業サイト、ポータルサイト、採用サイト、ポートフォリオサイト、ブログ、マガジン・メディアサイト、ショッピングサイト、ランディングページ、告知サイト、コミュニティサイト等など)

Web制作は大きく分けて3つの仕事内容(フェーズ)

  • 企画と設計
  • 制作
  • 保守運用

それぞれの仕事内容(フェーズ)を分解していくとこんな感じ。

企画と設計

  • ヒアリングとプランニング
  • 提案
  • サイト設計
  • コンテンツ設計
  • ワイヤフレーム設計
  • コピーライティング
  • フォーム設計
  • その他準備

制作

  • デザイン制作
  • コーディング
  • WordPressテーマ化
  • サーバー側の作業
  • サイト公開

保守運用

  • 保守管理
  • アクセス解析
  • ブログ執筆サポート
  • ソーシャルメディア戦略サポート
  • サイト修正
  • サイト改善の提案
  • テスト実施

Web制作のお仕事は最高にやりがいのある仕事!

Web制作のお仕事は結構やることあるんですが、どうしてもデザインとコーディングだけに目が行きがちですよね。色々とやることがあるからこそ、Web制作の仕事は面白いし、大変でもあるし、重いお仕事でもあります。非常にやりがいのあるお仕事です。

Web制作は需要がないとか、Webデザインは稼げないと言う人がいますがそれはあながち間違っていなくて、デザインとコーディングだけではそりゃ稼げません。誰でも出来ますから。Web制作はデザインとコーディングだけのお仕事ではありません。

しかし朗報です。上記の内容がすべて出来る人は余裕で稼げます。エンジニアやプログラマー以上に普通に稼げます。

それぞれのフェーズを説明していきたいのですが、全部いっぺんにだと長くなってしまうので、今記事はまず「企画と設計フェーズ」についてご紹介したいと思います。

企画と設計プロセスを学ぶ

このプロセスの目的: どんなサイトを制作するのかを明確にすること。

ヒアリングとプランニング

ヒアリングとは、お客様からご要望を伺うこと。プランニングとはWebサイトの企画を立てることです。

お客様はどんなサイトを作りたくて、どのような目的をWebサイトで果たしたいのか。どんなイメージがあるのか。テーマはあるのか?サイトを閲覧してもらいたい人(ターゲット)はどんな人なのか。どんな印象を閲覧者に与えたいのか。どのような機能を搭載したいのか。サイト制作の全体像をお客様と相談しながら把握していきます。

希望する公開日はあるのか。予算はいくらか等、お仕事の契約部分についてもプランニングの段階で決めていきます。

提案

ヒアリングでお客様のご要望を聞いたら、それをWebサイトで最適に実施するための提案をします。お客様のご要望通りに進めることも大事ですが、Web制作のプロフェッショナルとして、非推奨なことは指摘し、根拠ある内容に整えてあげることも私たち制作者の役目です。

診察が終わった後のお医者さんからのアドバイスのようなイメージです。

こうだからこうした方が良いよ。 これはやめておいたほうが良いよ。

という風に、プロ目線からのアドバイスを行うことが提案のプロセスです。

サイト設計

プランニング内容と提案に基づき、サイト構成を決めていきます。プランニングと提案の段階ですべき事は、サイトの目的を明確にすること。そしてその目的から逆算し、どんなページをサイトに用意すべきかを考えるのが、サイト設計です。

魅力を最大限に表現するためのページが必要ですね。 お問い合わせフォームが必要ですね。 ブログは必要ないけどニュース欄は必要ですね。 実績を載せるページが必要ですね。

等など。

制作するページを考え、サイトマップ(サイト構成)を作ることが目的です。

コンテンツ設計

サイト構成が決まったら、各ページごとにどんなコンテンツを載せるかを考えます。この段階では、文章のライティング(コピーライティング)は行いません。見出しや載せたいコンテンツ名などを決めていきます。

コンテンツ設計の段階で、クライアント支給の画像やイラストがあるのか、イメージデータの把握も行います。支給の画像がない場合は、素材サイトから購入するのか、素材費に費やせる予算などの確認も必要となります。

ワイヤフレーム設計

ワイヤフレームとは、デザイン制作を行う前に作る、デザインの骨組みのことです。どこに何を載せて、どんなレイアウトにするのかを決めていきます。

デザイン制作は色や見た目をこだわって制作しますが、ワイヤフレームは見た目ではなく、あくまでも骨組みと、導線設計(サイトデザインでユーザーを行動に導く流れの設計)です。

コピーライティング

ここでようやく文章のライティング、コピーライティングに取り掛かっていきます。お客様がコピーライティングの作業までをご依頼される場合は、制作側がライティングを行います。ライティングはお客様の方で対応されるというケースもあります。

心をつかむライティングも大切ですが、SEO対策(検索エンジン最適化)のノウハウに基づき、検索キーワードが適度に含まれるようにする施策も必要になります。

フォーム設計

大抵のコーポレートサイトの場合、サイトからお問い合わせをいただく事をサイト制作の目的としています。

お問い合わせは単純なメール送信ではなく、サイトのお問い合わせフォームや資料請求フォームを使います。お名前とメールアドレス、お問い合わせ内容を打ち込む欄、そして送信するための必須項目はどれにするかなど、フォーム内容を考えるのがフォーム設計です。

その他必要なものの準備(ロゴデータ・サーバー契約・ドメイン取得)

サーバーはWebサイトデータを置くところ。ドメインはvastill.co.jpなどのサイトのアドレスです。この2つを繋げて初めてウェブブラウザからサイトにアクセス出来るようになります。

レンタルサーバーの種類を知ることもちろんのこと、サーバーのコントロールパネルなども操作できなければなりません。初めてWebサイトを作られるお客様の場合、ドメイン名の提案も必要になるケースがあります。

Web制作には、レンタルサーバーとドメイン周りの知識も必要となります。

いざ制作のプロセスへ!

家を建てるプロセスで重要なのはやはり設計ですよね。設計図がなかったら何を作っていいかわかりません!これで設計図が完成したので、いざ制作(家の建築)に取り掛かっていきます。

Webサイトの制作フェーズはまた大きなくくりとなりますので次の記事にて解説していきます。

制作の後は保守運用フェーズ。その後はWeb制作者・Webデザイナーはどんなツールやアプリを、どんなシチュエーションで使うのか?という「使うツールやアプリ」についても解説したいと思っています。

つづく

Webデザイナー(制作者)のお仕事紹介シリーズ

企画と設計←本記事
  • ヒアリングとプランニング
  • 提案
  • サイト設計
  • コンテンツ設計
  • ワイヤフレーム設計
  • コピーライティング
  • フォーム設計
  • その他準備
制作
  • デザイン制作
  • コーディング
  • WordPressテーマ化
  • サーバー側の作業
  • サイト公開

制作プロセスについてはこちら

保守運用
  • 保守管理
  • ブログ執筆
  • ソーシャルメディアの活用
  • サイト修正
使うツール/アプリ
  • ウェブブラウザ
  • 書類アプリ
  • クラウド共有ツール
  • デザインツール
  • 画像処理アプリ
  • テキストエディタ
  • FTPアプリ
  • コマンドラインツール
Total
0
Shares
Share 0
Tweet 0
Pin it 0
Related Topics
  • Webデザイナー(制作者)のお仕事紹介シリーズ
平山翔樹

東京生まれ。ロサンゼルス育ち。Webテクノロジー、自己探求と音楽をこよなく愛する1989年生。Webデザイナー/SE/フロントエンド開発/写真家 バスティル株式会社 代表取締役

Previous Article
  • 代表ブログ

地を這うよう道を進む

  • 2020年9月28日
  • 平山翔樹
View Post
Next Article
  • 代表ブログ

2年前の今日死んだ

  • 2020年9月29日
  • 平山翔樹
View Post
You May Also Like
View Post
  • Web制作

最強のWeb制作者になるために知っておきたいWeb技術と知識

  • 平山翔樹
  • 2020年11月17日
View Post
  • Web制作

ホームページって無料で大丈夫なの?プロ推薦の無料サイト作成サービスとは?

  • 平山翔樹
  • 2020年10月8日
View Post
  • Web制作

Webデザイナーのお仕事紹介【制作プロセス編】

  • 平山翔樹
  • 2020年10月2日
View Post
  • Web制作

Webサイト構成を考える方法とサイトマップ案サンプル

  • 平山翔樹
  • 2020年2月15日
View Post
  • Web制作

ターゲット分析 Web戦略におけるターゲット層を掘り下げる【Web戦略策定シリーズ Vol.3】

  • 平山翔樹
  • 2019年7月12日
View Post
  • Web制作

ゴール設定 Web戦略における目標を決める【Web戦略策定シリーズ Vol.2】

  • 平山翔樹
  • 2019年7月2日
View Post
  • Web制作

Web戦略とは一体何で、なぜWeb戦略を策定すべきか。【Web戦略策定シリーズ Vol.1: 全貌】

  • 平山翔樹
  • 2019年6月27日
2 comments
  1. ピンバック: Webデザイナーのお仕事紹介【制作プロセスと保守運用編】 • Breakthrough
  2. ピンバック: Webデザイナーのお仕事紹介【制作プロセス編】 • Breakthrough

コメントを残す コメントをキャンセル

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

Vastill
  • 会社概要
  • 制作実績
  • 代表プロフィール
  • お問い合わせ
  • プライバシーポリシー
バスティル株式会社はデジタルクリエイティブエージェンシーです。

Input your search keywords and press Enter.