itとデザインで未来をつくる -...
TRANSCRIPT
ITとデザインで未来をつくる ー創造的問題解決ー
公立はこだて未来大学 システム情報科学研究科 特任助教 木塚 あゆみ
2016. 1. 20
今回の授業内容
「ITをデザインして未来をつくる」 • 私の興味
– 生物、同期現象、コミュニケーション、認知 – これまでに作ったものの小紹介
• 思いついたものを実現する – ITでプロトタイピング（↑で作ったものの作り方） – 創造力をきたえる：SFワークショップ – できる人と協力する・技術について調べる方法
• 息抜き用） サービスデザイン：自分の学びのExperience Mapを作ってみる – 大学に入学前と入学後
• 専門：メディアデザイン メディアアート、情報教育
• メディアデザインとは… さまざまなメディアの特性を知り 組み合わせてデザインする
• キーワード： 身体性、体験型、学び、映像、質感…
• 体験型学習展示物の開発 など
き づか 木塚 あゆみ
おとなになってきてわかったこと：表現の幅
History • 福岡県の普通科高校 卒業 • 1年浪人
• 公立はこだて未来大学（2002 - 2008） 学部～大学院
• 岡山県立大学 デザイン学部 助手（2008 - 2011）
• 福岡にて 個人事業を立ち上げる（2011 - 2013） – 科学館の展示 – IT×デザイン のコンテンツ開発
• 札幌にて 個人事業を継続 – 大学の先輩と同じ仕事に関わる – 科学技術コミュニケーションについて学ぶ（北海道大学）
• 公立はこだて未来大学 システム情報科学部 特任助教
芸術（映像）をやりたい!➡!世界の仕組みを理解したい
舞踏、!コンテンポラリーダンス
き づか 木塚 あゆみ
高校生～大学生のとき 夢中になったもの
宇多田ヒカルーTraveling（dir:紀里谷和明,2001）
宇多田ヒカルーSAKURAドロップス（dir:紀里谷和明,2002）
宇多田ヒカルーFinal!Distance（dir:紀里谷和明,2001）
Sheryl!Crow!@!Good!Is!Good(p:Psyop,!2008)
Franz!Ferdinand!@!Take!Me!Out!(p:Psyop,!2004)
田中秀幸
HALCALIーストロベリーチップス（dir:ﾀﾅｶﾉﾘﾕｷ,2004）
HALCALIータンデム（dir:!田中秀幸,2003）
木村カエラーJasper（dir:!中村剛/Caviar,2008）
チャットモンチーーシャングリラ（dir:!福居英晃,2006）
平面劇（脚本・演出:木塚あゆみ,2006）
舞踏青龍會（原田信雄） 珍しいキノコ舞踊団
演劇・舞台講演（木塚あゆみ,2002@2007）
テクノロジー×表現（演出） どうやってるんだコレ！？ ➡ 仕組みを考える
メタ的な問題： 人間はなぜ!
そう認識するのか
メタ的な問題： 現象として!
どういうことなのか
同期現象・非線形科学
https://www.youtube.com/watch?v=9@jfla4FHSs
同期現象・非線形科学
ホタルの集団明滅：!・蔵本由紀,!非線形科学,!集英社新書 2007!・スティーヴン・ストロガッツ,!SYNC! ―なぜ自然はシンクロしたがるのか―,!! 早川書店,!2005
生物のコミュニケーション：!・セオドア・ゼノフォンバーバー,!! もの思う鳥たち,!日本教文社,!2008!・アントニオ・ダマシオ, 無意識の脳・自己意識の脳,!講談社 2003
ホタル通信 呼吸情報を使ったコミュニケーションツール（2006）
＋
呼吸に応じて光が明滅する
• 熱電対（温度センサ）!• LED!• 通信モジュール（赤外線LED）
Globalホタル通信 光の明滅を使ったコミュニケーションごみばこ（200７）
呼吸に応じて光が明滅する
• ゴミの量測定!（圧力センサ）!
• LED
おもいぬま -Omoi-numa- 身体リズムを利用したコミュニケーション舞台（2008）
• 人の動き（省電センサ）!• 人がいるかどうか（赤外線LED）!• 水流制御、水滴制御（水ポンプ）!• 水を光らせる（LED）!• 水滴を光らせる（高輝度LED）!
おもいぬま -Omoi-numa- 身体リズムを利用したコミュニケーション舞台（2008）
http://youtu.be/AUXCp88_IxE
torikage ‒トリカゲ ｰ 影を使ったインタラクション、影シリーズ（2007－2011）
• 人の影（Webカメラ）!• アニメーション投影!（プロジェクタ）!
コンペ と わたし
余談ですが… コンペにハマった • 美術展のグラフィックデザイン： 優秀賞2万円 • ホタル通信： 学会発表で優秀賞 • Globalホタル通信：エコジャパンカップ準グラ50万 • torikage： 学生CGコンテスト入賞（プリンタとHDD） • Kageto： まちなかアートギャラリー福岡20万 ---- • おもいぬま：達成感
ボツになっているものが!多いとも言える…
未来をつくる 昨今のテクノロジーについて
音声認識・ジェスチャー・プロジェクション Openarch!||!FILM!(2011) Openarch
https://vimeo.com/32439871
市販されているデバイス 昨今のテクノロジーについて２
入力 出力
基本的な（よく使う）入力系
センサ：物理・電磁・熱・音響・化学の変化を 科学的原理を利用し変化を検出（信号化）するもの
– 加速度センサ – ジャイロセンサ – タッチセンサ – 温度センサ – 光センサ（画像・カメラも） – 圧力センサ – 磁気センサ – 距離センサ – 振動センサ（マイクも） – においセンサ（硫黄など） – スライダー、つまみ、ジョイスティック（可変抵抗） – RFIDセンサ（SUICAのような） – GPS（全地球衛星測位システム）
入力
便利な入力デバイス 入力
スマートフォン・PCなど Kinect http://www.xbox.com/ja@JP/kinect
Webカメラ
生体情報取得デバイス Nike!Smart!Watch! iOS8!HealthBook!
NeuroSky!!Mindwave
Spire!
入力
基本的な（よく使う）出力系
アクチュエータ：エネルギーを物理運動に変換するもの – LED（単色、フルカラー、アレイ、マトリクス） – DCモーター – サーボモーター – 振動モーター – ACソレノイド – バイオメタル
出力
VR 出力!
http://hacosco.com/
https://www.oculus.com
ロボット 出力!
入力 出力
コンピュータ ・
マイコン
距離センサ・イヤホン
Universal!Earphones（松村耕平,2012）
マイク・振動
ONTENNA（本多達也,2014）
マイク・振動
ONTENNA（本多達也,2014）
舞台表現・LED
Lighting!Choreographer!（光の振り付け）!
・ウェアラブル（LED、マイコン電飾）!
・ダンス!
m!plus!plus!Co.,Ltd.（藤本実 氏ら）!
ももいろクローバーZ!!!@!!サラバ、愛しき悲しみたちよ（2012） https://www.youtube.com/watch?v=OWSbfCPkTBk
第65回紅白歌合戦 三代目 J!Soul!Brothers!from!EXILE!TRIBE「R.Y.U.S.E.I」（2014）
東京工科大プレスリリース!http://www.teu.ac.jp/press/2012.html?id=128
作るのは簡単じゃないが…
アイデア プロトタイプ
! 知識を蓄える
こんなのがほしいなー!これ売れそうだな!
とにかく!作る
創造力を鍛える
# 創造力を鍛えるコツ
1. アイデア ⇄ ものづくり をたくさんする （なんでもいい、他人にも見せる）
2. 他人の創作物を見る、模倣する
3. モノコトを観察、分析する（常識に囚われない）
4. 妄想する
5. 振り返る
頭の中にたくさんの自分を蓄える
これ嫌い
意味!わからない
それビジネス!になるの???
その後!どうするのさ!
将来的に! 受けそう
面白いね！
SF映画ワークショップ
映画を使った問題発見-解決力のトレーニング
創作物Aの世界観（設定）を理解
Aの世界観（設定）のなかで!使われるインタフェースを開発
日常世界（現実）で!実際に使ってみる 40!
・発表会!
・振り返り
プロトタイピング
テーマ
世界観を!妄想
ワークショップ概要 『ICT DESIGN TREK 2014 ～SF映画をみて、映画の世界のインタフェースを作ろう！ 妄想×開発ワークショップ～』
– 2014年11月9、15、16日 3日間 – 2014年11月17～21日 ミュージアム展示
41!41!
! 「ブレードランナー」監督からの指令：" １つシーンを付け足して欲しい。" 実際にシーンを想定して、その場面で使う" 小道具(大道具)のプロトタイプを作れ！! !
– デモできるモノ・コト（ICT機器を使う）!– 実演プレゼン(アクティングアウト)! Ridley!Scott
成果物
• Aチーム – カスタマイズ傘屋
42!商品おすすめレジ
情報提示する傘
しゃべる傘
成果物
43!レイチェル役
• Bチーム!– 情報提示ロボット"「テレット」!
• Cチーム!– レプリカントによる"遠隔教育コンテンツ"（カプセル型）!
iPad!はめ込み映像
頭の中にたくさんの自分を蓄える
Blade!Runner
「振り返る」
知らざるを知らずと為す 是知るなり
『論語』（孔子）
し し な これ し
Experience Map サービスデザインで使われる経験の可視化マップ
Starbucks!Coffee’s!User!Experience!Map（2010）
Experience Map サービスデザインで使われる経験の可視化マップ
店内で 来店後 来店前
良い経験
悪い経験
時間軸
Experience Map サービスデザインで使われる経験の可視化マップ
店内で 来店後 来店前
良い経験
悪い経験
時間軸
前後での変化を!比較できる
振り返りExperience Map これまでの大学での経験を振り返ってみよう
振り返りExperience Map これまでの大学での経験を振り返ってみよう（数字の順に）
～～を学んだ!!!～～について知った!!!新しく～～について!興味を持てた!!!～～がうまく!いかなかった
～～～にはじめて!挑戦してみた!!!～～を学んだ!!!～～について知った!!!新しく～～について!興味を持てた
～～は自分には!向いてないかもと!感じた!!～～�����!� �����!分からないところが!あることに気づけた!!!～～について知った!!!新しく～～について!興味を持てた
～～に詳しくなりたい!!!～～に頼りにされる!人物になりたい!!!活躍して憧れの～～!さんと仕事がしたい!!!プライベートも充実!させたい。特に～～!について!
～～について卒業までに挑戦したい!～～について重点的に学びたい!～～を専門にしている人に直接話を!聞く機会を得たい!
～～について学びたい!!!～～をたくさん見たい!!!同じ趣味の友人を!つくりたい!!!～～をつくりたい
～～ついては学べた!!!～～は身についた!!!～～についてまだ!自信がない!!!～～を学ぶ機会が!まだない!
まとめ
入力 出力
コンピュータ ・
マイコン
テクノロジー×表現
Blade!Runner
「振り返る」
ayumikizuka.com
Twitter,!Facebook:!!ayumikizuka