私のWEBディレクター作業と仕事内容と【WEB求人情報!】

「WEBディレクターってどんな仕事をするの?」

これ、私がはじめてプロジェクトを任せてもらって感じた疑問でした。

実際にWEBディレクターになりたかったり、仕事で任される事になっても「何からやり始めればいいの?」がわからないと時間だけ使ってしまいます。

時間の無駄

そこで今回の記事では、私がウェブスターマーケティングで実際に行っているWEBディレクターの仕事・作業内容について記事にしてみました!

私自身、まだまだディレクターとしては駆け出しですが、これからWEBディレクターになる方の参考になれば嬉しいです^^

もし記事を読んで「これは違うんじゃね?」「もっといい方法あるよ!」という先輩ディレクターがいましたらコメントください!

最後に弊社ウェブスターマーケティングでおこなっている求人情報もご案内しているので、最後まで読んでもらえると嬉しいです!

この記事が「いいね!」と思ったらシェア・応援のはてブよろしくお願いします。

そもそもWEBディレクターとは?

まずWEBディレクターの仕事について、定義するのであれば「プロジェクトをゴールに導くための場を作り成果物の進行を管理する仕事」と私は思っています。

社内で企画をおこなってからプロジェクトを立ち上げ、成果物(弊社であればサイト)を完成させるためにチームの管理・制作物の完成を予想していきながらゴールに向かうようなイメージです。

そのために私が現在おこなっている実際の作業は下記の7つのステップです。

私のWEBディレクターの仕事

WEBディレクターの仕事全体イメージ

WEBディレクターの仕事

企画・立案・タスクの割り出し・コンテンツ設計
ワイヤーフレーム作成・デザイン確認・コンテンツ管理・SEO施策

ステップ数はあくまで私の場合で、もっと多い人も少ない人もいると思いますが、基本的には流れにそって作業と進捗管理をおこなっています。

まずはWEBディレクターの仕事の全体像をご紹介したところで、次からは実際に各ステップでどんな作業やディレクションをしているのか解説していきます!

企画・立案

企画・立案のイメージ
プロジェクトをスタートする前におこなうのが企画と立案です。

普通のウェブ制作会社ではクライアントの方と話し合い重ねていきながら…

  • サイト全体の将来的なビジョンとゴールを描きプロジェクトメンバーと共有する
  • どんなサイト構成にするのか?(サイトの全体設計)
  • どんなコンテンツ内容にするのか?
  • 各コンテンツのゴールはどこに設定するのか?
を相談しながら決めていくステップですが、弊社の場合は自分たちがクライアントでもあり、製作者でもあるのでとにかくゼロイチの仕事がほとんどです。

なので特に上記4つの要素のうち、核となる最初の部分が重要となります。

企画・立案で特に重要な事
  • メディアのビジョンとゴールを描きプロジェクトメンバーと共有する
  • どんなサイト構成にするのか?(サイトの全体設計)
そのあたりのことも含め、全員で社内ミーティングを重ねながら企画をおこなっていきます。

ここで出たアイデアや確定した内容はマインドマップにまとめておいて、次のステップのコンテンツ設計をおこなう際に使用できるようにしています。

ウェブスターマーケティングの場合のゴール設定は、質の高いコンテンツを世に出し・SEO施策をおこない上位表示して収益化がゴールになります!

実際に企画で描いたマインドマップ

企画で描いたマインドマップ
ブログ記事のイメージが分かりやすいように項目を折りたたんでいますが、弊社ではこの段階で各コンテンツ案も考えています。

コンテンツ設計

コンテンツ設計のイメージ
企画で出たアイデアを元にして、実際のサイトにするためにコンテンツ設計をおこなうステップです。

この作業ステップではWEBディレクターとしてサイトに入れるべきコンテンツ内容の設計はもちろん、SEOディレクターとしてSEOを意識しながらコンテンツ設計をしています。

設計時に意識してる事
  • ページ内での記事の序列は?
  • サイトでの内部リンク構造は?
  • ユーザーを回遊させるための内部構造?
  • CV(コンバージョン)はどこでさせる?
  • ソーシャル拡散できるコンテンツはどこ?
  • どこに外部リンクが集まりやすそう?
  • サイト内機能はどこに必要?
こんな感じで自分に質問をしながらサイトコンテンツの設計とSEOの設計をおこなっています。

