未経験からでもWEBエンジニアになれるブログ(さぼり気味)

可能な限り楽して生きていきたい。好きなものだけ食べて痩せたい。控えめに行っても玉の輿乗りたい。ほんとはプライベートブログにしたい。何もしてないのに尊敬されたい。家から出たくない。

webディレクション概論⑥

 

 

明日は新大久保にチーズダッカルビ食べに行って、

 

そのあとプリクラとって、

 

 

ついでに韓国人と付き合いてぇ~~~~~~

 

 

 

イケメン降ってきてくれ~~~~~~~~~

 

 

前回お話しましたが、たぶん今回そこそこ長いと思う

 

 

許して

 

 

 

 

 

 

 

webディレクターの仕事

 

③企画提案書の作成

 

 

webディレクターとクライアントが共通認識として持っておきたいのが、

 

サイトの目的は、要望と提案をマッチさせて最大効果を引き出すこと。

 

しっかりヒアリングで聞き出しておくにも、まずはこの共通認識を確認してから仕事を始めたいものですね。

 

 

 

 

では、この段階では、

webディレクターは、ヒアリング内容とRFPから、企画提案書を作ります。

 

企画提案書ってつまりなんだ?ってことなんですが、

 

内容は一般的にはこんな風になっているといわれています。

 

 

 

 

1、WEBサイト改修の目的

2、WEBサイト改修の方向性

3、サイトマップ

4、コンテンツ内容

5、画面レイアウト

6、スケジュール

7、サーバー環境

8、概算見積もり

 

 

 

 

これらをひとまとめにして「企画提案書」といいます。

 

 

まずサイト改修について。

 

改修したいサイトって、いろいろ理由はあるとは思いますが、

どんなサイトでもやっぱり、集客は望むとおもいます。

 

ここからはデザインの話になってきますが、

 

 

 

5、画面のレイアウト

 

 

この項目、非常に大切。

 

 

 

訪問者の目の動きを解析したり、スムーズに見てもらえるように配置を考えたり、色使いを意識したり。

 

 

 

、、、これはデザイナーが考えることなんですが、

 

 

 

訪問者にどのページを一番に見てもらいたいのか

使いたい色はどんな色なのか

 

 

 

ここを聞き出すのがディレクターの役割です。

 

 

 

デザイナーもライターも、カメラマンもイラストレーターも、みんなクライアントの要望を知っているディレクターの指示ありで動いていくもんだから、本当にディレクターの仕事って大事だなと思います。

 

 

 

 で、このデザインを組むにあたり、エンジニアとディレクターの連携が大切とも言いましたが、

 

 

 

ディレクターとクライアントがデザインする部分も存在します。

 

それは「サイトマップ

 

これ、聞いたことはあるけどあんまり意味わかんない、、、ってひと多そう。

 

私なりの理解ですが、説明していきます。

 

 

 

サイトマップ

 

 

サイトマップには3つの意味があります。

 

①サイトへの道案内

②ユーザーへのサイト内容の提示

