公立はこだて未来大学 2015 年度 システム情報科学実習
グループ報告書
Future University Hakodate 2015 System Information Science PracticeGroup Report

プロジェクト名
もえもえデジタルサイネージ〜人を動かす認知×デザイン×システム〜

Project Name
MOE MOE Digital Signage 〜Cognition，Design，and System〜

グループ名
ピアノ班（A），食堂班（B），Kinect 班（C）

Group Name
Piano Group(A)，Cafeteria Group(B)，Kinect Group(C)プロジェクト番号/Project No.

18

プロジェクトリーダ/Project Leader
1013090

熊木万莉母

Marimo Kumaki

グループリーダ/Group Leader
1013238

佐藤僚太

Ryota Sato1013065

赤平優莉

Yuri Akahira

1013018

原史也

Fumiya Hara

グループメンバ/Group Member
1012103

村上新Arata Murakami

1013021八幡望

Nozomu Yahata

1013222石垣愛美

1013045

梅庭由紀子

1013047

大谷一之

Kazuyuki Otani

1013082

平井彰悟

Shogo Hirai

1013088大山浩暉

Koki Ooyama

1013202

武田誠

Makoto Takeda

1013205

西村陽菜

Haruna Nishimura

1013234

小坂泰貴

Yasutaka Kosaka

Manami Ishigaki
Yukiko Umeniwa

指導教員
平田圭二，竹川佳成，田柳恵美子，椿本弥生

AdvisorKeiji Hirata，Yoshinari Takegawa，Emiko Tayanagi，Mio Tsubakimoto

提出日2016 年 1 月 20 日

Date of Submission
Jan 20，2016

-2-

概要
もえもえデジタルサイネージは，人を動かすためのサイネージを作成するためのプロジェクトである．もえもえプロジェクトは，「もっとエモーショナル，もっとエンターテイメント」の略語である．本プロジェクトでは，未来大学にサイネージを設置して，サイネージのコンテンツを見た人間がどのように心を動かされるのか調査をして，調査から得た結果を分析し，目的を再度練り直し，再びコンテンツを作成する，というプロセスを循環させ，コンテンツ制作を進めている．今回は，グループを 3 つに分けた．まずは調査を先にせずに，目的だけを考え，コンテンツ制作を行い，そこから調査を始める目的を重視したグループ A である．これらのグループは音楽という点に着目し，前期では音楽とゲーム要素を組み合わせた学内の売店で利用できるコンテンツの提案を行った．しかし，後期でエレクトロニクス工房に研究目的やピアノ部の活動支援のため設置されたピアノに注目し，ピアノ班としてピアノにプロジェクション
マッピングを用いたコンテンツを提案することとした．次は，未来大学内の調査をもとにして，そこから未来大生が必要と考える目的を立て，コンテンツ内容を提案する調査を重視したグループ B である．これらのグループは，前期に未来大生 100 名にアンケートを実施し，そこから学食利用に関する目的を打ち立てた．後期では食堂班として，学食の利用をより楽しく，
より役立つ情報を提供するコンテンツを提案することとした．最後は，調査と目的を立てることを交互に反芻し目的も調査も考慮するグループ C である．前期ではウェブメールや募集情報など見落としがちな情報を未来大生が取得しやすくなるようなコンテンツを提案することとした．取得をする方法として，Kinect の操作性に注目し，Kinect 班として Unity と連携したコンテンツの提案を後期は行った．本プロジェクトでは 1 年間を通じて，それぞれピアノ班，
食堂班，Kinect 班に分類し，作成したコンテンツによって，未来大生の興味を引き，心を動かすようなサイネージを，一から提案と制作を行った．
キーワード

デジタルサイネージ， 公立はこだて未来大学， コンテンツ（※文責: 熊木万莉母）-i-Abstract
Moe Moe Digital Signage is project to product signage for moving people. Moe Moe
project stands for More Emotional, More Entertainment. This project sets signage inFuture University, researches how to move people who look at contents on signage. And
this project analyzes results from research, then thinks concepts, products contents
again. This project moves forward with making contents while process is repeated.
This project divided members into three teams. A group thinks only concept without
research, then products contents, and starts to research. This group focuses on music,
proposed content which combines music and game in using university cooperative store
in the first term. But in the second term, this group focuses on piano located electronics
studio for the study or supporting piano circle. This group which is named piano groupproposed contents using projection mapping on piano. B group does only researchwithout concept, then thinks concept from research results, and proposes contents. This
group is named cafeteria group sent out 100 students question, then decides concept for
using cafeteria in university. In second term, this group which is named cafeteria groupproposed contents provide more useful information and more fun for using cafeteria inuniversity. Group C products contents to repeat thinking concept and research. This
group products contents to announce useful information that students don’t know. For
example, information of webmail and recruitment is overlooked by students. Group C
is named Kinect group focused on Kinect operability as announcement for students,
proposed contents which cooperate with Unity. This project parted each members into
piano group, cafeteria group, Kinect group, proposed contents of signage which attract
the interest of many people and move people and produced from scratch.
Keyword

Digital Signage， Future University Hakodate， Contents，（※文責: 熊木万莉母）- ii -

目次
第1章

本プロジェクトの背景

1

第2章

本プロジェクトの目的

2

第3章

ピアノ班

3

はじめに . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .

4

3.1.1

背景 . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .

4

3.1.2

目的 . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .

4

課題解決のためのプロセス . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .

5

3.2.1

サイネージ提案までのプロセス . . . . . . . . . . . . . . . . . . . . . . . .

5

3.2.2

システム概要 . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .

6

3.2.3

到達目標 . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .

12

3.2.4

プロジェクト内における課題の割り当て . . . . . . . . . . . . . . . . . . .

13

結果 . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .

14

3.3.1

活動結果 . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .

14

3.3.2

成果の評価 . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .

14

3.3.3

各人の担当分課題の評価. . . . . . . . . . . . . . . . . . . . . . . . . . .

16. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .

19

3.1

3.2

3.3

3.4
第4章

4.1

4.2

4.3

4.4

4.5

今後の課題と展望
食堂班

20はじめに . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .

21

4.1.1

背景 . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .

21

4.1.2

現状における問題点とコンテンツの目的 . . . . . . . . . . . . . . . . . . .

21

課題解決のためのプロセス . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .

23

4.2.1

調査内容 . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .

23

4.2.2

到達目標 . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .

28

課題解決のためのプロセスの詳細 . . . . . . . . . . . . . . . . . . . . . . . . . .

29

4.3.1

作業過程 . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .

29

4.3.2

各自の課題割り当て . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .

32

各人のコンテンツ制作における担当分課題とその評価. . . . . . . . . . . . . . .

34

4.4.1

八幡望 . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .

34

4.4.2

石垣愛美 . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .

35

4.4.3

赤平優莉 . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .

36

4.4.4

武田誠 . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .

36

4.4.5

西村陽菜 . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .

37

結果と考察 . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .

38

4.5.1

前期のコンテンツ案 . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .

38

4.5.2

後期の成果物 . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .

41- iii -

4.6

第5章

5.1

5.2

5.3

5.4

5.5

4.5.3

考察 . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .

46

4.5.4

成果発表会の評価と反省. . . . . . . . . . . . . . . . . . . . . . . . . . .

47

課題と展望 . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .

48

4.6.1

課題 . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .

48

4.6.2

展望 . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .

48

4.6.3

本グループ全体の反省 . . . . . . . . . . . . . . . . . . . . . . . . . . . . .

49

Kinect 班

50

はじめに . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .

51

5.1.1

背景 . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .

51

5.1.2

目的 . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .

51

目的達成のための課題の設定. . . . . . . . . . . . . . . . . . . . . . . . . . . .

52

5.2.1

課題の設定 . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .

52

5.2.2

課題の割り当て . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .

54

課題解決のプロセス . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .

55

5.3.1

月毎の作業過程 . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .

55

5.3.2

担当した課題ごとの解決過程 . . . . . . . . . . . . . . . . . . . . . . . . .

56

成果物と考察 . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .

63

5.4.1

成果物 . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .

63

5.4.2

成果発表会での結果と考察 . . . . . . . . . . . . . . . . . . . . . . . . . .

67

まとめ . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .

68

5.5.1

プロジェクトの反省 . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .

68

5.5.2

今後の展望 . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .

68

第6章

プロジェクト全体の活動

69

第7章

プロジェクト全体のまとめ

70

付録 A

習得技術

71

A.1

ピアノ班 . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .

71

A.2

食堂班 . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .

71

A.3

Kinect 班 . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .

71

相互評価

73

B.1

ピアノ班 . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .

73

B.2

食堂班 . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .

74

B.3

Kinect 班 . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .

76

付録 B

参考文献

78

- iv -

MOE MOE Digital Signage 〜Cognition，Design，and System〜

第1章

本プロジェクトの背景

デジタルサイネージとは，駅構内やバス車内，店頭などに設置された液晶ディスプレイなどの映像表示装置のことである．これらは通行者に向けて案内の情報や，広告などを流している．デジタ
ルサイネージは看板や紙ポスターが電子化されたものであり，新しい情報メディアとして注目されている．デジタルサイネージは情報伝達や広告の機能を果たすため，基本的に人通りのある場所に設置される．
本プロジェクトでは，このデジタルサイネージに注目した．デジタルサイネージの設置環境を公立
はこだて未来大学とし，ターゲットを未来大学の学生とした．すでにデジタルサイネージは未来大学内に導入されており，正面玄関に 1 台，ライブラリ横の通路に 1 台，1 階エレベーター前に複数台設置されている．正面玄関のデジタルサイネージには，空中で撮影した未来大学の外観や内観を
ソラカメラプロジェクトのコンテンツとして表示している．ライブラリ横のデジタルサイネージには図書館に置かれている書物の情報が定期的に更新され，人が通ると自動的に映像が流れるよう設定されている．
本プロジェクトの目標は，デジタルサイネージのコンテンツを閲覧した人間の心を動かし，行動を変えることができるようなコンテンツを制作することである．
本プロジェクトでは，この習作コンテンツを前期に制作し，後期は各班が提案したコンテンツを制作することとした．本プロジェクトの担当区分は当初 1 階のエレベーター横のデジタルサイネージとなっていたが，自分たちの制作したいコンテンツによっては大学内であれば場所も問わないということで，大学内の中で設置場所を考案し，コンテンツを制作することとした．
まず，1 階のエレベーター横には本プロジェクトのプロジェクトメンバーを隣接する研究室のメンバーに知ってもらう目的で，プロジェクトメンバー全員の自己紹介のスライドショーを流した．な
お研究室のメンバーだけでなく，一般の学生にも本プロジェクトの存在と概要を伝えるため，映像表示面を研究室の内側に向けて設置せず，エレベーターに向かって設置した．また，その横にはプロジェクトの概要をまとめたスライドや各班のプロジェクトにおける位置付けを説明したスライドも同時に流すこととした．実際にサイネージを設置したところ，何人もの学生や教職員が足を止めてコンテンツを閲覧する様子や，注目している様子を観察できた．
（※文責: 熊木万莉母）

Group Report of 2015 SISP

-1-Group Number 18

MOE MOE Digital Signage 〜Cognition，Design，and System〜

第 2 章 本プロジェクトの目的
目標を達成するため，本プロジェクトではコンテンツを制作する循環について定めた．まず，コンテンツを制作する循環の始めとして，目的・調査・デザインと 3 つの開始位置を定めた．目的，
調査，デザインの順に流れが定められ，デザインの後は目的に戻るサイクルを続けている．このサイクルに従い，班の構成のスタートを目的から始めるグループ，調査から始めるグループとした．
デザインについては，目的の一部に分類されるであろうという共通認識を持った．目的を重視す
る目的重視型，調査を重視する調査重視型，そして目的も調査も同時に反芻して繰り返していく目
的調査考慮型の 3 班にメンバーを分けた．そして各班で，それぞれコンテンツの提案を行うこととした．
目的重視型は，売店での行動に働きかける音楽やゲーム性のあるコンテンツの提案を目指した．
前期は学内の売店に伴奏や主旋律のみの BGM を流し，売店内にサイネージを設置する提案を行った．サイネージ画面には売店内の BGM に対応した楽譜が流れ，学生がサイネージの画面で副旋律の音符を楽譜にゲーム感覚で入れていく．後期では前期からの案を練り直し，音楽とゲーム性を引き継ぎ，エレクトロニクス工房内に設置されたピアノにプロジェクションマッピングを用いて通行者，演奏者，聴衆向けのコンテンツを提案することとした．そして，後期からはピアノ班と改名
し，エレクトロニクス工房内に設置されたピアノを学生が不安をおぼえることなく利用できることを目標とした．
調査重視型は前期に学生 100 名に学食に関するアンケートを実施し，アンケート結果をもとに学
食に関するコンテンツの提案をすることとした．前期では学食内にデジタルサイネージを設置し，娯楽的要素の強いコンテンツ，利便性の高いコンテンツを同時に流そうという提案であったが，後期は食堂班と改名し，2 台のデジタルサイネージを使用することで，どちらの情報もそれぞれのディスプレイに流し，コンテンツを制作することとした．デジタルサイネージは 2 台横に隣接し，1 台は学食でその日に食べたメニューを写真付きで投稿することで学生の知らなかったメニューやメニューの組み合わせなどを提供できる投稿型コンテンツの提案を行った．もう 1 台には不足しがちな栄養を補うためのメニューを学生に勧める動画を常に流すこととした．学生にとってより楽しい，より役立つ情報を提供するコンテンツを提供することを目標とした．
目的調査考慮型は，学生間での情報共有をウェブメールや張り紙以上に行いやすいコンテンツを提案することとした．そこで共有しやすく学生に興味を持たせるデバイスとして Kinect に注目した．後期では Kinect 班と改名し，Kinect と Unity を連携させることで，デジタルサイネージ内で仮想空間の情報共有を行うことを目標とした．
以上の 3 つの班の作成したコンテンツを学内に設置し，人の心を動かし，行動を変えるようなサ
イネージを本プロジェクトでは目指している．
（※文責: 熊木万莉母）

Group Report of 2015 SISP

-2-Group Number 18

MOE MOE Digital Signage 〜Cognition，Design，and System〜

第3章

ピアノ班
概要

ピアノ班は公立はこだて未来大学の学生の行動の活性化を目指して，学内に設置された電子グ
ランドピアノの利用機会を増やすためのシステムの提案や制作を行った．前期では，サイネージの試作と提案を行った．具体的には，サイネージの試作を通して，サイネージを制作するために必要な知識を身につけ，サイネージを見た人の心を動かすコンテンツを制作するというサ
イネージ制作の方針を固めた．また，本学学生の心を動かすサイネージとは何かをグループ内
で考え，大学生協の売店に焦点を当て，レシートの購買情報を利用した楽曲作成サイネージを提案した．後期ではまず，前期で提案したサイネージ案について班内で見直しを行った．その議論の中で，売店内で一定時間ユーザーを束縛するサイネージを設置した場合，サイネージ利用者がサイネージ前に滞ってしまい，購買行動を妨害してしまうという問題が浮上した．そして，前期で提案したサイネージに関する議論を重ねた結果，問題視されていない点を問題としたことや，問題を解決するのに有効ではない解決策が提案されていたことから，サイネージ案
を全く別のものにすることとした．そのとき，学内に設置された電子グランドピアノが学生に利用されていないことを知った．そこでピアノ班は，学内に設置された電子グランドピアノに焦点を当てることとした．そして，このピアノが学生に利用される機会を増やすためのシス
テムの提案を行った．本システムでは，より人の目を惹くことができるように，ピアノにプロ
ジェクションマッピングをし，ピアノをサイネージとすることとした．また，このシステムのコンテンツを，通行者向けや演奏者向け，聴衆向けの 3 つに分け，それぞれについてコンテンツを制作した．また，班員を 2 チームに分け，制作するコンテンツを分担してそれぞれ制作を行った．ピアノ型のサイネージである本システムを学内に設置することで，学生のピアノ利用の機会が増え，ピアノを通したコミュニケーションが活性化することを目指す．
キーワード

デジタルサイネージ，公立はこだて未来大学，ピアノ，プロジェクションマッ

ピング，エレクトロニクス工房（※文責: 佐藤僚太）

Group Report of 2015 SISP

-3-Group Number 18

MOE MOE Digital Signage 〜Cognition，Design，and System〜

3.1

はじめに

3.1.1

背景

2015 年 10 月 28 日，公立はこだて未来大学構内のエレクトロニクス工房内に電子グランドピア
ノが設置された．研究利用やピアノ部の発足，学生利用のためにピアノが導入された．電子グラン
ドピアノの利用にあたって遵守事項 [1] によると，ピアノを占有せず，音を出さないのであれば，本学学生は許可を得ることなくピアノを使用することができる．しかし，学生利用のためにピアノが利用される場面はほとんど見受けられない．この理由について，以下の理由より学生利用が少な
いのではないかとピアノ班は議論づけた．
まず，ピアノが利用可能であるかがわからないため，学生はピアノの利用を躊躇してしまう．ピ
アノの利用時間はエレクトロニクス工房の利用のマニュアルに準拠する [2]．それによると，10 時

30 分から 18 時 00 分に工房内で授業や業務が行われていなければ，学生は個人でピアノを利用することができる．このピアノを利用するうえで熟読する必要のあるマニュアルは工房内にあるほか，本学学生がアクセスすることのできる WebDAV から閲覧することができる．しかし，これらは普段の学校生活で目につきにくい場所にあるため，利用するうえで必要な情報を知っている学生は少ないという現状がある．
また，ピアノに対して興味があるにも関わらず，ピアノの経験が少ない学生は，自分のレベルでピアノを弾いて良いのだろうかという不安感に陥る．これによって，ピアノを弾く勇気を出せずに諦めてしまうことがしばしばある．そのため，ピアノを弾きたいと思う人全員が，不安感からピアノを弾くことができていないという現状がある．ピアノに興味を持つ人が不安を感じることなくピアノを弾くために，以上のようなピアノへの不安の払拭を支援する必要がある．

3.1.2

目的

ピアノが利用可能であるかを知らせ，ピアノ利用への不安を払拭するための手段としてサイネージは有効であるとピアノ班は考えた．そして，ピアノに対する人の目を集め，ピアノに興味のある
多くの学生に弾いてもらえるシステムの制作を目的とした．
話したことがない人同士にピアノや音楽といった共通の話題を与え，コミュニケーションの機会を増やす．そうすることで，一方がピアノを弾いていることで，もう一方が自分も利用可能であると思わせることができるため，ピアノ利用の機会が増えるとピアノ班は考えた．これを実現するた
めに，人の目をサイネージに集めることが重要であると考え，プロジェクションマッピングの集客効果 [3] によって人の目を集めることとした．
以上よりピアノ班は，学生利用の機会を増やすことを目的とした．ピアノへの不安感を払拭し，ピアノに興味がある人全員に弾いてもらえるピアノ型のサイネージを，プロジェクションマッピン
グによって実現させ，ピアノを通したコミュニケーションの活性化を目指す．
（※文責: 佐藤僚太）

Group Report of 2015 SISP

-4-Group Number 18

MOE MOE Digital Signage 〜Cognition，Design，and System〜

3.2

課題解決のためのプロセス

3.2.1

サイネージ提案までのプロセス

前期では，レシートの購買情報を利用して，大学生協の売店内に流れる楽曲を作成するサイネージの提案を行った．
このサイネージは売店での購買行動を促すことを目的とし，売店内の入り口付近や順番待ちの列ができやすい箇所などの目立つ場所にディスプレイを設置することとした．まず，ピアノの主旋律と伴奏のみで構成された，副旋律の無い音楽を売店内に BGM として流すことを前提とする．売店とサイネージを関連付けるために，売店を利用する学生が必ず共通で取得できるレシートに着目した．レシートから読み取った購入した商品の合計金額を元にゲームの難易度を決定し，図 3.1 のような音楽ゲームをディスプレイ上で学生にプレイさせる．このゲームは，売店内の音楽に反映されていない副旋律の音に対応した棒が上から降ってくるもので，これをバーで受け止めることによって売店内の楽曲にリアルタイムに副旋律が追加されるものである．合わせて，このゲームがプレイされていない時間に大学生協の広告をディスプレイに流すことで，購買行動を促すことができると考えたサイネージの提案を行った．
プロジェクト中間発表会で頂いた意見を元に，夏休みの期間を利用して提案内容の再検討を行った．その結果，前期で提案したサイネージを設置することによる，購買行動促進ができる裏付けが取れないことや，大学生協の売店に着目した必然性が全くないことが問題になった．期間を同じくして，学内に電子グランドピアノが設置されたという情報を得て，前期で提案したサイネージのピ
アノの要素を引き継いだ提案が出来ないかと提案内容を修正することとした．前期では提案内容にサイネージとしての広告要素が少なく，プロジェクト中間発表会でその点に関しての指摘を多く受けたため，後期の活動ではピアノという軸は変えずに，サイネージとしての広告要素のある提案を目指した．まず，ピアノの導入目的を考えた際，研究での利用とピアノ部の活動支援，一般の学生利用促進が挙げられるが，学生に弾かれていないことが多く，ピアノの存在を知らない学生も多いという現状があった．そのため，エレクトロニクス工房にピアノがあることや，誰でも弾くことができることを学生に伝えるサイネージの提案を行うことにした．
ピアノをどのようにサイネージ化するか考え，ピアノに関しての情報を集めていたところ，電子
ピアノのキーボード面や蓋の部分にプロジェクションマッピングして，演奏者がマッピングされた映像を見ながら楽しげに演奏している動画を発見した．ピアノの音に合わせたエフェクトがかかる
ことで，演奏を視覚的に楽しむことができるといった点を参考に，人の目を惹きやすいプロジェク
ションマッピングを使った提案を行うことにした．
当初，ピアノに興味があるが，工房内に入ることに不安を覚える通行人をターゲットとした．そのため，参考動画と同様にピアノの音に合わせたエフェクトがかかるよう，プロジェクションマッ
ピングを工房内の壁に投影し，利用可能情報を電子グランドピアノの近くに設置するディスプレイ
に映すこととしていた．

11 月の進捗報告会でこの提案をしたところ，電子グランドピアノでしかできないシステムを作るべきだという意見を受けたため，電子グランドピアノの良さとは一体何かと考えた．電子グラン
ドピアノと一般的な電子ピアノとの比較を行ったところ，音の響きや弾き心地は勿論であるが，それ以外にも形状の違いがあることに気がついた．電子グランドピアノの良さは従来のグランドピア
ノから引き継がれた形状の美しさであるといった点から，この形状を生かした投影を行うべきであると提案内容を修正した．したがって投影箇所を工房内の壁ではなく，ピアノの蓋や天板，側面なGroup Report of 2015 SISP

-5-Group Number 18