この時、私はマインドマップよりも、前回の記事でご紹介したcacooでコンテンツ設計をおこなっています。

ただツールについては使いやすいものはWEBディレクターによって違うので参考程度で大丈夫です!

…みなさんどんな方法でどんなツールを使っていますか?

よかったら教えてください!

cacooで作成したサイト設計図

cacooで作成したサイト設計図
実際にいま弊社で作成しているサイト用の設計図が上記のものになります。

サイト内での遷移やリンクの方向を設計図にいれていますが、WEBディレクターによってここの部分は変わってくるのかと思います。

ちなみに私の場合は、ここで次のステップをおこなう時の参考として、作業をどういったフェーズ分けをするのかを考えて色分けをおこなっています。

タスクの割り出し

タスク割りのイメージ
コンテンツ設計が完了したら、次にタスクの割り出しをおこないます。

ここで、前のステップで設計したコンテンツを項目毎にまとめ作業ベースまで落とし込んでいきます。

タスク出しの時考える事
  • どのような作業内容があるのか?
  • 誰を担当者にするのか?
  • タスク出しの段階で気になる点は?
  • 期間はどのぐらいの見積もりか?
タスクを出す時も上記のような形で自問自答しながらタスク出しをおこなっています。

この時、WEBディレクターとして初めて作業する人にアドバイス(そんな大それたことではない)をすると、タスク出しをおこなう時は時間を掛けてより細かいタスクまで出した方がいいです。

タスクをまとめたExcel

タスクをまとめたExcel
上記のExcelのように、1つの項目に対して作業がどのぐらい別れてるかを考えだしておくと、あとで「あれ思ってたより工数が掛かる!」って事になります。

もしタスク出しをおこなう中で「この作業はどんな作業が含まれるんだろう?」と疑問に思った時は、その作業を担当してくれるデザイナーやコーダーにすぐ聞くようにしましょう!

吉田の失敗談
この「担当者に聞く」を私は始め忘れていて、あとあとになって「なに?こんな作業がいっぱいあるの!?」と人知れずテンパった思い出があります。

くれぐれも分からない時はGoogle先生ではなく、担当してくれる「人」に聞いてくださいね^^

ワイヤーフレーム作成

ワイヤーフレーム作成イメージ
サイトの企画・設計が完了したら、次にサイトをどういった見た目にしていくのかを決めるためワイヤーフレームを作成していきます。

ワイヤーフレームについては、他のWEBディレクターがどういう風にしているかわからないですが、私の場合は自分がやりやすい方法でと思い、手描きでラフのワイヤーフレームを書いて、固まったらcacooを使ってデータにしていく流れで作成しています。

ワイヤーフレーム作成で考える事
  • ページ毎に持たせる要素・持たせない要素を洗いだす
  • ページの割り振りをして必要なワイヤーフレーム数を考える
  • 画像の配置やコンテンツ領域はどう見せるか?
  • 機能を入れ込んだ時に必要な要素は何?
  • SEO的に内部リンクはどこで結ぶか?
    ※dofollowとnofollowなども決められればベスト!

手描きのワイヤーフレーム

手描きのワイヤーフレーム
手描きでワイヤーフレームを作成する場合には、私が不器用なのかもしれないですが方眼紙(ほうがんし)を使うとキレイに書くことができます!

cacooで作成したワイヤーフレーム

cacooで作成したワイヤーフレーム

実際に現在作成中のサイトで作成したワイヤーフレームなのでモザイク処理をしていますが、実際にサイトとして完成した時に、どういった見た目・コンテンツ・SEO要素を入れていくのかを図にしていきます。

ワンポイント
ワイヤーフレームはサイト構築していくうえで重要なステップになります。ここでディレクターがズレた考えのままワイヤーを作成してしまうとデザインやコーディングにも影響が出て、最終的なゴールと違う方向に進んでしまう可能性があります。

自分の考えをまとめながら、チームメンバー・クライアントにこまめな確認をするようにしましょう!

デザイン

デザインのイメージ
完成したワイヤーフレームを元にデザインをしていくステップです。私の場合はデザインセンスやスキルがないので、デザイナーさんに作業してもらっています。

いくら完璧に作ったワイヤーフレームでも、デザインにしてみるとない方がよかったり、逆にあった方がいい要素が出てくる事がしばしば出てきます。

