HoloLens1とobnizで触覚連動させたメモ

先日のヒーローズリーグにてメンターをしつつ、エキシビジョン発表枠でHoloLens1とobnizで触覚連動させたメモです。

obniz Hand のプロトタイプ

以前にobnizを手に装着するデバイスの実験はしていました。

obnizに複数のGrove Mech Keycap をつけて光り方やボタン感を検証したメモ

これで実際にある程度イケるんじゃないかという感覚があったので今回発展させました。

やりたいこと

image

今回はHoloLensでデータ世界に触れると現実のobnizでGrove バイブレーションモーターが反応するという仕組みを作りました。

まずは実験

obnizでGrove バイブレーションモーターの動かす感覚をつかみます。

image

5本指で動くように準備。

image

実際動かしてみて、GND・VCCを律儀に引き出してしまうと、あっというまに、ポートを消費してしまうことがわかりました。

オリジナル基板を発注し基礎実装

GND・VCCを共有するために、調整します。

image

Fusion PCBに依頼します。

image

VCC・GNDは共有で、デジタル入出力だけに特化して、5つ同時に付けれる仕組み。

image

Groveコネクタを用意します。

image

はんだ付けします。

image

Grove バイブレーターとつないでいい感じです。

手袋に実装します

このあたりまで、春辺りから断続的に実装していました。

いよいよ、以前の obnizに複数のGrove Mech Keycap をつけて光り方やボタン感を検証したメモ をベースに手袋へ実装します。

image

結束バンドでobnizを手袋に装着。

image

指の部分のGrove バイブレーションモーターも結束バンドでいい具合に固定。

image

じゃじゃーん。

image

裏側もいい感じに、左手に装着できました。

obnizだけで単体で動く仕組みはざっくりこんな感じです。

html
<html>
<head>
  <meta charset="utf-8">
  <meta name="viewport" content="width=device-width, initial-scale=1">
  <script src="https://obniz.io/js/jquery-3.2.1.min.js"></script>
  <script src="https://unpkg.com/obniz@2.1.0/obniz.js" crossorigin="anonymous"></script>
</head>
<body>

<div id="obniz-debug"></div>
<h1>obniz instant HTML</h1>
<button id="on">ON</button>
<button id="off">OFF</button>
<div id="print"></div>

<script>
var obniz = new Obniz("OBNIZ_ID_HERE");
  
async function loopAction(){
  console.log("loopAction");
  obniz.io10.output(true);
  await obniz.wait(500);
  obniz.io9.output(true);
  await obniz.wait(500);
  obniz.io8.output(true);
  await obniz.wait(500);
  obniz.io7.output(true);
  await obniz.wait(500);
  obniz.io6.output(true);
  await obniz.wait(500);
  obniz.io10.output(false);
  await obniz.wait(500);
  obniz.io9.output(false);
  await obniz.wait(500);
  obniz.io8.output(false);
  await obniz.wait(500);
  obniz.io7.output(false);
  await obniz.wait(500);
  obniz.io6.output(false);
  await obniz.wait(500);
  console.log("end");
}
  
obniz.onconnect = async function () {


  obniz.display.clear();
  obniz.display.print("Hello Grove Hand");

  obniz.io11.output(false);
  obniz.io5.output(true);
 

  obniz.switch.onchange = function(state) {
    $('#print').text(state);
    obniz.display.clear();
    obniz.display.print(state);
  }  

  $('#on').click(async function () {
      obniz.display.clear();
      obniz.display.print("ON");
       await loopAction();
    
  });
  $('#off').click(function () {
      obniz.display.clear();
      obniz.display.print("OFF");
    
      obniz.io10.output(false);
      obniz.io9.output(false);
      obniz.io8.output(false);
      obniz.io7.output(false);
      obniz.io6.output(false);
  });
}

</script>
</body>
</html>

ここにさらにMQTTの仕組みを加えました。

image

いざ登壇

ということで、メンターしながらなので当日は2時間も制作できませんでしたが、今までの積み重ねもあったので、ぎりぎりエキシビジョン発表枠で間に合いました。

image

タイトル。

image

ぶっつけ本番のデモ。

image

ここまでデモでやってみて、なぜか手袋をつけた手のほうでツマミ動作がうまく認識できず苦戦。あと絡み合った技術すぎて説明の難しさもありました。これは今度の課題です。

この時点では、結局手袋をつけてない手の方でHoloLens内のブロックを触ると、手袋が連動できるという形でしのぎました。

image

その後のタッチアンドトライでは、結構な方に触っていただきました。うれしい。

うまくいかなかったくやしさはあるものの、いままで積み上げてきた技術を、ちゃんとつないでお伝えすることができて良かったです。

なぜ動作しなかったのかは検証して見えてきているので「obniz Hand(手袋)でHoloLens内のデータ空間を触ると振動で連動する」ということに近づけていきたいと思います!