こんにちは、最近ナマモノの日持ちが心配なBITA編集部のやな☆ぎさわです。
僕自身、Webディレクターという職を日々学んでいる真っ最中の身で、まだまだ何も分からない事が多すぎなのですが、今回はディレクターなら知っておいてほしいワイヤーフレームの極意！的なことをご紹介します。
※内容の監修を日本ディレクション協会会長（ていうかBITAのCMO）の中村さんにみていただいております！
01：コンテンツと重要度の洗い出し
まずは、各種コンテンツおよびその重要度を「細か！」て言いたくなるくらい明確に洗い出します。（中村さんはこれだけでA4ノート5枚びっしり！な手書き資料を作るのだとか…。引くわ。）
サイトの中で、あるいはページの中で、または該当するエリアの中で何が一番大切なのかをとにかく分かりやすくし、そこに順位を付けてあげること。
これができていれば、コンテンツの方向性やデザインのテイストなんかも見えてくるらしいです。
不要な要素のカット
改めてコンテンツを洗い出してみると類似のページなど「これ？必要じゃないっしょっ？」てのがちょいちょい出てきます。そんな時に「まぁでも今のサイトにあるから残して…」で進むのはNG。
なので、コンテンツリストから「いらないと思ったもの」は削除しましょう。
02：とにかく手書きで設置
コンテンツの洗い出しが完了したら、後はそれを設置していくだけ。らしいです。
設置するだけって言われても「？」ってなりますよね。僕も混乱しました。
が、割と「主観的に考えちゃってイイ」らしく、自分がそのページを見たら「どこから見ていくかなー？ 何を考えるかなー？」ていうのをユーザーになった気分で考えればいいそうです。
もちろん、この時点で不要なコンテンツがちゃんと整理されているってのが前提になりますが、それが完了していれば割と配置自体はパターン数が限られているためなんとかなるのだとか。
本当になんとかなるって騙された気持ちでトライトライですな。
03：コンバージョンを意識して配置を行う
あらゆるWebサイトには何かしらの収益なりを生む目的が発生するはずです。そうなれば単純にコンバージョンを上げることがメインになるはず！
なので、それをちゃんと考えてレイアウトしなければいけません。
要するにむやみやたら設置せず、ユーザーの欲が出てくるであろう所に何かしらのアクションを起こせるパーツを置きましょってことです。
例えば申し込みフォームへの動線であったり、SNSボタンであったり、あるいはカートに入れるみたいなボタンであったり…。と、はじめの段階でしっかり考えておかなければいけない部分なので抜けのないよう要注意ですね。
04：サイトデザインを意識して作る
当たり前ですが、ワイヤーは要素を設置して完成ではないのです。
ワイヤーからデザイナーに依頼して、最終的に素敵なデザインに仕上げてもらうのが基本的なのですが。
- ただ「〇〇が入ります」って書かれたBOXが置いてあるだけ
- 全ての文言が「テキストが入ります」とかだけしか書いてない
- 大事なラベルまで「フォームボタン」とかだけしか書いてない
というのはダメダメ！です。
僕は、その辺はデザイナーさんがやるほうがいいのかなー？なんて勝手に思っていたんですが、デザイナーさんに聞くとそんなこと無いらしいんですよね。
個人差はあるとは思いますが、やっぱりラベルやテキストまである程度、作りこまれたワイヤーを見ると、それをどうデザインしてやろうか！となって、作り手側もテンション上がるらしいんです。
それに、ワイヤーの段階である程度デザインが見えていない状態だと、デザインが出来てから修正→確認→修正…みたいなことに陥りやすい。それでは凄腕のデザイナーさんでも「疲れちゃう」。
完成度の高い「デザインを意識したワイヤー」は、これを無くすことができるらしいのです。デザインの観点も勉強せねば…。
まとめ：なんとなく綺麗なワイヤーに価値はない
「なんとなく格好いいサイトの真似」とか、「ここにこれがあったら格好いい感じがしたから」みたいな思い込みで書いたワイヤーは、マジで意味が無いです。
それやって怒られたので…。大切なのは！
- クライアントが一番言いたいことは何か？
- ユーザーに対してどうしてほしいのか？
この部分がワイヤーというレイアウトオンリーの資料にちゃんと組み込まれていなければ、デザインだってどっかスッポ抜けたものになってしまいますし、それを理由にデザイナーに文句を言うとガチで嫌われます。
「何を基準に考えればいいのか？ どこから手をつけていいのか？」について悩んでいる方やまだまだワイヤー作成に自信がないーって方に今回の内容を参考にしていただければ嬉しいーって思います。
既に完成しちゃったワイヤーの見直しにでも今回の考えを照らし合わせてみてください。
生意気なこと言ったオレ！もっと頑張ろうっと！
