第5週 ユーザーフロー・構造

第5週

こんにちは、TAの平子です。

第5回の授業では各グループ以下の内容を行いました。

■「MTIのwebデザイン」のグループ（以下グループAと略します。）では以下の内容です。

・各グループ「方向性」、「コンセプト」について発表（発表内容については先週の課題参照）

・ユーザーフローの作成

・web構造の作成

・webレイアウトの作成

■「CITのサービスデザイン」のグループ（以下グループBと略します。）では以下の内容です。

・各グループ「方向性」、「コンセプト」について発表（発表内容については先週の課題参照）

・ユーザーフローの作成

・サービス構造の作成

・サービスアウトラインの作成

【グループA、Bの作業内容】

■「方向性」、「コンセプト」の発表

先週の宿題であった「方向性」と「コンセプト」について発表していただきました。

－ 方向性の詳細は以下の通りです。

・人の方向性

・モノの方向性

・ビジネスの方向性

－ コンセプトについては以下の通りです。

・テーマとリードコピー

・キーイメージ

・コンセプトの説明

・コンセプトイメージ

各グループ緊張しながら発表していました。

みんなちゃんとバリューシナリオなどを作成していて凄い！

特によかったのが、このMTIグループの発表です。

方向性についてしっかり考えられています。

また、リードコピーが「楽しくアプリを探す」、

キーイメージが「宝箱を探すよう画像」大変わかりやすかったです。

ちゃんと相手に伝わるプレゼンテーションは聞いていて楽しいです！

【グループAの作業内容】

■ユーザーフローの作成

各個人でデザインする着眼点を決めて、どのようにwebを見ていくのかを視覚化していきました。

■web構造の作成

・コンテンツリスト

コンセプトに沿ってどのような内容が必要になってくるのかリスト化していきました。

・サイト構造

リスト化したコンテンツをもとにどのような流れだと見やすいのかwebの構造を考えました。

・ワイヤーフレーム

各個人で提案するWebサイトのページ内で何をどこにどのような内容を入れていくのか考えていきました。

■webレイアウト

ワイヤーフレームをもとに具体的にどのようなレイアウトがユーザに使いやすく魅力的なのか考えました。

【グループBの作業内容】

■ユーザーフローの作成

各個人でデザインする着眼点を決めて、どのように購買、食堂を利用するのか視覚化しました。

■サービス構造の作成

・提供リスト

コンセプトに沿って購買・食堂でどのよう商材があるのかリスト化していきました。

・サービス構造

リスト化したサービスをもとにどのような流れだと魅力的なのか構造を考えました。

・アウトライン

具体的に空間や情報のレイアウトのイメージを作成しました。

■サービスアウトライン

各個人でデザインする着眼点を中心にどのようなレイアウトがユーザに魅力的なのか考えました。

以上の内容について

個々で先生からアドバイスをいただきました。

内容としては以下の内容が多いイメージ…。

・今まで調査してきた内容と「コンセプト」、「アイデア」がつながっていない可能性があるので気をつけましょう。

・観察調査が不十分な場合、もう一度調査をしてもよいかもしれません。

【次回までの宿題】

■グループA、Bは以下の内容をレポートにまとめてください。

・方向性

　-　人の方向性

　-　モノの方向性

　-　ビジネスの方向性

・コンセプト

　-　テーマとリード

　-　キーイメージ

　-　コンセプト説明

　-　コンセプトイメージ

・提案する構造

グルームAは以下の通りです。

　-　Web構造（コンテンツリスト、サイト構造、ワイヤーフレーム）

グルームBは以下の通りです。

　-　サービス構造（提供リスト、サービス構造、アウトライン等）

・提案するレイアウト

グルームAは以下の通りです。

　-　Webレイアウト（代表ページのワイヤーフレーム等）

グルームBは以下の通りです。

　-　サービスアウトライン（空間レイアウト、情報レイアウト等）

【TA（平子）からのアドバイス】

■発表用の資料をちゃんと作成する

今回プレゼンテーションする際、「ai」や「word」などのファイルのまま、発表しようとする人がいました。

ちゃんと人に見てもらうようにpdfなどで制作した資料を準備しましょう。

