schoo（スクー） WEB-campusでは有料会員で授業を受けています。
どうも、Webディレクター１年生ワタナベです。
せっかく学んだことなので自分の知識として定着させたいので学んだことを僕なりの言葉に変えてアウトプットしていきます。
こういうのってパクリだとかで怒られたりしますか？自分の学んだことのアウトプットだから大丈夫ですよね？（ダメだったら指摘してください。。。）
さて
一つの記事がすごく長くなってしまいそうなので何回かにわけて
アウトプットしていこうと思います！
ワイヤーフレームとは？
ワイヤーフレーム (wire frame) とは、3次元コンピュータグラフィックスにおけるレンダリング手法の1つ。3次元オブジェクトを竹ひご細工のような線形状のみで表現する。
はい、こちらで間違っていません。しかし、
「え？Webサイトの骨組みのことじゃないの？」
と思った方もいらっしゃるんじゃないでしょうか？
Wikipediaでは、３Dの骨組みのことを説明しています。少し前まではWebサイトの骨組みのことではなかったんですね。
今は、もちろんWebサイトの骨組みのことをいうことがほとんどです。
というのをschoo（スクー） WEB-campusの授業でしりましたw
Webサイトのワークフローは家づくりと同じ
まずは、どんなサイトにしたいのかを聞き出します。
【家の場合】
- 広いリビングが欲しい
- キッチンは二人でも狭く感じないようにしたい
- リビングは吹き抜け
【サイトの場合】
- TOPページには、笑っている子供たちの写真がいい
- メニューはアイコンで直感的にわかるようにしたい
- 記事には大きめのシェアボタンが欲しい
といったところでしょうか。
こういったことを聞き出すことを「ヒアリング」と言ったりします。
この授業でも、実際のWeb制作の現場でもヒアリングシートというものを使ったりします。
こちらがヒアリングシートの参考になるかと思います↓
まとめ
ワイヤーフレームはWebサイトを制作する一番最初の段階で行うWebサイトの骨組みです。
- PCの前に向かうのではなくまずはどんなサイトにしたいかをお客様とのヒアリングで聞き出していく
- 聞き漏れのないようにヒアリングシートを活用する
といったところです。
企業によっては、お菓子を食べながら行っているところもあるそうです。
理由は、
「さて話するぞ！」というスタンスでやるとうまく聞き出しにくいので
お客様にリラックスしていただきながらヒアリングをするということのようです。
こちらの方がお互い聞きだせるように思います。
僕も自分の会社であればぜひ取り入れてみたいものです。
