top

第5回 インタラクションシナリオ、Directorでのマウス表示の変更

インタラクションシナリオとは

提案する機器とユーザが具体的にどういったやりとりを行なうのかを記述したもの。
   (サービスシナリオをブレークダウン(具体的)にしたもの)
   【サービスシナリオの機器とのやりとりにフォーカスしたもの】
ターゲットユーザが、提案する製品を手にとった瞬間から、その製品を扱うボタン操作1つ1つにおよぶまでの製品とユーザのやり取りを描くもの。

 最終的に提案する製品の完成像(インタフェースの画面全体(操作要素全体))を描きたくなりますが、製品便益(製品を利用した後、ターゲットユーザがどうなるのか?どのような効果を得るのか?)を実現する為に、【ユーザにどういった体験を提供すべきなのか?】という観点で思考を働かせる手法です。なお、ユーザが操作する為にどういった手がかりを提示する必要があるのか?ユーザの操作に対してどういったフィードバックを返すべきか?といったインタラクションの検討も目的となります。
 以上から、 製品全体(製品の完成像)を描くのではなく、【製品とユーザがや対話をする上で最低限必要な、《ハードウエア的ボタン要素》、《アイコン的視角要素》や《ユーザへフィードバックされる何らかの要素をアイコン化した要素》】と【文章】での記述をするのが適切と考えられます。
 さらに、本課題では、未来を想定した提案をもとめます。未来では、人と機械の関係は、どのようになっているでしょうか。電源ボタンはあるのでしょうか。ディスプレイを指でさわる行為はどう変わっているのでしょうか。その時代の最低限の機械操作の知識を定義し、最低限提示すべき操作に係るヒントを明確にするプロセスとしましょう。

インタラクションシナリオに含める要素

 0)製品便益を実現する為にユーザがどういった体験をするのか 
 1)ユーザが提案する製品を利用する際の使い方の手がかり(アフォーダンス)
 2)ユーザが個々の操作を開始する際の手がかり(アフォーダンス)
 3)ユーザが個々の操作を実行した際の反応(フィードバック)
 4)ユーザが個々の操作結果を認知した上での次のプロセスの提示(誘導)
   2)、3)、4)の繰り返し
 5)ユーザのタスク達成(製品の使い終わり)を理解させるフィードバック


ex.1
始めてスマートフォンを手にした60代男性


 スマートフォンにはボタンらしいものが、画面の下の1つのボタンしかなく、それを押してみた。すると、画面に「ロック解除」という表示と、「右向きの矢印(→)」が表示された。子供がスマートフォンを利用しているのを横目に見ていたことがあり、指で画面をなぞることは知っていたので、この矢印を矢印の向きになぞってみると、矢印が動いた。指で画面をなぞる感覚が新鮮であり、ピコピコやってみたうえで、一番右まで動かしてみた。


すると、「パスコードを入力」という文字と「4つの空欄」「テンキー」が表示された。あぁATMと同じだな、パスワードを入力するのだな、と理解できた。4桁のパスワードの入力に関しては、携帯ショップで先ほど決めてきたので、テンキーを押して4桁の番号を入力することにした。一桁押す毎に4つの空欄が●で埋まって行き、最後の4桁目をおした。



ex.2
 2050年、これまでの【大量生産大量消費】、【使い捨て文化】は廃れ、モノの価値が【ユーザが代々引き継ぎ使い続ける】になった時代の【道具を通した過去ユーザとの対話(利用前後の感情の変化を体感する)ツール】
(アナログなツールを含め、ありとあらゆるモノにICチップが埋め込まれている・人間の脳にも、簡易なチップが埋め込まれている時代、が前提。現在のBluetoothのような近距離無線通信規格により、人間がモノを扱っている時に、強い感情の変化が起ると、その感情が扱っている道具のICチップに書き込まれる仕組みが前提)提案するのは、その道具に書き込まれた過去ユーザの感情の変化を体感するツール(ツールのおぼろげなイメージとしては、片腕(手首から肘)に装着するようなモノ...)

 ネット検索で「アウトドア+ストレス解消」のキーワードと15000円の価格設定で購入した道具が届いた。(この時代のモノ購入は、モノの存在の希薄化が進んだ為、目的と金額を提示することで、推奨ツールが郵送されてくるのが一般的になっている)

