hack-ist

[hack-ist]

魚の魅力を映し出す不思議な水槽 Synchronized Aquarium（シンクロ アクアリウム）

図鑑に載っているような魚のあっと驚くような生態、ドキュメンタリー映像のように圧倒されるほどの魚の美しさ、目の前の水槽を泳ぐ魚達の魅力をもっと伝えるにはどうすればいいだろうか。

この課題をデジタル領域の広告制作プロダクションである私たちが持つ「伝える力」と「デジタルテクノロジー」で解決できないかと考え Synchronized Aquarium (シンクロ アクアリウム) という作品をつくりました。

Synchronized Aquarium (シンクロ アクアリウム) は「遊泳の美しさ」、「模様の面白さ」、「生態のヒミツ」といった魚の持つ魅力を映し出す不思議な水槽です。

この作品では、水槽の前面に貼った透明フィルムに、自由に泳ぐ魚の動きにシンクロした映像を重ねて投影しています。

リアルタイムに魚の軌跡、種類を認識し、魚の魅力をモチーフにさまざまな映像演出を行います。

従来の水槽の鑑賞体験をアップデートし、魚の魅力により気づき、学び、感動できる新しい水槽の鑑賞体験を目指しています。

魅力を伝える２つのモード

現在、このシステムには「ショータイム」、「吹き出し」という２つのモードがあります。

（１）魚に心を動かされる「ショータイム モード」

このモードでは「遊泳の美しさ」「模様の面白さ」をモチーフにした映像を音楽と魚の動きにあわせて、水槽に投影します。 泳ぐ魚に映像を重ねることで、映像が観賞魚の持つ本来の美しさを際立たせる補助線のような役割を担います。 また、映像を定期的にアップデートすることによって、シーズンにあわせた演出をすることが可能です。

（２）魚について学べる「吹き出し モード」

このモードでは、「お魚の名前、出身地」や「隠れた生態のヒミツ」などを魚自身が吹き出しで話してくれます。 説明パネルと水槽内の魚を照らし合わせて見る必要がなく、水槽を眺めているだけで図鑑で得られる知識を学ぶことができます。 魚の種類ごとに口調を変えたり、キャラクターを付けることで、より楽しく魚について学ぶことができます。

設置イメージ

現在のシステムは水槽の後ろからカメラで魚の位置をトラッキングし、水槽の前面に貼った透明フィルムに映像を投影しています。

HACKist 4th Exhibition、SXSW2018への出展、博報堂アイ・スタジオのエントランスでの展示風景はこちらです。

※ 弊社のエントランスでは６月末までこちらの水槽を展示しております。

Future Work

こちらの作品に興味があるクライアント or パートナーさまを募集しております。

(1) パッケージのカスタム販売

現在わたしたちがもっている水槽ソリューションに興味があるクライアントさまを募集しております。

(2) 未来の水槽のありかたを一緒に探れるパートナーさま募集

大型の水槽で実施できるよう研究開発を進めたいと思っています。 未来の水槽のありかたを一緒に探れる、大型水槽をお持ちのパートナーさまを募集しております。

問い合わせ先

ご興味がある方はお問い合わせ用フォームより、お気軽にお問い合わせください。

via: http://hackist.jp/?p=8439

[hack-ist]

Co-De / オランダとの共創プロジェクトはじめました

2018年の4月から7月中旬までの約3ヶ月ほどの期間で、日本とオランダをつなぐ実験的クリエイティブプロジェクトを始めました。

プロジェクトタイトルは「Co-De」。 去年よりワークさせているConnective Designの言葉頭をつまみつつ、CoもDeもそこから繋がる英単語にクリエイティブ周辺を連想させる言葉が様々に当てはまることもあり（Co-creation、Communication、Development、Deliver…）シンプルにそのプロジェクト名としています。

さてこのプロジェクトはどんなものなのか？ その内容をザーッと説明していきます。

どんなプロジェクトか？

体験とテクノロジーのデザインを強みとする我々と、デザイン＆リサーチ研究機関であるCreatives AcrossとMediaLab Amsterdam、そして両者のハブとなるNeuromagic Amsterdamの混成チームからなる、日本とアムステルダムを「テーマ」でつなぐ共創プロジェクトです。

東京チームでは4人、アムステルダムチームではおよそ6〜7人ほどのチームメンバーを立て、一つのテーマに対して双方の視点から課題に取り組みます。

両方の国に共通する課題に向き合い、社会実装を目指す

今回は、お互いの国に共通する社会課題に取り組む、という視点を立てました。 そこで、SDGs（持続可能な開発のための2030アジェンダ）からテーマを見つけることから、このプロジェクトはスタートしています。 SDGsとは、2015年の国連サミットで採択され、2030年までに国連加盟国が達成するべき目標として定められているものです。

両国に共通するテーマをSDGsのアジェンダに沿うように選び、MediaLab式の「Design Sprint」と呼ばれるワークフレームを通じ最終的に社会実装されるアウトプットを作ることを目的としています。

前述のように、本プロジェクトのDesign Sprintに関しては、MediaLab Amsterdamが独自で体系化したものをベースに使用。MediaLab Amsterdamが常日頃おこなっているカリキュラムを日本にも共有してもらい、その中でプロジェクトをワークさせています。

また、社会実装されることを目的としたアウトプットと言っても、その出口は色々とあります。 自分たちでサービスを始めるのか、どこかの企業に買ってもらうのか、はたまたもっと一般の人を巻き込み皆で作り上げる新しいプラットフォームにするのか・・・など、現時点ではどのような出口にたどり着くのか不明ではありますが、いずれにせよ「タンジブルなものを作り上げ何かしらの新しい領域に踏み込む」という点において、メンバー全員がその出口を目指し歩んでいくものとなります。

流れはこのような形で、1回のSprintに約三週間。 それを計4回ほど回し、最終的なアウトプットを両方のチームの連携で目指します。

通常の日本のやり方であれば、 アイデア出し → プロトタイプ → 検証 → 提案 を一本の道のりで行うことが多いですが、MediaLab式の場合は短い時間を区切り、その中で「未完成でもとにかく先に進める」というフローを繰り返すことで、より強度のあるアウトプットを目指していきます。

テーマによってチームがユニークに変化し、限られた時間の中で最大のアウトプットを出すことを求められるオランダにおいて、MediaLab式のDesign Sprintは非常に合理化されたフレームであることが、本プロジェクトを通じ実感値として得られています。

ひとまず、アムステルダムでSprint1を回してきた

遠く離れた場所でチームを組む場合、基本はオンラインでのコミュニケーションがメインとなります。 通常は以下のように、何かしらのビデオチャットツールを使い、双方のコミュニケーションを図ります。

ただ、どれだけオンラインツールが発達したといっても、初めてのプロジェクトを始めるのに一度も対面で会ったことがないのは、プロジェクトを進める上で色々と不安になります。 それはどの国の人でも一緒。相手がどんな性格か、どんなことを思っているか、何が得意で何が不得意か・・・を把握するためには、直接会って会話するのが一番です。

というわけで、まず最初のSprint1に関しては東京メンバー全員でアムステルダムへ行き、現地のDesign Sprintのフレームがどんなものか？のレクチャーを受けながら、実践していきました。

ユニークだったのは、PechaKuchaと呼ばれるやり方で全員の自己紹介をするというもの。これは1ページあたり20秒、トータル10〜20ページのスライドで自分のことをプレゼンするといった、ミニTEDのような自己紹介の方法です。 だいたい一人あたりトータルで200〜400秒の中で自己紹介を行い、それがバトンリレーのような形で回るので、スピード感と程よい緊張感で自分たちの紹介を行うことができます。

この辺りですでに、合理的な進め方で質をあげることを目指す、彼らのやり方の片鱗が見え隠れしています。

さらにDesign Sprintを回すのに欠かせないのが、このDesign Method Toolkit。 世界中にあるデザインやアイデア、リサーチの方法を収集し一つのカードにまとめているものです。

Toolkitのカードの中からファシリテータがその都度、現状のSprintに合うメソッドを選び、ストーリーを組み立ててていきます。 Toolkitの中には日本でのなじみ深いKJ法などもあり、広い視野で集められているのがわかります。

このToolkitはWebでも全ての情報がパブリックに公開されているので、興味ある人は全て読み込んでみるのも、ワークとして面白いかもしれません。（そして朗報があり、現在九州の大学でこのToolkitの日本語翻訳版がそろそろローンチ予定、とのこと。これは期待できそうです）

そんな形で、まずはテーマに対してのリサーチや現状把握をするべく、現地でのディスカッションとフィールドワークを通じSprint1に取り組んできました。 そこで得た様々な情報や刺激を持ち帰り、日本のやり方に沿うような形でアレンジしながら、現在進行形で取り組んでいます。

日本とアムステルダムの混成チームがどんな結果をもたらすか、楽しみでなりません。 現状どんなテーマに向き合っているか？どんな進捗か？の深い情報まではお伝えできませんが、新しいアウトプットに着地できることを信じ、残りの日程を進めています。

また新しい動きがあれば、アップデートした情報をお伝えできればと思います。 お楽しみに！

via: http://hackist.jp/?p=8571

[hack-ist]

The Falling Moon [HACKist 4th Exhibition]

はじめに

