ディレクターがワイヤーを書く直前にやるべき超細かい事あれこれ

ども。ナカムラです。

今回はいつもの「やたら上位に食い込みたがるディレクターズマニュアルの記事」と比べるとかなり粒度細かめ。

実際の現場でディレクターがワイヤーを書くその前に「やらなければいけないこと」とその理由について解説してみたいと思います。

ちなみに、お題は「既存コンテンツありのリニューアル with Word Press 案件」と仮定してみます。

さて、ワイヤー書く前にディレクターって何やればいいんでしょうね?

とりあえずサーバー周りの情報整理

WordPressに限らず、どんな案件でもまぁ必須。なんかしらCMSを乗せる場合であれば間違いなく事前に確認しておかないと大怪我するアレですね。

とりあえずLAMP動くかどうか?とセキュリティ系の情報くらいは整理しときます。

この辺の情報は1枚のドキュメントにまとめといたほうが後で楽かもですね。

既存のページ調査

リニューアルであれば、まずは「今あるコンテンツはなんぞ?」というところから始めるわけですが、まさか全ページの全要素をいちいち抜き出して考える訳にも行きません。

というわけで、ザックリ簡単なタスクに分解してみます。

  • レイアウトパターン洗い出し
  • コンテンツのスタイルパターン確認
  • サイト内のページ構造把握
  • 他サイトの見せ方調査 検討

うん。大体こんなもんかな?

それぞれに関して手書き or 超簡素なパワポワイヤーでも作っておくと話が早いかもしれません。

スコープ(制作物)の再確認

で、「なるほどこういう要素をもったこんなサイトなのね」というのが把握できたら、今度は「で、何作るんだっけ?」というとこまで一旦頭を戻します。

ここで洗い出すのは以下のような項目

  • 画面設計数
  • パーツ(コンポーネント)数とパターン数出し
  • モック作成ページ数確認
  • 新設画像
  • 新規機能、プラグイン
  • フロント制御系(JSなど)

既存コンテンツに存在しないもの(画像とかスタイルとか機能とか)をいくつも作っていくことになるハズなので、「まぁこれは作らないとだよねー」というモノや部分をしっかり書き出しておく感じです。

※ここで予算的に無理くせーなーってものを省いていくのも大事大事。

ページ構造考案

何を作るのか?どこまでやれるのか?

以上が決まると、ようやく「サイト全体の構造」を決めることができる段階になります。ワイヤーまでもうちょっとですね。

ここで確認しておきたいのは、以下のような要件。

  • 案件上での重要度確認
  • WordPress上での記事 / ページ制御
  • 検索対象箇所
  • カテゴリ・タグの扱いどーする?

まぁCMSが絡む絡まないに限らず、当たり前に確認しておかないとコケちゃう大事なとこですね。

結局、「更新できるようにしといてくれ!」→「あいよ!」では何も始まらんのですよ。

各ページのレイアウト考案

で、何をどんな構成に載せていくのか?が決まったらようやく「どうレイアウトするのか?」を考えるようにします。

ここまで来るとやることはかなりシンプル。以下の通りです。

  • 乗せる要素と機能を優先度順に整列
  • 競合を参考にしたりしながら挙動をサッと決めていく

失敗するワイヤーって大抵ここから考えちゃって、「あれ?あの要素どーすんだよ!どこ載せんだよ!」みたいなことになってたりします。

なので、ちょっと我慢が必要ですがこのフェーズまであんまり個別画面のレイアウトについては考えないようにするとスムーズなんです。

ちなみに手順でいうと、この後ようやくパワポとかエクセル、カクーとか使って本チャンのワイヤーフレームをデータで作っていくって感じっすね。(この時点ではまだ手書き)

ディレクションスキルを共通の知識としていくために

上記で触れられているようなガチ現場の手順みたいなやつは、実はこれまであんまり共有されてきませんでした。

出来る人が勝手にやって、そのやり方を「見よう見まね」で学ぶか、または「怪我をしながら身体に叩っこむ」しかなかったんですよ。

なので、今回は僕にとってのディレクションの師匠にあたる「webデザインのタネ」の sivacchi に手伝ってもらいながら、ちょいとドキュメント化してみました。

アタマの中で当たり前にやってしまっている熟練ディレクターさんはその確認用に。

まだまだ案件ごとに「何からどうしよう?」状態の方は手順の教則に。

ぜひぜひ参考にしてみていただければと思います。

違う会社のディレクターがワイヤー前に何考えてるか気にならない?

はい。というわけで恒例の「唐突だけどなんか妙に納得感のあるイベント告知」です。

隣の会社のディレクターがどう考えてるのか、一緒に考えて勝負して見てみないかい?というイベント、ディレクソンの第5弾が開催されますので、ぜひにぜひにー。(ナカムラも当然行きます)

ディレクターのための設計&プレゼンイベント「Webディレクソン」vol.5

社外のWebディレクター同士がひとつの案件を話し合い、一緒にプレゼンまでもっていく。というかなり豪快なディレ協の名物イベント。初心者大歓迎です!(全力)

日時10月18日(土)10:00~19:00(開場09:40)
料金1,500円(懇親会費別)
会場株式会社メンバーズ ラウンジスペース東京都中央区晴海1-8-10 トリトンスクエアオフィスタワーX 37F
主催日本ディレクション協会

イベントを詳しく見る