MOE MOE Digital Signage 〜Cognition，Design，and System〜
ど，電子グランドピアノの形状を十分に生かすこととした．投影箇所を増やしたため，ターゲット
を通行者だけでなく，一度ピアノを使った演奏者や，そして演奏を見ている聴衆まで拡大することとし，それぞれ通行者向けコンテンツ，演奏者向けコンテンツ，聴衆向けコンテンツと分けて制作を行った．
通行者向けコンテンツの目的は，通行者のピアノ利用への不安を払拭することであった．その目的を達成するため，通行者が工房入り口に設置されたピアノに気がついてから工房内に入りピアノを弾くまでの心理状態を考えた．まず工房内へと入るまでの過程から通行者の心理として，ピアノ
を誰でも使っていいのか分からない，利用可能時間がいつであるかが分からない，そもそも工房内に入ることだけでも不安である，といったことが挙げられた．そのためピアノを誰でも使っていいのか分からない，利用可能時間がいつであるかが分からない，といった問題を解決するために，ピアノが利用可能であるかを知らせるテロップの作成を行うこととした．また，そもそも工房内に入ることだけでも不安である，といった問題を解決するために，どのような状況であれば工房内に入るかを考えた．例として友人や親しみやすい人間が工房内にいて手招きされた場合，ほぼ反射的に
工房内に入るのではないかと考えたため，親しみやすいオリジナルキャラクターを作り，そのキャラクターによる手招きを行うこととした．これらの要素によって工房へ入る不安を解消した通行人が，次に工房内に入りピアノを弾きたいと思わせる要素として，その日弾かれた和音をアイコンとして表示する和音これくしょんを提案した．その日に弾かれた和音を表示することで，弾かれていない和音を弾いてみようという方向に心を動かすことを目指した．
演奏者向けコンテンツの目的は，演奏者が継続的に利用したいと思わせることであった．継続的に利用してもらうためには，演奏することが楽しいと演奏者が感じることが一番重要な点であった
ため，聴覚的効果の高い演奏状態に視覚的な効果を付与することで，演奏を楽しむことに繋がるエンターテインメント性のあるコンテンツを目指した．まず，演奏時常に視界に入る天板に，演奏者が打鍵した音に対応したエフェクトの表示を行うことで，演奏者自身が弾いた音が視覚的に認知できるシステムを制作した．また，演奏することが楽しいと思わせるため，演奏することによる達成
感を得ることができるシステムを考案した．達成感が感じられるものとは何かを考えた際に，ゲームをクリアすることが例に挙がった．そこで，打鍵数に応じてオリジナルキャラクターの容姿を変化させる育成コンテンツを提案した．
聴衆向けコンテンツの目的は演奏者の楽しむ様子を見た聴衆が，演奏者としてピアノを利用した
いと思わせることであった．演奏者として聴衆がピアノを利用したいと感じるためには，自身が演奏したかのような気分を味わうことが大切であると考え，演奏者が見ている光景を，聴衆にも共有できるコンテンツを目指した．そこで聴衆の立ち位置を演奏者から見て左側のピアノの側面側と固定し，工房奥側の側面に演奏者向けコンテンツと同様に，テロップやオリジナルキャラクター，演
奏者の打鍵した音に対応したエフェクトの表示を行うこととした．また，演奏者が演奏している様子を見た聴衆がピアノを演奏が終了した後利用したいと考えた時，聴衆が気がかりになる点はピアノの利用時間ではないかと考え，通行人向けコンテンツと同様に，利用時間や利用可能であることを示すテロップも流すこととした．
以上より，通行者や演奏者，聴衆をターゲットとした，ピアノの利用機会を増やすピアノ型のサ
イネージの提案を行った．

3.2.2

システム概要

ピアノ班は通行者や演奏者，聴衆に向けたコンテンツを，プロジェクションマッピングをピアノに投影し，ピアノをサイネージ化する提案を行った．このシステムを制作する上で班を 2 つのGroup Report of 2015 SISP

-6-Group Number 18

MOE MOE Digital Signage 〜Cognition，Design，and System〜

図 3.1 synthesia の完成予想図

チームに分けた．使用する開発環境からそれぞれのチームを，Processing 開発チーム，Quartz

Composer 開発チームとした．ピアノは MIDI 対応の電子グランドピアノである YAMAHA 製の
AvantGrand N3 で，想定として通行者に向けた開蓋状態とした．
プロジェクターやピアノなど，本システムの構成を図 3.2 とした．演奏時のエフェクトや，通行者向けコンテンツが通行者に見える位置にプロジェクターやピアノを移動し，床に目印を打つこと
で位置を常に固定させた．また，ピアノの外装が鏡面仕上げで投影映像を反射してしまうため，プ
ロジェクションマッピングの映像がピアノに投影できるよう，白いシートをピアノの側面全体に貼り付けた．このシートは静電気によりピアノの表面にシートの生地が張り付くようになっており，ピアノの演奏に問題が生じることはないものとした．同様に，プロジェクションマッピングの映像が投影できるよう，演奏者向けコンテンツを投影する天板部分に置く白い板を制作した．素材を白いシートと白い板で区別した理由として，白いシートは厚みが非常に薄いため形状変化が容易となっており，ピアノの丸みを帯びた側面に貼り付けるには最適であった．また天板部分に置く板は厚みがあり，作りもすぐに壊れないような非常に安定した板であったため，スピーカーの穴がいく
つかあり，くぼみの多い天板をカバーするには最適と判断し，これらの素材を使用することとした．
以上のような，主にプロジェクションマッピングをピアノ全体に投影するための準備作業を，両チーム共同で行った．システム制作は，ピアノからの MIDI 出力を MIDI 分配器で分配し，2 台のパソコンに同じ MIDI 入力を与え，各チームで制作を分担した．

Processing 開発チーム
本チームはまず，率先してプロジェクションマッピングの試作を行った．ピアノ班内でプロジェ
クションマッピング制作経験者がいなかったため，コンテンツを提案する前に工房内の壁やピアノの天板に映像のみを投影し，プロジェクションマッピングの足がかりとした．

Quartz Composer 開発チームは，未体験の Quartz Composer を開発環境としたため，1 ヶ月ほどを学習期間とした．この間本チームは，プロジェクションマッピングを行うために必要となる

MIDI 取得や映像とのリンクなどの技術を試作することで身につけ，Quartz Composer 開発チー
ムにそのノウハウを教えることとした．

Processing 開発チームはプロジェクションマッピングの試作をしたのち，通行者向けコンテンツと演奏者向けコンテンツについて制作を行った．通行者向けコンテンツの目的は，通行者のピアノ利用への不安を払拭することであったため，通行者に見える場所に 3.3 のようにそれぞれコンテン

Group Report of 2015 SISP

-7-Group Number 18

MOE MOE Digital Signage 〜Cognition，Design，and System〜

図 3.2

システム構成図

ツを表示した．3.2.1 でも述べたように，通行者が工房内に入るための工夫，工房内に入ってからピアノを弾くまでに至る工夫を行う必要があった．
まず，通行者が工房内に入る工夫として，2 つのコンテンツを制作し，これらをピアノの側面に投影した．まず 1 つ目はピアノが利用可能であるかの情報を，右から左に文字が流れるテロップ形式で表示したコンテンツである．ピアノを誰でも使っていいのか分からない，利用可能時間がいつであるかが分からない，といった問題を解決するためのテロップであるため，テロップに表示する
内容も工夫した．利用可能時間，誰でも気軽に弾くことが可能である，といった基本的な情報を主に流すだけでなく，これらの文章をオリジナルキャラクターが発言しているかのような口語で表示することによって，通行者が工房内に入ることに抵抗が少なくなるよう，工夫を凝らしたものとした．
もう 1 つの工房内に入るためのコンテンツとして図 3.4 のようにオリジナルキャラクターを表示した．親しみやすいキャラクターが手招きをすることで，ピアノが利用可能であることが直感的に知ることができるだけでなく，ピアノ利用に対する不安を払拭することができる．これを実装する
ために，手を振り上げた画像と手の甲を少し振り下げた 2 枚の画像を交互に表示し，キャラクター
が手招きしているように見せた．オリジナルキャラクターのデザインに関しては，アニメや漫画，ゲームを好む傾向が強い未来大生が興味を示しやすいよう，既存のアニメを参考とし，塗り方はア
ニメ塗りと呼ばれる手法をとったデザインとした．プロジェクト名がもえもえであったため，萌えという単語にかけて，班員の意見を元に髪色をピンク，髪型はツインテールとした．また，音楽に関するキャラクターとしたかったため，髪型のツインテールは，一般的なツインテールではなく，
ツインテールの曲線と比較的形状が似ているヘ音記号をイメージして作成し，キャラクターのアク
セサリーが音符やピアノ型といった特徴も持たせることとした．顔の表情についてはどのような表情であれば親しみやすいかを議論したところ，笑顔であると話がまとまったため笑顔とした．
次に，工房内に入った通行人がピアノを弾くまでに至る工夫として，ピアノの側面に，その日弾
かれた和音をアイコンとして表示する和音これくしょんを図 3.5 のように表示した．和音は 1 つの音に対して 15 種類存在し，ドからシまでの 12 種類全ての音に対してそれぞれに対応するアイコン
を 180 種類制作した．ドからシまでの白鍵は全部で 7 種類あるため，ちょうど虹の 7 色と色数が同じであった．そのため，ドを赤，レを橙，ミを黄，ファを緑，ソを青，ラを藍，シを紫と定め，Group Report of 2015 SISP

-8-Group Number 18

MOE MOE Digital Signage 〜Cognition，Design，and System〜
黒鍵に関しては，左右の白鍵に対応する色の中間色を用いることとした．和音これくしょんは，打鍵を一度も行わない状態では，アイコンは全て表示されないが，和音が弾かれることで，その和音に対応したアイコンが表示される．この和音これくしょんは人間のツァイガルニック効果と呼ばれる心理特性を活用したものとなっている．高橋（1989）によると，ドイツのゲシュタルト心理学者である Kurt Lewin は，人間の記憶について，「達成された課題よりも，達成されなかった課題や中断している課題の方が記憶に残りやすい」と提唱した [4]．この Lewin の考えに基づいて，旧ソビエト連邦の心理学者 Bluma Zeigarnik が実験を行い提唱したものがツァイガルニック効果である．ツァイガルニック効果とは，目標が達成されない未完了課題についての記憶は，完了課題についての記憶に比べて想起されやすいという，認知心理学における効果のことである．途中で課題が中断される，課題を達成できなかったといった場合，緊張状態が持続してしまうことになるため，
未完の課題は記憶に強く残ることになる．また，人は未完の課題による緊張を取り除くため，無意識に課題を完了させようと行動するのである．さらに，未完成なものが出来上がっていく過程を楽しむといった心理もツァイガルニック効果の一種であるとされている．毎熊（2015）はコレクショ
ンの要因のうち，「完璧に揃えたい」という心理状態が，このツァイガルニック効果にあたると提唱した [5]．これらの既存の研究結果から，和音これくしょんを表示させることにより，その日にまだ弾かれていない和音を弾いて和音アイコンをコレクションし，和音これくしょんを完成状態にさせたいと通行人が考え，ピアノを弾くまでに至るのではないかと期待した．これを全てのコンテンツをピアノにプロジェクションマッピングするため，形が崩れないように射影変換を用いて実装を行った．射影変換とは，ある図形から任意に頂点を複数選択し，それらの選択された頂点を動かして図形を変形させる手法である．プロジェクターの位置や首の角度がピアノに対して正面かつ垂直の関係を保っていないため，そのままの状態で投影してしまうと，映像全体が斜めに投影されてしまう．それを防ぐため，射影変換を用い故意に映像を歪ませることによって，実際に投影させた
場合に映像が正しい位置に投影させることに成功した．動かす頂点数について，オリジナルキャラ
クターの表示や和音これくしょんよりも，テロップの表示位置がピアノの側面の曲線部分の影響を受けやすい位置であったことから，射影変換を行うためのキャリブレートする頂点数を増やした．

Processing 開発チームは，射影変換する際に，実際に投影させながら頂点の位置を Processing の画面上でドラッグし，マッピングする位置の調整を行った．また学内の施設の管理上，ピアノやプ
ロジェクターを日ごとに全て片付けておかなければならない状態が続いたため，射影変換の座標の位置調整が日をまたいでも円滑に進むよう，頂点の座標位置を保存するプログラムを個別に用意した．通行者向けコンテンツとして，以上のような通行者のピアノ利用への不安を払拭するコンテンツを制作した．
次に演奏者向けのコンテンツの目的は，演奏者に継続的にピアノを利用したいと思わせることであったため，演奏者に見える場所に図 3.6 のようにそれぞれコンテンツを表示した．まず，ピアノの天板に演奏者の打鍵に対応してエフェクトを発生させた．エフェクトのテーマは作業の進行具合によって随時増やすこととし，12 月の成果発表会に向けて冬をテーマとしたエフェクト作成を行った．背景に大量の雪が上から下へと落ちていく 1 分動画を流し，打鍵に応じて雪の結晶が降るように見えるエフェクトを発生させた．雪の結晶は，1 つ 1 つの音に対応させ，88 種類制作した．
また，天板の右下に，オリジナルキャラクター育成コンテンツを表示した．このキャラクターは，
通行者向けコンテンツで手招きしているキャラクターと同一である．このキャラクターの容姿を打鍵数に応じて変化させることで，育成していると思わせ，演奏者が演奏することへの達成感を感じることを目的とした．キャラクターの容姿について，成長初期状態はドット絵という簡易的な絵柄であるが，成長するにつれアニメ風の複雑な絵柄へと変化するデザインとし，全部で 10 種類の容Group Report of 2015 SISP

-9-Group Number 18

MOE MOE Digital Signage 〜Cognition，Design，and System〜

図 3.3 通行者向けコンテンツ

図 3.4

オリジナルキャラクター

図 3.5

Group Report of 2015 SISP

和音これくしょん- 10 -

Group Number 18

MOE MOE Digital Signage 〜Cognition，Design，and System〜
姿変化を用意した．最後に，通行者向けコンテンツとして表示していた和音これくしょんがどの程
度コレクションされているかの達成率が，側面を見に行かずとも演奏者が知ることができるよう，
和音これくしょんの達成率を雪だるまのイラストの個数で表現した．この雪だるまは通行者向けコンテンツのキャラクターと同一である．雪だるま 1 体を和音 6 つ分とし，和音の数は 180 種類あるため，最大で 30 体の雪だるまが和音これくしょん達成率として表示されるようにした．雪の動画，雪の結晶，キャラクター育成，和音これくしょん達成率の表示，以上の演奏者向けコンテンツ
は，先ほどの通行者向けコンテンツと同様に射影変換を行った．
本チームを佐藤，熊木とし，以上の通行者向けコンテンツと演奏者向けコンテンツについて役割を分担し，制作することとした．

図 3.6

演奏者向けコンテンツ

Quartz Composer 開発チーム
本チームはまず，Quartz Composer でのプログラミングの学習を行った．未体験の開発環境であったため，11 月 5 日の進捗報告会までの期間を学習期間とし，それ以降よりプロジェクション
マッピングするためのコンテンツ制作を開始した．本チームは，聴衆向けコンテンツの制作を行った．
聴衆向けコンテンツの目的は，工房内にいるピアノを利用していない人に対して，演奏者としてピアノを利用したいと思わせることであるため，図 3.7 のように聴衆に見える場所にコンテンツを投影した．まず，通行者向けコンテンツ同様に，側面にテロップの表示とキャラクター画像の表示を行った．テロップは通行者向けと同じものを使用し，通行者と同じ情報を聴衆にも伝えることとした．これらの情報を知ることで，聴衆が次は演奏者になろうと考えることを期待した．キャラク
ター画像については，演奏者向けコンテンツのキャラクターを常に表示した．最終形態のキャラク
ターがどのようなものであるか表示することで，この容姿に変化することを演奏者に目指してもらうことが狙いであった．これだけを考えると，演奏者向けコンテンツの一部として常にこの画像を天板に表示させてしまうことも一案としてあったが，この最終形態になるよう演奏者が目指していることを聴衆にも共有してもらうため，聴衆向けコンテンツの一部とすることとした．また，演奏者向けコンテンツ同様に，開蓋状態の蓋に，打鍵に応じたエフェクトを表示することとした．蓋の形状を活かし，ピアノの鍵盤を投影し，演奏者の打鍵の様子が分かるよう投影することとした．テ
ロップの表示，最終形態のキャラクター画像，そして演奏者の打鍵の様子の投影，以上の聴衆向け
コンテンツを実装するために，Quartz Composer 開発チームは Processing 開発チームと同様に射Group Report of 2015 SISP

- 11 -

Group Number 18

MOE MOE Digital Signage 〜Cognition，Design，and System〜
影変換を行った．Quartz Composer 開発チームの射影変換は，Processing 開発チームとほぼ酷似
しているものの，頂点の座標位置を画面上でドラッグして調整せず，数値を入力して座標位置の調整を行った．
本チームを小坂，村上とし，以上の聴衆向けコンテンツについて役割を分担し，制作することと
した．

図 3.7

3.2.3

聴衆向けコンテンツ

到達目標

上記で設定した，課題を解決するために 3 つの目標を定めた．

1．どのようにすれば学生のピアノ利用機会を増やすことができるかを理解する．
2．どのようなシステムにするかを考察し，システム像を明確にする．
3．実際にシステムを導入し，システム利用者のレビューから，本システムの影響を調査する．
上記 3 つの目標をわたしたちの班の最終目標とし，課題解決に取り組んだ．前期では，大学生協の売店に焦点を当て，1 や 2 を行った．しかし，後期では提案内容の見直しを行い，全く違う提案を行ったため，新たに 1 や 2 について議論を行うこととした．実装にかける期間が長かったため，3 をすることができなかった．成果発表会後のレビューでは本システムのピアノを実際に学生に弾いてもらい，エフェクトが発生する様子が面白いという意見や，ピアノをサイネージ化する提案が斬新だという意見を得られた．

Group Report of 2015 SISP

- 12 -

Group Number 18

MOE MOE Digital Signage 〜Cognition，Design，and System〜

3.2.4

プロジェクト内における課題の割り当て

班員すべてに共通する課題：サイネージの提案，大学内の問題点の考察，サイネージ投影環境の構築，中間発表用原稿の作成，後期活動の打ち合わせ，チーム分け，後期制作物の提案，実装方式の決定，使用する技術の決定，デモビデオ撮影
村上の担当は以下の通り：ゲームシステムの実装，画像認識の実現，Quartz Composer 開発チームの作業，その他サイネージのシステムの実装，最終成果発表会のための設営
熊木の担当は以下の通り：MIDI 分配の作業，Processing 開発チームの作業，エフェクト作成，全鍵盤に対応する画像の作成，和音に対応するエフェクト作成，オリジナルキャラクターの提案と作成，班ポスター制作，動画作成，スライド作成
小坂の担当は以下の通り：キャンペーン情報の作成，Quartz Composer 開発チームの作業，ポス
ター制作における必要情報の測量，最終成果発表会のための設営
佐藤の担当は以下の通り：実装の段取り決め，コンテンツ制作の全体的な指示出し，MIDI 分配の作業，Processing 開発チームの作業，エフェクト制御，射影変換，テロップ操作（※文責: 佐藤僚太，熊木万莉母，村上新，小坂泰貴）

Group Report of 2015 SISP

- 13 -

Group Number 18

MOE MOE Digital Signage 〜Cognition，Design，and System〜

3.3

結果

3.3.1

活動結果

前述のサイネージを制作するために，2.4 で割り当てた課題を各人が行った．提案サイネージは
最終成果発表会で頂いたコメントでは基本的に賛成の意見が多かったが，否定的な意見も少々見受けられた．賛成の意見としては，ピアノを弾いている時にエフェクトが反応して出現するところが面白い，システムを体験したところ弾いていてとても楽しかった，オリジナルキャラクターが可愛い，演奏せずとも見ていて楽しく感じる，コンサートなどの外部でも使用できそう，ピアノの斜めや曲線の面に対しても映像がきれいに投影できている，実際に常設されていたら是非使ってみたい，などであった．否定的な意見としては，キャラクター育成コンテンツが打鍵数だけであるところが単純的すぎる，PC を 2 台使っているためコスト的に１台にしたほうが良い，面白さは伝わるが有益なものと感じない，などであった．以上のようにコンテンツの内容には賛否両論あり，万人に受け入れられる提案を行うことができなかった．加えて，今回の提案ではピアノに投影したコンテンツがエフェクト，キャラクター，テロップなどであったが，実際にピアノそのものに直結するコンテンツが Quartz Composer 開発チームによるピアノの鍵盤のみであった．また，ピアノの鍵
盤もそれを投影し，エフェクトを発生させただけで終わってしまったため，鍵盤を使った応用的な提案ができなかった．そのため，ピアノに投影するという必然性が薄く，ピアノそのものを活かした提案を行うことが必要であると感じた．
また，プロジェクションマッピングを試作するまでの期間が遅く，その影響から後の作業に支障をきたしてしまった．班員を Processing 開発チームと Quartz Composer 開発チームに二分したが，それぞれの進捗具合の把握や，次に行うべき作業を把握できなかったことが原因である．コンテンツとして，音に対応した通行者向けシステム，演奏者向けシステム，聴衆向けシステムをピアノに投影することができた．しかし，当初はエフェクトのテーマを 3 つとする予定だったが，作業の進行が遅れたため，雪のエフェクト 1 つの作成に留まった．また，同様の理由で制作したシステ
ムを設置して通行者，演奏者，聴衆への調査や分析を行うことができなかった．

3.3.2

成果の評価

通行者システム
通行者向けシステムとして，キャラクターの手招き，和音コレクション，利用可能状態を示すテ
ロップを提案した．しかし，通行者が工房内に入りたいと強く感じるサイネージの提案を行うことができなかった．
通行者向けシステムとして，キャラクターの手招き，和音コレクション，利用可能状態を示すテ
ロップを提案した．しかし，コンテンツを振り返ると，通行者が工房内に入るためのコンテンツが利用可能状態を示すテロップ，キャラクターの手招きの 2 点であり，工房に入りたいと強く感じる
サイネージの提案としてはまだ弱いといった結論に至った．
キャラクターが手招きするコンテンツでは，手招きを行っているオリジナルキャラクターを作成
し，ピアノの側面に投影した．ピアノが利用可能な時間帯で手招きを行うような実装をした．これについて，最終成果発表会で「キャラクターが可愛すぎて，逆に近寄りがたい」というコメントを頂いた．
弾いた和音に応じてピアノの側面にアイコンを表示する和音コレクションについては，完全な和Group Report of 2015 SISP

- 14 -

Group Number 18

MOE MOE Digital Signage 〜Cognition，Design，and System〜
音への対応は実現できなかったが，決められた時間内に特定の音を打鍵すると，和音として認識され，それに対応したアイコンがピアノの側面に表示される実装をした．アイコンは，和音 15 種類
を音 12 種類それぞれについて 180 種類作成した．しかし，演奏者自身に達成率としておおよその情報のみしか見ることができないことに加え，和音への理解を補助する工夫の提案を行っていなかったため，「通行者向けというよりは演奏者向けである」「和音がわからない通行者が多いため，
このコンテンツによってピアノを弾きたいと思わない」というコメントを頂いた．
テロップについては，駅の改札のテロップをイメージして工房の利用時間やピアノが利用可能であるかどうかをピアノの側面に表示した．テロップの背景色と文字色について時間を割いて議論を重ね，背景色を黒色，文字色を水色とし，通行者が情報を視認しやすい配色にした．しかし，ただ文字をひたすら流すだけのコンテンツを制作したため，紙媒体で同様の情報を表示することと変わらない提案となってしまった．
通行者向けについて，魅力的なコンテンツを提案することができなかったため，今一度通行者が工房内に入ってピアノを弾きたくなるようなコンテンツについて議論する必要がある．
演奏者システム
演奏者向けシステムとして，打鍵に対応したエフェクト，キャラクターの育成コンテンツや和音の達成率を表示する提案をした．
雪のエフェクトが上から下に移動するコンテンツと背景の動画に対して，ピアノに投影した際に歪みなく投影出来るよう射影変換を行った．エフェクトは雪のエフェクト一種類を用意し，グラン
ドピアノの鍵盤に対応させた 88 種類のエフェクトを作成した．打鍵した音に対応して雪の結晶が降ってくるように見える実装をした．この射影変換を行いながら画像を移動させる実装に多くの時間を割いてしまったため，他の作業の進行に影響を及ぼしてしまった．このエフェクト対する最終
成果発表会のコメントは，概ね肯定的なものが多く，実際にピアノが弾けない人も楽しさを感じな
がらピアノに触れる様子が見られた．
育成コンテンツは，射影変換をしたキャラクター画像を問題なく投影することができ，画像の種
類も成長を楽しめるだけ十分な数を用意することができた．成長するまでの打鍵数に関して議論が甘く，最終成果発表会では，全然成長しないといったコメントがみられた．また，当初の提案ではキャラクターの成長が和音これくしょんと対応しようと考えていたが，作業時間が押してしまい，
打鍵数に対応させる結果となった．
本システムのリピーターを増やすための演奏者向けコンテンツの提案ができたが，演奏者に与える影響の裏付けや，エフェクトのテーマの種類の多様化を進める必要があると感じた．
聴衆システム聴衆システムとして，キャラクターの育成コンテンツや利用時間状態を示すテロップ，打鍵に対応したエフェクトの提案をした．
キャラクターの育成コンテンツは，打鍵数に応じて成長しているように表示することができた．
キャラクター画像や成長過程は，演奏者向けシステムと同様のものとした．最終成果発表会では，演奏者向けシステムと同様のコメントを頂いた．
利用可能状態を示すテロップは，通行者向けのものと同じものを使用した．テロップの流れるス
ピードの制御に苦戦したが，この問題点は解決することができた．しかし，キャリブレーションに
おいて，Quartz Composer におけるキャリブレートを行うための頂点数を増やす実装方法を理解することができなかったため，プロジェクションマッピングする際は 4 つの頂点でキャリブレート

Group Report of 2015 SISP

- 15 -

Group Number 18