2017年10月26日から29日の4日間。HACkistの4度目の展示である【HACKist 4th Exhibition – Connective Design：テーマとテクノロジーをつなぐデザインの実験】が行なわれました。

今回のエントリーはその中の作品の一つである【The Falling Moon：VRアドベンチャー】と銘打ったVR体験コンテンツについて触れたいと思います。月の落下により崩壊する世界のラスト3分間を体験するVRアドベンチャーです。VRでのリッチな視覚＆身体体験ではなく、情報量を絞りREAL空間とVR空間を繋ぐことで「VRのナラティブ性」について深くアプローチすることを目的としています。

VRを考える上で見えてきた課題

VRコンテンツを作る上で幾つかの実例をやってみた結果、構築された世界への没入感は相当高いレベルである反面、身体情報の視覚、聴覚、触覚のみでそれを体験しなければならず、現実と比較して「何かが足りない」という印象を持ちました。 さらにヘッドマウントディスプレイを装着することで、いかにもこれからVRを始めますよ！という線引きがありその感覚にも改善点があるような印象を受けました。

この「何かが足りない」という漠然とした課題。

プロジェクトの大半の時間を割き、メンバーでディスカッションを続けた結果、VRでのリッチな視覚＆身体体験ではなく、情報量を絞りREAL空間とVR空間を繋ぎ「VRのナラティブ性」についてアプローチすることで課題に対しての一つの解が提案できると考えました。

アイディアと制作期間

VRの体験時間を3分と設定。短すぎても伝わらないし、長すぎてもVR酔いの懸念がある中で導き出した時間。 限られた時間の中で行う体験をどう現実世界の体験とシンクロさせるかでした。

こればかりは考えても限りがある部分でしたので、実際のものを作っては複数人でのデバッグ+意見交換というセットを何度も行い、ストーリーの軸を決めるor修正の繰り返し。何度もゼロベースから作り直しを行う為に制作スピードが求められます。 課題抽出のディスカッションの間の数日を使いいくつものサンプルが作られ、そして消えていくというまさにコンテンツタイトル通りの制作スタイルを貫いた感があります。

プランが固まり最終的に使うプログラム部分や会場のセッティング、オペレーションなどを確認しつつ仕上げを行い、展示前日のギリギリまで調整を続けていました。

展示期間中の運用

ヘッドマウントディスプレイの装着やコンテンツの説明、安全面の確保などでどうしても運用には人の手が必要となってきます。それをネガティブにはとらえず展示期間中に気づいたことを運用スタッフ間で共有し、オペレーション手順の改善やプログラムの更新などを随時行えたのは大きな成果だと思っています。（初日と最終日ではVR世界も少し変わっていたことでしょう）

オペレーションについては事前に想定していた管理用のインターフェースがあり、その状態を見ることでスタッフ間の引き継ぎも数分で行えるなどの事前準備が効いていました。これについては次の機会で触れようと思います。

展示を終えて

今回は「VRのナラティブ性」に対してのアプローチでした。振り返って反省点や追加で作りたい部分などはあるのですが、それを差し引いてもやはりVRは非常に強力な体験装置です。 ただどうしても一人でやることが前提になってきます。今回のように1:1の体験。それはそれで重要なのですが、1:N。多数の人が同時に体験できるものについて考えても面白いと思います。

今回の展示会を経て、ユーザー体験の重要性を非常に強く意識でき、その取り組みに関われて非常に良い刺激を受けることができました。 この経験を生かしてまた面白いものを作っていけたらと思っています。

ご来場いただいた皆様、そして関係者の皆様！ありがとうございました！！！

Credit

クリエイティブディレクター／アートディレクター／デザイン 望月 重太朗

デザイナ／テクニカルディレクター／VR構築 小井 仁

演出／シナリオ 下田 彦太（CluB_A）

ミュージック／サウンドデザイン 太田 昌孝（MUSE CREA inc）

ボイス 李そじん（青年団、東京デスロック）

レコーディング 村井 宏志（r STUDIO）

デザインアシスタント 諏訪真

運用／アシスタント 阿部 世理

via: http://ift.tt/2nKxEPi

[hack-ist]

HACKistでのハードウェアプロトタイプの制作過程

こんにちは！ HACKistでハードウェア系の制作をすることが多い進藤です。

HACKistではこれまでに色々とハードウェア系のプロトタイプや作品を発表してきましたが、それらのプロトタイプや作品がどうやって作られているのかをあまり表に出してこなかったので、今回はハードウェアの制作環境や制作過程をご紹介したいと思います。

ハードウェアの制作環境

弊社には「ラボルーム」と呼ばれる研究開発などに使用されている部屋があるのですが、その一角にハードウェア制作のためのスペースがあります。

ここでは主に電子回路の制作や実装、簡単な外装の制作などをおこなっています。 基板の制作は専門業者に発注することもありますが、最近では切削加工機を使って社内で制作することが増えてきました。

よく使う部品や材料などは社内にストックしています。

基板の制作から実装までを社内で完結できるようになっているので、短時間でのハードウェアプロトタイプの制作が可能となっています。

ハードウェアプロトタイプ制作の流れ

ひとえにハードウェアのプロトタイプ開発といっても、ハードウェア系の制作をしたことがない方にはイメージがつかないかもしれません。そこでHACKistでおこなっているハードウェア制作の流れをご紹介したいと思います。

前提として、何を作るか、どんな仕様にするかは既に決まっていることとします。

1. 基板の設計

まずはじめに基板の設計をおこないます。

基板の設計にはメンバーによって使用するソフトウェアは違いますが、僕の場合は基板の設計にはKiCadというソフトウェアを使用します。

まずKiCad上で回路図をおこしながら全体の設計をおこないます。この時点で使用する部品も決定していきますが、初めて使用する部品がある場合には、使い方を確認するために検証基板を専用に作成することもあります。 部品の購入は秋葉原の電子部品販売店で購入することが多いですが、そこで販売されていないものは海外の電子部品通販サイトなどから購入することも多いです。

回路図決まったら、基板の設計をおこないます。CAD画面上に部品を配置して、その間を配線などでつないだりしながら基板を設計していきます。この時の配線の仕方などに結構人それぞれのこだわりなどが現れたりするのですが、基本的にはキレイな配線を目指すとミスがあった時の修正作業などもスムーズにおこないやすいです。

すべての部品を配置してすべての配線をひき終えて、配線にミスがないかよくチェックをしたら基板の設計データの完成です！

2. 基板の制作

基板の設計データが完成したら、それを実際に出力します。

基板は切削加工機で基板用の銅箔板を削ることで制作します。

設計データを FlatCAM というソフトに読み込ませ、切削加工機を動かすための加工データを作成します。FlatCAMの使い方の詳細は割愛しますが、持っているエンドミル（切削加工で使用するドリル刃）の種類に応じてパラメータを入力し、最適な加工データを出力します。参考までに、うちでは 直径が0.5mmと0.2mmのエンドミルをよく使用していて、単純な回路は0.5mmだけ、細かくて複雑な回路だと0.5mmに0.2mmも組み合わせる場合が多いです。

加工データができたら、実際に基板の加工です！

加工中はエンドミルの交換などの作業以外は見ているだけなので休憩タイムです。

※上の画像と動画の切削中の基板は設計データとは別のものです

加工が終わると、写真のような基板ができあがります。

3. 部品の実装

基板の加工が終わったら、基板上に部品を載せてはんだ付けしていきます。

基本的には手作業ではんだ付けをしていくのですが、使用する部品によってはそれが難しい場合もあります。

下の写真の基板は、とあるICの検証用に制作した基板ですが、そこに使用するICは大きさが２ミリ程度、電極端子は0.2ミリ程度���大きさしかありませんでした。このサイズだと手作業でのはんだ付けは難しいです。

そこで、このような時は簡易リフローという手法を使ってあらかじめ基板上にペースト状のはんだをつけて、そこにICを載せてホットプレートで基板全体を熱することではんだ付けをします。※料理風景ではありません

こうしてすべての部品の実装が終わったら基板の完成です。

4. ファームウェアの制作

基板が完成してもファームウェア（基板に組み込むソフトウェア）を書かないと基板は動作しません。

ハードウェア特有の制約のようなものはありますが、ファームウェアの作成手順自体は普通のプログラム作成とそう変わりません。使用するマイコンメーカーが提供する開発環境を使用して動作させたいプログラムを組んでいきます。

ファームウェアを作成したら、メーカーが提供するデバッガと呼ばれる書き込み機を使用してファームウェアを基板上のマイコンに書き込みます。

5. （必要に応じて）外装の制作

ここまで来たらほぼ完成したようなものですが、制作するハードウェアによっては外装も制作しなければいけない場合があります。

切削加工機を使用して樹脂を削って制作したり、3Dプリンターを使って作ることもありますし、自分で制作する時間がなかったりクオリティを求める時は外部の3Dプリントサービスを利用することもあります。

※画像はスタイロフォームを使って外装の試作をおこなっているところです

下の画像はDIGLOGのものですが、基板に外装がつくと見た目の印象が大きく変わるので、制作のモチベーションもぐっと上がります！

6. 動作確認をして完成

基板とファームウェア（と場合によっては外装）がそろって、最後にきちんと意図した動作をしているかどうか検証をして問題なければようやくハードウェアプロトタイプの完成です！