■ワイヤーフレームは「Lucid chart」が便利

GoogleChromeのアプリケーションです。

ワイヤーフレームのサンプルなど無料で使う事ができるソフトです。

シンプルに使う事ができるので使う事をお勧めします。

Chromeを使っている学生は以下からダウンロードできます。

https://www.lucidchart.com/

■固いサービスは考えないように！

最初に言いましたが自分が何が得意なのか一度考えてみましょう。

サービスではイラスト、グラフィック、プロダクト、インタラクション等

自分がやりたいことを生かすようにしましょう。

第4週 コンセプトと構造

第４週
こんにちは、TAの伊藤です。

第４回の授業では演習デザイン論3の内容が関連してきますので少しそちらの話しをします。

「コンセプトとIA」という題目で講義が行われました。

初期のデザインの考え方では、モノの視点で視覚が中心ですが、それを支える構造が大切であり、そのモノがどのような「かたち（構造・フロー、視覚）」であったら良いのかということになります。

次に考えられるようになったのは、モノの視点に加えヒトの視点から見た場合にどのような「状況（コンテクスト、5W1H）と価値」があったら良いのかということを考えていきます。

 

そして今回の情報デザイン演習3ではこの2つにビジネスの視点を加えた計3つの視点から

講義を進めていきます。この3つの視点の考え方をユーザエクスペリエンスとよんでいます。

このユーザエクスペリエンスをどう考えていくとInformationArchitecture（情報構造体）を

よりよくすることができるのかという内容で講義が行われました。

情報デザイン演習3ではこの情報デザイン論3で行われた講義の内容を元に作業がすすめられました。

今回は2つのグループの作業内容はほぼ同じものになります。

そして今回の作業内容は

・講義第3週で出された課題発表

・シナリオの構造化

・千葉工業大学施設課へのインタビュー（一部の「CITのサービスデザイン」グループのみ）

の2つになります。

■講義第3週で出された課題発表

今週までの課題としてだされた調査内容を学生の中から複数人選び出し発表してもらいました。

調査をした学生の中には一時間おきに購買を利用した学生の人数を9：00～16：30まで数えたグループの学生もいました。

7時間半の間交代で数え続けたそうです。すごいですね・・・。

■シナリオの構造化

この作業ではバリュー階層、アクティビティ階層、インタラクション階層の3つを決めてシナリオを作って行き、ユーザがどういった体験ができるかを考えて行きます。

大雑把に言ってしまえば、誰が、何を、どういった事が体験できるのかということです。

講義ではバリューシナリオ（どんな価値があるのか）、アクティビティシナリオ（どういったシナリオで使われるのか）をいくつか考え色々なパターン作っていきました。

講義の最後には学生がどんなバリューシナリオ、アクティビティシナリオを作っているのかの発表が行われました。

■千葉工業大学施設課へのインタビュー

この作業は一部の「CITのサービスデザイン」グループのみが行った作業で実際に千葉工業大学ないにあるCITサービスの施設を管理する施設課にインタビューを行いに行きました。

その際には、第3週で行ったSkypeを使ったインタビュー同様にインタビュー前に質問をまとめたり、分担を行い打ち合わせを綿密に行い、インタビューに臨みました。

インタビュー内容の一部を以下に抜粋しました。

Q：購買部を2階に設置するときに障害者を考慮してエレベーターやスロープを設置する案は無かったのですか？

A：搬入用エレベーターがあるので、使いたい人がいれば、声をかけてくれれば使えます。

Q:購買脇の談話室はどこが管理しているのですか？

A:購買脇の談話室は大学が管理をしています。設計やレイアウトは建築家の方にアドバイスを受けてから、施設課が決定して、そこをCITサービスに使ってもらうというかたちになっています。

【次回までの課題】

今回の課題は2つのグループ同じ事をやってもらいます。

1、方向性

　・人の方向性：提供価値はどこに重点とするのか

　・モノの方向性：Webサイト、サービス（空間、グラフィック、デジタル？）

　・ビジネスの方向性：ビジネスモデル（どこで儲けるか、どこでもうけないか）

2、コンセプト

　・テーマとリードコピー（理念の言葉）

　・キーイメージ（理念のかたち）