MOE MOE Digital Signage 〜Cognition，Design，and System〜を行った．通行者向けのテロップよりも崩れた表示となってしまい，最終成果発表会でもその点を指摘されたコメントを頂いた．
打鍵に対応したエフェクトは，開蓋状態の蓋に鍵盤の画像を投影し，打鍵の様子がわかるような実装をする予定であった．しかし，作業が間に合わず，打鍵に対応して演奏者向け同様の雪のエ
フェクトが発生する実装となった．最終成果発表会では，ピアノの蓋を鍵盤にする発想が面白いといったコメントを頂いた．
聴衆者向けコンテンツでは，Quartz Composer の開発環境において，キャリブレートするための頂点数を増やすなど，精緻なキャリブレーションを行う必要がある．

3.3.3

各人の担当分課題の評価

村上新

5月

エレベーター横のサイネージに，プロジェクトメンバーと担当教員を紹介するコンテンツの制作に携わった．

6月

技術習得のため，大学で行われた OSS セミナーに参加した．また，中間発表のリハーサルで使用するコンテンツの動画を作成した．

7月

TeX 講座へ参加し，TeX 講座で得た知識をメンバーと共有すると共に，グループ報告書の途中経過を TeX に変換する作業を行った．Illustrator と AfterEﬀects を使用してリハーサ
ル段階での動画を作成し，受けたフィードバックを元に絵コンテを再度作成し直した．プロ
ジェクト全体のロゴを作成するため，Illustrator の使い方を独自に学んだ．

8月

オープンキャンパスへ参加し，プロジェクト発表の前半部の発表担当を担った．

10 月 プロジェクションマッピングのエフェクトを Quartz Composer で作成することに決まり，Quartz Composer の習得に努めた．Quartz Composer でエフェクトを作る上で様々な問題に直面し，問題解決のために更なる技術の向上に励んだ．

11 月 市立函館高校見学に伴う発表にて，ピアノ班の発表担当を担った．
12 月 プロジェクションマッピングの準備として，投影する映像を良く見えるようにするため，
ピアノに白いシートを貼り付けた．

熊木万莉母

5月

エレベーター横のサイネージに映すコンテンツの制作を行うため，エレベーター横で娯楽性のあるコンテンツを流せばいいのではないかと提案した．また，Google Drive を利用して週報のテンプレートを作成し，学外からでも週報の投稿が可能になった．

6月

PowerPoint を使用してグループ内のスライドの資料を作成した．

7月

グループ内の A1 ポスターを作成するために Illustrator を使用し，工房での A1 サイズでの印刷を行った．そしてコンテンツの将来的なイメージ画像を Photoshop と Illustrator を使い分けながら作成した．

9月

前期で発表した提案内容を変えるためグループメンバーと話し合いを行った．ピアノがエレクトロニクス工房に届くということで，ピアノを使ってプロジェクションマッピングを行う
提案をすることとした．ピアノが工房に届き，ピアノの設置をメンバーと協力しながら行った．ピアノは MIDI 対応のピアノであったため，MIDI を取得する準備も行った．

10 月 担当は Processing 開発チームであったが，Quartz Composer 班とも情報共有を行いやす
いよう，Quartz Composer の知識も基礎的な部分を習得した．Processing で MIDI を取Group Report of 2015 SISP

- 16 -

Group Number 18

MOE MOE Digital Signage 〜Cognition，Design，and System〜
得できることを確認し，Quartz Composer でも MIDI を取得するため，MIDI の取得方法を調べた．2 台の PC でそれぞれ MIDI を取得するため，MIDI 分配器を使用して佐藤と共に作業を行った．市立函館高校がプロジェクトの見学に来るため，Quartz Composer を使ってデモの準備，動作確認を行った．Processing で動かすための背景に流す雪の動画をAfterEﬀects で作成し，動画ファイルサイズを軽くした．
11 月 ピアノの全鍵盤に対応するよう，雪の結晶のエフェクトを制作した．コンテンツのオリジ
ナルキャラクターを Photoshop で作成した．コンテンツのロゴの作成を Photoshop で行った．A1 ポスターの作成を行い，修正と改変を繰り返した．和音演奏時に出現するアイコン
を絵柄 15 種類，色違い 12 色を作成した．

12 月 発表の際のスライドの作成を行った．発表時に流すためのデモ動画の作成を行った

小坂泰貴

5月

本学エレベーター横に，新たに設置予定のサイネージに映すコンテンツの制作準備を行った．プロジェクト担当教員とメンバー全員にアンケートを行った．実施したアンケートを使ってプロジェクトのメンバー紹介をするコンテンツを作成した．平田・竹川研究室付近のエレベーター横に新たに 3 台のサイネージの増設設置を行った．

6月

プロジェクト内で設置したサイネージの保守点検係に任命された．サイネージにコンテンツが映っているかの確認を行い，映っていない場合はメンテンナンスを行った．サイネージで使う写真を 20 枚程撮った．

7月

中間発表では全体の発表をする担当になった．プロジェクト内グループでの発表とは別に，
サイネージに関する前提知識スライドと A1 ポスターの作成を行った．

10 月 後期に入り，ピアノを用いたデジタルサイネージに案が切り替わったため，開発言語として取り扱う Quartz Composer のプログラム作成方法などを学んだ．工房に置かれるピアノが MIDI を取得可能であり，成果物に MIDI を利用することとなったため，自分の PC で取得する方法を調べた．

11 月 高校生にプロジェクト学習の面白さを伝えるための発表があり，自分の班のスライド発表を行った．担当教員からのアドバイスにより，自分たちの担当していたサイネージもピアノにプロジェクションマッピングで行うこととなった．この時点までの制作物をプロジェク
ションマッピング用にプログラム変更を行った．最終発表会に向けた A1 ポスターに載せる情報として，ピアノの製品情報や扉からの距離，プロジェクターの角度や大きさなどをまとめ，ポスター作成の担当者に教えた．自分の担当していたコンテンツの作成が，実際にピアノにプロジェクションマッピングを行うときに座標を調整するのみという段階になったので，他担当者の仕事の手伝いを行った．Photoshop を利用し，エフェクトのサイズ変更や色違いの作成，アイコンの背景透明化，和音の種類を全て書く作業などを行った．

12 月 プロジェクションマッピングを行うためのプロジェクターの位置の再調整や，ピアノにプ
ロジェクションマッピングを映すためのテープの貼り付けなどを行った．プロジェクション
マッピングを実際にピアノに行い，画像やエフェクトの出現位置などの座標調整を行った．

佐藤僚太

5月

エレベーター横のサイネージに映すコンテンツの制作を行うため，エレベーターの待ち時間を測定し，コンテンツが流れる秒数などを考え，サイネージを制作する情報とした．グルー

Group Report of 2015 SISP

- 17 -

Group Number 18

MOE MOE Digital Signage 〜Cognition，Design，and System〜
プで行われたことについて議事録をとり，毎度プロジェクトが始まる前に確認を行うこと
で，前回の話し合いの続きを脱線することなく行うことが出来た．

6月

楽曲作成サイネージや双方提供コンテンツの提案を行い，イメージするコンテンツの動作手
順をメンバーに共有した．Processing を使用して，実装を行い，リハーサルではデモとして
発表した．

7月

スライド資料の下書きや原稿の作成を行い，この下書きをもとにスライドを熊木が修正し，原稿については発表するメンバー同士で共有を行った．Google のスプレッドシートを利用して，中間発表時の評価者，発表者担当振り分けを表にしてまとめ，PWG への提出を行った．グループ報告書を TeX による文章の変換を行い，体裁を整えた．

10 月 Processing を用いたプロジェクションマッピングのプログラミングについて知識を深めた．ピアノが工房に設置されたためピアノを使ったコンテンツ制作に取りかかった．

11 月 高校生に対してプロジェクト学習について発表を行った．プロジェクションマッピングを行うための射影変換を行ったプログラミングを行った．

12 月 コンテンツをピアノに投影しながら制作した．
（※文責: 佐藤僚太，熊木万莉母，村上新，小坂泰貴）

Group Report of 2015 SISP

- 18 -

Group Number 18

MOE MOE Digital Signage 〜Cognition，Design，and System〜

3.4

今後の課題と展望

わたしたちは，学生利用の機会を増やすためのピアノ型のデジタルサイネージの提案を目的としていた．そのために，ピアノへの不安感を払拭し，ピアノに興味がある人全員に弾いてもらことを目指し，プロジェクションマッピングによる実現を図った．このシステムを通行者に向けたもの，
聴衆に向けたもの，演奏者に向けたものの 3 つに分け構成した．
通行者向けコンテンツについて，工房内に入りたいと思わせる十分な提案をすることができなかったため，今一度議論する必要がある．聴衆向けコンテンツについて，より精緻なプロジェク
ションマッピングのための座標合わせと，エフェクトの種類の多様化が求められる．演奏者向けコンテンツについて，システム体験者の評価が概ね良好であったため，エフェクトの多様化やシステ
ム利用による影響のデータ収集をすることで，コンテンツを発展させる．
今回の最終成果発表会では，実装したいと思うコンテンツ全てについて実装することが叶わなかった．より計画性のあるコンテンツ制作と，偏りのない仕事分担が必要である．秋葉原に向けたコンテンツ発表会では，以上の反省を踏まえ，より魅力的なシステムを制作する．そして，システ
ムの学内設置を目指し，ピアノを通したコミュニケーションの活性化を目指す．
（※文責: 佐藤僚太）

Group Report of 2015 SISP

- 19 -

Group Number 18

MOE MOE Digital Signage 〜Cognition，Design，and System〜

第 4 章 食堂班
概要
本グループは，本学学内で調査を行いそこから本学学生が必要としているコンテンツを調査し目的を立て実装を行うグループである．前期に食堂利用に関するアンケートを本学学生 100 名に対し行った．その結果，食堂に焦点をおくことに決めた．また待ち時間と売りきれ表示に関する意見をもらい，メニューを受け取るまでの待ち時間表示コンテンツと目の前でメニューが売り切れてしまうのを少しでも防ぐ情報提供コンテンツの２つの案を提案した．後期では班員をシステムチームと動画チームの 2 つのチームを編成しコンテンツ制作を行った．待ち時間を表示するために必要な情報を得るために，本学学生がメニューを受け取るまでの時間を計測し，統計にまとめた．しかし Web カメラの顔認識の限界と生協専務理事の鏡秀隆氏との話し合いを重ねていくうちに待ち時間表示のコンテンツは待ち時間の表示の仕方によって食堂を利用する本学学生が少なくなり，食堂利用者が減少してしまうといったデメリットの方が強く，実現不可能となりコンテンツ案を練り直した．まず着目した点として，メニューにお好みの調味料をかけて自己流の食べ方をしている本学学生がいることである．次に本学学生の健康面を配慮することである．最後に生協側からの新メニューや限定メニューの告知ポスターである．これ
らの点より本学学生と生協側，双方にメリットのあるコンテンツの提案を行った．１つ目は本学学生が自己流の食べ方などを投稿することができ，他の食堂利用者が自由に閲覧することのできるシステムを提案した．２つ目は本グループが三群点数法に基づいて組み合わせメニューを考え，本学学生に少しでも栄養のある食事をしてもらう動画コンテンツを提案した．３つ目
は生協からの新メニューや限定メニューをスライド形式で紹介するコンテンツを提案した．最
終的に学内の食堂前に実際に設置し稼働させた．本学学生だけではなく，食堂を利用しているすべての人が投稿，閲覧可能とした．本コンテンツを食堂前に設置することで本学学生の食堂
利用者が増え，食堂利用促進へと繋がることを目標とする．
キーワード

デジタルサイネージ，公立はこだて未来大学，食堂，生協，本学学生，情報提供（※文責: 八幡望）Group Report of 2015 SISP

- 20 -

Group Number 18

MOE MOE Digital Signage 〜Cognition，Design，and System〜

4.1

はじめに

4.1.1

背景

本学にデジタルサイネージを設置するにあたって，本学学生が学校生活で欲しい情報とは何かについて知るために，本学学生に直接インタビューして意見を集めた．集めた意見をグループ内で議論した結果，お昼時食堂が混んでいる，食堂でメニューを受け取るまでに列に並んでいる時間が長い，といった食堂に関する意見に注目した．そして我々は食堂にデジタルサイネージを設置することで，多くの本学学生にデジタルサイネージを閲覧してもらい，食堂に関する問題を少しでも解決できるのではないかと考えた．我々は，食堂利用の現状を知るために本学学生 100 人にアンケー
ト調査を実施した．それを基に前期は 2 つのコンテンツ案を考えた．1 つ目はこれから食堂を利用する本学学生に向けて．メニューを受け取る際に，列に並んでからメニューを受け取るまでにかかる待ち時間を伝えるコンテンツである．待ち時間を具体的に伝えることにより，実際に列に並んで待っているときの体感時間や，現状の列の長さを見て想像する待ち時間よりも，意外とメニューを受け取るまでの時間が短いということを伝えることができるのではないかと考えた．2 つ目はメニューを受け取るまでの列に並んでいる本学学生に向けて，列に並んでいる暇な時間を解消するた
めに，函館や本学のイベント情報などを表示するコンテンツである．少しでも列に並んでいる時の体感時間を短く感じさせることができるのではないかと考えた．中間成果発表会でのフィードバッ
クを受け，コンテンツ案を変更した．1 つは，前期と同様で待ち時間を伝えるコンテンツである．
もう 1 つは，メニューに好みの調味料をかけて自己流の食べ方をしている本学学生がいることに着目し，本学学生の昼食を紹介する投稿型のコンテンツである．その後，鏡氏と打ち合わせした．待ち時間コンテンツについては，具体的に待ち時間を表示することで，本学学生が食堂で食事をする
ことを諦めて別の場所に行ってしまうのではないかといった生協側にとっての不安を解決する案の必要性があった．一方で，投稿型コンテンツについては本学学生にとってメリットはあるものの健
康的な食事の提供をめざす生協側にとってのメリットが弱いという指摘をうけた．食堂にデジタル
サイネージを設置するにあたり，食堂の利用者である本学学生だけでなく，食堂を運営する生協側のメリットも考える必要があった．そこで我々は前期に行ったアンケート調査の結果を見直した．
現状として，6 割以上の本学学生が週の半分以上食堂を利用しており，メニュー選びの際に値段と新メニューや期間限定メニューを気にしているということが分かった．その反面，カロリーを気にしてメニューを選んでいる学生が少なく，あまり健康を気にしていないということが分かった．また，生活協同組合専務理事の鏡氏へのインタビューから，本学学生に常日頃食べているメニューに小鉢やみそ汁などをプラスして健康的な食事を摂ってほしいという生協側の狙いが判明した．しかし，この健康的な食事を摂取することについての情報は本学学生に伝わっていないという現状がある．加えて，新メニューや期間限定メニューの告知がポスターだけであり，本学学生に対する告知
力が弱いということも現状として挙げられる．以上のことから我々は本学学生側と生協側の双方にメリットをもたらすことが可能であるコンテンツを提案した．

4.1.2

現状における問題点とコンテンツの目的

現状の問題点は以下のことが挙げられる．一人暮らしをしている本学学生が多く，メニューを選
ぶ時に値段を気にするということがアンケート調査から分かった．そのため，丼類や麺類１品で食事を済ませたり，常日頃同じようなメニューを選んだりしている．これは健康的な食事を摂ってほGroup Report of 2015 SISP

- 21 -

Group Number 18

MOE MOE Digital Signage 〜Cognition，Design，and System〜
しいという生協側の狙いが達成されていないということが言える．しかし，健康ばかりを本学学生に意識させてしまっては，自己流の味付けをしたり，好みのメニューを組み合わせたりしている本
学学生の楽しみを奪ってしまうのではないかと考えた．また，新メニューや期間限定メニューなどの紹介がポスターだけであり，生協の告知力が弱い．以上の問題点から，我々は 3 つのコンテンツを提案した．1 つ目は投稿型コンテンツである．このコンテンツの目的は，色々な食べ方やメニューの組み合わせを知ってもらうということである．本学学生が自己流の味付けやメニューの組み合わせ，新メニューを食べた感想などを写真とコメントで投稿することによって，食べ方やメニューの組み合わせ，感想を共有することができると考える．また，常日頃同じようなメニューで食事を済ませてしまう本学学生のメニュー選びのきっかけになることを期待する．2 つ目はおすすめの組み合わせコンテンツである．このコンテンツの目的は，未来大生にバランスのよい食事をしてもらうということである．常日頃値段を気にして丼類や麺類 1 品だけを食べている本学学生に，
プラス 1 品加えることにより栄養を補うことができるメニューを組み合わせて紹介する．これにより本学学生に栄養バランスを考えるきっかけを与えることができるのではないかと考える．また，

1 つ目の投稿型コンテンツだけでは健康的な食事の提供を目指す生協側にとってメリットがないという問題点が挙げられたが，おすすめの組み合わせコンテンツと並べて表示することによってお互いのコンテンツのデメリットをカバーし合えるのではないかを考える．3 つ目は生協の告知コンテンツである．このコンテンツの目的は新メニューや期間限定メニューをより知ってもらうということである．新メニューや期間限定メニュー，生協からのお知らせを紹介する．これにより，生協の告知の場が増える．また，本学学生にとっては食堂のメニューを知ってもらえるというメリットがあると考える．
（※文責: 赤平優莉）

Group Report of 2015 SISP

- 22 -

Group Number 18

MOE MOE Digital Signage 〜Cognition，Design，and System〜

4.2

課題解決のためのプロセス

4.2.1

調査内容

インタビュー

6 月 19 日に我々の周りの本学学生約 20 名に本学での不満や欲しい情報についてインフォーマルなインタビューを行った．インタビューが終わった後それぞれが収集した意見をまとめた．出た意
見として，• 食堂の空席状況を知りたい• 食堂の商品を受け取るまでの待ち時間を知りたい• 教授の誕生日が知りたい• スタジオの空席状況を知りたいなどがあったが，食堂に関する意見が多かった．このことから話し合いの結果，食堂に焦点を当てることにした．
アンケート調査
本学学生の食堂利用の現状を知るために 6 月 24 日に食堂利用に関するアンケート (質問紙調査)を実施した．アンケートは 1 年生 36 名，2 年生 14 名，3 年生 49 名，4 年生 1 名の計 100 名に本
グループ全員で手分けして行った．以下は実際に質問したアンケート内容の詳細である．なお，()
内は記述形式を表している．

1. 食堂の利用頻度 (1 つ選択)• 毎日
• 週 3〜4 日• 週 1〜2 日• ほとんど利用しない
2. メニュー選びの基準 (優先順位の高いものから最低 3 つ選択)
• 値段
• 新商品や限定メニュー• 列の並び具合• カロリー• いつも食べてるもの• その他
3. 食堂利用に対する不満 (自由記述)
4. 食堂内に座る席がない場合の対応 (1 つ選択)
• とりあえず商品を買いに並ぶ• 食堂の利用を諦める• 席が空くのを待ち，席を取ってからメニューを買いに並ぶ
5. 食べようと思っていたメニューが売り切れてしまった場合の対応 (自由記述)
6. 食堂を利用する理由 (自由記述)

Group Report of 2015 SISP

- 23 -

Group Number 18

MOE MOE Digital Signage 〜Cognition，Design，and System〜
アンケート実施後，選択項目に関しては結果をグラフ化した．自由記述のものは模造紙に付箋で張り出しカテゴリ毎にまとめた．このアンケートの中から，食堂の利用頻度についてグラフ化した
ところ，全体の約 6 割が週 3 日以上食堂を利用していることが分かった (図 4.1 )．

図 4.1

食堂利用頻度同様に，メニュー選びの基準についてグラフ化したところ，値段を気にする人，新メニューや限
定メニューを気にする人が多かった．その反面，カロリーを優先して考えている人が少ないことから健康をあまり意識していない人が多いことが分かった (図 4.2 )．

図 4.2

メニュー選びの基準

図 4.2 の優先度 (点数化) については，メニューを選ぶとき何から優先するかについてを点数化して決めたものである．1 番優先するものを 5 点，2 番目を 4 点，3 番目を 3 点，4 番目を 2 点，5番目を 1 点とし，それぞれの項目の人数とかけた．例えば，値段の項目では表 4.1 のような優先順
位と人数が得られている．
表 4.1

Group Report of 2015 SISP

値段の優先度

優先順位

人数

1

29

2

27

3

22

4

2

5

2

- 24 -

Group Number 18

MOE MOE Digital Signage 〜Cognition，Design，and System〜
1 位の配点が 5 点で人数が 29 人なので 5 × 29=145 点，2 位以降も同様に 4 × 27=108 点，3 ×
22=66 点，2 × 2=4 点，1 × 2=2 点で総和は 325 点となり，これが図 4.2 の値段の優先度を点数化したものになる．
食堂の観察

10 月 5 日から 10 月 30 日までの約 1 ヶ月間にわたり食堂の並び具合に関する調査を実施した．
調査時間は食堂が開店する午前 11 時から午後２時までであった．２人１組で調査を行い，月曜日
から金曜日までローテーションで行った．計測機としてストップウォッチ，パソコンを使用し，計測次第パソコンで記録をした．丼類と麺類にそれぞれどのくらい並んでいるかを調べた．実際に調査した内容の詳細を表 4.2 に示す．
表 4.2

調査内容

性別
メニュー (丼 or 麺)並び始めた時間
どのくらいの時間並んだかどのくらいの時間並んだかに関しては，前に並んでいる人がいない場合はおぼんを持ってから，前に並んでいる人がいる場合は最後尾についてから商品を受け取るまでを計測した．調査を終えた
後各週の統計を，最終日の調査が終わった後は 1 ヶ月間の統計をとり，まとめた．丼と麺の 1 人当たりの平均待ち時間を出した後，表 4.3 に示す項目の統計をとった．
表 4.3

統計項目

平均時間/人丼に並んでいる人の合計
麺に並んでいる人の合計
丼の平均人数
麺の平均人数
丼がピーク時でないときの平均時間/人麺がピーク時でないときの平均時間/人丼がピーク時のときの平均時間/人麺がピーク時のときの平均時間/人
統計から，麺と丼のそれぞれの平均待ち時間/人を割り出すことが出来た．丼の平均待ち時間は
約 3 分，麺の平均待ち時間は約 3 分 30 秒と，丼の人の方が麺の人より並んでいる時間が短いことが分かった．また，これらの平均時間はあくまで全日程の平均時間であるので当然時間によって待ち時間は変わる．例えば，ある曜日の丼類と麺類それぞれの待ち時間を時間ごとに表したものを表4.4 と 4.5 に示す．

Group Report of 2015 SISP

- 25 -

Group Number 18

MOE MOE Digital Signage 〜Cognition，Design，and System〜
表 4.4

丼の時間ごとの待ち時間

時間

待ち時間 (秒)11:00〜11:10

0

11:10〜11:20

0

11:20〜11:30

0

11:30〜11:40

86

11:40〜11:50

122

11:50〜12:00

101

12:00〜12:10

149

12:10〜12:20

185

12:20〜12:30

0

12:30〜12:40

85

12:40〜12:50

182

12:50〜13:00

0

表 4.5

麺の時間ごとの待ち時間

時間

待ち時間 (秒)11:00〜11:10

0

11:10〜11:20

0

11:20〜11:30

0

11:30〜11:40

94

11:40〜11:50

206

11:50〜12:00

120

12:00〜12:10

159

12:10〜12:20

250

12:20〜12:30

200

12:30〜12:40

0

12:40〜12:50

0

12:50〜13:00

0

ピーク時は表から，丁度昼休みが始まる時間である 12:10〜12:20 にきていることが分かる．ピー
ク時の待ち時間は丼は約 3 分，麺は 4 分 10 秒と，丼は上記の平均待ち時間と同じだが麺は平均待ち時間よりも長い．反面，ピーク時でないとき (0 秒を除く) は，11:30〜11:40 となっている．丼の待ち時間は約 1 分 25 秒，麺の待ち時間は約 1 分 35 秒と比較的あまり並ばなくて済み，上記の平均待ち時間よりも早く商品を受け取ることができる．これらから早く商品を受け取れる時間，商品を受け取るのが遅くなってしまう時間があることが分かった．

Group Report of 2015 SISP

- 26 -

Group Number 18

MOE MOE Digital Signage 〜Cognition，Design，and System〜

鏡氏との打ち合わせ
本格的にデジタルサイネージを設置させてもらうために，鏡氏と 4 度の打ち合わせを行った．連絡手段として web メールを使い，事前に日時などの相談を行った．