制作物によっては基板の設計から製造までを丸々外注に出してしまうこともあったりするので、必ずしも今回説明した通りではないのですが、ハードウェアの制作という意味ではおおむねこのような工程で制作がおこなわれ���す。

ちなみに、上の写真の左側にある基板は現在プロトタイプを重ねながら現在開発中のものなので、詳細はいずれ改めてご紹介できればと思います！

さいごに

今回は簡単にですが、HACKistのハードウェアプロトタイプの制作現場をご紹介しました。 ハードウェアはソフトウェアに比べると形になるまでの道のりが長くて大変だったりするのですが、動いた時完成した時の感動はソフトウェア以上のものがあるように思います。

これまでのHACKistブログはソフトウェア系の記事が多かったですが、HACKistではフィジカルを活かしたハードウェア系作品の制作にも取り組んでいますので、今後はそういったハードウェア系の記事もどんどん上げていきたいと思います。

via: http://ift.tt/2tETjYs

[hack-ist]

動画や写真からボーンが検出できる OpenPose を試してみた

どうも貴田です。今回は CMU-Perceptual-Computing-Lab の OpenPose というディープラーニングのライブラリを試してみた記事です。

OpenPose って何ができる？

写真・絵画・マンガや、動画から人物のボーンの2次元座標を抽出できます。

以下、いくつか openposeのデフォルト設定でボーン検出してみた例を貼ります。

人物写真。

※ 出典元 : PAKUTASO

古い写真や、風景写真。

西洋絵画。

「民衆を導く自由の女神」 ウジェーヌ・ドラクロワ

「アダムの創造」 ミケランジェロ

「アルプス越えのナポレオン」 ダヴィッド

例えば、イラスト。

※出典元 : いらすとや

浮世絵などの日本絵画。

「三世大谷鬼次の奴江戸兵衛」 東洲斎写楽

「鷹見泉石像」 渡辺崋山筆

漫画。

出典：ブラックジャックによろしく

OpenPose は実写の人間だけではなくて、写実的なイラストや、絵画にも効果を発揮することがわかっていただけたと思います。

OpenPose の論文によると、教師データは MPII Human Pose Dataset と、COCO 2016 keypoints challenge dataset であると書いてあります。このデータセット内に絵画がないように見受けられるので、実写の人物写真に対し最も効果的です。もし絵画に対してボーントラッキングしたいなら別途、漫画のデータセットを作るのが正攻法だと理解しつつ、OpenPose は抽象化された人間に近いかたちに対しても応用が可能な汎化能力の高さがあり、すごいなー、と感じました。

  また、OpenPose は画像だけじゃなく、動画に対しても利用可能です。

リアルタイムではない過去の動画だったら、全フレームに対して、認識をすることができます。以下はインド映画の全フレームに対して OpenPose をかけてみた動画です。

※ こちらの動画を解析させていただきました。

リアルタイムな動画の場合でも、このくらいの精度・速さで認識ができます。

僕がいつも使ってるディープラーニングマシン (NVIDIA Tesla K40C) だとリアルタイムのウェブカム映像（1080p）をそのまま認識させると、 3[fps] 程度でしたが、 github の demo_overview ページにあるように、--net_resolutionオプションをつけて、解析対象の画像の解像度を下げて実行すると、認識精度が下がりますが、FPSは早くなります。被写体が映像の中で大きく写っていれば、だいたい 7-10[fps] くらいで認識できます。

OpenPose はすでにあるポーズ推定技術と何が違うの？

一番商用でなじみのあるポーズ推定技術である Kinect V2 と比べたときの、OpenPose のメリット・デメリットについてです。

○ メリット:

人物が写っていれば、古い動画でも対応可能。また、人物が描かれた写実的なイラスト、絵画にも対応可能な場合がある。

ふつうの単眼のビデオカメラや、ウェブカメラで撮影した映像でポーズ推定可能。（つまり、わざわざ Kinect で撮影したデータを使わずに、スマホでとったデータでも解析可能ということ）

センシング距離に制約がない（KinectV2 は 8[m] までとのこと）

屋外の太陽光の有無に関係なく使える（KinectV2 は赤外線に影響を受けやすい）

× デメリット:

リアルタイムだとマシンスペックにもよるが、だいたい 3-10[fps] 程度と fps が遅め

2 次元座標しかとれない。3 次元座標がとれない。

OpenPose の実行には性能のいい GPU を積んだマシンが必要。

ポーズ推定原理として、KinectV2は赤外線を使って TOF 方式という、光を照射して、戻ってくるまでの時間をもとに、3D デプスデータを取得し、そこからボーン推定をしていますが。OpenPose は 2 次元画像をもとに、「右手首」「左足首」などの体のパーツをディープラーニングで物体認識し、そこから体全体のボーン構成を推定するような手法をとっていることから、このような違いが生まれています。（※参考： Multi-Person Pose Estimation using Part Affinity Fields というプレゼン資料）

  OpenPose はどんな表現に使え��う？

ひとまずスノーボード動画に対して、プレイしている人が常に映像の中心に固定されるような映像を作ったら、プレイヤー中心視点の映像となり、新しい見え、にならないかぁー？という実験を Unity でしてみました。

※ こちらの動画を解析させていただきました。

最近、こんなかんじの実験をいろいろ試しており、OpenPose らしい表現が見つかり次第、この blog にまたあげようと思います！

OpenPose のライセンスについて

ここに書いてある通り、非商用利用の場合はフリーで使えるが、商用で利用する場合は、連絡をください、と書かれています。

OpenPose の今後について

五指のトラッキングが1,2ヶ月後、顔のランドマークのトラッキングが 2,3 ヶ月後に comming soon と書かれており、OpenPose の今後のアップデートに注目していこうと思っています！

via: http://ift.tt/2sUYmm0

[hack-ist]

【SXSW2017】成功の裏にいつもあるのは地味で大切な作業。

SXSW2017が終わり、テキサスから帰国して、早くも1ヶ月が経ってしまいました、、、SXSW2017派遣メンバーの横山です。

今年で4回目のトレードショー出展を果たし、無事に4日間戦い抜いた「HACKist」なわけですが、本記事では、「【SXSW2017】HACKist、四度目のオースティンの大地を踏む」でご紹介した5つのプロダクトの現地での準備風景と、日本〜現地で設営を終えるまでの裏方の苦労話から一つ、お話しようと思います。

まずは現地の準備前の風景。

去年に引き続き3ブース（約9メートル）借りたので、相変わらずの広さ！ 出展企業の中でも3ブース横につなげて展示しているところは、単独の出展ではめずらしいのではないでしょうか。

到着すると、日本を出る前にオーダーしたモニターなどの備品が各ブースに届けられています。 今回も日本から発送した（苦労して税関を通過させた）荷物を宿からトラックの荷台に乗せて運び、みんなで開梱、組み立てていきます。

こちらは今回の目玉、Invisible Force（IF）の筐体組み立て風景です。 現地でのテストも無事に終えることができました。 やはり現場入りから気づくこともあり、このあとIFで使うブロックをスプレーで白く塗るなど、現場での対応が必ず必要なのもこういう所ならではですよね！

トレードショーが始まってからも、やはりIFは派手で音もでかいため、周囲の注目を集めていました。体験したいという方が続出していました。

テスト風景動画はこちら

IFに続いてTREKTRACK、Talking POP、 JACH、RePHubもどんどん展示していきます。

前回よりも長くなったターポリンも全員協力して設置します。

Invisible Forceで使用予定だったノートPCがパワー不足で使えないなどのトラブルもありましたが、今回もなんとか無事に、2日間の設営と動作確認を終えることができました！

、、、そして、ここからが裏方の話。

トレードショーに出展するには、あたりまえですが、現地で展示する実物をはじめ、ターポリンや什器、説明パネルなどの付属品も用意しなければなりません。そして現地の運営ともやり取りしないといけないことが多くあります。 また作ったものは現地に輸送しなければならないので、そこを円滑に進めることができるか、というのもトレードショーを成功させるにあたって非常に大事なキーとなります。

そして、実はここがなかなかめんどくさい。

今回はそのめんどくさく、もっとも裏方っぽい「出展関連物の発送」についてお話をしようと思います。

輸送方法はなにがいいのか

今回、最初に、そして初めてトライしようとした方法は展示会場の機材・設営周りをすべて取り仕切っているFREEMAN という会社に事前に荷物を送り、トレードショー準備が始まる日に、ブースまで届けてもらうという方法でした。

結果、今回も、いつもお世話になっているFedExで宿泊先に輸送→メンバーで現地まで運搬という方法を取ることとなってしまったのですが（理由は後ほど）、次回SXSWに荷物を送るときはこの方法がいい思いました。 アメリカまでの輸送費(FedEx)+現地の輸送費(FREEMAN)で、ちょっと値は張るかもですが、現地でのオペレーションがだいぶ効率的になります。

ただしこの方法も、送る時期によって一時保管の倉庫かトレードショー会場かで送り先が違ったり、ちょっと注意は必要です！

ルールの確認は入念に！

先ほど、結局今回も宿泊先までの輸送なったと書きましたが、何故そうなったのでしょうか？今回の理由は梱包にあったのです。

今回梱包した荷物はこのような感じです。

前回(SXSW2016)送ったときはダンボールとガムテのみの包装でしたが、今回は綺麗にまとめてラップでぐるぐる巻き。 梱包作業はメンバーみんなで行ったのですが、流石に手際も良くなっており、梱包にはさほど時間はかかりませんでした。