　・コンセプトの説明（ストーリー、バリューシナリオ）

　・コンセプトのイメージ（シーンとモノのスケッチ）

今回の課題は情報デザイン論3の講義内容が深く関わってきます。

情報デザイン演習3の方でやったバリューシナリオとアクティビティシナリオのテンプレートはFaceBookの「CIT情報デザイン演習3」グループで上がっていますのでそちらからダウンロードしてください。

【TA（伊藤）からのアドバイス（？）】

ハイ！毎回アドバイスになるかわからTA伊藤からのアドバイスです！

今回のバリューシナリオ、アクティビティシナリオは山崎先生等が書かれた

『EXPERIENCE VISION』という本の中にやり方から活用方法まで載っているのでもしわからない部分があったりしたら山崎研究室にも置いてあるので訪ねて読んでみてください！

いや、決して、「みんなぜひ本買ってね！☆ミ」と販売促進をしているわけではありません

ほ、本当ですよ！！

ただ・・・、気にいったら買ってください！

・・・

さ、さて次のアドバイスですが！

今回ので講義やったことはデザインを進めていくうえで重要な要素の一部です。

コンセプトやどういったもの作っていくのかを決めていくうえで大切な部分なので色々なバリューシナリオ、アクティビティシナリオを作ってみて、自分が「これだ！」というものを見つけてください。

第3週 インタビュー調査・調査まとめ

第3週
こんにちは、TAの伊藤です。

第3回の授業では「MTIのWebデザイン」のグループと「CITのサービスデザイン」のグループで

分かれて行いました。

■「MTIのWebデザイン」のグループ

・mopita　マーケット開発者の方に質問

・調査まとめ

■「CITのサービスデザイン」のグループ

・本質的要求価値分析

・CVCA作成
・調査まとめ

【「MTIのWebデザイン」のグループの作業】

■mopita　マーケット開発者の方に質問

mopita　マーケット開発者の方にSkypeでの質問時間を設けてもらいました。

質問の内容は「MTIのWebデザイン」のグループの中でさらに3～4人のグループに分かれた後、各グループ内でまとめたものを集計して使います。

各グループの代表が集計したものの中で似たような質問をまとめたり、取り除いて良い質問などを選び分担しています。



実際に質問をしている時の写真です。

各グループの代表が質問をしているあいだは、グループメンバーは質問の答えをメモを取りながら聞いています。

 

■調査まとめ

第1週・第2週で用意してあった調査結果と今回行ったSkype会議をまとめ、来週の講義に備えます。

【「CITサービス」のグループの作業】
CITサービスを対象に以下の事を行いました。
■本質的要求価値分析
食堂、購買ともに観察調査での記録や
インタビューをもとに以下のようなイメージで作成していきました。

ユーザの事象として観察調査やインタビューのことを書き出します。

ユーザの行為目標としてKA法を使い出していきます。

最後に本質的要求価値として分類していきました。

■CVCA作成

・目的

事業者等のやり取りに関係する事を表現し、価値の連鎖を可視化する事を目的とします。

可視化する事により製品化はいつを成功させる上で、どのステークホルダー（利害関係者:ex消費者など）が重要な顧客であるかを把握できます。

・CVCAの作り方

１：ステークホルダーのリストアップ

・post-itで団体名などを書き出していきます。

２：ステークホルダー間の価値とその流れの識別

・金銭、資本などを「￥（円）」、物品などを適したアイコン、要求（クレーム）などを「！」で表現します。

３：分析

・重要なカスタマはだれなのか？→「￥」と「！」を追跡

・それぞれにとっての価値はなんなのか→InとOutの変化に注目

・クレーム等Negativeな影響を与える人に注目

【次回までの宿題】

■「MTIのWebデザイン」のグループ

・現状

　サイトの目的、サイトマップ、コンテンツリスト

・ユーザテスト

　NEM、ユーザテスト結果（プロトコル分析）、エクスペリエンス評価

・ユーザニース

　KA法/本質価値分析

・キャスト表/ペルソナ

・CVCA

・リデザインの方向性

■「CITのサービスデザイン」のグループ

・現状

　サイトの目的、サイトマップ、コンテンツリスト

・観察結果

・ユーザテスト