ーーここまで、サービスシナリオーーーー
ーー以下、インタラクションシナリオーー

 大きな箱を開けてみると、「斧」と「薪」が入っていた。●●ツールを装着した左手で「斧」に手を触れた状態で、手を大きく強く開く動作(読み取り機能の実行)をしてみると、いつものように「チュイーン」という機械的な音がなった。
 2秒ほどすると、5名の男性のを意味するアイコンが使用年代と共に、腕部分に表示された。一番新しいユーザをタッチすると、そのユーザが初めて利用した●年●月●日 ●時●分〜●時●分(計35分間)の尺と、30秒間、1分間、2分間のボタンが表示された。
 30秒間をタッチすると「感情再生」が開始された。まず冒頭では、左腕全体に「深いな印象(じっとりした蒸れた感じ/むず痒い凹凸振動/不快な締付け/不協和音振動)」が広がった。その後5秒位からゆっくりと、「爽快な印象(心地よいリズミカルな振動/冷気と締め付けの解除/爽快なサウンド)」に変化をしていった。
 「なるほど、薪割りでこれまでの過去のユーザは、適度な運動、自然との対話、薪を割るという爽快感を通して、日々の疲れ/ストレスを解消していたんだな、今の自分に適切だな」と「斧」という道具のあり方を再認識するに至った。
 



マウス表示の変更

Common/配布/プロトタイプ2(柿山)/05/mouse_pointer.dir【完成版】
Common/配布/プロトタイプ2(柿山)/05/mouse_pointer_0.dir【練習版】
(↑「指でクリック」コンテンツで解説)

今回のコンテンツでは、いかにリアルな世界の表現をするかがポイントと考えられます。
そういった意味で、マウスポインタではなく、人間の手や身体を動かす(マウスポインタの代わりにする)手法が有効と考えられます。
まずは、パソコン内に準備されている、いろいろなマウスカーソルを利用してみます。


cursor()

マウスカーソルの表示を■に入れた数字に従い変更します。(ヘルプに、数字とカーソルの対応表有り)


プロセス:最初に、このフレームにとどまるようにして、マウスカーソルを変更してみます。

マウスの場所に、画像を追尾させる。

前述のマウスカーソルの変更コマンドによって、マウスカーソルを非表示にします。
かわりに、オリジナルの画像をマウスポインタの座標に追尾させます。

■本日のハンドラ(トリガー)


そのスプライトが表示されたら
(そのフレームに入ったら)
  (フレームスクリプトチャンネル)
  (スプライトチャンネル)

on beginsprite me
 ●コマンド(命令)

end

そのスプライトの表示がなくなったら
(そのフレームから出たら)
  (フレームスクリプトチャンネル)
  (スプライトチャンネル)

on endsprite me
 ●コマンド(命令)

end

 exitFrame と何が違うのか?
    exitFrame はいつも通りの待機状態をつくった際に、
    フレームを出たり入ったりする回数分、実行されますが、
    (fpsが30の場合、1秒間に30回実行される)
    beginsprite は 入った時に1回だけ、endsprite は出る時1回だけ、
    実行されます。      参考:スクリプトの時間の流れ

■本日のコマンド(実際の命令)


  cursor()

●番で定義されたマウスポインタに変更します。
(ヘルプを使ってみましょう。)


  the mouseH

その時の、マウスのX座標値をしめします。


  the mouseV

その時の、マウスのY座標値をしめします。


  set the LocH of sprite to 100

スプライト●番にあるものの画面上でのX座標を、100にします。


  set the LocV of sprite to 200

スプライト●番にあるものの画面上でのY座標を、200にします。


  set the LocH of sprite to the mouseH

スプライト●番にあるものの画面上でのX座標を、現在のマウスの座標にします。


  sound(1).play(member("■"))

キャスト内で■という名前の音声ファイルを、サウンドチャンネル1番でならします。(Director内には、8つのサウンドチャンネルがあります=同時に8つの音声ファイルを再生できます)


 

【参考】ここまでの技術を使うと、ハエたたきゲームがつくれます。

Common/配布/プロトタイプ2(柿山)/05/flyswatter.dir【完成版】
Common/配布/プロトタイプ2(柿山)/05/flyswatter_0.dir【練習版】

次回のプレゼンテーションの仕様に関して

・提案する製品やサービスがユーザに与える影響を
  インタラクションシナリオで記述してください。
分岐型順列型並列型を参考に、
  内容に即した「ページの移動」ができるDirectorファイルを作成してください。
・スライドの中には、「視覚的要素」を含めてもらいますが、この要素に
 マウスアクションによる、何らかの変化を加えてください。

提出先:Common/提出/プロトタイプシミュレーション2(柿山)/06_インタラクションシナリオ/
提出物:学籍番号.dir ファイルを入れて提出
提出〆切:次回(第6回 11/17)の授業開始時刻

  *製品コースの学生さんは、総合実習3にて提出物の詳細を解説します。