1 度目は 10 月 30 日 10:00 に行った．本学学生の食堂利用の現状，デジタルサイネージを設置する目的，また，コンテンツ案として，• 後の 4.4 章に出てくる，色々な食べ方やメニューの組合せを知ってもらうための投稿型コンテンツ– タッチ式ではないデジタルサイネージを用いて，投稿フォームから投稿されたタイト
ル・コメント・画像を動画としてデジタルサイネージに反映• 4.5 章に出てくる，どのくらいで商品を受け取れるかを知ることが出来る待ち時間表示システム– 顔認識システムを活用して並んでいる列の長さを認識し，統計データを合わせて平均待ち時間を計算し，デジタルサイネージに表示• デモムービー・フライヤー作成，待ち時間調査
設置内容として，• ディスプレイの設置場所– 食堂の入り口付近にあるメニューの隣の位置になるように食堂の中から外に向けてガラス壁に取り付ける– 電源を借用できるか否か (11:00 に電源を入れて 14:00 に電源を切る)– 11 月 6 日 (金)〜11 月 27 日 (金) を予定• ディスプレイに接続する PC の設置場所– ディスプレイにつないで邪魔にならない場所へ設置– 11 月 6 日 (金)〜11 月 27 日 (金) を予定• 人数を認識するためのカメラの位置– 購買の雑誌コーナーの向かいにある網の柵に列の後ろへ向けて設置• おぼんにのせるフライヤー– 初めは 1 日 30 枚くらいをおぼんに乗せ，様子を見て枚数を調整– 食堂の方の手がかからないように設置は自分たちで行い，回収箱を設置– 11 月 13 日 (金)〜11 月 27 日 (金) を予定

上記の内容を提案した．
投稿型コンテンツや設置内容については了承を得られた．しかし，待ち時間表示システムについては「待ち時間を表示することによって食堂以外の場所へ行ってしまうのではないかという不安が大きい」とのコメントが得られた．

2 度目は 11 月 9 日 14:00 に行った．前回あまり良い評価を得られなかった待ち時間表示システ
ムを中心に，• 待ち時間表示システムのメリットやデメリット– メリット：本学学生の行動を変える，心を動かす– デメリット：他の飲食店に行ってしまう
Group Report of 2015 SISP

- 27 -

Group Number 18

MOE MOE Digital Signage 〜Cognition，Design，and System〜• ネガティブな捉え方をされないように改めた修正コンテンツ案– 例えば，今日は 11:30 くらいが並ばずに買えるよ！など食堂に誘導するような言葉で表現• 投稿型コンテンツの実施概要– 投稿システムがどういうものなのかを未来大生に知ってもらうための宣伝動画を流す– 投稿方法を提案した．
やはり待ち時間表示に関しては良い返事を聞くことが出来なかった．更に今回は投稿型コンテンツの内容についてもあまり良い評価を得ることが出来なかった．

3 度目は 11 月 13 日 16:00 に行った．前回の打ち合わせは自分たち学生の視点ばかりであったことに気付き，生協側と本学学生側双方にメリットがあるような後の 4.4.2 で出てくる組合わせコン
テンツを提案した．鏡氏が分かりやすいように栄養素の値をグラフ化 (可視化) した．この案については了承を得られた．

4 度目は 11 月 20 日 15:30 に行った．実際にデジタルサイネージに投影する投稿型コンテンツ，
組合せコンテンツ，後に出てくる 4 章の告知コンテンツの動画を鏡氏に見てもらった．これら 3 つのコンテンツの了承を得ることが出来た．

4.2.2

到達目標

本学学生がコンテンツを見ることによって，生協側と本学学生側双方の利益になるような目標として，• 食堂利用機会の増加• メニュー選びのきっかけ• 健康への興味

上記 3 つをあげ，これらを満たすようなコンテンツを目指す．
（※文責: 石垣愛美）

Group Report of 2015 SISP

- 28 -

Group Number 18

MOE MOE Digital Signage 〜Cognition，Design，and System〜

4.3

課題解決のためのプロセスの詳細

4.3.1

作業過程

5月
・もえもえプロジェクト発足
プロジェクトメンバーが決定し，初回の集まりでプロジェクトの概要の説明を受けたり，グループ分けを行ったりした．本グループのリーダーは赤平，サブリーダーは石垣となった．
・エレベータ前に設置するコンテンツの案出しプロジェクトが発足してすぐに，担当教員の方から全グループに対しエレベータ前にあるディスプレイに放映するグループ紹介の動画を制作するという課題が出されたため，グルー
プメンバー全員でどのような動画を制作するかという案出しを行った．どうしたら人が立ち止まって動画を見てくれるかということを考えて案を考えた結果，メンバー紹介をストップ
モーションムービーで行うという案に決定した．
・動画の撮影，編集決定した案に基づき，動画の撮影を行った．ストップモーションムービーはメンバー全員が作成したことが無かったため，動画サイトなどで既存のムービーを見て参考にしながら，絵コンテの案を考えた．案が固まった後，実際に撮影を行った．静止画が全て揃った後，ス
トップモーションムービーにするためそれらを繋ぎ合わせ動画にする作業を Windows ムー
ビーメーカーを使用して行った．また，グループの方針は，スライドショーで作成した．

6月
・平田・竹川研究室との合同発表会

6 月 12 日 (金) の 4，5 限目に平田・竹川研究室の先輩方と合同での発表会が行われた．発
表では，グループの活動の流れや，1 年間の目標，調査する内容や展望などを発表した．プ
レゼンテーションは石垣が行った．
・インフォーマルインタビュー
本プロジェクトの対象である本学学生をどうすれば動かすことができるのかを考えていくた
め，本学学生に対してインフォーマルなインタビューを行った．調査の内容は主に，本学で不便と感じるところ，デジタルサイネージで欲しい情報とした．調査の結果，食堂に関する意見が多数挙げられた．
・食堂質問紙調査アンケート作成
聞き込み調査の結果から，食堂に関する調査を行うことになったため，食堂質問紙調査のためのアンケートを作成した．アンケートの質問内容は以下の通りである．
・メニュー選びの基準
・食堂利用に対する不満・食堂内に座る席がない場合の対応
・食べようと思っていたメニューが売り切れてしまった場合の対応

Group Report of 2015 SISP

- 29 -

Group Number 18

MOE MOE Digital Signage 〜Cognition，Design，and System〜
・食堂を利用する理由
・質問紙調査の実施
作成した質問紙を本学学生 100 人に対しグループメンバー全員で配布し，質問紙調査を実施
した．
・調査結果のまとめ
質問紙調査が終わった後，選択項目の調査についてはグラフ化し，自由記述項目の調査については同じ意見や類似する意見をまとめた．席，列，給水器などの混み具合に関する不満が全体の 69 パーセントを占めるという結果が出た．また，自分が食べたいと思っていた商品が直前に売り切れてしまうなどの売り切れに関する不満も自由記述から挙げられた．
・食堂におけるコンテンツの案出し調査の結果を踏まえたうえで，具体的なコンテンツの案出し，ブレインストーミングを行った．具体的な内容までは決まらなかったが，「並んでいる人に少しでも暇を感じさせない」，「在庫，売り切れ情報を分かりやすく表示する」というようなデジタルサイネージを制作していくという方針に決定した．

7月
・コンテンツ案の具体化
どのようなデジタルサイネージを制作していくかが決定したところで，それらについての具体案をグループメンバー全員でブレインストーミングやインターネットでの調査により考えていった．「並んでいる人に少しでも暇を感じさせない」デジタルサイネージについては，並んでいる人が見ることができる短い期間のコンテンツをいくつか繋ぎあわせたものをデジ
タルサイネージを利用して表示するという案に定まった．「在庫，売り切れ情報を分かりやすく表示する」デジタルサイネージについては，商品が売り切れたときにリアルタイムで知らせ，売り切れている商品が常に分かるような仕組みにするという案に決定した．
・中間発表の準備
中間発表に向けて，発表スライドの作成，A1 ポスターの作成を行った．また，スライドに載せるコンテンツのデモ動画の制作を石垣，西村が行った．スライド，ポスターの完成後は，プロジェクト内でのリハーサルとその後の改善を数回行った．発表終了後は，評価シー
トをメンバー全員で読み，今後の改善に活かしていけるようにまとめた．

8月
・後期スケジュールの確認，各メンバーによる課題の決定
中間発表が終わった後，後期のスケジュールの予定を立てた．また，何を使ってどのように，どんなコンテンツを作るのかという具体的な案を考えること，それに必要と考えられる知識や技術を習得することをメンバー全員の夏休み中の課題とした．
・オープンキャンパスへの参加

8 月 6 日にオープンキャンパスが行われ，もえもえプロジェクトも参加した．中間発表で使Group Report of 2015 SISP

- 30 -

Group Number 18

MOE MOE Digital Signage 〜Cognition，Design，and System〜
用した A1 ポスターやデモ動画を使用し，高校生に対してプロジェクトの概要や活動内容を
説明した．

9月
・ニセコでのマネジメント計画発表
北の 4 大学（公立はこだて未来大学，室蘭工業大学，小樽商科大学，帯広畜産大学）が集まり，マネジメント計画発表がニセコで行われた．本グループからは石垣，西村が参加した．

10 月
・後期プロジェクトの活動計画の確認
プロジェクトメンバー全員で，後期の活動方針について確認し，前期の反省とそれを後期どのように活かして行くかを話し合った．
・コンテンツ概要の話し合い，コンテンツ制作
夏休みに各メンバーが考えてきた案をもとに，コンテンツ概要について話し合いをした．また，コンテンツを制作していくにあたって，列に並ぶ待ち時間を表示するシステムを開発するシステム班（八幡，武田），動画を制作する動画班に分けた．システム班は，OpenCV を利用して web カメラで並んでいる人数を認識するという方針でプログラミングを進めた．
動画班は，制作する動画の内容についての案を出した．
・食堂の列の待ち時間調査
列に並んでいる人数に対する時間の統計を取るために，昼休みにグループメンバーが交代で待ち時間の調査を行った．ラップタイマー等を用いて並んでいる人数毎の時間を計った．調
査期間は約１ヶ月であった．
・コンテンツ概要の変更

web カメラで並んでいる人数を認識することが技術的に厳しいという状況に陥ったため，待ち時間表示の実装の代わりに自分の食べた昼食のメニューや組み合わせの画像やコメントを投稿できるという投稿型コンテンツを制作することになった．
・市立函館高校の生徒への発表

10 月 23 日に，市立函館高校の生徒へ向けたプロジェクト学習の発表が行われた．スライドやデモにより，活動内容や制作しているコンテンツの紹介を行った．

11 月
・生協専務との交渉
デジタルサイネージを食堂に設置する許可を得るため，鏡氏との交渉を行った．数回にわたる交渉の中で，本学学生にメリットがあっても生協側にメリットが無いとのご指摘を受け，コンテンツ概要を見直した．その後も，デジタルサイネージ設置に関して何度か話をした．

Group Report of 2015 SISP

- 31 -

Group Number 18

MOE MOE Digital Signage 〜Cognition，Design，and System〜
・進捗報告会

11 月 6 日にプロジェクト内で進捗報告会が行われ，担当教員全員と平田・竹川研究室の先輩方にコンテンツについてレビューを受けた．投稿サイトに関しては，いいね機能のデータの管理や溜まったものをデジタルサイネージにどのように反映するのかということを考えていった方が良いとの意見をもらった．
・コンテンツ概要と役割分担の見直し
コンテンツ発表会で頂いたアドバイスをもとに，コンテンツ概要の見直しを行い，完成へ向
けての道筋を立てた．また，生協専務からのご指摘から，制作物を投稿型コンテンツ，おす
すめの組み合わせコンテンツ，生協の告知コンテンツの 3 つとした．投稿型コンテンツを八幡，武田，西村が，おすすめの組み合わせコンテンツと生協の告知コンテンツを赤平，石垣が制作することに決定した．
・コンテンツ制作
各班，完成に向けてコンテンツ制作をした．投稿型コンテンツについては，コンテンツ発表
会の段階のものから，様々な改良を重ねていった．主に WordPress を用いて制作していき，
デザインやシステム等を改良した．システムについては，WordPress のプラグインによって自動更新を実装したり，投稿画面をより見やすくするために，PHP のコードを変更したりした．おすすめの組み合わせコンテンツについては，栄養バランスの取れたメニューの組み合わせを考え，その組み合わせを紹介する動画やストップモーションムービーを Windows
ムービーメーカーや Illustrator を用いて制作した．生協の告知コンテンツについては，生協の公式サイトに掲載されている新メニューや期間限定メニューの画像を Illustrator で編集し，スライドショーを作成した．また，食堂のおぼんに置くフライヤーを Illustrator によって作成した．

12 月
・サイネージの設置
制作物が全て完成した後，実際に食堂にデジタルサイネージを設置するための準備を行った．デジタルサイネージは，キャスター付きの台にネジなどで取り付け，それを食堂入口付
近に設置するという手法を取った．設置期間は 2 日間であった．
・最終発表の準備
最終発表に向けて，発表スライドや A1 ポスターの作成を行った．前期と同じようにスライド，ポスターの完成後，リハーサルと改善を数回行った．前期とは異なり，スライド発表とポスターセッションという形式であったため，どのように説明するかを考え，練習を行った．

4.3.2

各自の課題割り当て

投稿型コンテンツの制作（八幡，武田，西村）
投稿型コンテンツは主に WordPress や WordPress 内の HTML，CSS，PHP のコードを変更することにより制作した．まず，WordPress を使用できるようにするためにサーバーの設定を行った．サーバーは簡易のレンタルサーバーを使用し，データの管理を行った．WordPress を使用でGroup Report of 2015 SISP

- 32 -

Group Number 18

MOE MOE Digital Signage 〜Cognition，Design，and System〜
きるようにした後，投稿が見やすいようなテーマを定め，メニューや背景などの外観の設定を行っ
た．投稿画面は，ユーザーになるべく分かりやすいようにと余計なメニューやボタンを排除した．
ヘッダーの画像は，食堂のメニューの画像を組み合わせた画像となっている．また，ログインを行った後，直接投稿ページが表示されるような設定をした．WordPress のプラグインによって，設定した間隔でサイトが自動的に更新される自動更新機能や，気に入った投稿にいいねを付けることのできるいいね機能などの実装を行った．投稿サイトが完成した後，PC のディスプレイを縦に設定し，F11 キーによりタスクバー，メニューバーを非表示にしてタッチディスプレイに反映させた．
動画制作（石垣，西村）
撮影した動画に Illustrator で作成したイラストや写真を合成したり，Windows ムービーメー
カーで静止画を繋ぎあわせたり，テロップを表示させたりすることでおすすめの組み合わせコン
テンツの動画を作成した．また，発表時に使用するデモ動画の作成は，実際に使用しているところの動画を撮影し，Illustrator で作成したイラストを合成したり，Windows ムービーメーカーでテ
ロップを表示させることによって作成した．
顔認識プログラムの作成（八幡，武田）
列に並んでいる人数を数え，待ち時間を表示するプログラムの準備段階として，顔認識を行うプログラムを作成した．OpenCV による顔認識のプログラムを編集するという方法を取った．言語は Processing を使用した．また，openFrameworks を使用した顔認識も行った．認識の際にはweb カメラを使用した．
スライドショーの作成（赤平）
大学生協公式サイトのメニューの画像や，鏡氏からいただいた新メニューや期間限定メニューの広告の画像を Illustrator によって値段の表示やデザインの変更などの編集を行い，生協の告知コ
ンテンツのスライドショーの作成を行った．
フライヤー制作（赤平，石垣）
食堂のメニューの画像を Illustrator によって編集することにより作成した．また，投稿サイトの QR コードや投稿の仕方の説明を載せた．

A1 ポスターの作成（赤平）
Illustrator で A1 ポスターを作成した．
スライドの作成（武田）PowerPoint を用いて発表スライドの作成を行った．その後，各メンバーによる修正も行った．
（※文責: 武田誠）

Group Report of 2015 SISP

- 33 -

Group Number 18

MOE MOE Digital Signage 〜Cognition，Design，and System〜

4.4

各人のコンテンツ制作における担当分課題とその評価

4.4.1

八幡望

10 月
待ち時間を表示するシステムを開発するための準備として大学内の Library へ行き，開発
言語の習得を独学で学んだ．それを元に人の顔を認識することのできるプログラムを作成した．このプログラムは解像度は低いものの Processing と OpenCV を用いて作り上げることができた．その人の顔を認識することのできるプログラムを応用して列に並んでいる人数を認識するプログラムを制作することとした．このプログラムは C++ で動画を 1 フレームの画像に分け，その画像 1 つ 1 つに 2 値化を適応し，列の長さを観測していく方法をとろうとした．また，待ち時間を表示するための基準を決めるために食堂に 10 月の 1 ヶ月間，統計を取った．しかし，正確に列を認識できないことやカメラの解像度の限界があり，待ち時間を表示するシステムは実現不可能となってしまった．プログラムの知識不足と画像認識に関する知識が欠落していたと痛感した．
また 10 月 23 日に市立函館高校に対してプロジェクト発表が設けられた．その際の本グループの発表資料を作成した．市立函館高校の生徒にどのように発表したらプロジェクト学習に関心を持ってもらえるかを考えながら作成した．

11 月
10 月でコンテンツ案の修正があり，待ち時間を表示するシステムは作れなかったため，
投稿型コンテンツの制作を担当した．主に Wordpress を使用し，PHP と CSS ファイルにプログラムを書き加えたり修正することで投稿フォームを作成した．特に力を入れていたところは第三者にとってわかりやすい UI を制作することと細かい設定を行うことであった．
一目でこのボタンは何を表しているのか，投稿までの手順をわかりやすく設定するといったユーザ目線にたって制作を行ってきた．またこの投稿型コンテンツはタッチディスプレイを使用するため，タッチした際に他のサイトへ飛んだりサイトのヘッダー，フッダーを見えなくする工夫を凝らした．実装機能の 1 つとしてある一定の時間が経過した際に自動的にサイトを更新する機能を付け加えたのだが，うまく機能するときとしない時があり最終成果発表
会では実装することができなかった．
前期で行った調査やアンケート結果を表やグラフにまとめ直した．工夫した点としてメニュー選びの基準を優先度順にグラフ化する際に点数化することによって明確に作成することができた．またグラフの色を割合が高いものは赤色で，低いものは青色で一目でわかるように変更した．

12 月
最終発表に向けて発表資料の修正と全体発表の発表練習を主に行った．文字の体裁や図の入れ方など，教授の教えのもと初めて発表を聞く人でもわかるような資料になった．グルー
プ発表とデモンストレーション及びプロジェクトの全体発表の 3 つを行ったがどのように説明すれば伝わるのかを考え，ジェスチャーや人の目を見て発表を行うことができた．

Group Report of 2015 SISP

- 34 -

Group Number 18

MOE MOE Digital Signage 〜Cognition，Design，and System〜

4.4.2

石垣愛美

10 月
我々は後期に入ってから，投稿型システム，待ち時間表示システムを提案した．まず，待ち時間表示システムについて 10 月 5 日〜10 月 30 日まで食堂の並び具合について調査を実施した．私は水曜日と金曜日を担当した．実際に調査を行ってみて，最初は人数を数えるのが思いのほか難しかった，班の中でも共通認識が足りておらず定義が多少異なっていたことなどがあったが，人数は数えるのをある程度許容し，定義もすり合わせていった．
また，10 月 30 日から 4 度にわたり鏡氏と打ち合わせを行った．待ち時間表示システムについて 2 度にわたり案を改善し交渉したが了承を得ることができなかった．アンケートをとるなどして対応すれば少しは結果が変わったかもしれないと感じた．投稿型コンテンツについては，初めはサイトに投稿してもらったメニューを動画として編集し，動画を流す前に告知動画を流そうと考えていた．しかしリアルタイムで情報を流したいということで投稿サイトをタッチパネルディスプレイで操作し誰でも見れるようにした．私は上記の投稿型コンテ
ンツの告知動画と紹介動画の作成を担当した．告知動画は FUNCH とはなにかと投稿方法についてを動画にしたが，40 秒くらいになってしまいもっと簡潔に作成できればよかった
し，もっと違う視点から宣伝できたのではないかと感じた．紹介動画は季節に合わせて背景を変えられると見てくれるひとも飽きなくて良いと思い，空をイメージして作成した．最初は見てくれそうだが，すぐに見てもらえなくなりそうだったので，背景をより頻繁に変えたりデザインを改良する必要があると感じた．

11 月
10 月からの専務との打ち合わせで，初めは学生視点ばかりで生協側のことをあまり考えていなかったが，先生のアドバイスから学生側と生協側双方メリットになる新たな案として組み合わせコンテンツと生協の告知コンテンツを提案した．そのうちの組み合わせコンテン
ツを私が担当した．組み合わせコンテンツは投稿型コンテンツの隣に並べられていた．コン
テンツに人を起用して本学学生に見てもらえるように制作した．しかし投稿型コンテンツの方ばかりに目が行ってしまっているように思えたので，より学生に見てもらえるようにエフェクトを効果的に活用，投稿型コンテンツと同様にタッチパネルディスプレイを取り入れるなどすると良くなるのではないかと感じた．
また，食堂のおぼんに設置するフライヤーについては，赤平が作成したフライヤーを編集した．主に私は投稿型コンテンツの投稿方法について作成した．どのようなタイトルやコメントを書けばよいか，どのように投稿すれば良いかを簡潔に書けた．

12 月
成果発表に向けて投稿型コンテンツの投稿場面の撮影と編集を担当した．画面の反射で打っている文字が見づらかったりピントが合っていなかった．したがって，スマートフォンの画面を直接映すことと投稿している場面を 2 画面表示にする，ピントをしっかりと合わせ動画のクオリティーを上げるなどして対処する必要があったと感じた．
また，引き続き組み合わせコンテンツの制作や改善を行った．

Group Report of 2015 SISP

- 35 -

Group Number 18

MOE MOE Digital Signage 〜Cognition，Design，and System〜

4.4.3

赤平優莉

10 月
待ち時間表示コンテンツのために，1 ヶ月間かけてお昼休みに食堂へ行き，メニューを受け取るまでにかかる待ち時間の統計を取った．1 週間ごとにグループ内で統計の取り方や統計結果について話し合いを行った．投稿型コンテンツにおいてメニューを紹介するための動画の案を考えた．また実際に本学学生が投稿して，その投稿されたデータがどのように保存され，その後動画に反映されるのかといったシステムの流れを考えた．最終的には投稿シス
テムから投稿された内容が直接サイネージに表示されるというシステム案に決まった．また，10 月 23 日に市立函館高校に対してプロジェクト発表が設けられた．その際の本グループの発表を担当した．

11 月
鏡氏との打ち合わせの予定をメールでやりとりしたり，実際に資料を作成してそれを基に打ち合わせをしたりした．実装では，投稿型コンテンツにおいて，本学学生が投稿システムにアクセスするためのフライヤーを制作した．おすすめの組み合わせコンテンツにおいて，メニューの組み合わせを考えたり，動画のシナリオの案を既存の動画を研究しながら考えた．また，投稿型コンテンツ，おすすめの組み合わせコンテンツ，生協の告知コンテンツの3 つを合わせた FUNCH というロゴの制作を行った．
12 月
実際に実装したサイネージを食堂に設置するために，鏡氏と打ち合わせを繰り返したり，
コンテンツのブラッシュアップを行った．また，成果発表会に向けて A1 ポスターの作成や発表資料の作成を行った．成果発表会当日は，本グループの発表とデモ発表を行った．

4.4.4

武田誠

10 月
待ち時間を表示するためのシステム制作を担当した．カメラで並んでいる人数を認識し，その人数からおおよその待ち時間を割り出すというシステムであるため，まずはカメラでの人数認識をするプログラムの作成を行った．また，おおよその人数を割り出すために，昼休
みに食堂へ行き，どのくらいの人数が並んでいたらこのくらいの待ち時間が発生するという統計を取った．人数認識のプログラムに関しては，手法についてインターネット等で調査はしたが，難易度が高いということもあり，あまり貢献できなく，実現することができなかった．画像認識に関するプログラムの勉強が足りなかったと感じた．統計については，ラップタイマー等を利用し，効率的かつ継続して作業を行うことができた．

11 月
主に投稿型コンテンツの制作を担当した．サーバーの設定では，始めは MySQL や PHP，