梱包も終わり、集荷表も書き、集荷も依頼済み、「あとは待つだけ」と思ったその時、、、

最終確認のため見返していたSXSWの出展者用ポータルサイトで見つけてしまいました。

「Freeman will accept crated, boxed or skidded materials」

ちゃんとダンボールに入ってるか、木箱に入ってるか、スキッド？に乗ったものしか受け付けませんとのこと。

気づいたのは集荷時間の３０分前、、、。 危なかったです。気づくのがあと一歩遅かったら、危うくアメリカに荷物がついてから送り返され（るか行方不明になっ）て、展示が全て台無しになるところでした、、、。

輸送周りの手配を一緒に行っていた公文さんに、即効電話で相談、プチ会議の結果、今回も宿泊先へ荷物を輸送することに。 そして例年通りそこから自分たちの手で会場まで運ぶことになりました。

みなさんも、得意先からもらった仕様書を納品前によくよく見直したら仕様が違って、作り直し、、、なんて経験はないでしょうか？

自分は普段エンジニアとして働いているのですが、今回の一件はそれに近いものがあるなと感じました。 やはり、しっかりと事前にドキュメントを理解するってことが、何事においてもものごとの出発点だなと再認識しました。

最大の難関、税関申告書

さて、FedExに集荷依頼して、梱包したら、終了か？と思うのですが、そういうわけにもいかないのです。

そう、集荷時に「税関申告書」も書いて提出しなければならない。 この申告書、海外に荷物を送ったことのある方ならわかると思いますが、非常に細かく書かなければならない。

そしてただでさえ厄介な輸送で、この税関を通す作業が一番手間がかかります。 HACKistは2016年も2017年もこのフェーズでヒヤヒヤしました。最悪、荷物が届かないですから。

今回、一番大きな例を上げるならば、IFの筐体をwoodshelfとしたのですが、これまた税関で引っかかってしまったんですね〜。

2016年はTシャツ、つまり綿で引っかかってますから、やはり植物の持ち込みは厳しいことが伺えます。

今回は3回ぐらい、税関を通してくれるFedExの人と電話やメールのやり取りをしてどうにか通ったのですが、木の学術名称まで聞かれたり、最初大雑把に書いてしまうと、あとでより細かく聞かれることを学びました。

HACKistがSXSWに出展を始めた頃からずっと、この税関周りの対応をメインで行ってくれている公文さんが、FedExからメールが来る度に「またか、、、。もうやだ〜。」とうんざりしていたのが印象に残っています、、、。笑

余裕を持った対応を。

HACKistの実体験を踏まえてご紹介したSXSW出展の裏方、いかがでしたでしょうか。

これからもSXSWに限らず色々な場へ可能性を探しに行くHACKistとしてはこの辺の地味な知見でも次に生かし、より制作に集中、余裕を持った対応、そして安心して現地入りできるようにしたいと思います！

via: http://ift.tt/2o88giv

[hack-ist]

【SXSW2017】 広告プラナーが未来から持ち帰った5つの「問い」

こんにちは。新メンバーのtakuroです。 SXSWのレポートをプラナー視点でお届けします。

まず前提として

カンヌには「解」がある。 SXSWには「問い」がある。

と言われるほど、SXSWには未知のテクノロジーや未解決の課題がゴロゴロしています。 両者の違いは、こう言い表すこともできるでしょう。

カンヌ：過去1年間の作品を振り返って表彰し次世代のクリエイティビティを予見する「フォアキャスト」志向 SXSW：どんな未来を創りたくて、そのために何を今やるのかを、スタートアップや研究者が集まって実行する「バックキャスト」志向

いずれも間違いなく未来をクリエイトするための動きであり、両方の視点を持っていることで本当のイノベーションが起こせるのではないかと思います。

私は昨年度のSXSWに視察目的で初参加して、それまで8年間の広告業界ライフで良しとされていた価値観（カンヌ至上主義）を叩き壊されるような感覚を覚えました。 SXSWでは、成功事例が綺麗にパッケージ化されたケースフィルムなどほぼ見かけず、荒々しい形相のプロトタイプや出口の見えない議論が無造作に転がっています。まるで初めてのアジア旅行で見知らぬバックパッカー街にたどり着いたときのような、不安と好奇心が入り混じった高揚感を思い出しました。

今年は、出展やスピーチなどのよりディープなSXSW体験から、5つの「問い」を持ち帰ることができました。

1. リアリティを増したバーチャル体験は現実にどんな影響を与えるのか？ 2. 音声と画像のデータ処理が容易になることで、どのようなUIが普及するのか？ 3. 広告領域のアイデアは、ビジネス領域でも通用するのか？ 4. 企業はどのようにイノベーション機能を持つべきか？ 5. 100年後の未来に「旅行」という概念は残るのか？

今回はVR関連の事例レポートも兼ねて1つ目の問い

「1. リアリティを増したバーチャル体験は現実にどんな影響を与えるのか？」

について書きたいと思います。

  まずはVRに関する4つの事例をご紹介します。

事例１：台湾発の8k画質360度カメラ（正式名称不明） 8K画質がVRにも持ち込まれ、3D映像の解像度は高まり続けています。すでに現時点で、人と人が会話するくらいの距離ではほぼ現実と変わらない解像度を体感できるようコンテンツが存在しています。

事例２：The Music Room VRならではの楽器演奏空間。バーチャル空間が主語となって現実空間に対して干渉する、これまでと逆のアプローチが試みられている。

事例３：OSSIC 音を全方位的に感知できるヘッドホン。このような周辺技術の進歩によって視覚以外の体験が向上している。

事例4：Sensiks 匂いや熱風など五感でVRを体験できるボックス型装置。周辺技術だけでなく「演出」方法も進化している。ここは広告業界にとっても得意分野なのでは？

これらの事例を見ていると、「バーチャル体験のリアリティは今後も高まり続ける。現実との関わりにどんな変化が起きるだろう？」という疑問が自然と湧いてきますよね。

かつてインターネットは、現実とは別世界のように認識されていましたが、近年ではリアルな生活の一部となりました。その延長線上で考えれば、バーチャル空間は現実と等しい、あるいはそれ以上の価値を持つ空間になりえます。

そのとき、例えば墓をバーチャル上で創作する人が現れるかもしれません。その墓に生前の人物のデータに基づいたAIが備われば、埋葬という文化や宗教にも変化が生まれそうです。

旅行はどう変わるでしょう？肉体的な移動を伴わずに様々な土地の風景や文化に触れることができるのであれば、「実際の移動」という体験こそが高級な旅行スタイルに進化するかもしれません。

リモートワークの普及が現在も進んでいますが、ほぼ全ての仕事がバーチャル空間でより効率的に進む可能性もあります。その時、アパレル業界はバーチャル空間上の衣類に注力することになるでしょう。

このようにSXSWで自分なりの「問い」を見つけ、それに対する仮説を考えることは、各種業界の未来を先回りして考えることにもつながります。その仮説からプロトタイプを生み出していくことで、業界課題の解決につながるサービスや製品が生まれることもあるでしょう。プラナーにとってのSXSWは、新しい広告手法のネタ集である以上に、広告会社の未来のビジネスモデルのヒントの宝庫だと思います。

広告会社が拡張しつづける、クライアント課題に対するソリューションをイメージにすると↑のように描ける。サウスバイに集まる技術やサービスもこの中へ。戦略と戦術が混同するカオスな状況が続く中で、技術に対する正しい理解がプラナーにも求められる時代へ。

この図のように課題自体を能動的に発見することで、ビジネスクリエイションやコンサルティングが広告会社の新しい提供サービスになりえる。点の技術ではなく、面で何が起きているか捉えるためには、広告と技術に限らない「自分らしい視点」がより重要になるかもしれない。（この辺は、広告アイデアをビジネスに活かせるか、という「問い」とも関連しそう。）

前述した他の4つの問いについても引き続き思考をめぐらせ、研究開発に生かしていきたいと思います。

takuro

via: http://ift.tt/2ouxTMP

[hack-ist]

【SXSW2017】HACKist、四度目のオースティンの大地を踏む

ITの未来を占うといわれる世界最大規模のビジネスとコンテンツの祭典「SXSW2017」がいよいよ開催！ 四度目の挑戦となるSXSW Trade Show（3/12-15）の展示に向け、メンバーが今年も現地入りしました！

今年は「Prototype to Business」を旗印に、五つのプロダクトとサービスを展示します。

今回の目玉は、ブース面積の半分以上を使って展示する、Mixed Realityの新しい形「INVISIBLE FORCE」。 HoloLensや各種センサー、デバイスを組み合わせ、仮想空間と現実空間を連動させた驚きのインタラクションとなっています！

さらに、パワーアップした「TREK TRACK」や「TalkingPOP a.k.a Talkable Vegetables」の展示を始め、 新しいサービスプロジェクトである「Project JACH」、「RePHub」も公開します。

TREK TRACK http://trektrack.jp/ TalkingPOP http://ift.tt/2mNlFyK Project JACH http://hackist.jp/jach/ RePHub http://ift.tt/2m5Rxuf

進化し続けるHACKist、そして展示作品をぜひSXSW現地にて、チェックしてみてください！

