NEMLand

NEMのアドレスから仮想空間を作る(NEMLand)

NEMLand (ネムランド)
NEMLand

NEMのアドレスに仮想空間の情報を記録しておき、アプリケーションから読み込むことで仮想空間を描画できるようにしました。

これを利用して作ったサービスがNEMLandです。まだ開発中です。

NEMLandとは

NEMLandはNEMアドレスを持っていれば、誰でも簡単に仮想空間を作って遊ぶことが出来るサービスです。

アドレス内のトランザクションデータの中で、前もって決めておいたルールに則ったデータを利用することで仮想空間内にオブジェクトを作成することができます。

使用時の注意

• ネムランドは開発段階で、誤作動を起こす可能性があります
• 投稿の削除はできません
• 暗号化メッセージには対応してません

主な開発ツール

• nem-sdk
• three.js

開発の流れ

• 仮想空間を描画するためのルールを作る
• nem-sdkのwebsocketでトランザクションデータを取得
• three.jsで取得したデータを元に仮想空間を描画

仮想空間を描画するためのルールを作る（コマンド）

nem-land:box(x,y,z)

上述したテキストがルールの一例です。部分ごとに説明していきます。

nem-land:
このトランザクションデータがNEMLandの利用を考慮していることを示す。

box(x,y,z)
仮想空間上に箱オブジェクトを作成させるコマンド。（x,y,z）は座標を表します。指定できる座標の値は0~9のみにしています。（それ以外の値はうけつけないはず）

このコマンドをメッセージとして送信すると、その内容が正しければ仮想空間に反映ます。

その他にもモザイクに反応するtreeコマンドがあります。

tree(x,y,z)
仮想空間上に木オブジェクトを作成させるコマンド。座標についてはboxと同様。また、treeコマンドに関しては、モザイクを必要とするようにしました。

どのモザイク(XEMを除く)でも適用されます。モザイクの量に応じて木のサイズを変えるようにしました。（あまり多すぎるとやばいことになりますので注意...）

本当はもっといろんなコマンドを作りたかったのですが間に合いませんでした。機会があれば増やしたいと思ってます。

nem-sdkのwebsocketでトランザクションデータを取得

NEMLandではwebsocketを使っているので、仮想空間の描画はリアルタイムで変化します。（音出るので注意）

nem-sdkのwebsocketを使うときに参考にしたリンクをシェアします。

• nem-sdk example(github) このソースコードをひな型として開発していきました。
• nemアドベントカレンダー2017 日に日に新しい有益な情報が出るのでとても参考にしました。皆さんありがとうございます。

NEMLandにはバグがあり、承認済みトランザクションの同じデータを2つ受信してしまうバグがあります。なぜだかはよくわかりません。

追記)このバグは同一のアドレスから送られてきたトランザクションの場合に起こることを教えていだぎました。異なるアドレスからの場合は起こらないそうです。

three.jsで取得したデータを元に仮想空間を描画

仮想空間を作るためにweb上で3D処理ができるjavascriptライブラリのthree.jsを使いました。

• Three.js入門サイト

ざっくりですが、これらの記事を参考にしながら、利用できるソースコードをがちゃがちゃに組み合わせて、動けばいいや精神で作っていきました。

今後の課題

今回は0から学び始めることが多かったため（npmってなんやねん！ってところから始まりました）、バグもあったり、やりたいこともあまりできませんでした。NEMLandを今後改善していくときにやっていきたいことをリスト化してまとめておきます。

• 動けばいいや精神で作ったので、ロジックを設計からちゃんと見直す。
• コマンドを増す。（モザイク毎にオブジェクトを変更したり、アニメーションもできるようにしたり）
• コマンドのミスを防ぐための対策を考える。
• 複数の仮想空間を連結、共有できるようする。
• VR、AR、MRへの対応をする。（現実の地理情報と連動できれば面白そう）
• アドレスのQRコードをARマーカーとして利用できるようにする（やろうと思ったが方法がみつからず諦めた）
• ハーベスト、PoI、マルチシグ等使っていないNEMツールを活用する。
• TipNEMなど他のNEMアプリケーションと連動できるようにする
• 仮想空間内でキャラクター操作とかできるようする（デジモン、ロックマンエクゼ的な）

やってみた感想

tiwitterで「NEMapi使ってなにかしら作りたい」と軽い気持ちでつぶやいたら、思わぬ反響があり、引くに引けない状況になってしまってから2か月くらいがたち、なんとかひとつ開発できたのかなと思います。0からということもあり正直大変でしたが、やはりNEMapiの使いやすさを改めて実感しました。（データベース周りとか学ぶ必要が無かった。これもやってたらもう数か月かかるところだった）本当にjavascriptを学ぶくらいでできてしまうので、プログラミングをこれから学ぼうとしている人たちにとってもNEMをつかったサービス開発は良いのではないでしょうか。

明日は待ちに待ったnemketですね！皆さん行きましょー！！