apache を利用し，自分の PC 上でデータの管理を行う予定であったが，自分の勉強不足，知識不足により簡易のレンタルサーバーを利用するという結果になった．サイトの制作では，積極的により良いものとなるように作業することができたが，実現できなかった点もいくつかあった．これも主に自分の勉強不足と時間不足が原因であった．このような長期にわたるシステム等の開発では，スケジュール管理がとても重要であると感じた．また，投稿型コンGroup Report of 2015 SISP

- 36 -

Group Number 18

MOE MOE Digital Signage 〜Cognition，Design，and System〜
テンツの説明用紙の作成も担当した．コンテンツを利用する人が分かりにくいと感じる部分
を，紙を見ただけですぐ分かるようにと，マークを大きくする，余計な文を省く等と工夫をすることができた．

12 月
最終発表の準備では，主にスライド作成を担当した．前期もスライド作成を担当したため，前期の反省を意識しながら作成した．リハーサル時，いくつかの指摘は受けたが，前期ほど改善する点が少なかったため，前期よりは良いスライドを作ることができたと感じた．

4.4.5

西村陽菜

10 月
10 月の前半は動画班担当となり，コンテンツ案の話し合いを行った．レシートを利用した健康管理や金銭管理を行うコンテンツなどが案として挙げられたが現実的に実現が難しい
こと，そして本学学生にとってより有益なコンテンツを考えた結果，投稿型コンテンツを制作することに決定した．私は投稿フォームの作成を担当することになり，WordPress を使用して制作することを決めた．10 月は WordPress の環境設定を行っていた．XAMPP を使って Apache と MySQL を起動させるための作業を行った．環境設定に大幅な時間をかけてしまったことが反省として挙げられる．
また，待ち時間表示システム制作のために，食堂の混み具合に関する調査を行った．私は月曜日と金曜日を担当した．月曜日は 12 時 10 分〜30 分の間で丼類の列が 40 人超えする
日などもあり，データの記録が難しかったが，分担分けをしたことによって正確なデータを記録することができた．

11 月
今回のコンテンツ制作を行う上で専務との打ち合わせを 4 度行ったが，私はそのうちの 2
回の打ち合わせに参加した．1 度目の打ち合わせでは鏡氏に我々のコンテンツについて承諾を得ることができなかった．その反省として，我々は食堂の利用者の立場を重視しすぎた点が挙げられる．さらに，打ち合わせの際には鏡氏に我々が制作したいコンテンツについてあ
まり良いプレゼンをすることができなかったと感じた．我々が制作したいコンテンツへの熱意を伝えることができれば，もう少し違う結果になったのではないかと考える．
鏡氏の承諾を得てから，投稿型コンテンツの実装を本格的に進めた．WordPress は今回初めて使ったため知識が全くない状態から進めたが，知識を深め，少しづつ完成に近づけることができた．私はログイン画面，閲覧画面のデザインと投稿ページの設定を行った．自動更新やいいねボタンなどの仕様にも取り組んだが，自分では解決できない問題が多くシステ
ム班のメンバーに助けてもらう場面が多かった．知識を得て，実装する力を身に付けるためには，さらに WordPress の勉強を行う必要があった．

12 月
成果発表会に向けて投稿型システムの操作方法についての動画撮影とスライドの修正，組
み合わせのコンテンツの実装を進めた．撮影についてはピントが合わなかったり，オートの解除方法に時間がかかるなど，カメラの知識と技術不足が目立ったことが反省点である．組
み合わせコンテンツについても，Illustrator の知識不足が目立った．
（※文責: 八幡望，石垣愛美，赤平優莉，武田誠，西村陽菜）

Group Report of 2015 SISP

- 37 -

Group Number 18

MOE MOE Digital Signage 〜Cognition，Design，and System〜

4.5

結果と考察

4.5.1

前期のコンテンツ案

食堂での混み具合，並んでいる間に注文したいメニューが売り切れてしまうといった食堂に関する問題点を解決するため，並んでいる人に少しでも退屈させないようなデジタルサイネージ，売り
切れ情報を分かりやすく表示させるデジタルサイネージを制作するという計画を立てた．まず，並んでいる人に少しでも退屈させないようなデジタルサイネージの概要については，並んでいる人が見れる 30 秒程度の短時間のコンテンツをデジタルサイネージを利用して表示することを考えた．
コンテンツの内容については，限定メニューの紹介やおすすめ商品，イベント情報などの情報系のコンテンツ，クイズやまちがい探し，今日の占いなどの娯楽系コンテンツがある．これらを繋ぎ合わせて表示させる．次に，売り切れ情報を分かりやすく表示させるデジタルサイネージの概要については，商品が売り切れたときにリアルタイムで知らせることができ，売り切れている商品が常に把握できるようなシステムの制作を考えた．
並んでいる人を少しでも退屈させないデジタルサイネージの概要
並んでいる人を少しでも退屈させないためにはどのようなコンテンツを制作すれば良いかを考えた際に，まず 1 つのコンテンツを流す時間について注目をした．長いコンテンツを流すよりも短いコンテンツを次々に見ることができ，切り替えて表示した方が見る人が飽きないと考えた．そこで，並んでいる間に見れるような 30 秒程度の短時間のコンテンツを流すことにした．
また，流すコンテンツの内容はどのようなものが良いかを考えた際に，本学学生にとって，あったら嬉しい情報と見ている人が少しでも面白いと感じてもらえるようなデジタルサイネージを制作することを目標として挙げた．その点に注目した際に情報系と娯楽系の二つのコンテンツを考案した．表 4.6 がコンテンツ内容の一案である．情報系のコンテンツはサークル紹介やイベント情報
を，娯楽系のコンテンツは間違い探しや心理テストなど様々な種類のコンテンツを流していきた
いと考えた．そして，情報系と娯楽系を合わせたコンテンツを繋ぎ合わせ，例としては 10 分を 1ロールとして流す．また，情報の切り替わりを分かりやすくするという意図でコンテンツの開始と終了が分かるようにジングルを置きたいと考えた．
表 4.6

コンテンツ内容の案

情報系

娯楽系

限定メニューの紹介

クイズ

オススメ商品の紹介

おもしろ動画イベント情報

まちがい探しサークル情報

投稿写真
心理テスト

Group Report of 2015 SISP

- 38 -

Group Number 18

MOE MOE Digital Signage 〜Cognition，Design，and System〜

商品の残り数・売り切れ情報を分かりやすく表示するデジタルサイネージの概要
商品が売り切れた時，リアルタイムで知らせたいと考えている．図 4.3 がその画像である．また，売り切れている商品がいつでも分かるようにテロップで情報を流す．それによって，食堂を利用している人が現在どの商品が売り切れたかという情報を認識しやすいと考えた．また，お知らせ
画面が出て，商品が完売されたことが表示されるようにしたいと考えている．通常は画面上部にイ
ベント情報などの短時間のコンテンツが流れ，完売情報が出た後は画面下のテロップに完売情報が流れるようにする．図 4.4 が通常画面の例である．売り切れ情報だけでなく人を退屈させないデジ
タルサイネージを制作するために以上のようなコンテンツ制作を考えた．
デジタルサイネージの流れとしては，まず通常時はサークル情報やイベント情報が表示されている．商品が売り切れた際にお知らせ画面に切り替わり，完売した商品の情報が流れる．その後，元の情報系のデジタルサイネージに切り替わり画面の下に，完売情報が常に表示される．１つのイベント情報の紹介が終了すると，一つの区切りを付けるために moemoe という文字が表示される．
これはデジタルサイネージの提供者が分かるようにするためという意図が含まれている．

図 4.3

デモ動画

完売情報
図 4.4

Group Report of 2015 SISP

通常時の画面- 39 -

Group Number 18

MOE MOE Digital Signage 〜Cognition，Design，and System〜

１２秒

６秒

４秒
５秒

１２秒

図 4.5

サイネージ画面の切り替わり

メニューを受け取るまでの待ち時間を表示するデジタルサイネージの概要
待ち時間を計測するために本グループはカメラで並んでいる列や人の顔を認識する方法を考えた．その方法として以下の 2 つの方法を考えた．

• パソコンのインカメラを使用して計測• Web カメラを使用して計測
まず 1 つ目のパソコンのインカメラを利用して計測を行う方法である．Processing for OpenCVを利用して顔認識を行った．準備段階として Processing 上でソースコードを元に顔の輪郭を検出し，検出できた際にその顔に画像を貼り付けるプログラムを作成した．このプログラムは数メー
トルまでしか人の顔を認識することができなかった．従って食堂で設置するのは不可能だと判断した．
次に 2 つ目の Web カメラを利用して計測を行う方法である．こちらも一つ目と同様，Processing

for OpenCV を用いてプログラムを同じように作成した．インカメラと違い，計測することのできる距離が長く遠くにいる人を複数人認識することに成功した．しかし検出画像が荒く，食堂に並んでいる本学学生を認識するのは非常に難しいと判断した．
これらの方法以外にも複数の方法を考えた．人の顔を認識するのではなく，列の長さを認識する
ことやおぼんの置いてある台の隙間を距離センサで計測しそこから並んでいる列の長さを導く方法などが挙げられた．これらすべての方法は独学で学び，また教授からのアドバイスを元に作成を行ってきた．鏡氏との話し合いの結果，待ち時間表示は実現不可能となった．

Group Report of 2015 SISP

- 40 -

Group Number 18

MOE MOE Digital Signage 〜Cognition，Design，and System〜

4.5.2

後期の成果物

後期で我々は，投稿型コンテンツ，おすすめの組み合わせコンテンツと生協の告知コンテンツの3 つのコンテンツの制作を行った．実際に制作したデジタルサイネージを食堂入口の左側に設置
した．
デジタルサイネージの設置方法は，初めの段階では食堂の内側にピアノ線を使ってデジタルサイ
ネージを吊るして固定する予定だったが，設置する位置の関係からピアノ線を均等に吊るすことが難しく失敗に終わった．次に食堂の外側にデジタルサイネージを固定しようと考え，強力な磁石を利用してピアノ線を吊るす部品を制作し，固定したが，磁石が横移動に弱くこの方法でもデジタル
サイネージを設置することが不可能であった．最終的にデジタルサイネージを台の上に固定して設置するような形になった．

図 4.6

食堂に設置したサイネージ

投稿型コンテンツ
本学にある食堂の昼食を紹介するコンテンツであるため，本学の英語の略称である FUN と，昼食の意味を持つ LUNCH と合わせて，投稿型コンテンツの名称を FUNCH と名付けた．FUNCHのロゴについては，Illustrator を使用して 3 種類のデザイン案を考案し，さらに字体，色の配色の違うものを 4〜8 通り考案し，その中からメンバー間で話し合いを行いロゴを決定した．

Group Report of 2015 SISP

- 41 -

Group Number 18

MOE MOE Digital Signage 〜Cognition，Design，and System〜

図 4.7 ロゴ案

始めの段階では，投稿フォームを作成し投稿されたものを我々が編集してからデジタルサイ
ネージに表示しようと考えていた．しかし，投稿したものの閲覧がすぐにできた方がシステムとして有効なものになると考えリアルタイムで表示するシステムを制作した．投稿型コンテンツは，

WordPress と WordPress 内の HTML，CSS，PHP によって制作した．投稿型コンテンツのシステムを制作した際に，多くの仕様やデザインをプラグインによって制作した．どのプラグインで何を行ったかの詳細について説明する．

• MS Custom Login
ログインページの画像や色のカスタマイズを行った．

• Akismet
コメントの中でスパムコメントを自動的に分類し，スパムから保護をした．

• Reaction Buttons Options
ユーザーが気に入った投稿にいいねを押すことができるボタンを制作した．いいねを 1 人のユーザーが何度でも押すことができるような設定にした．

• Reloadr for WordPress
新しい投稿がされたときに自動更新されるように設定にした．このプラグインによって，パソコン上で閲覧した際には自動更新することが可能になったがデジタルサイネージ上で閲覧した際に自動更新される仕様にすることができなかった．

• TinyMCE Advanced
投稿ページで投稿者が自由にコメントの文字の多さやフォントを変更できるようにした．

• Post Control
投稿ページを制作時に最初の初期設定で記載されていた，カテゴリーなど不要だと判断したものの削除を行った．
その他，投稿されたものを閲覧するページの全体のデザインは WordPress 内にある外観で設定した．タイトル，写真の配置などの全体のデザインは外観のテーマからインストールし設定を行った．サイトのタイトル (FUNCH)，キャッチフレーズ (〜FUN × LUNCH〜)，ヘッダー画像については外観のカスタマイズから設定を行った．一度に見ることのできる閲覧数や写真の大きさなどの設定は WordPress 内にある設定の投稿設定，一般で設定を行った．

Group Report of 2015 SISP

- 42 -

Group Number 18

MOE MOE Digital Signage 〜Cognition，Design，and System〜
投稿方法については，まず初めに，おぼんの上に投稿方法が記載されているフライヤー (図 4.9，
図 4.10 ) を置き学生にフライヤーから投稿システムの QR コードを携帯電話で読み取ってもらう．
次に，読み取ったサイトにアクセスすると我々が制作した FUNCH のログイン画面が表示される．
ユーザー名とパスワードの両方の打ち込み欄に fun と入力すると，投稿画面に切り替わる．そこにメニュー名やオリジナルのタイトルと，食べたメニューの感想などを自由に書いてもらう．そして，投稿したい写真を選択し，公開ボタンを押すことでデジタルサイネージ上に反映されるというシステムである．タッチパネルディスプレイに表示された投稿をスクロールして見ることができ，目のマークのボタンを押すことで写真を拡大することができる．また，鎖マークを押すことで，写真とコメントを同時に見ることができる．投稿されたものを，誰でも自由に閲覧することが可能であり，気に入った投稿にはいいねボタンを押すことができるという仕様を制作した．

タイトル

コメント

写真挿入

図 4.8

投稿画面

自己流の味付けや食べ方，メニューの組み合わせを投稿することによって自分のおすすめのメ
ニューを紹介することができるとともに，他の食堂利用者がどういった食事をしているのかを知ることができる．娯楽性のある情報共有の場として機能する想定である．また，いいねボタンによって人気の高い投稿を知ることができ，メニュー選びや食堂利用をより楽しんでもらうきっかけになる．

図 4.9 フライヤー (表)Group Report of 2015 SISP

- 43 -

Group Number 18

MOE MOE Digital Signage 〜Cognition，Design，and System〜

図 4.10 フライヤ− (裏)ホームに戻る

写真を拡大投稿された写真
写真とコメントを同時閲覧

図 4.11

投稿型コンテンツ

組み合わせコンテンツ
組み合わせコンテンツとは，考案したメニューを動画形式で紹介するコンテンツである．動画の素材は本学の食堂で撮影した．人のみの写真を複数枚撮影し，その写真に Illustrator を利用して組み合わせメニューを貼り付けた．貼り付けた画像をムービーメーカーで 1 つの動画にした．
組み合わせメニューについては，我々が三群点数法にも基づいて考案した．考案した組み合わせ
メニューは，丼類や麺類にプラス 1 品小鉢を追加したものである．三群点数法とは，食品を栄養の働き別に赤・ 緑・黄の 3 つに色分けしたものである．赤は体の中で血や肉になるもの，緑は体の調子を良くするもの，黄は力や体温になるものである[6] ．動画の中には，それぞれの商品にどの栄養素が入っているか，さらにプラス一品追加することによってどの栄養素を採ることができるのかがGroup Report of 2015 SISP

- 44 -

Group Number 18

MOE MOE Digital Signage 〜Cognition，Design，and System〜
一目で分かるように，商品の上部に含まれている栄養素の色を記載した．また，学生が商品の値段を気にしているということが調査によって判明したため，値段も記載するようにした．
表 4.7

考案した組み合わせメニュー

主食

プラス 1 品

追加によって得られる栄養

鶏から南蛮丼秋のバランス惣菜

赤緑黄

カレーライス

ポテト＆コーンサラダ

緑黄

味噌ラーメン

冷ややっこ

赤

豚みそ焼肉丼

かぼちゃ煮

緑黄

釜玉そば

ほうれんそうゴマあえ

緑黄

運営側は栄養のある食事をしてほしいという想いがあるということも鏡氏との打ち合わせを行ったことで判明した．そこで，我々の組み合わせメニューのコンテンツの効果として，普段丼類や麺類の１品のみの食事をしている人にプラス 1 品付け加えて，少しでも栄養のある食事をしてもらうきっかけになることが挙げられる．プラス 1 品という低価格で不足している栄養を補うというのは，双方にとってメリットがあると考えた．

摂取できる栄養素

図 4.12 組み合わせコンテンツ

生協の告知コンテンツ
新メニューや期間限定メニュー，生協からのお知らせなどの画像を繋げて，スライドショー形式
で紹介するコンテンツである．組み合わせコンテンツと生協の告知コンテンツは同じディスプレ
イ上で表示している．PicPlayPost というアプリケーションで 2 つのコンテンツを組み合わせている．
生協の告知がポスターのみであるという現状から考案したコンテンツであり，このコンテンツの効果として，告知の場を増やすことで少しでも学生に食堂のメニューを知ってもらうこときっかけになることが挙げられる．さらに，さまざまなメニューを知ってもらうことによって，メニューのGroup Report of 2015 SISP

- 45 -

Group Number 18

MOE MOE Digital Signage 〜Cognition，Design，and System〜
選択肢が広がり食堂利用の促進に繋がると考えた．

図 4.13

4.5.3

生協のイベント告知コンテンツ

考察

前期の考察
前期ではデモ動画として売り切れ情報の全画面表示，イベント情報の表示とその下に売り切れ情報をテロップで流すというものを制作した．商品の残り数，売り切れ情報を下に表示することやテロップで流すことは適切なのかを検討し改善が必要であることが判明した．また，見ている人が飽きないエンターテインメント性のあるコンテンツを制作するために，既存の動画を研究し動画編
集技術の向上に努めること，それと同時に，商品の残り数，売り切れ情報をリアルタイムで反映させるためのシステム開発も進める必要があった．また，コンテンツを考案するために鏡氏にインタビューを行ったにも関わらず，その後，こまめに連絡を取ることを怠ってしまい結果的にコンテンツ案の相談をすることができなかった．そのため，自分たちのコンテンツ案が本当に食堂に設置できるのか明確でないまま，前期はコンテンツ提案という形で終了してしまった．

後期の考察
平成 27 年 12 月 9 日，10 日の 2 日間食堂が営業している 11 時から 14 時の間にデジタルサイ
ネージを食堂前に設置した．投稿システムについては，2 日間で 13 件の投稿があり，1 日およそ 7件の投稿がされたという結果になった．表 4.8 からわかるように，自己流の組み合わせに関する投稿が最も多いという結果になった．続いて，新商品や期間限定メニューの感想，自己流の味付けを紹介してる投稿も見られた．このことから，我々がこのシステムを制作した狙いである，新しいメ
ニューや新しい食べ方の共有ができていたことが分かる．
また，食堂のスタッフにオムライスにケチャップで顔を書いてもらった写真など食堂の方とのコ
ミュニケーションが見受けられる投稿などもされていた．さらに，購入した商品の具材が被ってしまったという投稿や，タイトル名にユーモアのあるものなどが投稿されていた．このことから，制作した我々が予想していなかった様々な内容の投稿がされており，今後このシステムの設置を続けGroup Report of 2015 SISP

- 46 -

Group Number 18

MOE MOE Digital Signage 〜Cognition，Design，and System〜
ることでより多くの人がこの投稿型コンテンツを利用し，ユーモアのある投稿や，食堂利用に対して興味が湧く投稿が増えるのではないかと推測される．
表 4.8 2 日間の投稿内容

投稿内容

1 日目

2 日目

新メニュー

0

4

期間限定メニュー20

自己流の組み合わせ3

3

自己流の味付け10

また，投稿されたものの中には食堂とは関係のない投稿もされていた．今回は我々がデジタルサ
イネージ設置中は常にサイトの監視を行っていたため，瞬時にその投稿を非表示にするという対応を行えたが，このような適切ではない投稿を判別し自動で表示させないようにする必要がある．デ
ジタルサイネージを設置した 2 日間，我々はデジタルサイネージの観察を行っていたが，その際の印象として，組み合わせコンテンツと生協の告知コンテンツは投稿システムと比較すると，足を止めて見ている人が少ないように見受けられた．また，フライヤーに関してだが，おぼんの上に置いてあるものを避けて他のおぼんに置いていく学生が複数人見られた．さらに，おぼんを片付ける際にフライヤーが散乱することのないよう，フライヤー回収箱を設置したが，回収箱に入れずにそのままにしていくケースが見られた．このように，フライヤーに関する問題点がいくつか判明した．
これらは食堂スタッフに負担がかかってしまうため，何らかの対応策が必要である．

4.5.4

成果発表会の評価と反省

12 月 11 日金曜日に実施された成果発表会では全 6 回の発表のうち，少なくとも 1 人 1 回はプレゼンテーションを務めた．プロジェクト全体の発表の後に各グループの発表を行い，その後，各グループのブースに分かれてデモ発表を行った．各グループの発表で我々本グループは，提案に至るまでの背景，提案物の大まかな概要と目的を発表した．その後デモ発表では実際に制作したサイネージを設置し，タッチパネルを操作してもらったり，動画を見てもらったりした．成果発表会で発表を見に来てくださった方々から発表技術に関してと発表内容の 2 つの視点から評価をいただいた．発表技術に関しては，デモ発表があり，実際に成果物に触れることができて分かりやすいという評価をいただいた．また，声が大きくはきはきしていて聞きやすかったという意見と，声が小さくて聞き取れない部分があったという両方の意見があった．発表者によって違いが生じたと考える．誰が発表しても同様の発表になるように努める必要があった．発表内容に関しては，学校生活に関わっている内容で興味を持てた，ぜひ使ってみたいという評価をいただいた．一方で，システムの UI の改善が必要，写真がおいしそうに見えないといった評価もいただいた．実装への取り掛
かりが遅かったために，細かいところまで手を加えるといった作業ができなかったことが原因と考える．
（※文責: 西村陽菜，八幡望，赤平優莉）

Group Report of 2015 SISP

- 47 -

Group Number 18

MOE MOE Digital Signage 〜Cognition，Design，and System〜

4.6

課題と展望

4.6.1

課題

前期にコンテンツ案を固め後期で実際に実装へと切り替わる予定だったが，なかなか案が定まらず本格的に実装へと移ったのが 11 月になってしまった．投稿型コンテンツと組み合わせコンテンツ，生協の告知コンテンツは到達目標である設置までは到達できたが，実装にあまり時間を割くことがあまりできなかった．また本格的にコンテンツ制作へ切り替わった際にシステム構築を行う
チームと動画を作成するチームに分かれたが互いに進捗情報の共有が少し足りなかった．
商品を受け取るまでの待ち時間をデジタルサイネージ上に表示させる案があったが，鏡氏との話し合いを進めていく内に生協側のデメリットの方が強く，鏡氏を納得させられる提案をすることができなかった．そのため，生協の売り上げアップにつながることで鏡氏を納得させるこのできるメ
リットを考えることが今後の課題である．

4.6.2

展望

まず第一に商品を受け取るまでの待ち時間をデジタルサイネージ上に表示させる案の実現を目指したい．これは独学で OpenCV を用いて顔を認識するところまでは出来ているため，列の長さを計測することが出来たら食堂調査の統計を基に待ち時間を表示させることが可能となる．しかし，10 月の１ヶ月間の統計結果しか取っておらず，このままでは信憑性が薄いためもう２，３ヶ月
ほど調査を行う必要がある．投稿型コンテンツに関しては，UI のデザインについてもう少しユー
ザーが使いやすくかつ分かりやすいデザインに改良していきたい．投稿記事のページへアクセスするボタンの画像や投稿画面における画像添付方法をわかりやすく説明し配置する必要がある．
オススメの組み合わせコンテンツでは三群点数法に基づいて自動で組み合わせを紹介するシステ
ムにしたい．現状のコンテンツは自動ではなく，私たちが三群点数法に基づいて考え手動で動画を作成しているためシステムとしては不十分である．
告知コンテンツでは，生協のホームページが更新されると自動で告知も最新の告知に自動で切り替わるシステムを構築したい．新メニューや限定メニューは季節や月ごとに変わるためリアルタイ
ムで管理することを目指したい．
最終的にコンテンツを全て作り終え，稼働，設置することで目標を達成することができたが設置期間が 2 日間と短く，本コンテンツの評価を得ることができなかった．本来ならば 1 週間程度，食堂前に設置し紙媒体のシステム利用アンケートを本学学生に対して行うべきであった．目視だけで本学学生がシステムを利用しているのか，本学学生だけではなく先生方も利用されるのかなど確認した程度であった．これでは調査とは言い難い．今後はアンケートを本学学生に対して行い，改善点などを列挙し何年も利用していくことのできるシステムを目指していきたい．