　エクスペリエンス評価（ユーザテストの分析）

・ユーザニース

　KA法/本質価値分析

・キャスト表/ペルソナ

・CVCA

・リデザインの方向性

【TA（伊藤）からのアドバイス（？）】

来週までの内容はかなり多く思えますが第1週、第2週でやったものをまとめ、

どのようにリデザインするかを考える時間なので見た目ほど量は多くないです！

数に圧倒されず、モチベーションを上げて頑張りましょう！

・・・これアドバイスになるのかな？

【TA（平子）からのアドバイス】

・CVCAのつながりは言葉だけではわかりません。

イラストなど書くことによって相手に伝わるようになって行きますのでぜひ書いてみてください。

・レポートのまとめは「ドキュメント」

レポートに結果だけを書いてもわかりません。なぜそうなったのか明確にプロセスを書く事によって受け手は納得してくれるものです。

第2週 インタビュー調査・ユーザテスト

第2週

こんにちは、TAの平子です。

第二回の授業では各グループ以下の内容を行いました。

今回は内容が盛りだくさんです。

■「MTIのwebデザイン」のグループ（以下グループAと略します。）では以下の内容です。

・タスクの設定

・パイロットテスト

・ユーザテスト

■「CITのサービスデザイン」のグループ（以下グループBと略します。）では以下の内容です。

・インタビュー質問項目作り

・インタビュー

【グループAの作業内容】

■タスクの設定

タスクの対象はスマフォブラウザの「mopita マーケット」です。

各グループ宿題のターゲットユーザの分析シートをもとにユーザが行うであろうタスクを３つ設定しました。

■パイロットテスト

設定したタスクの内容と量が適切であるか、実施者（グループA）が事前テストを行いました。

■ユーザテスト

グループBのメンバーに協力してもらい、設定した３つのタスクのユーザテストを実施しました。

被験者は「mopitaマーケット」になれている人、なれていない人を各１名ずつです。

実施者はタスク説明者、撮影者、各１名ずつです。

■エクスペリエンス・フィードバック評価

被験者は撮影した映像（被験者がユーザテストを行った際のスマフォの画面）を見ながらマップを作成しました。

マップは横軸をタスクを行った時間軸、縦軸をタスクを行った際の感情の変化というかたちになっています。

【グループBの作業内容】

■インタビュー質問項目作り

CITサービス（株）で業務されている方を対象としたインタビュー項目の作成を行いました。

■インタビュー

CITサービス（株）で業務されている方に実際にインタビューを行いました。

インタビュー内容の一部は以下の通りになっています。

Q1「一日の利用者はどれくらいですか？」

A1「一日600人ほどです。火曜、木曜日が利用者数が多く、土曜日は少ないです。」

Q2「エレベーターの利用目的は何ですか？」

A2「学生の為でもあり、商品の搬入の目的にもあります。」

Q3「CD販売などもしているみたいですが、みんなの知らないものなどありますか？」

A3「一人暮らし用の家電なども販売しております。基本は入学の際に販売されます。」

【次回までの宿題】

授業内で終わらなかったところまた、以下の内容を進めておいてください。

■分析の実施

・プロトコル分析の実施

　「動画眼」を使って、ユーザの操作映像を分析する。

　動画眼はこちらのサイトからダウンロードできます。（windows対応、mac非対応）

　http://www.do-gugan.com/tools/

　同様に、自分の操作映像を分析する。（こちらは操作画面だけでよい。）

■ペルソナ作成

　ターゲットユーザ分析の基づき、最も比率の高い層に該当するユーザ（少なくとも２
   名）にインタビュー調査を実施する。

【TA（平子）からのアドバイス】

■ユーザテスト中に気づきなどを書き出す

被験者にマップを作成している間、実施者は様子を撮影しているだけでなく、その場での気づきなどを書き出しておいた方がよかったと思います。ユーザテスト中のその場での気づきは大切です。後々書き出しても、人は忘れているものです。

第1週 ガイダンス・テーマ設定

【ガイダンス】

こんにちは、TAの平子です。

第一回目では授業のガイダンスを行いました。

主な内容としては

■授業内容詳細

■グループ分け

〈詳細〉
■テーマ
A　MTIのwebサイトのデザイン