ここはサイト構築をおこなう場合、方向性を固めておかないと後が大変になるのでじっくりと相談しながら進めていきます。

それでも、どうしても考えがやコンテンツ公開後の予想ができない場合には、A案B案という形で公開後にABテストできるようにしておきましょう!

デザインで気をつける事
  • デザイナーとはこまめに相談をする
  • WEBディレクター・デザイナーで意見が別れたらチームで確認
  • 変更が決まった部分は必ずワイヤーにも反映
  • 公開後の反応が見えない部分はABテスト用にデザイン依頼
    ※先に決めておくとコーダー&SEが楽になります^^
デザインはWEBディレクター業務のなかでも、自分が作成したワイヤーフレームをデザイナーがキレイな見た目にしてくれるので、言い知れぬ充実感を感じる事があります!

サイトデザイン確定したら、次にコーディングを依頼します。

デザインしてもらったワイヤー

弊社の場合、サイトの表面のコーディングと自社システムを使用する場合には管理画面のコーディングも依頼します。

ワンポイント
コーディングについては私も今、まさに勉強真っ最中です^^;

なぜ?というとWEBディレクターであっても、ある程度知識がないと実際にどういった作業をしてもらってるのか把握できなくなって、後々お互いの手間を増やす羽目になるとコーダーさんに教えてもらったからです。

「常識でしょ!」という人もいるかも知れないですが、これからWEBディレクターになる人は、他の作業の合間に勉強する事をおすすめします!

コンテンツ作成

コンテンツ作成のイメージ
サイトデザイン・コーディングの依頼をしている間にコンテンツの作成をおこないます。

コンテンツ作成では見た目や読みやすさを意識しつつSEO対策もおこなっていきます。

コンテンツ作成で考える事
  • 検索エンジンに対して狙うキーワードを明示する
  • コンテンツの網羅性もたせ共起語を入れる
  • 検索者の検索意図に対して答えを返すコンテンツ
  • オリジナル要素
  • 画像の配置位置
  • CV(コンバージョン)ポイントの仮定と誘導方法
  • ユーザー導線を意識した構成(SXO)
  • コンテンツ毎の目的を再確認する
この他にもタイトル・ディスクリプション・URL・モバイルフレンドリーなど、SEO面で考える事はありますが、【コンテンツ作成】という作業段階では上記のような事を考えながら作業していきます。

ここで、先に作成したタスク表を確認しながら、自分が作成するコンテンツとライターやブロガーに依頼する記事の振り分けと・依頼内容も一緒に考えると、タスク出しの際には出てこなかったアイデアもでるのでおすすめです^^

SEO(検索エンジン最適化)施策

SEO(検索エンジン最適化)施策のイメージ
サイトが晴れて完成してWEB上に公開したら、ここからがある意味新しいスタートとなるのがSEO施策です。

近年のSEOは”Search Engine Optimization”の言葉どおりに検索エンジンだけを意識した施策では上位表示しづらくなっています。

2013年にGooleが導入したハミングバード、2015年の「RankBrain」の機械学習をベースにした人口知能システムの発表をみても、現在の検索結果は「ユーザー」を意識したコンテンツを求めています。

なので検索エンジンを意識すると同時に、ユーザー体験を意識したSXO(Search Experience Optimization)やUX(User Experience)の向上といった視点も重要です。

弊社ではこういった多角的な視点を入れながらABテストをおこなうSEO施策をおこなっています。

具体的な施策内容については弊社のサイト管理ツール【ALUMINA(アルミナ)】契約者限定の教材でご紹介していますので、ご興味をお持ちいただけた方は、ぜひご覧ください。

→サイト管理のその先へ Alumina[アルミナ] 

私がWEBディレクターに必要と思うスキル

ここまでが私がWEBディレクターとしておこなっている仕事と作業内容をご紹介したうえで、WEBディレクターに必要だと思ったスキルを上げていきます。

スキルのイメージ

コミュニケーション能力

ディレクション業務では、自分だけではなくデザイナー・コーダー・SE(システムエンジニア)・ライターといった様々な人と協力しながらプロジェクトを進めていくので必須のスキルです。