Group Report of 2015 SISP

- 48 -

Group Number 18

MOE MOE Digital Signage 〜Cognition，Design，and System〜

4.6.3

本グループ全体の反省

本グループの反省として以下の三点が挙げられる．

• 調査方法の明確さ• コンテンツ案の決定時期• 情報共有の少なさ
本プロジェクトにおいて本グループは調査を主として活動を行ってきた．しかし調査方法に少し問題があった．前期で食堂利用に関する調査を行ったが，初めての調査で明確な人数や対象，質問項目など曖昧にしたまま手当たり次第に調査を行ったため統計がうまくとれなかったり，まとめるのに苦労した．最初の調査からしっかりと目的を持ってどの人に何を聞き，何を得たいのかを決めておく必要があった．2 回目に行った調査では 1 回目の反省を生かし，本学学生 100 名に対して目的を持ってアンケート調査を行うことができた．コンテンツ案を前期のうちに決め，制作に時間を割く段取りであったが，なかなかコンテンツ案が決まらずに先延ばしになってしまった．またコンテンツ案を後期に入りすぐに決め，制作に取りかかっていたところで鏡氏との話し合いによって現在のコンテンツ案を大幅に改善する必要がでてきた．班員全員でコンテンツ案をもっと突き詰めていく必要があった．
また後期に入り，プログラミングを行う班と動画を作成する班に分かれてコンテンツ制作を行ってきたが，互いの班の意思疎通が足りなかった．コンテンツはすべてを合わせて一つのシステムとなるため，そこで食い違いが発生すると完成までには至らない．互いにどのくらい進んでいるのか，何か変更点はあるのかなどの進捗情報を随時共有する必要があった．
（※文責: 八幡望）Group Report of 2015 SISP

- 49 -

Group Number 18

MOE MOE Digital Signage 〜Cognition，Design，and System〜

第 5 章 Kinect 班
概要
Kinect 班は前期の活動で本学学生が手軽に情報を発信でき，情報を取得した人が新たに情報を発信したいと思えるような情報共有コンテンツを提案した．その結果，本学学生が情報を発信する際の煩わしさを取り払うことができ，学生間で埋もれがちな情報を知る機会を増やしていくことができると考えた．後期の活動では主に提案したシステムを実現するために実装を行った．コンテンツの実現のためにはどのようなデバイスや開発環境を用いるべきなのかを改めてグループメンバーで話し合った．そして前期から使用を検討していた Kinect を用いて，学生による手軽な情報取得についての実装を行った．また Kinect 班はデジタルサイネージにゲーム性を付与すれば人の目を惹くことが出来ると考え，システム開発環境として Unity を使用することにした．そして役割を分担し，11 月の本プロジェクト内の進捗報告会までコンテンツの実装を進めた．その後進捗報告会で Kinect 班は多くの指摘を受け，コンテンツについての見直しを行った．そしてコンテンツの反省点を見つけ，実装の部分を大きく変えることとなった．その中でも投稿システムを追加したことは大きな変化となった．Kinect 班が考えた投稿システムを用いれば本学学生が手軽な情報発信を実現することができ，より良いデジタルサイ
ネージコンテンツが実装できると考えた．その投稿システムの実装には C ＃と Java の 2 つの言語を用いた．また Unity では 2D で作成していたオブジェクトを 3D で作成し奥行きを持たせた．Kinect の操作は情報取得者が腕を横に動かしたり，前に動かすとその腕の動きにリンクしてキャラクターが動くようにプログラムを作成した．以上の要素を 1 つのコンテンツに組み込み，実際に情報取得者が Kienct を操作して，情報を取得し，自分の発信したい情報を投稿するという一連の流れを実装した．その後成果発表会があり，スライドと A1 ポスターでKinect 班が作成した実装について発表をした．成果発表会のフィードバックでは様々な指摘があり，実装の部分についての指摘はこれからの展望として実現していくこととした．
キーワード

デジタルサイネージ，公立はこだて未来大学，コンテンツ，Kinect，Unity（※文責: 原史也）

Group Report of 2015 SISP

- 50 -

Group Number 18

MOE MOE Digital Signage 〜Cognition，Design，and System〜

5.1

はじめに

5.1.1

背景

現在，ポスターまたは新聞などの絵や文字を用いた様々な広告媒体が存在する．その中でも新しい広告媒体としてデジタルサイネージという広告用ディスプレイがある．図 5.1 に具体的なデジタ
ルサイネージの図を示した．このようなデジタルサイネージでは画像や文字の他に動画や音も一度に表示させることができる．つまり，デジタルサイネージには人の目を惹く工夫がされている．
本学ではライブラリ前や 3 階の正面玄関前に実際にデジタルサイネージが設置されており，本学学生にとって身近な存在となっている．本学の情報を発信している広告方法には主に学内ポスターと学内メールが挙げられる．しかしこれら２つの広告方法には問題点がいくつかあった．まず学内ポスターを掲示する際には事務局に許可をもらうという手続きが必要である．この手間により，手軽に情報を発信することができず，本学学生が情報を発信したいという気持ちを少なからず下げてしまうという問題がある．また学内メールでは，受信フォルダを見た場合にタイトルが同じような書き方になっておりどれがどのような情報なのかを学生側は正しく判断しにくい．その上，あまり
学内メールを頻繁に確認しない人にとっては，同じようなタイトルの中から自分にとって必要な情報がどのメールに記載されているかがわからないという問題が挙げられる．これらの問題点を解決するにあたって，Kinect 班は，Kinect と Unity を用いることによって本学学生が手軽に情報を発信でき，自分が欲しい情報をすぐに見つけられる事で，より学内の情報共有が活発になるような新しい広告デジタルサイネージを提案した．

図 5.1

5.1.2

デジタルサイネージの例

目的

Kinect 班の制作したコンテンツは利用者が広告を投稿する側と閲覧する側に分かれている．投稿する側は，Java プログラミング言語で作成したパソコン上のソフトから４つの投稿箇所の中の1 つを選択すると次の画面に移動する．移動後，広告タイトルと広告内容を入力する画面になり，
２つの項目を入力し入力ボタンを押す．その後，最初の画面に戻り更新ボタンを押すことでデジタ
ルサイネージに反映される．デジタルサイネージ内には Unity で作成した未来大学を参考にした
２階式のフィールドが配置されている．フィールド構成はキャラクターを使用者が腕を動かすこと
によって操作する．その操作したキャラクターをフィールド内の別のキャラクターに近づけることで投稿された広告内容が表示される．このようなコンテンツにした目的はいくつかある．まず，投稿面では，広告内容を入力する際の作業をタイトルと内容の入力のみに絞ることで投稿者の手間をできるだけ軽減させる．また，広告を閲覧する操作の際に，Kinect を用いて大きい動作を行うこGroup Report of 2015 SISP

- 51 -

Group Number 18

MOE MOE Digital Signage 〜Cognition，Design，and System〜とで周囲の人の目を惹き，興味を持たせる．その他にも，キャラクターに吹き出しをつけ，ジャンルをその中に入れておくという広告の掲載方法にすることで，自分が欲しい情報がどれなのかを判別しやすくさせる．これらのコンテンツ全体のシステムによって本学学生同士の情報共有の活発化が成されると考えた．
（※文責: 大谷一之）

5.2

目的達成のための課題の設定

5.2.1

課題の設定

学生による手軽な情報発信

Kinect 班は携帯電話のアプリ開発を利用し，この要素を解決できるのではないかと考えた．
Kinect 班が開発したアプリからデジタルサイネージへ送りたい情報を送ることで情報を送信する
ことの手軽さを追求することが出来る．具体的な利用形態としてはタイトル，内容，サイネージに表示してほしい時間帯，画像の添付，これらをアプリを用いて入力してもらい，実際にその情報がサイネージに流れるようにしたいと考えた．その携帯電話のアプリの具体的な例を図 5.2 に示した．アプリ開発の課題としてはアプリを用いれば本当に手軽さを追求できるかの調査を行う必要があることやアプリがうまくサイネージと連携できるのかを試す必要があると考えた．後期に入って，実装を行う過程で iPhone にアプリ化する際，Developer Program に登録しなければならなかった．しかし，有料であったため，アプリ化せずに手軽に情報を発信する方法を模索した．
また，サーバーを立てることに知識がある人もいなかった．そのため，投稿システムと広告を映す
ディスプレイをローカル上で行うことにした．投稿システムは広告ディスプレイ近くに設置され，発信したい情報を入力すると，投稿されるシステムとして修正した．投稿された内容はリアルタイ
ムに広告ディスプレイに表示される．この方法を用いることで発信した情報がすぐサイネージ上に反映され，手軽さを追求することが出来ると考えた．

人の目を惹くデジタルサイネージ
前期までのアイデアとして，人の目を惹くためのデジタルサイネージにするために，オリジナルのキャラクターを作り，キャラクターが動くことによって受信者の目に留まりやすくなるとした．
またキャラクターの動きによって，情報の重要度を表すようにして受信者が大事な情報を受け取りやすい環境を作ることで，さらなる情報共有の活発化が望めると考えた．コンテンツ実装についてを考えると，キャラクターをどのように動かすのか，動きは一定の動きなのか，ランダムに動かすようにするのかなどを考える必要がある．このような課題を前期で考え，その環境を実現するためにはまず柔軟なキャラクターの動きを実現できる環境が必要だと考えたが，C ＃や Java だけでのプログラムを作成するだけでは理想としているアニメーションが実装できないと判明した．そこでどのような開発環境が良いか模索したところ C ＃，JavaScript を使用することができ，さらにオブジェクト作成が容易であり，サンプルアセットが用意されていることなどの理由から Unity を開発環境として使用することとした．開発環境が Unity となり，前期のアイデアを進めていくために

2D 上でのゲーム作成が理想だと発覚し，2D 上で作成したオリジナルのキャラクターが情報を持Group Report of 2015 SISP

- 52 -

Group Number 18

MOE MOE Digital Signage 〜Cognition，Design，and System〜

図 5.2

携帯電話アプリの詳細図

ちそのキャラクターが動くことで，受信者の目に留まると考えた．しかし研究生や先生方にコンテンツの進捗報告会を行った際に，2D でコンテンツを表現することは伝わりにくい，キャラクター
の完成度を高くした方が良い，kinect の誤動作が多く修正した方が良いなどの指摘を受けた．そしてもう一度人の目を惹くためのデジタルサイネージとは何かを班のメンバーと考えた結果，Kinect班は以下の内容をコンテンツに含めることとした．

• 本学の建物内に模した 3D 仮想空間オブジェクトの作成• 本学学生や先生方などに模した 3D キャラクターを配置• 複数のキャラクターに個別に情報を付属• 手軽な情報取得のために必要な Unity 内のプログラムの構築• 情報受信者が仮想的な本学内のキャラクターをプレイヤーとして操作
この 5 点をうまく実装することが出来れば，人の目を惹くデジタルサイネージが実現できると考えた．

学生による手軽な情報取得

Kinect を使用して情報を閲覧するというのは，Kinect で Unity 上のキャラクターを操作できるようにし，他のキャラクターの近くに行くと，情報が表示されるという流れで情報を閲覧することである．この流れを実現するには，Kinect と Unity を連動させて利用者が手を動かすと Unity 上のキャラクターが動く仕組みが必要である．そして，この仕組みを作るためには Kinect と Unity
を連動させること，利用者を Kinect を通じて Unity 上で反応させること，利用者の手の動きにGroup Report of 2015 SISP

- 53 -

Group Number 18

MOE MOE Digital Signage 〜Cognition，Design，and System〜

図 5.3

前期のコンテンツのアイデア

よって Unity 上のキャラクターが動くようにすること．これらの課題を解決しなくてはならない
と考えた．

5.2.2

課題の割り当て11 月の初旬まで，2 つの班に分かれて作業を行った．
• システム班：大山，原• キャラクター班：梅庭，大谷，平井
システム班は主に，Kinect と Unity の連携を担当した．キャラクター班は，大谷，平井で Unity
を用いた広告の画面遷移を考え，梅庭が 2D キャラクター作成を行った．2D キャラクターは図 5.4に示す．11 月初旬に進捗報告会があり，そこでの評価として 3 つの点を指摘された．1 つ目は，Unity の強みとして，3D モデルを用いることができることである．2 つ目は，投稿部分に担当がいなかったため，進捗が遅れていた．3 つ目に Kinect の誤動作が多すぎて，システムの全容がわからないという点だった．この評価を元に 12 月に分担を改変した．

• システム班：大山• 投稿班：平井• 3D キャラクター作成班：原，大谷，梅庭
よってこのような課題の割り当てとした．システム班は Unity と Kinect の連携を 3D 上で出来るよう Kinect のプログラミング技術の習得と Unity 内の C# のプログラミング技術習得を課題として設定した．投稿班は Java を利用し，手軽な情報を投稿できるようなシステムの実装を課題の設定とした．3D キャラクター班は Unity 内の本学に模したステージ作りや 3D キャラクターの設置，アニメーションなどを課題の設定とした．
（※文責: 原史也，大谷一之）

Group Report of 2015 SISP

- 54 -

Group Number 18

MOE MOE Digital Signage 〜Cognition，Design，and System〜

図 5.4 2D キャラクター

5.3

課題解決のプロセス

5.3.1

月毎の作業過程

5月• 一階エレベータ前に設置しているデジタルサイネージに流す本プロジェクトの紹介動画を撮影• 平井，梅庭，大山が動画撮影を行い，原，大谷が動画に出演
6月• デジタルサイネージの動画を編集するため AﬀterEﬀects の使用方法を平井，大山が Web サ
イトや勉強会で学習• 大山，原で Kinect についての勉強を開始し，その後 C++ でプログラミングを行い，人の顔を認識し顔を別の画像に差し替える動作までのプログラムを作成• 原は研究生方との合同発表会で Kinect 班のアイデアの発表• 原，大谷，梅庭で中間発表会に向けての案出し• 中間発表のためのスライドの制作
7月• 平井は 1 階エレベータ前の動画が流れる時間を指定し，リピート再生されるように設定• 大山，原が中間発表会のスライドを作成• 平井，大谷がスライド内のデモ動画を作成• 梅庭が A1 ポスターを制作• スライドの確認やポスターの確認は班員全員で行い，中間発表会のプレゼンテーションを分担

9月• Kinect 班は Unity についての知識を深め，2D キャラクターか 3D モデルにするかを議論• 梅庭がキャラクター制作チームとして PhotoShop を使用してキャラクターを作成• 平井と大谷が Unity 内のアニメーションを作成
Group Report of 2015 SISP

- 55 -

Group Number 18

MOE MOE Digital Signage 〜Cognition，Design，and System〜• 原，大山は Unity と Kinect を連携させるため参考書や Web サイトを用いて知識を取得
10 月• 平井が 2D キャラクターに動きを付与する方法を模索• 原，大山が Kinect と Unity の連携を完成• システム制作チームが当たり判定プログラムを作成し，キャラクターに触れた際選択されたキャラクターが前に出てくるプログラムを作成• 進捗報告会後，3D 画面でコンテンツを作成することにし，原，大谷が 3D オブジェクトの作成• 投稿システムの作成を決定し，平井が担当した• 梅庭はコンテンツの名前とロゴの作成
11 月• 平井が 1 つの PC 上でデュアルディスプレイにして広告と投稿画面を分ける方法を提案• 原は Unity 内のステージ作成とキャラクターの当たり判定を行い，未来大学に模したステージを作成• 大谷がステージ内で用いる階段や床のモデルを作成• 大山は Kinect の前に立っている人がキャラクターを動かせるようにするため，前後左右に加え，初期位置に戻るための物体計 5 つを作成し当たり判定を付けるプログラムを作成• 梅庭は A1 ポスターのラフスケッチを作成し，全体のグループのテンプレートを作成
12 月• 平井が投稿画面が小さかったため，サイズを PC の画面サイズになるよう変更• 平井が Unity 側で表示されるテキストに文字化けが発生したためこの問題を解決するために投稿のプログラムを修正• 大山がキャラクターを動かす際，どこのオブジェクトに反応して動いているのかを分かりやすくするためのプログラムを作成• よりキャラクターを動きやすくするために物体の当たり判定を試行錯誤し調整• 梅庭は A1 ポスターの最終訂正と動画の最終訂正• Kinect 班全員で成果発表会直前リハーサルで指摘された点を踏まえつつ，スライドの内容を修正• 原，平井，大山，大谷がポスターにコンテンツの詳細を加えるための内容を考案

5.3.2

担当した課題ごとの解決過程

原史也

5 月に一階のエレベーター横に設置するサイネージに流す本プロジェクトの紹介動画の撮影を行い，その動画に出演した．

6 月には平田・竹川研究室との合同発表会を行い，メンバーと共に考えたアイデアの発表をしGroup Report of 2015 SISP

- 56 -

Group Number 18

MOE MOE Digital Signage 〜Cognition，Design，and System〜
た．その後 Kinect を C ＋＋でプログラミングし，人の顔を認識し顔を別の画像に差し替えるという動作までのプログラムを作成した．そして中間発表会のためのスライド制作に取り掛かった．

7 月も引き続き中間発表会のスライド制作を行い，プロジェクト内での発表のフィードバックなどを参照しながら，修正を何度か繰り返した．その後中間発表会ではプレゼンテーションを 2 回行
い，発表の経験を積んだ．

10 月からは Unity のシステムについてと Kinect と Unity の連携についての勉強を行った．まず Unity についての勉強は 3 年後期に Unity を使用する講義があり，Unity についての参考書を買いそれを用いて勉強を行っていた．その参考書を参照してオブジェクトの作り方，キャラクター
の動かし方，Prefab，インポート方法など Unity についての様々な知識を得た．さらに深い内容を知りたいときは積極的にインターネットを利用した．このようにして Unity での基礎的な知識を得た．次に Kinect と Unity の連携を行うために Kinect がどのようにして Unity 内で用いることが出来るのかを参考書などを用いて調べようとした．しかし連携についての内容が深く書かれている本が少なく，インターネットで情報を得ることしかできなかった．インターネットでプログラムを調べていくうちに，Kinect と Unity についての連携をしているサイトがいくつかあり，そのサ
イトを参照しながら連携の作業を進めていくと，時間はかかったがどうにか連携を成功させることが出来た．

11 月には進捗報告会を行い，実装の内容が大幅に修正されてからは Unity 内の 3D ステージの作成とキャラクター作成を行うことになった．よって Unity についての知識をもっと深めなければならないと判断し，勉強を再び始めた．具体的な勉強内容としては，オブジェクトに付属できるcollider や Ragidbody などのスクリプトや GUI テキストの仕組み，キャラクターのアニメーショ
ンについての勉強を行った．これによって複雑なステージ作成をすることやキャラクターに動きを加えることなどができ，コンテンツの見栄えが改善された．

12 月は成果発表会のためのスライド作成を行った．Kinect 班には 1 回 3 分間の発表時間が与えられ，スライドもその時間に合わせるように作成した．このようにして短い発表時間ではあったが，背景や目的，成果物の内容を含めたスライドを作成することが出来た．

梅庭由紀子

5 月は最初の活動として，デジタルサイネージに Kinect 班の紹介動画を映すこととなった．動画の撮影前に，平井，大山と共にシナリオを考えた．シナリオ考えた後，出演者である大谷と原に動画の撮影方法を説明した．撮影には三脚とビデオカメラを用い，撮影場所は本学 4 階に位置する
スカイウォークとエレベーター前で行った．

6 月は主に，デジタルサイネージのコンテンツ内容の話し合いを行った．コンテンツの案を出す
際，Kinect 班が考えたデジタルサイネージの定義付けと本学の問題点から本学の生徒の運動不足を解消するデジタルサイネージなど，案を積極的に出した．

7 月はデジタルサイネージを作成するために動画の編集方法を学ぶ講習会にソラカメラプロジェ
クトの人と共に参加した．使用するソフトは Aftereﬀects で未経験者でも写真を取り込み簡単なエフェクトを使用してスライドショーを作成した．また，中間発表に向けて A1 ポスターの作成とスライドの修正を行った．A1 ポスターは熊木が作成したテンプレートを元に作成した．A1 ポス
ターは繰り返し担当教員に指摘を頂いた．指摘内容として，文字サイズが小さい，内容が薄い，第3 者が見た時にわからない内容になっているなど様々な指摘を頂いた．「指摘を受けた部分を何度も修正した．最終的に入れる内容が多く，1 枚に収めるのに苦労した．」またスライドに関しても，Group Report of 2015 SISP

- 57 -

Group Number 18

MOE MOE Digital Signage 〜Cognition，Design，and System〜
中間発表前のリハーサルで指摘を受けた部分を全員で話し合い，修正を行った．中間発表のプレゼ
ンテーションは前半の 3 回のうち 1 回を担当した．

9 月には中間発表で受けた評価を元に実装を始めた．中間発表まで考えていた実装をモチーフにした動画を参考にキャラクターを作成した．キャラクターの作成は Unity 作成チームと話し合いを重ねどういった動きをするのか，欲しい素材はどういったものかを話し合った．その結果 2D で作成することに決定した．そのため私はまず紙で土台になるキャラクターを書き，その後綺麗に修正した．修正後は，写真を撮影したキャラクターをパソコンに取り込み，Photoshop を用いてラフスケッチを切り抜いた．切り抜いた画像は色を塗りつぶし，パペットワークで関節を付けた．関節を軸にキャラクターを少しずつ動かした画像を何枚も保存し，それをつなげてパラパラ漫画に似た物を作成した．同じ動作を繰り返しジャンプするキャラクター，手を振っているキャラクター，寝ながら首を振っているキャラクターの 3 体を作成した．

10 月は進捗報告会で Unity の要素が弱いと指摘を受けたためコンテンツの内容の練り直しを行った．具体的には Unity を使うのに 2D はふさわしくない，2D を使う理由が弱いといったものだったため 3D にすることした．ゲーム性をより高めために内装を本学の内装にするなど，案を全体的に練り直した．コンテンツの内容を練り直した後，コンテンツの名前を決めるため，今回のコンテンツに関係している要素を書き出し，色々な組み合わせの名前を考えた．結果，名前は Kinectと Character を掛け合わせて Kinecter と決めた．また Kinecter の名前に合うロゴの作成も行った．ロゴを作成するためにラフスケッチを行い，キャラクター要素を重視してロゴの作成を行った．

11 月は最終発表に向けて作成する A1 ポスターに含める項目と内容を書き出しレイアウトを何案か書き出した．また各班の A1 ポスターに統一感を出すためにテンプレートの作成を行った．各班のポスターを担当する人で大まかなポスター構成を見るために簡単に A1 ポスターを作成した．
各班のポスターの内容を見ながら含める項目や必要な情報を書き出し，部分的にラフスケッチを行って実際に Illustrator で書き出した．また，最終発表に向けてコンテンツの使い方，操作説明，
投稿画面の使い方などをわかりやすく伝えるために動画を作成する事に決定した．そのため，最初に動画を作成するため，Aftereﬀects の基本の使い方を学習した．Aftereﬀects の使い方を学びな
がら動画のシナリオを作成し，様々な似たような製品を紹介している動画を見てシナリオを考えた．多くの動画を見てどんな動画にするかの案を固めてから絵コンテを書いた．

12 月は，実際に使用するデジタルサイネージにパソコンを繋げて動画の撮影を行った．動画を撮影する前にどういったシナリオで動画が進んでいくのかを原，大山に説明した．動画の撮影には一眼レフカメラと三脚を用いて行った．動画は同じパターンの動画を撮影した．動画の撮影後はAftereﬀects を使用して動画の編集を行った．動画は実際にデジタルサイネージの操作方法，投稿システムの使用方法，投稿した広告の確認方法の 3 部分の動画を繋げて作成した．動画作成後に，書き出しを行った．作成した動画を客観的に見ると多くのミスに気づき，何度も修正を行った．成果発表会直前のリハーサルで動画を見せた際，投稿画面の動画の説明が長く，投稿画面が重要に見えるしまう事，肝心のコンテンツの内容が伝わらないという指摘を受けた．コンテンツ動画をより伝えるために Kinect を用いて動かすキャラクターが吹き出しを出しているキャラクターの所に行った際，出現する広告を拡大する動画を追加した．動画時間が長いと指摘を受けた投稿画面は全体的に最低限見ている人に伝わるまでカットし動画時間を短縮した．またシステムの情報をより詳しくするため，実装班の人にシステムの説明を受け，システム構成図の部分の内容に深みを出した．そのため，システム構成図の内容とデザインを一から考え直した．各班でヘッダーを 1 つに統一するため削っていたコンテンツの説明を作成し，プロセスをより情報を含めて書き直した．またGroup Report of 2015 SISP