このブログを始め以下のFacebookページでも随時情報を発信していくので、こちらも合わせてお楽しみに！

TAPES http://ift.tt/1QUYDwG

via: http://ift.tt/2n5nTtX

[hack-ist]

HACKistあんだーCOMITA119に参加します！

こんにちは！HACKist_(あんだー）です。

ツイッターでも既に告知済みですが、 今週末に東京ビックサイトで開催される同人即売会COMITA119にあんだーで参加いたします！

日程 ＊ 2月12日（日）11:00~16:00 場所 ＊ 東京ビックサイト・え15a

今回は、2年前のCOMITIAに出した「シュレディンガー」のアップデート版として「シュレディンガーⅡ」を販売いたします！

■ メッセージカード「Schrödinger（シュレーディンガー）」とは ■ タロットカードをモチーフにした4種類のカード。恋人や、好きな人に向けてのメッセージがそれぞれ2パターン用意されており、受け取った側がQRコードを読み込むとランダムで「告白」か「食事の誘い」どちらかが表示されるという運試し要素のあるメッセージカード。告白したいけど迷っている‥勇気がない‥そんなあなたの背中をデジタルの女神さまが押してくれるはず！

–

今回はアップデート版として、「告白」以外のランダムメッセージを用意しました！ 例えば、「ご飯を奢る」か「コーヒーを奢る」のどちらかがランダムで出る「まったりしようよカード」 「旅行にいこうよ」か「飲みにいこうよ」のどちらかがランダムで出る「お出かけしようよカード」 などなど‥

今まで好きな人や恋人への告白という「恋愛」テーマのメッセージのみでしたが、 友達や家族どうしの距離もぎゅっと近づけてくれるカードになりました！ どちらが出るか？！おみくじ感覚で楽しんでいただけると幸いです。 イラストはメンバーそれぞれが担当。 「映画」「プレゼント」「まったり」「おでかけ」の4種のテーマをイラストにしています。 販売価格は各種一枚300円を予定しております。

他にも、毎年夏に出しているAR同人誌HACKist_Vol.1~3の販売 去年の夏コミではいろんな方に声をかけていただいた動くポスター また、次世代の漫画などなどの展示も行っております！

みなさまのお越しを心よりお待ちしております。

via: http://ift.tt/2ln3H22

[hack-ist]

彩りを変えるステッチ、「ふわッチ」

2016年5月の第3回HACKist展にて出展させていただきました。

  繊維に対する新しいアプローチ

繊維は人々の生活に欠かせないもので、その長い歴史から様々な織り方が編み出され、 工芸分野からインテリア、その人に合わせたファッションスタイルにまで広がっています。

なかでも近年では、衣服の色を動的に切り替えるというアプローチが着目されていると思われます。 光るスカートや、ファッションつながりでいうとFES Watch、Vixoleなど、 その時の気分やシチュエーションによって切り替えられる楽しみができそうではあるものの、まだまだ実験的であったりします。 また、そのアプローチもLEDのような発光体をすえつけた実装が多いようではあります。

今回、LEDのような発光体を用いず、繊維自体の色を変えられないか取り組んでみました。

  サーモインク × Arduino

「Access to Materials -デザイン/アート/建築のためのマテリアルコンピューティング入門 」という書籍に、 やりたい事柄に近いものがあり、ひとまずそれをやってみました。

サーモインクという温度によって色が変わる試料に布を浸し、 Arduinoから導電糸(電気を通すステンレス糸)を這わせて、 あてた箇所の色を変えるというものです。

画面右側にサーモインクが熱せされ、導電糸に沿って色がピンクに変わりました。

やってみた結果、確かに色は変わるものの、繊維が塗った周辺に染み込み、 形どったものをいろ付けようとすると滲んで見えてしまうのが課題でした。

そこで、布にサーモインクを浸すのでなく、糸をサーモインクに浸す方法に切り替えました。 以下が、HACKist展で展示した際のイメージです。

Arduinoと導電糸の間にスイッチを設置し、 スイッチを押すと電流による熱で糸がピンク色になり、 離すと温度が下がり徐々に糸が元の色に戻っていきました。

右から2,3つ目のステッチに導電糸を縫い込んでいて、その部分で色が変わっています。

  やってみた感想

今回、本のやり方にプラスアルファを加えてみた形ではありますが、 回路図含め動く形にもっていけたのは良かったです。

やってみての課題としては、以下のような点が挙げられます。 ・LEDと違って光るわけではないため、照明環境によっては変化が見えづらかったりする ・使ったサーモインクが青 -> ピンクの切り替わりだけだったので、他の色のサーモインクと組み合わせると良さそう ・今回、一部箇所の色を変えるものだったので、模様を工夫する必要がある ・温度変化が小さいため、糸の色が変化するのに時間がかかる ・導電糸が絡まった状態で電流を流すとショートするため、ヒータなり別の熱源でできないか ・展示ではArduino及び電源orバッテリーを用意する必要があり、着て移動するには持ち運びしやすいパッケージ化が必要 ・洗濯できるのかという質問を受けたので、実用化には洗濯にも耐えうる備えがあると良い

なお、「ふわッチ」の由来は、 「ふわっ」と色が変わる「ステッチ」、になります。

  スタッフリスト

八木 啓太 高野 祥宏

via: http://ift.tt/2fShRVL

[hack-ist]

AI・VR・世界にひとつだけの特設装置も。ミオヤマザキ イベントに技術提供します!! の巻。

突然ですが今日はただいま制作中のデジタルコンテンツのご紹介です。Qawasakiです。

なんで制作中に紹介？ というところなのですが 今作ってるコンテンツはなんと今週末（10/29-30）に池袋にて、たった2日間だけ開催される限定開催イベント。 少しでも多くの人にお伝えしておきたいなと思って書いている次第です。

さて、HACKist今回のコラボ相手はミオヤマザキというロックバンドです。

強烈なメッセージ性と感情を爆発させるLiveを展開し、10-20代の感受性豊かな世代から絶大な支持を得ているバンドですが、 メディアへの露出は行わず、そのプロモーションはリアル脱出ゲームのアプリ（250万DL!!）を出すなど、なかなかにトガっております。 そんなミオヤマザキ、11/2（水）にEPICレコードからメジャー1st Alubum「anti-these」が発売になります。

このタイミングでコラボをして何をやるかと言いますと、 デジタル技術を使ったミオヤマザキの世界観を体験出来るミュージアムを作りします。 全面技術協力という形で、２日間のクリエイティブ全体を我々がやらせてもらっております。

コンセプトは「疑似体験」。 今回は６つのコンテンツでミュージアムが作られております。 この記事ではそのコンテンツの一部を（ネタバレなしで）技術面にも触れてご紹介します！！

メン��ラギャラリー

まず１つ目はオリジナルイラストのギャラリーです。 ミオヤマザキメンバーが自らが定義、分類、キャラ付けを行なったメンヘラガールの解説付きイラストが会場に展示されます。 こちらがその一部。

イラストはHACKist_（あんだー）でおなじみのさーにゃ画伯によるもの。 書き下ろしですよ。世界観満載ですよ。

そして、ギャラリーには１つだけ振動スピーカーを仕込んでおります。 これまで指向性スピーカーでのコンテンツはいくつかやってきましたが、振動は初登場。 どんなものか、というとスピーカー接着した面と後ろの空間を共鳴させる事で音を鳴らします。 つまり、壁につければ壁全体がスピーカーの役割を果たす、というモノです。 後ろの空洞具合や、つける素材、大きさなどで鳴りが変わるものです。

どんな使われ方をするのか？どこに設置されるのか？ 会場でのお楽しみに！

3D Projection Mapping MV

２つめは会場の一部屋をまるまる使ったプロジェクションマッピングMV。 立体物への投影と立体映像を駆使して、サラウンドスピーカーによる「全身で体験するMV」となっております。 感情の爆発、をテーマに「え、こんなところに投影しちゃうの？」という場所でやります。 技術面でいうと今回は立体物＋平面という会場に合わせて映像の加工と投影を行う事で 綺麗系やインタラクティブ系のプロジェクションとは一風変わったそこでしか味わえない体験をお届けします！

AI少女 ミオ

３つめはオリジナルのAI少女とチャットが出来るというもの。 博報堂アイ・スタジオのクリエイティブAI研究所が制作したチャット空間に生きるAIをミオヤマザキが教育してます。

自動で受け答え出来るAIbotが溢れる昨今、アーティストが監修したこの子は言う事が一味違うだけでなく、 AIなのに感情を表現してきたりします。会場の端末で触れますので、ぜひ。

Hallucination VR

4つめはMR（MixedReality）を駆使した体験コンテンツ。 会場に用意されたVRゴーグルを装着すると、実際に目の前の光景が見えてきます。 視覚を奪わないVR。そこから何が起きるかは会場でのお楽しみです。UnityのShaderとかDeepDreamなどを使っております。

そしてなんと、システムチェックに「ミオヤマザキ」からvoのミオさんとDrのハンちゃんが登場！！ 一足先に体験してくれました。

インタラクティブ”XXXXX”装置（詳細非公開）

５つめは５月の展示での「AIラッパー」も記憶に新しい貴田と、車輪型照明「WHEELED」のハード開発を担当した進藤が送るインタラクティブコンテンツ。 ネタバレしちゃうので詳細は書けないのですが、今回は特製装置を制作しております。おそらく世界に一個だけしかない装置です。 映像は元AKB４８の岩田華怜さんに出演頂いてます。

が、

内容を言うとバレちゃうので、せめてシステム構成を一部だけ公開しておきます。

どんなものか、当ててみてくださいませ。

mioyamazaki360° virtual“スレ”（ライブ）

で、最後６つめはすごく簡単に言うとVR体験です。 が、当然ただのLIVEが見れるとか360度見渡せるみたいなものじゃないです。 撮影機材はTHETA Sのみ、再生はGEAR VRを使います。 触覚とか錯覚とかそういう小細工はなく、撮影手法と場所、音の力という泥臭いクリエイティブでやっております。

普段はメディアに顔出しをしないミオヤマザキ。 つまり、視覚情報を遮断したアーティストでもあると言えます。そこをVRで活かすにはどうするか？

考えに考えてコンテを起こし、撮影、監督、編集までHACKist担当し、バンドメンバーと一緒に 六本木のライブハウスmorph tokyoでロケ敢行しました。

アーティストというか表現で生きる世界の人はアイデアや適応力がすごいですね。

画像はVR空間を楽しむミオさん。

イベントチケットは、SMEさんよりイープラスにて絶賛発売中です。 しっかりと体験頂くためにチケットは枚数制限があり、どうやら残りも少ないらしいとの事です。 2日間だけの開催ですが、このミラクルコンテンツ達を是非ご体感下さいませ。

我々も現地でご説明などしておりますので、お気軽にお声掛けくださいー。 制作STAFFはこんな感じです↓

では！

via: http://ift.tt/2dz5hON

[hack-ist]

動くポスターを作ってみた！

こんにちは！ HACKist_(ハックイスト・アンダー）のわかたです。

みなさん、 突然ですが、動くポスターを見たことはありますか？

「ポスター(紙)って動くものじゃないでしょ？」 今回は、そんな固定概念を覆す作品を紹介させていただきます。

動くポスターって？

動くポスターは 8月14日(日)に開催されたコミックマーケットで 展示していた作品です。

まずは動画をご覧ください。 こんな感じで、紙のポスターが動きます。

動くポスターのしくみ

今回の動くポスター制作では、企画、イラスト、デザイン、動きの検討部分をHACKist_が担当し、 それ以外の実際の電気回路制作や、プログラム実装、印刷、設営の部分は外部の協力会社に制作を依頼しています。

動くポスターは “静電モーター”という静電気の力で 物体を移動させる技術で動かしています。

まずは、こんな風に、どう動かしたいか、を検討したら、

実現したい、動きに合わせて、電気回路を設計。 紙の上に電気回路を作る、ということも、 印刷によって回路を形成できる、銀ナノインクプリントで実現しています。

移動の速度や、回転などのパターンもプログラムにより 制御ができます。

横から見ると、こんな感じで バッテリーや基盤も結構コンパクトに収まっていて 前から見ると、本当に、ただの紙にしか見えません。

ポスターのイラストについて

夏のコミケ！ということで、 夏の路地裏をテーマに絵を描きました。

ある夏の日、不思議な路地に迷い込むと、あら不思議、 スマホの中から、インターネットの中の住人が飛び出してきた！ という設定です。

路地のモデルは月島の路地裏で、激ゆるラフで イラストの構想を固めたあとに 月島で資料撮影を行い、少し丁寧な線画に、その後に トレース台の上で、もう一段階丁寧な線画にして、着色しました。

↑”動かす”というのが最大のポイントなので、 髪型やスカートや、植物なども、”風”を表現しやすい形状にしています。

動くポスターの可能性について

イラストを”動かす”ことで、 静止している状態だと伝えきれなかった、 風の流れや、キャラクターの動きを表現でき、 イラストの世界観をより深く伝えることができました。

また、コミケの会場でも 多くの人が足を止め興味を示してくださり、 動くポスターの広告としての可能性を感じることができました。

もしかしたら、近い将来、 広告はもちろん、さまざまな施設のサインや、 教育現場の教材などでも、動く紙の仕組みは 活躍しているかもしれません。

HACKist_ は引き続き、漫画/アニメ/ゲームの可能性をガンガン広げていきたいと思います！

Staff List

企画 : HACKist_ イラスト : わかたさき デザイン : さーにゃ

via: http://ift.tt/2dpYZ3X

[hack-ist]

Live2Dを触ってみた！その可能性とは？

こんにちは、HACKist_（ハックイスト・アンダー）のイトマリです。

先日ブログでもご紹介しました、DIGITAL DIVREZ出展「別世鏡」、コミケC90出展「HACKist_ Vol.3」で使用しました 「Live2D」について、触ってみてわかったこと＆その可能性について書きたいと思います！

Live2Dとは？

たった1枚のイラストがあれば、その持ち味を活かしたままに、まるで生きているかのように動かすことのできるツールです。 2008年の登場以来、現在でもゲームなどでよくつかわれている技術です。

↓こんな感じのイラストを1枚用意すれば、 ↓これくらい動かすことができちゃいます。

その特徴

手書きアニメーション、3Dモデリングなどと比べ、動きの制限はあるものの、 1枚のイラストがあれば比較的短時間で動きが作れる、という手軽さも魅力なのですが、 一番の特徴はやはり、イラストのタッチを活かしたまま、キャラクターを動かすことができる！というところだなと思います。 上のものは線画ですが、イラストレーターさんの塗りのタッチや、少女漫画家さんの繊細なラインをそのままに動かせるのは、 この技術ならではの強みですね。いわゆる石膏デッサンなんかも、そのまま動かしてみると楽しそうです。

そしてもうひとつ、仕様上の特性として、任意のパラメータを増やすことができる、というのが挙げられます。 これは「首の傾き」や「瞬き」といったの基本動作のほか、「照れる」「泣く」などの様々なパラメータを 自由に追加できるというもので、プログラムでの制御を行うこともできるため、 いろいろな使い方が考えられます。 ボタンを押すと衣装が変わる、背景が変わる、つつくと怒る、ツノが生える、などなど、 キャラ特性を自由に拡張できる機能というわけですね。

事例

別世鏡

この作品では「自分が二次元のキャラクターになってしまう」体験を作り出しました。鏡に出てくるキャラクターが もし3Dモデルだったら、おそらくここまで「二次元のキャラクターになっている感」は出せなかったと思いますし、 制作期間内に作りきることもできなかったのではないかと思います。 またこの作品ではLive2Dモデル側に「天使」「悪魔」というのパラメータを追加し、そのパラメータをActiveにすれば、 すべての天使関連パーツ/悪魔関連パーツが一気に表示されるように設定されています。表示制御をLive2Dモデル側に まとめることで、表示切り替え部分をシンプルな命令で行うことができるようになっているわけです。

HACKist_ Vol.3

冊子のオマケARとしてLive2Dを仕込んでみました。冊子に登場するキャラクターたちが、 作者のタッチそのままに、ループアニメーションしています。

↓人じゃなくてももちろん動かせます

今回の同人誌は全編漫画となっていたのですが、スマホアプリを特定のページにかざすことで、 キャラが動きながらアフターストーリーを展開するといった使い方をしてみました。 そこまでに読んでいた漫画のキャラが、筆者のタッチのまま生き生きと動くのは、作っている方としても楽しく、 かなり面白いものに仕上がったと思います。

その可能性

現在はゲームでの使用をよく見かけるのですが、漫画やカードなど、イラストの持ち味を活かせる分野と プログラムをうまく繋げる架け橋として、非常に有効なツールだと感じました。 スマホをかざすと、漫画のキャラが動きだすポップなどは、いますぐ作れそうです！

すでにVRと組み合わせた事例なども出てきていますし、最近ではWebGLとの組み合わせで、 こんなこともできるようになってきてます。 サイトの案内マスコットがこんな風に動いていたら、かわいいかもしれません。

静止画だと思っていたものが動きだすワクワク感を、ぜひ様々な分野で展開していきたいと思います。 興味ある！という方は、是非是非HACKist、もしくはHACKist_（あんだー）メンバーにご一報ください！

via: http://ift.tt/2dqqyFv

[hack-ist]

本でも映像でも電子書籍でもない。「次世代の漫画」

みなさま、漫画はお好きでしょうか。

漫画は鳥獣戯画などで知られる「絵巻物」を起源としていると言われています。 その後、印刷・製本の技術発達によって、昨今メジャーとされる「綴じ型」へと変化を遂げました。 現代の技術の進化は、漫画をさらに変化させるはずです。 次世代の漫画を感じさせる、プロトタイプをご紹介いたします。

  デジタル技術で探る、漫画表現

漫画の定義には、絵に時間という軸が加わったものだと言う説があります。 コマ割りやセリフの吹き出しや効果音が、いつも見るあの形じゃなくてもいいわけです。 さらにいえば、コマが動いていたって、吹き出しが見えたり見えなかったりしても、いいわけです。

表現は広く、技術が進化すればさらにそれは広がりを見せます。 紙をWEBに焼き直す以上に、表現の幅は広がっているはずです。

今回 私たちは、昔は本を開いている人も多かった電車内で利用されるスマートフォンをピックアップし、 スマートフォンならではの表現を探しました。

  短編１：「マンボウの書」

http://ift.tt/2cagQaM ↑ 作品はこちらから。　※iPhone6,6sに最適化して作成してあります。（対応機種拡大予定）

この漫画、最初にiPhoneを縦にして読まれたか？ 一番最後の仕掛けに、お気づきになられましたか？ この漫画では、iphoneを縦横に動かすと見える範囲が変わることを利用して、 ２軸のストーリーを展開しています。

縦で読むと１人がぼんやりお茶を飲んで、こぼして、そこにマンボウが飛んでくるという不可解なストーリーですが、 横に倒すと実は話し相手がいて、なぜお茶を零したのか、 どこからマンボウがやってきたのか、謎が解けるという仕組みになっています。

  短編２：「ガラスの椅子」

http://ift.tt/2caglxh ↑ 作品はこちらから。　※iPhone6,6sに最適化して作成してあります。（対応機種拡大予定）

本は、めくる一方向にしか進みませんが、WEBはそうではありません。 タップもあれば、スワイプも、自動操作もあります。 私たちは日々こういった技術を、WEBサイトの制作において利用しています。 この漫画では、その技術を漫画に使用しています。 パララックスと呼ばれる奥行き表現により 瓦礫の飛んでいく様を表現したり、 自動スクロールによって 所謂回想シーンというものを表現しています。

スマートフォンによって変化したインターフェイスを漫画の表現として活用することで、 新しい漫画の体験を模索しました。

実装面について

マンボウの書は見せ方の仕掛けがシンプルであるため、 細かい動きはすべてCSSアニメーションのみにするなど、実装面もシンプルに設計することで、 「普段ウェブを作らない絵描きさんでも簡単に作れるウェブ漫画」を目指して作りました。

逆にガラスの椅子では、普段の業務で培ったウェブの表現やコンテキストをふんだんに漫画に取り込んでおり、 普段ウェブサイトを作っている側の人だからこそできる漫画になっています。

表現的な動きだけではなく、それを実現する技術のあり方も含めて、 「次世代の漫画」を感じていただければと思います。

  今後の活動

表現の可能性が溢れていて、既にやりたいこともいくつかあり、 他の表現を利用した漫画を今後も制作していく予定です！ こちらのページで徐々に作品を発表していきますので、 ぜひご覧いただけますと幸いです！ また、更新の情報なども含め、こちらのtwitterアカウントでも発信していきます。

近い未来、ウェアラブルデバイスで利用できる漫画や、AIが作り出す漫画も生まれることでしょう。 それはきっと未知の時間体験です。 漫画の可能性を、今後も感じさせていけたらと思います！

■次世代の漫画 WEBサイト：http://ift.tt/2c29w3V ■HACKist_：@HACKistUNDER

  クレジット

デザイン、漫画： かさき 実装： ごっしー

via: http://ift.tt/2cah15P

[hack-ist]

あなたを異次元へ誘う「別世鏡」

こんにちは！ HACKist_(ハックイスト・アンダー）です。

先日原宿Galaxy銀河系にて行われた３回目のHACKist展「DIGITAL DIVREZ」で展示していた HACKist_(ハックイスト・アンダー)による「別世鏡」の紹介をさせていただきます。

※HACKist_(ハックイスト・アンダー)とはイラストとテクノロジーを程よくブレンドし 漫画/アニメ/ゲームの可能性をデジタルの力で広げるようなプロトタイプを提案、発信していくチームです。

  「別世鏡」とは？

突然ですが「二次元に行きたい」と思ったことはありませんか！？

別世鏡は自分がキャラクターに成り代わり、漫画からリアルへ、リアルから漫画へと 「二次元」と「三次元」の境を曖昧にさせていく装置です。

一連の体験は無料配布のストーリーペーパーを読むところから始まります。 ペーパーを読み終わった参加者は実際に漫画のシーンを再現した部屋に入り 途中抜けている1ページで何が起きたのか主人公の目線で追体験いただけます。 ※ストーリーペーパーの漫画はこちらから読むことができます。

部屋には不思議な鏡があり、鏡に自分を映すと自分の姿が漫画の主人公になり変わります。

机の上には大きな本が2冊。 片方を手にとって開くと鏡に映った自分が悪魔の姿に、もう片方を開くと天使の姿に…。 こうして2つの別世に存在する自分を見つめる主人公は物語の最後どうなってしまうのか？

体験の一連の流れや、仕組みについて、動画でまとめましたのでぜひご覧ください！

  世界観の作り込み

今回は没入感をしっかりと作り込むために物語の設定と、部屋の再現にはかなり力をいれました！

部屋のテーマは「かつて占い師が居た部屋」。 鏡に見えるものは実際は鏡面モニター。オーダーメイドで作った絵画フレームを取り付け 上部分にあるWEBカメラもレーザーカッターで制作したフレームで隠しました。

��にも部屋のいたるところに小道具や怪しい絵柄の古びた用紙を置くことで、ぐっと世界観が出るようにしています。

また体験のコアとなる本はデバイスを中に組み込めるようにし、昼と夜でデザインを変えレーザーカッターで加工した表紙部分にはLEDを仕込んでいます。

  キャラクターに息を吹き込むLive2D

漫画の中に登場したキャラクターを、その漫画の印象のまま、人の動きに合わせて動かす必要があったため、 今回はHACKistとして初めて、Live2Dというソフトウェアを使用しました。 Live2Dのパラメータ制御部分をうまくプログラムと連動させ、1モデルのみで、様々な変化を実現しています。

瞬きや首傾げなどの基本の動作のほか、悪魔と天使に変化した際は、 それぞれ髪の色や顔にある模様が変わるだけでなく、羽根の部分まで動くように設定していました。

天使の動きサンプル

システムとデバイス

今回制作したシステムと本型のデバイスの構成はこのようになっています。

本型のデバイスでは、本の開閉を検知するために、リードスイッチというものを使っています。 このスイッチは磁石を近づけると電流が流れるといったもので、 このスイッチを使うことで本の中に仕込んであるArduinoが開閉を検知していました。 そして、そのArduinoは開閉を検知すると、ZigBeeと呼ばれる無線モジュールを使ってPCに信号を送っています。

メインPCでは、今回はかなり複雑なシステム構成になっています。 まずWebカメラから顔認識を行うための画像を取得し、それをFacerigというソフトウェアが受け取ります。 Facerigとは、Webカメラに写っている画像から、顔認識によって顔がどこに向いているのか、 また顔の表情などをよみとり、それをアバターに反映させて表示するソフトウェアです。 このソフトウェアを使うことによって自分たちの作ったキャラクターを、自分の顔に合わせて動かすことができます。

そして、FacerigからopenFrameworksにそのアバターが動いている画像を送信します。 openFrameworksは、その受け取った画像をOpenCVを使いクロマキーによってキャラクターのみを抜き出し、 openFrameworksで表示している背景と合成します。

openFrameworksでは、背景合成以外に、Kinectを使用して、体の傾きや手の高さを取得していて、 体が前のめりになると、アバターも一緒に体を前のめりにしたり、 自分が手を振るとアバターもそれに反応して手を振り返してくれます。 また、PCにZigBeeによって送られてきた信号もOpenFrameworksによって取得し、アバターの見た目を変化させています。

この動作を行うためには、openFrameworksからFacerigに何かしらの通知を行わないといけないのですが、 Facerigはもともと独立したシステムなので、受け取れる入力がキーボードかマウスしかありません。 そこで擬似的にキーボードが押されたという信号をPCに送ることができるArduino Leonardoを使用しました。

openFrameworksが体の動きや本の開閉を検知すると、Arduino Leonardoに命令を送ります。 Arduino Leonardoは送られてきた命令によって、Facerigに送信するキーボードのキーを切り替えることで、 手を振るアニメーションや見た目の変化といったことを実現しています。

今後の展望

今回の作品は、 Live2D Creative Awards 2016 にて CreativeAward賞 を受賞することができました。

デバイス、顔認識、Live2D等… 新しい技術を使わず、既存の技術だけでも、 組み合わせと演出次第で、まだまだ様々なことができそうです。 今回はこれらの合わせ技で、VRともまた違う、不思議な没入感を作り出せたのではないかと思います。

HACKist_ は引き続き、漫画/アニメ/ゲームの可能性をガンガン広げていきたいと思います！

/ Staff List

イラスト : わかたさき

内装、クラフト、ロゴデザイン : さーにゃ

Live2Dモーション : いとまり

プログラミング : あさひだくん

サウンド制作 : 剣持学人

クラフト制作協力 : 小井仁

デバイス制作協力 : 進藤俊彦

via: http://ift.tt/2bxSPsD

[hack-ist]

モノとコミュニケーションをするためのインタフェース「PLUS ANIMA」

PLUS ANIMA (プラスアニマ) という作品の紹介をさせていただきます。 2016/3 SXSW 2016、2016/5  第3回HACKist展 で展示させていただいたものです。

※ もし作品を「うちの施設においてみたい」という方がいらっしゃいましたら、ご一報ください。連絡方法はこの記事の下のほうです。

PLUS ANIMA ってなに？

PLUS ANIMA はモノとコミュニケーションをするためのインタフェースです。

「モノとおしゃべりできたらな〜」と思ったことありませんか？ 「食べ物」にオススメの調理法を聞ききたい。「カメラ」の詳しいスペックがよくわからないから説明をしてもらいたい。「博物館の土偶」から歴史の話を詳しく聞きたい。「ぬいぐるみ」と寂しい時におしゃべりしたい。などなど…etc

PLUS ANIMA は ディープラーニング ＋ プロジェクションマッピング の技術によって、モノに魂 (ANIMA) を宿し、擬人化した演出をすることで、「人とモノとの直接的なコミュニケーション」の実現をします。

PLUS ANIMA では「魂が宿ってるかのように振る舞い、擬人化され、コミュニケーションのとれるモノ」が、今までの人とモノとの関係をアップデートし、人がモノと触れ合う行為をより楽しく、直感的に拡張すると考えて、取り組んでいます。

くわしくはこちらの動画をご覧ください。

どうやって使うの？

使い方はとてもシンプルです。

ようは、「モノをテーブルにおくだけ」で、モノに魂がやどり、勝手にしゃべりかけてきます。 モノからの質問には YES or NO ボタンに手をかざすと、返答できます。

どんなユースケースを想定しているの？

「モノを擬人化し、おしゃべりさせる」テクノロジーはさまざまな場面での使い方が想定できます。その中で、私達がおもに考えている 教育、セールス、エンタテイメントの 3 つのシーンでのユースケースをご紹介します。

教育施設（博物館、科学館など）での使い方

博物館、科学館などの教育施設の展示品が子供たちへ自分自身の成り立ちついて説明をすることで、より直感的にその展示物への理解を深めることができる、と考えています。

歴史的な壺や、化石が、たとえば、「私はマンモスの牙です。私が若い頃は、こんな体してたんですよ〜。私に含まれる化学成分が◯△✕だから、縄文時代のものだとわかり…etc」と映像とともに、自身の成り立ちについて、わかりやすく解説してくれるコンテンツを作ることができます。

セールスでの使い方

小売店で商品が自分自身についてのセールストークをしたり、生活者の商品についての疑問点を解消したり、また、生活者の声を集めてPDCAを回すための装置としても、役立つのではと考えています。

たとえば、食品売り場で、じゃがいもを乗せたら、「にんじんも一緒に買って、カレーにして食べるとおいしいよ」と、調理法や一緒に買うとよい品をレコメンドしてくれたり。

家電売場で、カメラ同士が会話をはじめて、「カメラAくんは高いよね。でも、画質が僕に比べるといいよね。」などと、わかりやすく商品スペックの比較をしてくれたり。

エンタテイメントでの使い方

モノを擬人化させることで、アミューズメント施設の世界観を効果的に演出するためのツールとしての利用法を考えています。

風船をもって、てくてく歩いていると、あるエリア内では、ふつうの風船に、突然、���が宿り、顔がついて、「Welcome!」と風船がしゃべりはじめ、来場者を驚かせたり。その風船が施設内を案内してくれたり。といったユースケースを想定しています。

どんなテクノロジーが裏側で動いているの？

「モノにまるで魂が宿ってる」という演出を行うための裏側のテクノロジーについて説明します。

ディープラーニングによる物体認識

PLUS ANIMA ではモノにセンサーやタグなどは一切埋め込んでいません。

事前に学習させておいたモノの画像データをもとに、テーブル上部に設置されたカメラで撮った画像から、「そのモノがはなに？」という物体認識をしています。そのため、モノにセンサーやタグなどをつける必要がなく、商品をあり��ままの状態で演出させることができます。

✨ プロジェクションマッピングによる演出

深度カメラ、RGBカメラの２つのカメラでモノの輪郭、色、をリアルタイムにセンシングし、プロジェクションマッピングの技術を用いて、モノへの演出をリアルタイムにジェネレートしています。

モノの形状解析からのパーソナリティ・トークシナリオ生成

独自アルゴリズムにより、モノの外見的特徴（色、サイズ、形）にあわせたパーソナリティ（性別、年齢、性格）を生成しています。また、そのパーソナリティに応じて、モノのトークシナリオを、動的に生成しています。

よくあるご質問

SXSW 2016や、HACKist展で展示をしていた際に、よく頂いたご質問を紹介させていただきます。

Q. テーブルの上にはどんなモノをのせても認識しますか？

A : あらかじめ学習させておいたものは精度が高く認識ができます。あらかじめ学習していないものでも、インターネット上から一番近そうなモノの名前を頑張って探してくるので、なんらかの認識結果が出ます。

Q. あらかじめの学習はどのようにしますか？

A : モノをさまざまな角度から動画で撮影し、認識用のデータをわたし達のほうで作らせていただきます。

Q. 2 つ以上モノをおくとどうなりますか？

A : 現状はあとにおいたモノが喋りはじめる仕様になっています。いづれは 2 つの似ているモノを置いたら、スペックの比較ができるような機能があるとよいと思っています。

PLUS ANIMA を実験的に導入して頂ける施設の方を大募集しております！

こんな感じでつくった PLUS ANIMA ですが、まだ実験的プロトタイプ段階で、世の中でまだ活用頂く機会に恵まれていません。

そこで、 「PLUS ANIMAを導入してみたい」 という施設の方がいらっしゃったら、ご一報いただけると幸いです。「擬人化されたモノの可能性」を一緒に探って、人とモノとの新しい関係性について考えられたら嬉しいです。

もしご興味ある方がいらっしゃったら、このページのお問い合わせメニューから、ご連絡ぜひお待ちしております！

/ Staff List

クリエイティブディレクター : 望月重太朗

企画 ＆ プログラマー : 貴田達也 、茶谷亮裕

デザイナー : 手塚健太郎、中川美香

プロデューサー : 山本恭裕、館由依子

おたすけプログラマー : 菅沼慎平

—

3月に行われた SXSW2016 での展示の様子を Gizmode さんの Twitter でご紹介いただきました！

「Hello World!（https://t.co/uHCpFfS5iQ）」by HACKist ものを置くとそれを判別して、話し始めるテーブルです。YES／NOのボタンも出てくるのでものと会話しているような気分に #SXSW http://pic.twitter.com/ijdLqU0j0z

— ギズモード・ジャパン (@gizmodojapan) March 14, 2016

SXSW2016 での展示の風景です。

via: http://ift.tt/2bKATAt

[hack-ist]

WebGL特化型VJ演出 【notall 2nd Anniversary Tour!! ~夏だ！騒ぐぜ！東名湾~】

こんにちは。HACKistです。

先日、アイドルグループ notall さんのワールドツアー 【notall 2nd Anniversary Tour!! ~夏だ！騒ぐぜ！東名湾~】 にて、WebGLをつかったインタラクティブパフォーマンスのご協力をさせていただきました。

インタラクティブパフォーマンス

インタラクティブというと、対話、双方向といった意味になるのですが、今回のケースでは、アイドルメンバーやライブにいらしているお客さんの放つ声や音、カメラから入力された映像情報を元に、ステージ上に投影される映像演出をダイナミックに変えていくというパフェーマンスを行いました。 こういった演出の多くは、最近流行りであるUnityやMAX、openFrameworksといったソフトウェアを用いて行うのですが、今回は国内でも例の少ないWebGL/GLSLに特化させて演出を行っています。

今回は全体で4曲の演出を行ったのですが、その中から3曲の内容を少し紹介させていただければと思います。

1. UNU

【 0:00 – 0:10 】 EDM調の楽曲で、全体としてアブストラクトな表現を行っています。パーティクル系の表現と、光の効果を活かせるような構成を行いました。

2. ウサギツンデレラ

【 0:10 – 0:16 】 キネティックタイポグラフィという表現方法を使い、テンポ良く楽曲の中に背景を取り入れる演出を行いました。 楽曲と演者のマイクから入力された音により映像を変化させる仕組みを取り入れ、リアルタイムに変化する映像効果を実現しています。

3. マジ

【 0:17 – 0:32 】 パーティー感の強い楽曲で、曲の持つ楽しいイメージを再現するため、様々な3Dオブジェクトを作り、それを直接演出の中に取り込んでいます。3Dオブジェクトの生成にはBlenderとIllustratorを組み合わせ取り込みを行いました。

舞台裏

「マジ」のリハーサル中。 楽曲の音によって自動的な処理がかかる部分もありますが、人の手を入れる部分をあえて残すことで、リアルタイムVJプレイの要素も残しています。 VJだけの演出であればそう難しくはないのですが、実際はステージの進行と合わせることが必須であり、音響や照明機材、演者の状況などを含め連携しつつ進めていくため数時間にわたるリハーサルを入念に行っています。

機材はGPUを強化したマシンを軸に、キーボード、マウス、MIDIコントローラー、オーディオインターフェイスなどを揃え、今回の演出にカスタマイズした構成を用意。プラン通りの演出はもちろん想定される緊急時の対応方法まですべてをコントロール下におきました。

  HACKistは今まで何度かVJに関わらせていただく機会に恵まれ、様々な演出を行っています。 今回は大規模なライブイベントで、WebGLを軸にしたステージの演出を行うことができ、最高の演出ができたと思っています。

今回はWebGLに特化したVJだったのですが、また機会があれば新しい体験の場を作れればと思っています。

■ Credit（HACKist制作スタッフ） Creative: 谷岡 尚人 高野 祥宏 / 八木 啓太 / 齋藤 陽一 岩橋 卓 / 横山 幸正 / 荒瀬 亮太 佐野 彩香 小井 仁

PM: 小井 仁

Produce: 十字 賢

via: http://ift.tt/2aWSDmL