ちょっとした事でもコミュニケーションを取ると自分では考えてなかった改善点・改善案を教えてもらう事ができます。すべてではないですが、その中から取捨選択をする事で最終的な成果物がより良くなると同時に、チームの方向性がブレずにプロジェクトを円滑に進める事ができます。

情報収集スキル

WEBディレクター職に限らず、WEB業界は日進月歩で新しい技術がうまれているので、分からないことや気になる事を起点にして、常に新しい情報はないか?のアンテナを張るようにしています。

特にSEO周りはGoogleアップデートが頻繁にあるので、こまめな情報収集から検証までのスピードが重要です。

見つけた事は、自分で一度咀嚼して、実践で効果があったものは社内で共有するよういしましょう。インプットとアウトプットが短期間でできるので頭の整理と社内のスキルアップになると思います!

正直、まだ未経験からディレクターとしての仕事を始めて4ヵ月と少しなので、まだまだ勉強・スキル不足なところがあると感じるし「ディレクション経験の人と一緒に働きたいな~、話したいな~」とか思うこともあります。

ただ、わからない事を勉強しながらステップアップしていけてる今がすごく楽しいし、それをさせてくれる社長にも感謝しています!

もう1メディア担当しろと言われたら、さすがに厳しいですがw

あくまで今回の記事は、今の私の作業であって、効率を上げる方法はたくさんあると思うので、これからもブラッシュアップできた事があれば、この記事を更新するか、新たに記事にすると思うので、その時はよろしくお願いします!

最後に、このページでご紹介したWEBディレクター職を含めて、現在ウェブスターマーケティングでおこなっている求人情報をご案内します!

代表の吉岡からメッセージもあるので、目を通していただければ幸いです^^

ウェブスターマーケティングのWEB求人情報!

いまウェブスターマーケティングでは一緒に働く仲間を募集しています。

募集している職種は下記になります!

募集職種

  • SEOディレクター
  • WEBディレクター
  • Webデザイナー
  • システムエンジニア
  • 広告運用担当
  • いい条件のWEB系求人が見つからない
  • いまの仕事じゃ満足できない
  • 会社の歯車じゃなく主体性をもって仕事がしたい!
  • 部分ごとの作業からステップアップしたい!
  • 制作だけじゃなくSEOも勉強したい!
  • いまの知識を活かして大規模メディア作ってみたい!
なんて事を、いま頭の隅ででも考えている人は、ぜひ一度ウェブスターマーケティングにご連絡いただき、お話を聞かせてください!

もし記事を読んでいただいて「あいつ、WEB屋の求人探してたなぁ」と心当たりのある人はシェアよろしくお願いします。

弊社の住所や事務所環境についてはこちらの記事でご紹介していますので、どんなところで働くの?と気になったり不安な方は一度目を通してください。

代表の吉岡よりメッセージ

吉岡
ディレクターの吉田が独自の判断で!?求人募集のメッセージを出しておりますが(冗談です!)

弊社では実はこっそりとこちらのページにて求人の募集をしておりました。

弊社ではデザイナーさんもエンジニアさんも、それぞれが専門領域を持ち、それを最大限に活かしながら、ディレクション業務をして頂きます。

また吉田もこの記事内で書いてくれているように、一般的なWeb制作会社と弊社のビジネスモデルの最大の違いは、私達自身がクライアント(制作の依頼者)でもあり、製作者、運営者でもあるという2重3重の側面を持つということです。

なぜなら私達のビジネスモデルが『完全成果報酬型広告を主軸とした広告モデル』を基本としているからです。全くのゼロから全ての企画を考え、自分たちのサイトを構築していきます。

それゆえ、サイトの設計やコンテンツ作成についても非常に自由度が高く、自分たちがやりたいと思ったことは何でも形にできる反面、非常にシビアな結果が求められます。なぜならば成果が発生しないことには1円の売上にもならない世界だからです。

ただ、私自身は学生時代から既に10年以上このビジネスに取り組んできて、結果を出し続けています。

あなたのアイデアやスキル次第では日本を代表するメディアサイトを作ることも可能です。

もし少しでも弊社に興味を持って頂いた方はどしどしご連絡お待ちしております!

ABOUTこの記事をかいた人

ウェブスターマーケティングでWEBディレクターとしてSEOやメディア事業部の企画・制作を担当しています!弊社ならでは情報、私ならでは情報をご提供できるよう毎日アンテナを張り巡らせて精進してまいります^^