- 58 -

Group Number 18

MOE MOE Digital Signage 〜Cognition，Design，and System〜
システム構成図の部分もシステム内容が多くあった為，投稿システム，Kinect，Unity の 3 つに分け，作成した．また成果発表会直前リハーサルで先生方や先輩方からプレゼン資料に指摘を受けた部分を全員で修正を行った．成果発表会当日は後半に 2 回発表を行った

大谷一之

5 月には，グループのイメージを象徴するロゴ作成とコンテンツコンセプトの動画作成，合同発
表会のスライド確認を行った．図 5.5 を Illustrator を使用して作成した．始めにスケッチブックに何案かデザインを考案し，そこから llustrator に書き起こした．その後，グループメンバーと話し合い，グループロゴの最終デザインを決定した．また，コンテンツコンセプトの動画作成においては，1 階エレベーター前で実際に Kinect 班の考えたコンセプトのデジタルサイネージを使用する役で出演した．またスライド確認については，動画のスライドの確認と修正を行った．

6 月には，デジタルサイネージのコンテンツのアイデアの案出しを行った．そのアイデアは本学のライブラリの図書やインターネットでサイネージの例などを参考にして考えた．

7 月には，ソラカメラプロジェクトのメンバーと合同で AfterEﬀects 講習会を受けた．講習内
容は使用経験者と未経験者で内容が分かれており，私は未経験者側の講習を受けた．作業内容としては，自分の写真を幾つか AfterEﬀects に取り込み，その複数の写真同士をフェードアウトや位置移動などの効果を用いて繋げるといったものであった．それらの講習によって簡単な動画編集技術を身につけることができた．中間発表のポスターについては，梅庭と分担し Illustrator でテンプ
レートを参考にしつつ，先生からの指摘をもとに改善し，中間発表のポスターを完成させた．
後期のプロジェクト活動開始の 9 月には中間発表のフィードバックを元に話し合いを行った．そこでコンテンツを作成する為には Unity が必要であることが分かり，また Unity 環境で必要となるオブジェクトの配置方法・コンポーネントの使用方法・UI の表示方法・作成したキャラクター
の動作制御と当たり判定の付け方を習得した．一通り学んだ後に，梅庭が作成したキャラクターのイメージを Unity 内で組み合わせ，そのキャラクターのアニメーションを作成することができた．
また，その作成したキャラクターに動かすスクリプトを書き込み，当たり判定を付与するコンポー
ネントを設定することで，キャラクターをコンテンツ内に導入することができた．また，広告タイ
トルを入れる為にキャラクターに吹き出しをつけ，背景のデザインも平井と考えた．

10 月では 9 月の段階までのコンテンツの進捗を発表したが，指摘を受けたのでそれを参考にコンテンツの作り直しをした．コンテンツを 2D から 3D に変更することに決定し，それによりオブジェクトも 3D に変更になるので sculptris というソフトウェア用いてオブジェクト作成の練習を行った．練習で行った内容としてはカメのオブジェクトを作成した．その作成方法は，ミラー機能
を on にし，球状のオブジェクトを作成．そのオブジェクトに手足として突起させたい 4 箇所をマウスでドラッグしながらなぞり膨らませる．ブラシの強さを調整しながら移動ブラシを使用してその突起部分を引き伸ばす．顔となる位置を膨張ブラシでこすり顔を作成．質感を設定するマテリ
アルを緑色のマッドな質感に設定．お腹の部分を平らブラシで平らにする．平らにしたお腹の部分を溝ブラシで模様となる溝を作成．溝がはっきりしすぎているため，スムースブラシで滑らかにさせる．甲羅のふちとなる部分を丸ブラシでなぞり盛り上げる．次に首の角度を調整する．調整方法
は，頭から首の付け根以外にマスクをかけて編集出来ないようにする．その後，画面内の中心線の位置を首の付け根まで移動させる．次に回転ブラシで首の角度をもう少し上向きになるように調整する．回転させるだけでは首が引っ込んでしまうため，移動ブラシで頭を引っ張り伸ばす．仕上げとして，甲羅のふちなどのくっきりさせたい境目をつまみブラシでなぞり，練習用のカメのオブGroup Report of 2015 SISP

- 59 -

Group Number 18

MOE MOE Digital Signage 〜Cognition，Design，and System〜
ジェクトを完成させた．オブジェクト作成はインターネットで sculptris の使い方を掲載している

web サイトを参考にした．
11 月では，10 月に練習したソフトを用いて，本学学内の建物を参考にしながらコンテンツに取り込む階段と床を作成した．階段の作成過程としては，plane オブジェクトのサイズを調整し板状に変形させ，足場を作成．次に cylinder オブジェクトのサイズを調整し，左右の柵を作成．次にbox オブジェクトのサイズを調整し細長い板状に変形させ，手すりを作成．最後に，box オブジェ
クトを縦長の長方形に変形させ，階段を支える柱を作成し，それらを組み合わせることで階段を完成させた．床の作成過程としては，まず本学の床を写真に撮り，そのまま写真通りになるようにイメージした．その後，plane オブジェクトを正方形に変形させた．次に本学のカーペットの質感となるようにマテリアルを作成し，赤，青，緑，グレー，ベージュ，白の 6 種類の色を先程のオブジェクトにそれぞれ適用させた．そのオブジェクトを写真の床の色の法則に合わせて組み合わせていく．その組み合わせたものを prefab 化させ，prefab 化したものをさらに組み合わせていき，フィールドに合うサイズまでその作業を行い，床を完成させた．

12 月にはコンテンツも完成したので，最終発表に向けて発表スライドの作成や A1 ポスターの確認，プレゼンテーションの打ち合わせを何度も行った．

図 5.5

5 月に作成したロゴ

大山浩暉

5 月はデジタルサイネージのコンテンツ作りの一環として動画制作を行った．動画編集は日頃から行っていたため，私が動画編集を担当した．Kinect 班がこれから何をしていきたいかを表現した動画を制作した．内容としては本学の空いているスペースにデジタルサイネージを設置し，バスの情報や教授の部屋番号情報といった学生が役に立つ情報を自分たちが用意して表示させようといった内容だった．しかし，その案ではありきたりすぎるという指摘を受けた．

6 月にはどのようなコンテンツを制作するかをメンバー全員で話し合った．その結果，現在の本学の問題点として，情報を発信，取得する環境が出来ていないということがあげられる．そして

Kinect にはデジタルサイネージを目立たせる効果があると文献調査によって判明したことから，
Kinect とデジタルサイネージを連携させて，楽しく情報を閲覧できるコンテンツを制作することを目標とした．

7 月ではその目標を中間発表で分かりやすいようにスライド資料を調整し，プレゼンに工夫をした．

9 月に Kinect と Unity を連動させるために Kinect for Windows をダウンロードしセットアップした．そしてサイトから Kinect Wrapper Package for Unity3D をダウンロードし，これを Unity の Project にインポートした．Kinect フォルダに入っている Kinectlnterop.cs ソース

Group Report of 2015 SISP

- 60 -

Group Number 18

MOE MOE Digital Signage 〜Cognition，Design，and System〜
ファイルの 9 箇所を変更しなければ Kinect が正しく表示しないため変更した．そのあと Project
ビューの中にある Scene フォルダの KinectSample シーンを開いて実行を押すと図 5.6 のような

Kinect から読み取れる人間の関節が表示されるようになった．これで Unity と Kinect の連動が可能になった．

10 月には人間の関節と Unity 上の 3D オブジェクトという物体が触れた場合，3D オブジェク
トの色が変わるというプログラムを作成することを目標とした．Kinectv1 では指さしの反応は不可能なので腕指しで当たり判定を付けることにした．腕指しは肩と腕のベクトルを計算して得る．Kinect を通して腕指しの状態を Unity 上で判断できるようにインターネットからサンプル
プログラムを参考にし PoingHandler.cs ソースファイルを作成し，Kinect Wrapper Package forUnity3D のサンプルの KinectPointMan にソースファイルを付与した．加えて，当たり判定対象とするための HitTarget レイヤーを登録した．3D オブジェクトに当たった場合色が変わるというプログラムを作成するために PaintIt.cs ソースファイルを作成し，3D オブジェクトに付与した．
この 3D オブジェクトにも当たり判定対象とするための HitTarget レイヤーを登録した．そしてMain Camera を作成して，シーンを実行すると関節と，3D オブジェクトが触れたときに色が変わるということが可能になった．

11 月には関節と 3D オブジェクトが触れたら Unity 上のキャラクターが移動するというプログ
ラムを作成することを目標とした．前後左右移動するために 3D オブジェクトを 4 つ作成し，Unity
上の関節の前後左右に配置した．加えて，その 4 つの 3D オブジェクトそれぞれに PaintIt.cs，

PaintIt1.cs，PaintIt2.cs，PaintIt3.cs ソースファイルを付与した．3D オブジェクト側では今まで色が変わるといった処理の部分に，キャラクターが持っているソースファイルのある関数を呼び出すというプログラムを付与した．キャラクターが持っているソースファイルには前後左右に移動するための 4 つの関数を作成した．PointingHandler.cs ソースファイル中の触れたら PaintIt の色を変更する関数を呼び出すというプログラムの部分に，触れたら PaintIt1 の色を変更する関数を呼び出す，触れたら PaintIt2 の色を変更する関数を呼び出す，触れたら PaintIt3 の色を変更する
関数を呼び出すを加え，それぞれの関数の場所を変更するという調整を行った．こうすることで，人間が前後左右に腕を伸ばし，Unity 上の関節と 3D オブジェクトが触れたとき物体の色が変わり，色が変わっている間キャラクターが移動するということが可能になった．

12 月にはどの 3D オブジェクトに触れているのかを分かりやすくすることを目標とした．これは 4 つの 3D オブジェクトを作成した場所の真上に Sub Camera を作成し，真下に撮るように角度を調整し，画面の右上にあまり邪魔にならない程度の大きさを 2 つ目の画面として付けることで全体画面の右上にどの 3D オブジェクトが反応しているのか視覚的に分かるようにした．次に，もしキャラクターが詰まって動けなくなってしまった場合の初期位置に戻るプログラムの作成を行った．これは PaintIt4.cs ソースファイルを付与した 3D オブジェクトを作成し，Unity 上の関節が表示されている位置の真上に配置した．そしてキャラクターが持っているソースファイルに初期位置に戻る関数を作成した．PaintIt4.cs ソースファイルにはその関数を呼び出すプログラムを付与した．これから人間が真上に腕を伸ばし，Unity 上の関節と 3D オブジェクトが触れたらキャラク
ターが初期位置に戻るということが可能になった．そのほかに，Kinect での操作を少しでもやりやすいように Unity 上の関節の周りにある 3D オブジェクトの位置や大きさを微調整した．

Group Report of 2015 SISP

- 61 -

Group Number 18

MOE MOE Digital Signage 〜Cognition，Design，and System〜

図 5.6 Unity 上の白い関節平井彰悟

5 月は，1 階のエレベータ前のサイネージに流すコンテンツの動画を撮影し，編集担当の大山に引き継いだ．

6 月は，サイネージの動画を編集するために AfterEﬀects の使い方を勉強した．
7 月は，エレベータ前の動画を時間指定どおりにリピート再生されるように設定した．指定した時間どおりにデスクトップがスリープ状態になるソフトとして，nemnem，他画面でリピート再生するソフトに MPC-HC などの FREE ソフトを使って管理する方法を学んだ．中間発表の資料に使う動画を大谷と分担して行い，デモ動画を作成した．スライドの内容を見る人にとって伝わりやすい構成を考え，指摘した．また，プロジェクト全体発表の担当になった．そのため，プロジェク
ト全体のポスターの作成とプレゼンテーション資料の作成を小坂，八幡と行った．

10 月は，Unity 上で 2D キャラクターに動きをつけた．キャラクターに C ＃のスクリプトを付与することで動きを自動化することができた．また，Kinect を使いキャラクターに触れた時キャラクターを 1 体消し，広告が載っている看板が降りてくるコンテンツを作成した．しかし，降りてくる広告情報が Unity を停止して自分たちで書き直さないと，更新されない状態だった．

11 月の進捗報告会後から投稿担当になった．投稿システムには，Java を使用した．講義で学習したソースコードを見直すところから始めた．Java の関数が全くわからなかったため，投稿の 1
画面だけの作成から始めた．実装する案として Java 側では，txt ファイルを書き出す方法を思いついた．そのため，FileWriter 関数を用いて，txt ファイルを書き出す画面を作成した．その後，複数の広告を投稿できるようにするため画面遷移を実装することにした．画面遷移の方法としてFrame と Panel を利用した．これにより，4 つの広告画面に移動できるメイン画面と 4 つの広告を記入できる投稿画面を作成できた．その後，メイン画面が小さすぎる問題を解決するために画面を拡大した．拡大するとボタンと背景だけでは，画面が大きすぎるため，各広告のタイトルをメイン画面に表示したタイトルを表示するために BuﬀeredReader 関数を利用した．

12 月は，Unity と Java を連動した時に txt の文字コードで問題を発見した．txt の文字コードが SHIFT JIS だったが，Unity では対応していなかった．そこで，txt を UTF-8 で書き出すた
めに，FileWriter 関数から PrintWriter 関数に変更した．また，全体発表者として，成果発表直前
リハーサルで発表を行った．各班の成果物の内容，目的を把握していなかったと感じた．そこで，全体発表のスライドを読み込み，各班の成果物の内容理解に努めた．

Group Report of 2015 SISP

- 62 -

Group Number 18

MOE MOE Digital Signage 〜Cognition，Design，and System〜（※文責: 原史也，大山浩暉）

5.4

成果物と考察5.4.1

成果物• デジタルサイネージの全体の流れ
本プロジェクトにおいて Kinect 班は，学生の情報共有のためのコンテンツの提案，実装を行った．最初にデジタルサイネージに設置されている Kinect が反応する位置に立つ．腕を画面に向かって前に出すと，デジタルサイネージ内に立っているキャラクターが腕の動きに連動して動き出す．キャラクターの動きに連動する腕の種類としては，前，右，左，後ろの 4 種類がある．また腕を前に出しながらもう片方の腕を左に出すとキャラクターが左斜め前に進む．右や後ろも同様である．Kinect を操作する事でコンテンツ内のある階段を登ったり，学食に入ったりなど，色々な場所を見て回る事が出来る．
コンテンツ内部は本学をモチーフに作られた内装になっている．コンテンツを見て回っていると吹き出しを出しているキャラクターを発見する事が出来る．吹き出しを出しているキャラクターの広告の種類はサークル，事務，自由投稿１，自由投稿２がある．キャラク
ターの吹き出し部分にはそのいずれかのジャンルタイトルが表示されている．興味があるキャラクターに触れると，そのジャンルに関連した広告を見る事が出来る．広告を表示しているキャラクターから離れるように，キャラクターを動かすと広告が消える．広告を見る以外にもコンテンツ内部の様々な場所をキャラクターを動かし，見る事が出来る．階段を使って二階に登ったりすることや扉を開けて教室や学食の内部に入る事も出来る．コンテンツの中身を見終わったり，一番最初に戻るのが面倒な時，キャラクターが詰まって動かなくなってしまった時などに腕を上にあげる事で初期位置に戻る事が出来る．以上の一連のシステムの流れを図 5.7 に示す．

• 投稿システムの全体の流れ
デジタルサイネージ内のキャラクターに設置されている広告は，投稿システムを利用して自分で書く事が出来る．投稿方法はまず，デジタルサイネージの下に設置してあるノートパ
ソコンの前に行く．ノートパソコンの画面にはサークル，未来祭，自由投稿１，自由投稿２という項目が用意してある．投稿者は自分が投稿したいと思っている内容と一番近いジャンルの項目をクリックする．項目をクリックすると，タイトル記入欄と本文記入欄が出てくる．投稿者はタイトルと本文を記入する．タイトルと本文を記入後，下にある入力ボタンをクリックする．タイトルと本文を書き直したい時は，画面の右にあるクリアをクリックするとタイトルと本文が消える．またメイン画面に戻りたい場合は，クリアの右にある戻るボタ
ンをクリックするとメイン画面に戻る事が出来る．記入した内容に不備がなければ入力ボタ
ンクリックする．クリック後はメイン画面に戻る．メイン画面の下にある更新ボタンをクリックすると，現在の広告の所に自分の打ち込んだタイトルが表示される．広告の更新後，
デジタルサイネージのコンテンツを操作し，自分の広告がきちんと投稿されているか確認をする．

Group Report of 2015 SISP

- 63 -

Group Number 18

MOE MOE Digital Signage 〜Cognition，Design，and System〜

図 5.7

システム構成投稿システム
投稿システムには，Java を使用した．この投稿システムでは，MainFrame と Panel4 つのクラスを作成し，画面遷移できるようにしている．また，全ての画面で背景にゲーム画面のスクリーン
ショットをいれた．イメージを持ってもらうために図 5.8 に開発した投稿システムの MainPanelを表した．MainPanel には，重要な広告を消さないために，JPasswordField を用いてパスワードを設置した．このパスワードがついた広告画面は，パスワードを知っている人以外が更新を行うことはできない．図 5.8 の各広告部分をクリックするとそれぞれの SubPanel に画面遷移する．

SubPanel の画面が図 5.9 である．タイトルを JTextField，本文を JTextArea に入力できる．発信
者が投稿内容を入力後，入力ボタンを押すことで FileWrite 関数が呼び出される．それにより，書き込まれた情報を txt ファイルで保存される．保存される txt ファイルの文字コードを FileWrite
で UTF-8 に変更した．入力ボタンを押すと，投稿画面は，MainPanel に戻る．MainPanel の更新ボタンを押すと，ファイルのチェックが行われる．対応した SubPanel 上にファイルが存在する
場合，Buﬀered Reader を使い，タイトル部分の txt ファイルだけを読み込む．と見込んだタイト
ルを MainPanel 上で表示する．表示する方法として，readLine を使い，読み込んだ txt ファイルの中身を String 型に変更して，setText で画面に表示させた．

Unity
デジタルサイネージにゲーム性を付与するために Unity 内で実装を行った．まずゲーム性を付与するための課題として挙げていた本学に模した仮想空間を作るために，オブジェクトを用いてステージ作成を行った．Unity はプログラムを書くことなく，Cube や Rect などの様々な図形を作成することができ，位置や大きさも簡単に変更することが出来る．この特徴を生かすことで，箱型のステージを作ることや 2 階建にするためのフロアを作成できた．しかしそれだけでは本学に模したステージには見えなかったため，本学内の特徴を踏まえた要素をステージに付与することとしGroup Report of 2015 SISP

- 64 -

Group Number 18

MOE MOE Digital Signage 〜Cognition，Design，and System〜

図 5.8

投稿システムホーム画面

図 5.9

投稿入力画面た．

1 つ目の要素は本学内の床に規則正しく配置されている色の付いたタイルを Unity 内でも実装することである．まず初めにタイルの規則性を理解するために，本学の床を写真で撮り，配置について調べた．その後 Unity 内で赤色，青色，緑色，黄色，灰色，茶色の 6 色のタイルを 1 枚ずつ作成し，それらを規則性に従い図 5.10 のようにステージの床に配置させた．これによって本学の床を仮想空間上で表現することが出来た．

図 5.10 仮想空間内のステージ

2 つ目の要素として，2 階のフロアを利用可能にするために階段を Cube や Rect 等のオブジェクトを駆使して作成し，キャラクターが階段を上れるようにした．3 つ目の要素としては，AssetStore という Unity で使用できる 3D モデルの素材や画像などをダウンロードできるオンライン
ショップを利用し，本学に近づけるための素材をダウンロードしたことである．テーブルやイス，

PC，時計，ホワイトボードなど本学に必要である素材をダウンロードし，その素材をステージ上に配置し，本学学生が実際に使用している研究室や講義室，学食などを仮想空間上で作成した．このようにして本学を模したステージを作成することが出来た．そのステージの内装を図 5.11 で表した．

Group Report of 2015 SISP

- 65 -

Group Number 18

MOE MOE Digital Signage 〜Cognition，Design，and System〜

図 5.11

仮想空間内のステージ

次にキャラクターを配置しそのキャラクターに情報を付与させた．その情報を付与するために

FileOpen という C ＃のプログラムを作成した．FileOpen のプログラムでは UTF-8 でエンコードされた txt ファイルを Unity 上で読み込み，GUI として文字のサイズ，背景の色などを表示するようにした．よって FileOpen が Unity 上で呼ばれた時に，txt ファイルを表示するという仕組みになっている．このプログラムを事前にステージ上に配置しているキャラクター 1 体 1 体に付属させた．そうすることによって，キャラクターに対して何かしらの反応があった時に FileOpen が実行されるというような流れを作った．最後に仮想空間内のキャラクターに collider と Rigidbodyという当たり判定ができるスクリプトを付与し，情報受信者が操作するキャラクターと他のキャラ
クターが触れた時にプレイヤーではないキャラクターが保持している情報を表示するようにした．
この方法として• キャラクター全てに collider と Rigidbody を付与し，当たり判定を有効化• 操作するキャラクターに player というタグを付与• 操作するキャラクターと他のキャラクターがぶつかった時だけ情報を表示させるプログラムを作成
以上の 3 つを行った．特に工夫したことは操作するキャラクターとぶつかった時だけに情報を表示させることである．このプログラムを作成するために collider というスクリプトが反応している時だけに実行できる OnCollisionStay 関数と collider の反応が終了するときに実行できる

OnCollision 関数を用いた．さらに player というタグを持ったキャラクターの collider にしか反応させないようにする collision.gameObject.tag ==player というスクリプトを記述した．これにより操作しているプレイヤーとぶつかった時と離れた時だけに実行が開始されるプログラムを作成することに成功した．以上の内容が人の目を惹くデジタルサイネージにするために行った実装内容である．

Kinect
利用者は右手左手どちらでもよいが，右の方に手を伸ばすと Unity 上のキャラクターは右に移動
し，左，前後も同様に手を伸ばすとその方向にキャラクターが移動する．もしキャラクターがどこかで詰まってしまい動けなくなった場合，利用者は手を真上に伸ばすとキャラクターが Unity を起動したときに立っていた場所に戻る．利用者はどの部分のオブジェクトに触れているのかを分かりやすくするために，右上に十字キーに似た物を表示させている．これはキャラクターが前に進んでいるときはキーの上の 3D オブジェクトだけが赤くなり，左右や後ろに進んでいる場合はキーの左
右や下の 3D オブジェクトが赤く表示されるようになっている．キャラクターが元の位置に戻るときはキーの中央の 3D オブジェクトが赤く表示する．プログラムとしては，Unity 上の関節と 3DGroup Report of 2015 SISP

- 66 -

Group Number 18

MOE MOE Digital Signage 〜Cognition，Design，and System〜
オブジェクトが触れた場合，その対象の 3D オブジェクトだけ赤色に変わる．そして 3D オブジェ
クトが赤色に変わっている場合，キャラクターが移動する関数を呼び出す．以上のプログラムの流れで Kinect を使用してキャラクターが動くようになっている．

5.4.2

成果発表会での結果と考察

例年通り成果発表会は前半３回，後半３回に分かれて行われた．そして本プロジェクトは全体でプレゼンテーションを行った後，各班でポスターセッションを行った．プレゼンテーションを見ている人はコンテンツの説明を聞いた後，デモを体験してもらう形式を取った．Kinect 班のコンテンツに興味を持った多くの人がポスターセッションとデモを見に来た．デモを行う前にはコンテンツの操作と投稿システムの仕組みを伝えるために動画を流し，その後実際にコンテンツを操作してみたい人にコンテンツを触ってもらった．デモを行う人はポスターセッションに訪れた人の中から選んだ．デモを行う前に見せた動画の流れをもう一度口頭で説明した．デモの説明を充分に行ったが，やはり Kinect を使用して操作する事に慣れていないため，最初からスムーズに操作出来ていなかった．また Kinect の操作がうまく動作せず，キャラクターの動作が階段を登る時などに遅くなってしまった．しかし少し操作すると慣れてくれ，デモは全体的に評判が良かった．しかし，中には時間が押してしまいデモが出来ない時もあった．またポスターセッションを見に来てくれた人を対象に評価シートの記入をしてもらった．評価シートの意見として以下のような指摘があった．

