ワイヤーフレーム

どこに何がどう入るかが作業チームで共有できるように
なってれば　ワイヤーフレームは手書きでもツールでもよし。

ワイヤーフレームを作る前に
１）ユーザーが欲しい情報を示す（欲しい情報とは何かを突き止めて表示する）
２）よそのサイトをしっかり見る。先行事例をよく観察したり考察する（電話番号がしたの方はなぜかとか（店主によっては営業中に電話が鳴ったりするのが困るので下に配置希望されることがあるとか、営業時間は上に書くとか）
３）既存のテンプレートを使うかどうか（wordpress、CSSフレームワークなど）。使わずに一からコードで作成する場合はレスポンシブ対応するのか、完全振り分け（タブレットだけのとか）対応にするのか、などを決める。
パソコンだったら縦書き文字になるよ、スマホだったらタイトルが横書きになるよ、とかをワイヤーフレームの段階で決めておく。

路面にお店があるカフェとかは、アクセス解析するとスマホユーザーが多い。

レスポンシブ対応の数だけ　ワイヤーフレームを作る。（スマホ、PC、タブレットetc）

写真素材などは　ワイヤーフレームを作ってる段階で集め始める。

スマホはiphone5（640x1136px）の大きさで作ることが多い。

ワイヤーフレームはモノクロで大体作る。illustratorで作っても、photoshopで作ってもどっちでもよし。　
その場合、テキストでどこに何がくるのか記入する。（メイン画像、店舗情報、地図、などなど）。