B　CITのサービスデザイン

■目的

エクスペリエンスデザインのデザインプロセスと必要なプロセス・手法を学び、webサイトではプログラミングとwebサイトへの実装化、サービスデザインではユーザーとのタッチポイントのプロトタイプの制作を目的とします。

■協力企業

エムティーアイ（株）　様

コンセント（株）　様

CITサービス（株）　様

今回は中間発表や最終発表でエムティーアイ（株）とコンセント（株）の方に参加いただき、アドバイスを頂きます。

【グループごとの作業】

AとBの２つのテーマから一つを選び、３、４名ずつのグループ分けを行いました。

グループ決定後、各グループでスケジュールを立てました。

【講義内容】

■webサイトのデザインのプロセスについて

webサイトでは、「株式会社エムティーアイ」社のスマートフォン用のwebサイトを対象とします。

プロセスは現状調査から行い、価値分析、コンセプト、インフォーメーションアーキテクチャー、視覚化、プロトタイプ、ユーザ評価、プログラミングを行い、webサイトの実装化を最終的に行います。

■サービスデザインのプロセスについて

サービスデザインでは、「株式会社CITサービス」社の津田沼キャンパスの食堂または購買を対象とします。

プロセスは現状の観察調査から行い、価値分析、エクスペリエンスマップやビジネスモデルを活用したコンセプト、プロトタイプ、ユーザ評価、最終アウトプットの作成を行います。

■山崎先生からのアドバイス

・webサイトを作る人はたくさんいます。今はサービスの企画ができる人を求人されています。

・自分が将来どのような仕事をしたいのか考えながらやってみるとよいです。

・サービスデザインはいろいろな解決方法があるので難しいかもしれません。なので、自分が興味あるものでユーザによりよりサービスを与えられるものを考えましょう。

・サービスではネーミングを考えることもアプローチになります。また、家具や食器などの提案の可能性もあり、重要な要素になってきます。

■安藤先生からのアドバイス

・  サービスデザインの参考に千葉工業大学芝園キャンパスの近くにある中古車ショップ「WOW!TOWN!」を参考にするとよいでしょう。

・  他大学の有名な学食なども調査するとよいでしょう。

・  サービスデザインの対象として購買と食堂のつながりをやってみてもよいでしょう。

【次回までの宿題】

■  MTIのwebサイトのデザインの選択者は以下の通りです。

MTIサイトの現状調査

課題サイトを隅々まで閲覧し、そのような情報が提供されているのか調査し、３つのドキュメントを作成してください。

①サイトマップの作成

現在のサイトの情報内容とその構造を表現してください。

②コンテンツリスト

コンテンツの種類をExcelデータでリスト化してください。

③サイトの目的の把握

２つの分析をふまえて、提供者にとってのサイトの目的を定義してください。

■ CITのサービスデザインの選択者は以下の通りです。

CITサービスの現状調査

対象サービスを隅々まで観察し、どのようなサービスがどのような仕組みで提供されているのか調査し、３つのドキュメントを作成してください。

①サービス提供時間・期間・利用制限等の把握

サービスの提供時間、期間や利用制限等を把握して基本事項を明確にする。

②サービス提供状況のおよび見取り図（全体構成図）

現在の空間的な見取り図をラフでよいので作成してください。

それぞれどのような場所でどのようなサービスが行われているのかその状況を表現してください。

③サービスの提供リスト

サービスの提供内容（商品のカテゴリ）の種類をリスト化する。

■MTIとCITの共通する宿題は以下の通りです。

ターゲットユーザの分析

①ターゲットユーザ分析シート

課題のサービスを良く観察し、利用すると考えられるユーザの属性やその比率、ユーザの特徴やサイトを求めるニーズなどをよく検討して、シートを作成してください。

【TA（平子）のアドバイス】

「MTIのwebサイトのデザイン」はがっつりHTMLを勉強したい！という人向けです。

「CITのサービスデザイン」はがっつりブランドを勉強したい！という人向けです。

サービスデザインでの参考としてジャーニーマップなどで検索するとたくさんブランドに関する参考サイトが出てくるので、調べてみてください。
webはともに勉強していきましょう！という感じで。