経験デザインとエスノグラフィを語る私的なブログ
<< UX大阪 #01-Vol.2 ブートキャンプ | TOP | 3ちゃん屋(大阪中津) >>
DMM.com 社内研修#09 ワイヤーフレームの作成
DSC01324.JPG
 10月14日(火)の夜、恵比寿ガーデンプレィス。
DSC01327.JPG
 今日は台風一過、とても良い天気。
02.jpg
 社内研修も後半戦に入り、サービスを一つ仕上げるところまで来た。
DSC01329.JPG
 前回までも構造化シナリオを持ち寄って、ワイヤーフレームまで落とすのが本日の授業。
DSC01331.JPG
 インタラクションシナリオからワイヤーフレームに描きかえるのだが。
 シナリオの粒度が荒いと、もう一度考えなくてはならなくなる。
DSC01344.JPG
 そういう事態を防ぐためには、インタラクションシナリオを書く前にラフなフロー図を描くのがコツ。
DSC01332.JPG
 このチームは、きちんと設計してますね。
01.jpg
 では次は、大きな紙にしっかりワイヤーフレームを描いてみよう。
DSC01335.JPG
 ラフなフロー図では情報を設計し、大きなワイヤーフレームでは画面を設計する感じだ。
DSC01337.JPG
 さあ、時間が無いのでどんどん進めよう。
03.jpg
 出来上がった大きなサイズのワイヤーフレームは、次回のアクティングアウトでオズの魔法使いとして使う予定。
 ユーザーのアクティビティ(活動)を演じる人達の後ろで、その段階ごとのインタラクション(操作)を示して、オーディエンスからの評価を受ける訳だ。
DSC01345.JPG
 アクティングアウトの次は、もう少し小さな紙に更に精緻化された画面設計が描かれ、ストーリーボーディングと言うプロトタイピング(評価)を行う。
DSC01342.JPG
 ペーパープロトタイピングは、そのように徐々に粒度を上げながら様々なやり方で形成的評価を繰り返し精緻化を行うのである。
DSC01346.JPG
 このレベルでの大きめのワイヤーフレームは、オーディエンスからの評価が受け易いようにシンプル目のUIを、太いはっきりした線で作成しよう。
 次回は、アクティングアウトとオズの魔法使いである。

◇DMM.com 2014年度東京社内研修アーカイブ
10月28日#10:アクティングアウトとオズの魔法使い
11月11日#11:ストーリーボーディング

◇DMM.com 金沢社内研修アーカイブ
2013年09月22日:ユーザー評価
2014年10月04日:#04構造化シナリオ法
2014年11月08日:#05ペーパープロトタイピング
posted by アサノ | 06:04 | 企業研修(守秘義務アリ) | comments(0) | trackbacks(0) |
コメント
コメントする










この記事のトラックバックURL
トラックバック機能は終了しました。
トラックバック
Search this site