検索エンジンへのサイト内容の提示(SEO

 

たぶん、一般ユーザーの方だと、直感的にわかりやすいのは①のサイトへの道案内。

 

webサイト内のページ構成を一覧で簡単に見れるようにしたもの。

 

これをあらかじめ作っておくことで、

 

必要コンテンツの洗い出し、コンテンツのグルーピング、階層の構造を事前に作成できます。

 

そうすると、サイトの作成が格段にしやすくなるんですね。

 

 

さらにサイトマップから派生してもうひとつ、

ディレクターとクライアントで作成するものがあります。

 

 

 

コンセプトダイアグラム

 

 

 

これはユーザーの視点から、サイトのコンセプトを図解しようというものです。

 

ちょっと図解とか言いながら図を用意していないあたりが申し訳なさの極み

 

ひとまず言葉で何とか説明していきます(笑)

 

 

 

 

 

たとえば、お酒の場合を例にとって考えます。

 

 

 

 

1、まず、ユーザーが興味を持つ理由を考える。

そのお酒の特徴や新製品のお知らせ

 

これを第1層に置きましょう。トップページとか。

 

 

 

2、さらに興味を持ったユーザーに向けて

商品のカタログ

 

これを第2層

 

 

 

3、そこで購入意思があるユーザーのために

購入方法、そのお酒が飲める店の情報

 

第3層に置く。

 

 

 4、そして最下層にカート、決済ページを配置する。

 

 

例にはなりますが、簡単に言うとサイトの構成ってこんな風になってるんですね。

 

これを図解したものが、コンセプトダイアグラムと呼ばれるものです。

 

そしてコンセプトダイアグラムをwebサイトに起こしたものが、サイトマップとなります。

 

 

 

エンジニアがサイトを作成する前の段階で、ディレクターも実はデザインしてるってこと、今回初めて知りました。

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

webディレクション概論⑤

 

 

 

身長が高いせいで振られる女の気持ち、知ってる?

 

 

ぜんぜん関係ないけど、訪問者数増やしたくて検索エンジンみたいなのに登録しました。

 

 

もっとみんな遊びきて!!!!わたしもいくからね!!!

 

 

 

さ、続きいくとしましょう。

 

 

 

 

webディレクターの仕事

 

オリエンテーションヒアリング

 

 これは仕事受注の前に、基本的には取引先に訪問し聞き取りをする工程です。

 

 

インバウンドで仕事を受注するときを例として、

自社のHPから仕事の申し込みがくるとします。

 

 

そのとき、ただ「お願いします」だけでなく、

 

依頼者側がRFPとよばれる依頼シートに内容を書き込み、それを先に制作会社へ送付します。

 

RFPとは、Request For Proposalの略で、提案依頼書という意味です。

 

 

まずはこれを依頼者から受け取ります。

 

 

ディレクターがヒアリングを行うのは、このRFPで受け取りきれなかった情報の範囲を聞き取るためです。具体案や、細かいところを、実際に聞きにいきます。

 

 

事前の打ち合わせみたいな感じ。

 

 

ここでオリエンテーションヒアリングをする前にすることが2つ。

 

 

まず一つ目は、

アジェンダ送付(メール送付)

 

 

アジェンダとはもう俗に言うメールらしいんですが、

 

 

オリエンテーションのために企業を訪問するにあたり、

 

会いたい人にアポをとっておいたり、企画、提案をするためにクライアントからの情報、要望を事前に確認しておくためのメールってかんじ。

 

それと同時進行で、

 

マーケティング、競合調査、市場分析、事業把握、現行サイト把握

 

などなど、そのクライアントになる企業の予習も欠かさずしておくのが常識らしい。

 

そして最終的にオリエンテーションヒアリングでの達成目標は、

 

 

信頼関係の構築

 

目的の共有

 

課題の共有

 

 

この3つ。

 

投資する理由は、そこに課題があるから。

 

 

 やば、まじかっこいいこと言ったわ

 

 

 

では、次、③の企画提案書の作成ね、いこうと思ったけどこれ長くなりそうなので次で。

 

 

 

 

 

 

 

webディレクション概論④

 

 

自分の頭皮の天パ生成する部分殺してぇ

 

 

 

 

ピザ用のチーズって言いたかったのに

ピーズ用のチザっていって恥かいた

 

 

もうあのスーパーにはいかない

 

 

 

さて、webディレクターの仕事内容についてざっくり説明したのが前回。

 

 

12工程に分けて番号を振っていましたので、講師の説明があったところを私なりに解釈して書いていきたいと思います。

 

 

 

 

 

webディレクターの仕事の流れ

 

①引き合い獲得、仕事の獲得

 

まずはこれ。

 

HPを作成したい人を獲得する

 

仕事を獲得する

 

 

これしなきゃ何も始まりません。

そのために何をするか?

 

いくつか考えてみます。

 

 

 

ホームページで仕事を取る(インバウンド)

 

ホームページ制作会社が自社のホームページで仕事取れなきゃ意味がありません。

 

まずはインバウンド、最低限の努力。

できれば実績ページを載せるのが良きらしい。

 

 

マッチングサイトを利用する

 

webを作るのが得意な人

webを作って欲しい人

 

両方に利益があるから、それをマッチングさせてあげようというサイトを利用する。

 

たとえば手軽なところで言うと、ココナラ。

 

 

coconala.com

 

 

 

web案件はもちろん、名前考えますとか、コピーライト考えますとか、結構面白い内容の売買が行われています。

 

このサイト、きちんと実績を公開する仕様になってます。賢い。

 

ただやっぱり手軽すぎるかも(笑)

 

近いうちに使ってみようと思います。

 

 

 

 

人脈

 

おもむろに極論出た

 

意外と多いのがこの人脈からの紹介。

 

 

「この企業のサイトいい、私もここで作って欲しい」

 

こういう流れでくる案件ってうれしいですよね~

 

で、その人脈を作るためにお勧めなのが、

 

 

 

 

交流会

 

IT飲み会って知ってます?

 

めっちゃ行ってみたいけどびびって一人でいききらん、誰か一緒いこうや

 

あっでも私まだエンジニアやない

 

 

でも行きたい

 

www.it-nomikai.jp

 

 

まじいきたい

 

ここにも書いてあるとおり、コラボプロジェクトは数知れず

 

こういうところから広がる仕事の世界もあるんですね。

 

 

 

ちなみに

 

飛び込み営業

 

これに関しては、コスパがあんまりよろしくない

 

 

ディレクション費用って、見積もりの中に上乗せになってきます

 

 

そう考えると、あんまりいい顔はされないらしいですね、営業って

 

 

 

 

 

 

 

 

 

webディレクション概論-仕事の内容をざっくりと解説!やりがいのある仕事です。

 

 

 

 

アイコスのヒートスティック折れるのまじ控えめに言ってもムカつく

 

 

あと充電時間長いのもムカつく

 

 

 

 

 

、、、、、、

 

 

 

 

さて、文章量が多いwebディレクション概論

 

今回は実際の仕事の流れを説明していきます。

 

 

本当に、本当にめっちゃ内容多くなりそう。

 

 

このディレクション概論だけで10記事くらいいきそうな勢いあるわ

 

 

末永くお付き合いいただけますと幸いです。

 

 

 

 

 

webディレクターの仕事の流れ

 

 

ここではざっくりと説明します。

ちゃんと解説もしていくのでご心配なく

 

webディレクターが仕事を受注するまでの流れ

 

①引き合いの獲得、仕事の獲得

 

オリエンテーションヒアリング

 

③企画書作成とその提案

 

④要件定義、見積もり

 

⑤プレゼンテーション

 

⑥仕事の受注

 

 

長ぇ

 

 

納品までの流れ

 

 

⑦詳細仕様の決定

 

⑧制作、開発

 

⑨品質管理

 

⑩校正、検収

 

⑪納品

 

 

長ぇ

 

 

 

納品後の流れ

 

 

⑫更新、運用、保守

 

 

クライアントとの付き合いは一生ものといいますが、まさにこのことですね。

 

更新や保守は月額いくらとかで受注するらしい。

 

その話はまた後ほど。

 

 

 

全部で12工程。簡単に説明してもこんなにあります。

 

 

というか受注までこんなに長いのか

 

 

今回は仕事内容の導入みたいな感じですが、

 

 

次から具体的な仕事内容を説明していきますね。

 

 

 

 

webディレクション概論-身に着けるスキルは?どんな働き方するの?

 

 

さて前回の続きなんですが、コーヒー飲みたい。

 

 

 

 

webディレクターに必要なスキル

 

 

webディレクターに必要なものですね。

スキルとか。簡単に。

 

もうたぶんみんなわかってる当たり前のことしか言いません。なんかすいません。

 

まずひとつ、なんだかんだでこれが一番重要。

 

コミュニケーション能力

 

これですね。むしろこれがなかったら他があっても無理なんやないかと思うくらいコミュ力。

 

まずは会話しないと何も始まりません。他社の方と話して仕事をもらってくるわけですし、人一倍のコミュ力があったほうがそりゃもちろんいいですよね。

 

で、その次かなと自分で思ったのが

 

 

ヒアリング力

 

これはただ聞き出すだけでなく、引き出す、汲み取る力も入っています。

 

何をイメージしているのか、何を作りたいのか、

ただ伝えてくれるのを待っているだけでなく、サイト制作のイメージやターゲットなど、うまく聞き出すことが大切。

 

ここで仕事のできるできないが変わってくるらしいよ。

 

 

他にも

 

マネジメント力

 

自社のエンジニアに指示を出すわけです。

 

クライアントからもらってきた案件を、

 

いつまでに仕上げるか

工数はいくつなのか

提示されたイメージはどうなのか

 

こういう風に受注から納品までの流れを管理します。

 

たとえば何かがあってエンジニアが一人抜けたとしたら、

 

そこをどうカバーして納期に間に合わせるか考えるのもディレクターの仕事らしい。

 

 

記録、記憶力

 

メモを取ることは大前提ですが、

 

しかし話しているうちにイメージが少し最初と変わったり、

同じクライアントでも伝え方が違ったりするものですから、

 

さりげなく大切にしていそうな部分を記憶してメモして、

 

時にはこちらの判断で情報の取捨選択をしていくことも大切。

 

 

本当に当たり前体操のことしか言ってないけど、

 

そういうことです。

 

 

 

 

web制作までの一般的な体系

 

前回はweb制作会社に属するディレクターの話をしましたが、

 

もっと具体的に見ておきます。

 

ディレクターの立ち位置や、まとめるエンジニアの種類なんかもざっくり確認できると思います。

 

まずはクライアント。

 

クライアントの企業体系はぶっちゃけわからないんで、適当にします(笑)

 

大体、決済者がいて、その下にweb担当がいるのかしら。

 

で、ディレクターに話を持ってくるのは代理担当者が多いらしい。

 

その後ディレクターに案件が入り、それを会社に持って帰る。

 

会社に持って帰ったとき、ディレクターはデザイナーやそのほかエンジニアに制作を依頼しますよね。

 

 

そのときに一般的にとりまとめるエンジニアがこちら。

 

 

webデザイナー

コーダー

カメラマン

ライター

プランナー

システムエンジニア

イラストレータ

アートディレクター

プログラマー

エディター

SEOコンサルタント

webアナリスト

アカウント

 

 

めっちゃありますよね

 

これだけの仕事内容を簡単に把握し、工数を把握し、期限を設定し、進捗を確認し、さらにクライアントと話を進めていく

 

 

頭の回転の速さと段取りの組み方、肝ですね~~

 

 

なかなか簡単な仕事ではなさそうですが、

 

めちゃめちゃやりがいありそう。

 

 

 

webディレクション概論-ディレクターってそもそも何なのか

 

 

正直一日に何回更新するんこいつって思わん?

 

私もそう思うもん。

 

 

 

さてね、前回は何の脈絡もなくtwitterのアカウントをさらしましたが、

 

どうか友達になってください。お願いします。

 

 

何なら今回も貼ります。マジで。お願いします。

 

とかいいつつ鍵アカなのウケる

 

 

twitter.com

 

 

 

あい、そしたらディレクション、学んでいきますか。

 

 

 

 

 

 

 

 

webディレクターとは何か

 

 

 

さっきから先生がワインの話しかしませんが、とても面白い方です。

マジでワインの話しかせんけど

 

 

 

さて、なかなかね、文字に起こすと難しい話にはなってくるんですけども。

 

 

 

 

一言で言うと、

 

 

 

webデザイナーなど技術職の人と

他企業のクライアントとをつなぐ人

 

 

 

かな~~~~と。

 

フリーランスのデザイナーさんとかだと、この辺は一人でカバーしていくことになるんでしょうね。そりゃもちろんそうですよね、ひとりやもん。

 

 

 

デザイナーやエンジニアあがりのディレクターももちろん多いですが、

普通に突然ディレクターになる人も多いらしい。

 

 

 

私が思うに、このディレクター自体は技術職ではない気がする。

 

 

 

で、

 

 

 

このwebディレクター、ざっくり2種類いるらしい。

 

web製作会社に属するディレクター

 

と、

 

発注元に属するディレクター

 

 

この二種類、違いを簡単に説明していきましょう。

 

 

 

web制作会社に属するディレクター

 

こっちはデザイナーやカメラマンなど、そのほかエンジニアをまとめる係りの人って印象でした。

 

 

具体的には、

 

 

クライアントが制作会社のディレクターに要望を出す。

 

そこで制作会社のディレクターが、自分の会社のデザイナーに依頼する。

 

デザイナーから制作物(成果)が返ってきたところで、

 

それをクライアントのもとへ持っていき、企画提案する。

 

 

ここでディレクターと話し合い、

 

新規製作、既存HPのリニューアル、運用などを行います。

 

 

 発注元に属するディレクター

 

発注元とは、デザイナー目線から見た発注元って意味なんですけど、要するにクライアント側にいるディレクター。

他社のディレクターさんと話したりとかする人です。

 

この場合は、

 

クライアントの偉い人(?)が、自分の会社のディレクターと会議なり何なりして、

 

そのディレクターが、制作会社のデザイナーに依頼します。

 

制作会社から成果物が納品された場合、

 

それを偉い人(?)に、報告します。

 

こっちのディレクターについてはあいまいすぎてなんか申し訳ない

 

 

 

そしたらこの2種類を踏まえたうえで、ディレクターに必要なスキルについて、次回より書いていきます。

 

 

 

 

 

まじコーヒーのみたい

webディレクション概論予告編

 

こんにちは。

最近一言がおもんないでしょ?私もそう思うもん。

 

そういえば、白猫プロジェクトにはまりました。誰かやってない?相互フォローしない?え?しようや???

 

あとなんとなくtwitterのアカウントも乗せておきますね。鍵アカなんですけどね。→@BB_loathe

 

twitter.com

 

 

 

さて、前回のカラーコーディネートから続きまして、しばらくは座学でございます。

 

少し前にした、webマーケティングの続きって思ってもらえると好きかも知れない。

 

 

webディレクターの話。

ここから数回は、

 

webディレクターとは何か?

 

みたいな話をします。

 

正直私もあんまりわかってないですし、私は現在フロントエンドエンジニアを目指しているところですのですが、

 

関係ないかといえばそうでもないみたい

 

ちなみに次回よりwebディレクション概論を数回書きますが、

 

 

その後はweb解析についてがしばらく続きますので、お楽しみに。