• ゲーム性を持たせる必要性がわからない• Kinect や Unity を使用する根拠を数字で欲しかった• 実際の未来大学に対応した投稿がみたい• 操作するのに練習が必要• 欲しい情報を取得するのに時間がかかる．
• 投稿システムのモニタも大きくして欲しかった．
指摘された点の反省としては，根拠となるデータを調査，分析出来なかった点である．そのため，5 月の始まりで，実装と調査・分析を繰り返す班として始動したが，プロトタイプを作成することができず調査・分析を怠ってしまった．Kinect を配置することで人がどれだけ足を止めるか，

Unity が付与するゲーム性とは何か具体化する，などの調査を後期に並行して行うべきだったと感じた．欲しい情報を取得するのに時間がかかるについては現在の 2 階建ての建物で情報取得にかかる時間に不満を感じるかを調査し，その評価によって取得範囲を狭めることで解決していきたい．
未来大学に対応した投稿が見たいという意見については，事務局との連携をとることで，事務局から配信される重要な未来大学の情報が流れるようなコンテンツにすることで解決したい．操作するのに練習が必要な点については，見た人が直感的に操作可能になるよう画面上で示唆する仕組みを取り入れたい．最後の投稿システムのモニタの大きさについて述べる．投稿画面が見づらいという指摘は，成果発表直前リハーサルの段階で問題になっており，最終発表の際には PC 画面ではなくディスプレイを使用した．しかし，結果的に改善されず見づらいという指摘を受けた．デモ発表の重要な発表部分でもあるため，相手に見えやすく，工程が伝わるプレゼンテーションの方法を模索する必要がある．

Group Report of 2015 SISP

- 67 -

Group Number 18

MOE MOE Digital Signage 〜Cognition，Design，and System〜（※文責: 平井彰悟，梅庭由紀子）

5.5

まとめ

5.5.1

プロジェクトの反省反省点として 3 点ある．

• 投稿部分の実装始めの班分けで，キャラクターとシステム班に分けてしまい，投稿部分の実装が遅れてスタートした点である．後期が始まった段階で投稿に時間を当てることができていたら，ローカルでの投稿とは違う形に進めることができたと感じる．

• スケジュール管理 スケジュールを立てなかった結果，模索しながらの実装期間が長引いてしまった，詳細な予定表を作り，どの部分の進捗が遅れているかを書き出すべきだったと感じた．また，各自の問題に対し，1 人で悩むのではなくグループ全体で話し合うことでス
ムーズに解決していた問題もあった．

• スケジュール管理

3D モデルの作成ができなかった点である．3D モデルの作成が難しく，

今回は時間を割けなかったため Unity ちゃんなどの既存のキャラクターを使用した．この点についても，初めの班分けの時に 2D キャラクターで絞って作業を行ってしまったことで少ない作業時間になってしまったことが原因である．

5.5.2

今後の展望

Kinect を操作して 3D 空間でキャラクターを動かすこと，Unity を使用している事だけではゲー
ム性が薄いと考えた．よってゲーム性を付与するため，特定の時間に隠れキャラクターを出現されるなど工夫したい．現在は広告を持っているキャラクターの外見は，内容と全く関係ないものになっている．したがって，サークルの情報を持っているキャラクターはギターを持たせる，未来祭の情報を持っているキャラクターは未来大実行委員の T シャツを着ているなど，吹き出しのジャンルだけではなく，外見でそのキャラクターが持っている情報が少しでも伝わる工夫をしていきた
い．投稿システムは現在，広告が 4 つしか投稿出来ないようになっているので投稿出来る数を増やしていきたい．現在は投稿が集中してしまっても，投稿が上書きされてしまう．例として，最初に投稿した人と次に投稿した人の差が 30 分しかない場合，前の人の投稿は 30 分で消えてしまう，
そのため，掲載時間が極端に少ない投稿が出てしまう可能性がある．投稿時間が短い場合の改善案
として，次に投稿されたものは保存されるようにし，投稿が集中した場合でも 24 時間後に自動的に投稿される．このような投稿保存機能をつけたいと考え今後の展望として設定した．
（※文責: 平井彰悟，梅庭由紀子）

Group Report of 2015 SISP

- 68 -

Group Number 18

MOE MOE Digital Signage 〜Cognition，Design，and System〜

第6章

プロジェクト全体の活動

プロジェクトメンバーの顔合わせは 5 月からであったため，活動の開始は 5 月初旬からであった．まず，各自がコンテンツ制作の興味のある開始位置のところで自由に集まり，初期メンバーとして未来大学内に設置したいと考えるコンテンツ提案，グループの活動方針などをまとめ，発表を行った．これはメンバーの親睦を深めるための活動であったため，一週間後には解散し，新規のグループを作り，目的重視型，調査重視型，目的調査考慮型とした．本決定した後は，1 階エレベー
ター横のサイネージを新しく設置し直す活動を行った．それと並行して，各班ごとに目標を定めて調査を行い，コンテンツの提案内容を固めていった．

6 月には各班による習作コンテンツを制作し，実際にサイネージに流して大学内に公開をした．その後，プロジェクトメンバーの中の 3 人が先ほどの 3 つのグループと独立したコンテンツ設置班として，デスクトップパソコンなどの設置や調整，アプリケーションのインストールなど，これからサイネージを運営していく上で必要な環境を整えた．また，各班の提案内容を第三者に評価してもらうため，平田・竹川研究室と田柳研究室の合同発表会を行った．その合同発表会を元に，各班はコンセプトをさらに深化させ，より具体的な提案をするべく，議論を重ねた．

7 月には中間発表に向けて，リハーサルを行い，より良いプレゼンを行うため，平田・竹川研究室の研究生に内容面だけでなく発表姿勢などの指摘を受けた．中間発表が終了した後，中間報告書の制作に取り掛かった．報告書提出後は夏休みに入り，8 月は中間発表の振り返りを各班行った．また，同月にオープンキャンパスがあったため，オープンキャンパスリーダーを立て，そのリーダー
中心にオープンキャンパスの準備を行った．

9 月は前期の提案内容に基づいて，各班コンテンツ制作に必要な知識の習得の時間にあてることとした．そして，北の 4 大学として，公立はこだて未来大学，室蘭工業大学，小樽商科大学，帯広畜産大学がマネジメント計画をニセコで行った．プロジェクトメンバーの中でピアノ班から 2 名，食堂班から 2 名，Kinect 班から 1 名の計 5 人がその発表に参加した．

10 月は後期に入ったため，各班コンセプトをさらに展開させ，コンテンツの設計を行った．また，
よりコンテンツ内容に適した場所にサイネージを置くため，サイネージ設置環境の検討も行った．

10 月下旬には市立函館高校の学生がプロジェクトの見学に来たため，各班デモを準備して発表に臨んだ．11 月はコンテンツ制作に重点を置き，各班制作の時間にあてることとした．

11 月上旬には各班のコンテンツを互いに発表しあい，各班の進捗報告会とした．この進捗報告には平田♪竹川研究室の研究生も参加し，コンテンツに関しての意見だけでなく，コンテンツ制作に関わる必要な知識などの指導も受けることができた．11 月下旬には学生だけでリハーサルを行ったり，A1 ポスターの体裁も整えたりと，12 月の最終成果発表会を意識した活動を行った．

12 月にはプロジェクトの時間をほとんど割き，先生方や平田・竹川研究室の研究生にリハーサルを見てもらい，スライドやポスターの改良を続けた．最終成果発表会ではリハーサルで指摘された点を意識しながら発表を行った．最終成果発表会が終わった後は教員仮提出に向けて最終報告書の作成の時間とした．最終報告書はグループごとの報告書ではなく，プロジェクト全体で一冊の報告書とした．
（※文責: 熊木万莉母）

Group Report of 2015 SISP

- 69 -

Group Number 18

MOE MOE Digital Signage 〜Cognition，Design，and System〜

第 7 章 プロジェクト全体のまとめ
もえもえデジタルサイネージは未来大生の心を動かし，行動を変えることができるサイネージのコンテンツを目指し，学内に設置するサイネージの提案と制作を 1 年間を通じて行った．3 つの班を作り，それぞれ興味のある班で活動を行った．前期では全班ごとにコンテンツの提案に力を注いだ．中間成果発表会での評価を受け，提案内容を変える班もあったが，ほとんどの班では提案を変えず，評価を参考により良いコンテンツの制作を目指し，後期は実装を進めた．11 月には各班の実装も進み，実際に動かせるようになった．しかし，その時点ではコンテンツとしてはどの班も未熟であり，12 月の最終成果発表会までに実装のスピードを上げ，無事に発表を行うことができた．
スケジュールを振り返ると，成果発表会直前のリハーサルが続き，なかなかコンテンツ制作に集中できないなど多忙な週もあったが，全体的にプロジェクト全体はスケジュール通りに動くことができた．一度スケジュールを立てた後，担当教員に相談するだけでなく，各班のグループリーダーともスケジュールを確認しあってからスケジュールをメンバー全員に共有したことがスケジュール管理に成功した点であった．また，後期ではプロジェクトリーダーと各班のグループリーダーが協力し，成果発表会の準備や報告書の体裁を整えたことが情報共有を深められたことに繋がっていた．
グループリーダーから各班のメンバーに情報を伝えてもらうことで，情報の食い違いが起きにく
く，共有もスムーズであった．
コンテンツ制作を振り返ると，各班で仕事の分担量に違いが起きたり，考えの違いが起きたり，そこがメンバー同士の衝突につながることもあった．しかし，それぞれの班が 1 つのコンテンツを制作するため，最終的にはメンバーがまとまって制作に全力を尽くすことができた．コンテンツに関して，ピアノ班は後期からの提案内容が前期とほぼ異なるものであったにも関わらず，プロジェク
ションマッピングとピアノを組み合わせ，ピアノをサイネージ化するといった新しい形のサイネージを制作した．食堂班は前期ではアンケートを実施し，調査の結果を分析し，学生が必要としている学食に関するサイネージを制作した．また，実際に学食の前にコンテンツを設置し，学生や教職員に使ってもらうことができた．Kinect 班は，他班より新しい知識の習得がはるかに多いコンテンツであったにも関わらず，制作を根気強く進めシステムを実装させることができた．Kinect を利用したコンテンツであったため，最終成果発表会では多くの聴衆が体を動かしてシステムを操作し，楽しげに使用している様子が印象的であった．
（※文責: 熊木万莉母）

Group Report of 2015 SISP

- 70 -

Group Number 18

MOE MOE Digital Signage 〜Cognition，Design，and System〜

付録 A
A.1

習得技術

ピアノ班

• 佐藤は Processing による射影変換の知識を習得．
• 熊木，小坂，村上は Quartz Composer によるシステム開発の技術を習得．

A.2

食堂班

• OpenCV• WordPress• Illustrator• PowerPoint• ムービーメーカー

A.3

Kinect 班

原史也• Unity に用いる C# プログラミングの習得• Kinect に用いる C# プログラミングの習得• Unity 内のオブジェクト制作技術の習得

梅庭由紀子• A1 ポスターのレイアウト• AfterEﬀect での動画編集技術の習得• Illustrator での Kinect グループのロゴ制作技術の習得

大谷一之• Unity 内のオブジェクト制作技術の習得• Illustrator での Kinect グループのロゴ制作技術の習得

大山浩暉• Kinect と Unity を連携するための技術習得
Group Report of 2015 SISP

- 71 -

Group Number 18

MOE MOE Digital Signage 〜Cognition，Design，and System〜• Kinect に用いる C# プログラミング技術の習得

平井彰悟• 投稿システム制作のための Java プログラミング技術の習得• 2D キャラクターのアニメーション制作技術の習得

Group Report of 2015 SISP

- 72 -

Group Number 18

MOE MOE Digital Signage 〜Cognition，Design，and System〜

付録 B

相互評価

ピアノ班

B.1
佐藤僚太

• 村上:Processing 班として，プログラムの作成を担当していた．プロジェクションマッピン
グに対して熱意はグループ内で最も高く，プログラムの内容は精巧に映像投影を行えるようにできていた．また，グループリーダーとしてコンテンツの方向性をまとめたり，メンバー
間の情報伝達を率先して行っていた．

• 熊木:同じ Processing 班としてプログラムの作成を行ってくれた．プログラムの作成のために新しい知識を習得したりと尽力してくれていた．また，グループリーダーとしてグループのメンバーを常に引っ張ってくれたことが印象的であった．

• 小坂:自分たちの班のリーダーとして各課題の連携を考えて課題の締め切りを考えてくれた
ため，班内での活動が滞ることが少なかった．

村上新• 佐藤:Quartz Composer でシステム開発するための技術を学習して，率先してシステムを制作してくれた．

• 熊木:Quartz Composer 開発チームとして，初めての開発環境である Quartz Composer の使い方を独学で学びながら作業を進めてくれた．プロジェクションマッピングで使用する物品の調達や細かな作業にも率先して取り組んでいた．

• 小坂:同じ Quartz Composer 担当チームとして，プログラムがなぜこう動くかを理解し，分
かりやすく教えてくれてとても助かった．

熊木万莉母• 佐藤:同じ Processing 開発チームとして，技術的に作成が困難なオリジナルキャラクターやアイコンの作成を行ってくれた．

• 村上:Illustrator や Photoshop，After Eﬀects の知識や技術がピアノ班の中で最も高く，キャラクターデザインや A1 ポスター，エフェクトの素材，動画作成などを担当してくれた．その成果物の質は非常に高く，コンテンツがより良いものになった．また，プロジェクトリー
ダーの仕事とグループ内での仕事を卒なくこなす姿に感心した．

• 小坂:班内で使用していた 2 つの開発言語の知識を獲得してくれた．そのおかげで，2 つの開発言語のどちらが各課題の解決に適しているかがわかり，担当チームごとの課題がわかりやすくなった．

Group Report of 2015 SISP

- 73 -

Group Number 18

MOE MOE Digital Signage 〜Cognition，Design，and System〜

小坂泰貴• 佐藤:Processing 開発チームでできない仕事を分担した際，快く引き受けて締切までに作業を終わらせてくれ，非常に助かった．

• 村上:同じ QuartzComposer チームとして，使い方の習得や技術の向上を互いに協力し，コンテンツの制作をしてくれた．また，プログラムの整理や映像の微調整，エフェクトの調整など，細かい作業を率先して行ってくれた．初めは苦手だった発表担当も，最終発表には克服してピアノ班のグループ発表者を務めてくれた．

• 熊木:Quartz Composer を使って，新しい知識を獲得しながらコンテンツを作ってくれた．
また，Processing 開発チームで人手の足りない作業を手伝ってくれたり，機材のサイズ測定なども積極的に行ってくれた．

食堂班

B.2
八幡望

• 石垣:顔認識や投稿システムなどシステム系でとても活躍していた．
• 赤平:システムを構築するためにプログラミングを頑張っていた．現実的な目線から意見を出してくれた．

• 武田:システムを制作している際に，様々なアイデアや方法を出してくれて，とても助けられました．投稿型コンテンツの制作では，誰よりも WordPress や PHP などの知識を深め，作業の進捗に貢献していた．

• 西村:WordPress での投稿型コンテンツ制作の際に中心となって取り組んでいた．実装力がとても高く，大変頼りになった．また，待ち時間の調査の分析を椿本先生にアドバイスをもらいながら 1 人で行ってくれた．待ち時間コンテンツを実現することはできなかったが，実装を頑張っていた．

石垣愛美• 八幡:動画を細部まで丁寧に編集し，また的確なアドバイスやこまめな連絡，スケジュール管理などをしてもらい大変頼りになった．

• 赤平:計画性があり，プロジェクト学習の時間外での活動の際は積極的に声がけをしてくれてとても頼りになり多くの場面で支えられた．

• 武田:副リーダーとして，リーダーや他のメンバーをしっかりと支えていた．前期と変わらず，きちんとスケジュールを管理し，率先して連絡事項をまとめてくれた．動画作成なども細かいところまで丁寧に作業をし，良い動画を作ってくれた．

• 西村:副リーダーとしてグループをまとめ，グループを引っ張ってくれた．グループ間の連絡を率先して行っていた．動画制作を担当していたが，その他にやるべきことを考え行動している姿がみられた．どんなタスクに対しても，丁寧な作業を行っていたと思う．

Group Report of 2015 SISP

- 74 -

Group Number 18

MOE MOE Digital Signage 〜Cognition，Design，and System〜

赤平優莉• 八幡:グループリーダーとしてみんなをまとめ，率先して A1 ポスターやフライヤーの作成を行ってくれた．専務との話し合いにおいても積極的に連絡を取り合い，素晴らしかった．

• 石垣:リーダーとして意見をまとめてくれたり，ほかの人とは違う視点の考えを出してくれたりと参考になり，頼りになった．

• 武田:１年間リーダーとして，メンバーをしっかりとまとめ，引っ張ってくれた．話し合いの中では，より多くの意見を出してくれたし，専務との連絡も責任を持って欠かさず行っていた．A1 ポスターについては，ほぼ一人で素晴らしい出来のものを作ってくれた．

• 西村:リーダーとしてグループをまとめてくれた．専務との打ち合わせの資料やフライヤー，
A1 ポスターなどの多くのものを作成してくれた．Illustrator の知識と技術が素晴らしかった．グループの代表として，専務との打ち合わせやその連絡を行ってくれた．専務の了承を中々取ることができず，大変だったがそんな中でもグループを引っ張ってくれた．頼りがい
があった．

武田誠

• 八幡:WordPress でのシステム構築及び最終発表での発表スライド作成を行ってくれた．シ
ステム構築での多彩な意見出しに助けられた．

• 石垣:顔認識や投稿システムなどシステム系でとても活躍していた．前期よりも意見が多くなった．

• 赤平:システムを構築するためにプログラミングを頑張っていた．プレゼンや資料作成を積極的にやってくれた．

• 西村:投稿型コンテンツの制作の際に大変頼りになった．実装力が高かった．最終成果発表
会のプレゼン資料の作成，改善の際には大変活躍していた．どうすればより良いコンテンツができるのかというのを，とても考えていると感じた．

西村陽菜• 八幡:動画編集もしつつ，システム構築の方も助けてもらい大変助かった．また報告書をまとめたり他のメンバーへ気配りしている姿が見られた．

• 石垣:報告書をまとめてくれたり，とにかく仕事が丁寧で周りへの気配りもできていた．
• 赤平:仕事が早く丁寧でとても頼りになった．案出しの際も積極的に意見を出してくれた．
• 武田:どんな作業でも強い責任感を持って取り組んでくれました．投稿型コンテンツの制作
では，多くの良いアイデアを出してくれたし，作業が行き詰ってもいつも諦めずに一生懸命取り組んでいましたGroup Report of 2015 SISP

- 75 -

Group Number 18

MOE MOE Digital Signage 〜Cognition，Design，and System〜

Kinect 班

B.3
原史也• 梅庭:グループリーダーとして率先して連絡を積極的に行ってくれた．実装においても，全ての分野を把握していた．Unity で本学をイメージして作成した内装も完成度が高かった．
また A1 ポスターを作成する時，丁寧にシステムの解説をしてくれた．スライドの修正も率先して行ってくれた．

• 大谷:グループ内の作業を全体的に把握しており，今後の予定をまとめてくれとても助かった．コンテンツ作成においては，ステージ作成や Kinect 関係を悩みながらも続けて行っていた．

• 大山:Kinect 班のグループリーダーとして積極的に声かけをしてくれた．Kinect の設定や投稿機能のプログラムも行ってくれた．話し合いをみんなに分かりやすくまとめてくれた．

• 平井:グループリーダーとして積極的に活動を行っていた．Kinect の設定と Unity を用いて広告画面の作成を担当してくれた．投稿画面に行き詰まりを感じていた時にアドバイスをく
れた．

梅庭由紀子

• 原:A1 ポスターの作成，デモムービーの作成などコンテンツをしっかり紹介をするために励んでくれた．さらにコンテンツのアイデアの提案を積極的に行ってくれた．

• 大谷:梅庭は唯一のデザインコースでもあったため，A1 ポスターやキャラクターのデザインなどをほとんど一人でこなしてくれた．周りがあまり協力できない中で本当によくやっていたと思う．

• 大山:A1 ポスターの作成やコンテンツのデモムービーの作成，コンテンツのデザインの提案などデザインコースとしての仕事をしっかりやってくれた．

• 平井:A1 ポスターの作成やデモムービーの作成を行ってくれた．デザインコースで学んだことをコンテンツの話し合いで提案してくれた．

大谷一之• 原:コンテンツ内のデザインや複雑なオブジェクトの作成をしてくれた．またその作成されたオブジェクトが非常に完成度が高く，未来大学の特徴を良く捉えてくれていた．

• 梅庭:原と共に Unity で本学の内装を担当してくれた．また，私が動画の編集に手が回らない時，手伝ってくれた．A1 ポスターの確認を行ってくれた．成果発表会のスライドを作成してくれた．

• 大山:3D オブジェクトの作成はとても素晴らしかった．コンテンツ内のステージを本学をそっくりに作成したのは驚いた．Kinect 班の成果発表会に向けたプレゼンテーション資料の作成も積極的にしてくれた．

• 平井:未来大学の床の配置を調べ，それを Unity の画面上で再現してくれた．成果発表会のスライド作成を積極的に行ってくれた．

Group Report of 2015 SISP

- 76 -

Group Number 18

MOE MOE Digital Signage 〜Cognition，Design，and System〜

大山浩暉• 原:Kinect の知識をしっかり学び，より良いコンテンツになるためにプログラムを書いてくれた．Kinect のプログラムは難しい内容であったがしっかりと理解をしてくれ，コンテンツの完成度が高まった．

• 梅庭:全体的に Kinect の実装を行ってくれた．Kinect 班が考えていたキャラクターの動作を実装してくれた．A1 ポスターの Kinect 部分の内容を一緒に考えてくれた．

• 大谷:後期のプロジェクトを通して Kinect について実装作業を行っていたが，黙々と作業をこなしていた．その上構想から実装までのスピードも早く，おかげで実装に早く手を着けることができた．

• 平井:システムの中でも特に重要な Kinect と Unity の連携を行ってくれた．連携する作業中に見つけた関数を教えてくれて，作業が円滑に進む場面があった．Unity と Java を連携させるために共有フォルダの作成を行ってくれた．

平井彰悟• 原:2D キャラクターの作成や投稿システムの作成など様々な実装を行ってくれた．また他の部分のプログラムも積極的に手伝ってくれ，コンテンツの完成度が高まった．

• 梅庭:時間があまりない中，投稿システムの実装を行ってくれた．また話し合いの時，的確な意見をくれた．プロジェクトの全体発表も行ってくれた．

• 大谷:コンテンツの投稿画面などを作成していたが，作業内容の中では１番大変だったかもしれない．何度か問題が見つかっても諦めずに Java や C ＃のプログラミングでの実装を達成したのはよくやってくれていた．

• 大山:投稿機能のプログラムやプロジェクト全体発表をしてくれた．疑問があれば全体に共有してくれた．投稿機能に関してはほぼ 1 人で作成していたので，技術力が高いと感じた．

Group Report of 2015 SISP

- 77 -

Group Number 18

MOE MOE Digital Signage 〜Cognition，Design，and System〜

参考文献[1] 公立はこだて未来大学事務局：電子ピアノ利用にあたっての遵守事項．
[2] 工房ミュージアムワーキンググループ：工房・エレクトロニクス工房・グラフィック工房について．

[3] 迎山和司，川又康平，小林真幸，川嶋稔夫：プロジェクションマッピングによる公立大学の地
域貢献，情報処理学会論文誌，Vol. 55，No. 8，pp. 1787-1794（2014/08/15）．

[4] 高橋雅延：記憶におけるツァイガルニック効果の基礎的研究．
[5] 毎熊一樹，石毛優樹，内川実咲，内海理子，太田佳織：コレクション欲求を喚起する心理的要因の解明．

[6] 全国大学生活協同組合連合会 (2016)3 群点数法赤・緑・黄ってなに？. http://www.univcoop.
or.jp/service/food/three.html(2016/1/15 アクセス)．

Group Report of 2015 SISP

- 78 -

Group Number 18