Unityでつくる 楽しいブロックチェーンアプリ · WebGl_ Development Yuild...
Transcript of Unityでつくる 楽しいブロックチェーンアプリ · WebGl_ Development Yuild...
![Page 1: Unityでつくる 楽しいブロックチェーンアプリ · WebGl_ Development Yuild Autoconnect Profiler Scripts Only Build Llnitv Android J :WebGC 'tv tvos Xbox One ps Vita](https://reader030.fdocuments.net/reader030/viewer/2022041105/5f0764c27e708231d41cc37d/html5/thumbnails/1.jpg)
Unityでつくる
楽しいブロックチェーンアプリ
坪沼邦生
SCSK(株)
2018/7/20
![Page 2: Unityでつくる 楽しいブロックチェーンアプリ · WebGl_ Development Yuild Autoconnect Profiler Scripts Only Build Llnitv Android J :WebGC 'tv tvos Xbox One ps Vita](https://reader030.fdocuments.net/reader030/viewer/2022041105/5f0764c27e708231d41cc37d/html5/thumbnails/2.jpg)
自己紹介
普段の業務:AI・ディープラーニング
ブロックチェーンもさわっている
社内でハンズオン開催とか
![Page 3: Unityでつくる 楽しいブロックチェーンアプリ · WebGl_ Development Yuild Autoconnect Profiler Scripts Only Build Llnitv Android J :WebGC 'tv tvos Xbox One ps Vita](https://reader030.fdocuments.net/reader030/viewer/2022041105/5f0764c27e708231d41cc37d/html5/thumbnails/3.jpg)
3
![Page 4: Unityでつくる 楽しいブロックチェーンアプリ · WebGl_ Development Yuild Autoconnect Profiler Scripts Only Build Llnitv Android J :WebGC 'tv tvos Xbox One ps Vita](https://reader030.fdocuments.net/reader030/viewer/2022041105/5f0764c27e708231d41cc37d/html5/thumbnails/4.jpg)
ハンバーガー屋
ブロックチェーン上で代金を払ってもらって
通販をしよう
ストーリー
![Page 5: Unityでつくる 楽しいブロックチェーンアプリ · WebGl_ Development Yuild Autoconnect Profiler Scripts Only Build Llnitv Android J :WebGC 'tv tvos Xbox One ps Vita](https://reader030.fdocuments.net/reader030/viewer/2022041105/5f0764c27e708231d41cc37d/html5/thumbnails/5.jpg)
ブロックチェーン上でハンバーガーの代金を払う仕組み
必要なもの
![Page 6: Unityでつくる 楽しいブロックチェーンアプリ · WebGl_ Development Yuild Autoconnect Profiler Scripts Only Build Llnitv Android J :WebGC 'tv tvos Xbox One ps Vita](https://reader030.fdocuments.net/reader030/viewer/2022041105/5f0764c27e708231d41cc37d/html5/thumbnails/6.jpg)
0xabc123... 0xdef456...0.1 ETH
お客さんのアドレス 店のアドレス
届く
![Page 7: Unityでつくる 楽しいブロックチェーンアプリ · WebGl_ Development Yuild Autoconnect Profiler Scripts Only Build Llnitv Android J :WebGC 'tv tvos Xbox One ps Vita](https://reader030.fdocuments.net/reader030/viewer/2022041105/5f0764c27e708231d41cc37d/html5/thumbnails/7.jpg)
ブロックチェーン上で
代金を支払うには?
![Page 8: Unityでつくる 楽しいブロックチェーンアプリ · WebGl_ Development Yuild Autoconnect Profiler Scripts Only Build Llnitv Android J :WebGC 'tv tvos Xbox One ps Vita](https://reader030.fdocuments.net/reader030/viewer/2022041105/5f0764c27e708231d41cc37d/html5/thumbnails/8.jpg)
ウォレットを使ってもらう:MyEtherWallet
誰でも使えるWebアプリ
![Page 9: Unityでつくる 楽しいブロックチェーンアプリ · WebGl_ Development Yuild Autoconnect Profiler Scripts Only Build Llnitv Android J :WebGC 'tv tvos Xbox One ps Vita](https://reader030.fdocuments.net/reader030/viewer/2022041105/5f0764c27e708231d41cc37d/html5/thumbnails/9.jpg)
①宛先アドレスを指定
②支払額を指定
③送信
![Page 10: Unityでつくる 楽しいブロックチェーンアプリ · WebGl_ Development Yuild Autoconnect Profiler Scripts Only Build Llnitv Android J :WebGC 'tv tvos Xbox One ps Vita](https://reader030.fdocuments.net/reader030/viewer/2022041105/5f0764c27e708231d41cc37d/html5/thumbnails/10.jpg)
でも…
宛先や支払額間違えそう…
なんか機能が多くて難しい…
![Page 11: Unityでつくる 楽しいブロックチェーンアプリ · WebGl_ Development Yuild Autoconnect Profiler Scripts Only Build Llnitv Android J :WebGC 'tv tvos Xbox One ps Vita](https://reader030.fdocuments.net/reader030/viewer/2022041105/5f0764c27e708231d41cc37d/html5/thumbnails/11.jpg)
これ使って払ってね
宛先間違えた…
![Page 12: Unityでつくる 楽しいブロックチェーンアプリ · WebGl_ Development Yuild Autoconnect Profiler Scripts Only Build Llnitv Android J :WebGC 'tv tvos Xbox One ps Vita](https://reader030.fdocuments.net/reader030/viewer/2022041105/5f0764c27e708231d41cc37d/html5/thumbnails/12.jpg)
そうだ、専用アプリを作ろう
ボタンを押せば支払える
![Page 13: Unityでつくる 楽しいブロックチェーンアプリ · WebGl_ Development Yuild Autoconnect Profiler Scripts Only Build Llnitv Android J :WebGC 'tv tvos Xbox One ps Vita](https://reader030.fdocuments.net/reader030/viewer/2022041105/5f0764c27e708231d41cc37d/html5/thumbnails/13.jpg)
どうやってWebアプリとEthereumを連携させるの?
Webアプリ(HTML/CSS/JS)
MetaMask
![Page 14: Unityでつくる 楽しいブロックチェーンアプリ · WebGl_ Development Yuild Autoconnect Profiler Scripts Only Build Llnitv Android J :WebGC 'tv tvos Xbox One ps Vita](https://reader030.fdocuments.net/reader030/viewer/2022041105/5f0764c27e708231d41cc37d/html5/thumbnails/14.jpg)
MetaMaskとは?
Ethereumに接続するためのChromeの拡張機能
※Firefox版などもある
![Page 15: Unityでつくる 楽しいブロックチェーンアプリ · WebGl_ Development Yuild Autoconnect Profiler Scripts Only Build Llnitv Android J :WebGC 'tv tvos Xbox One ps Vita](https://reader030.fdocuments.net/reader030/viewer/2022041105/5f0764c27e708231d41cc37d/html5/thumbnails/15.jpg)
この中で自分のアカウントを作れる
![Page 16: Unityでつくる 楽しいブロックチェーンアプリ · WebGl_ Development Yuild Autoconnect Profiler Scripts Only Build Llnitv Android J :WebGC 'tv tvos Xbox One ps Vita](https://reader030.fdocuments.net/reader030/viewer/2022041105/5f0764c27e708231d41cc37d/html5/thumbnails/16.jpg)
画面のJavaScriptから使える!
web3js = new Web3(web3.currentProvider);
web3js.eth.sendTransaction({from: "0xabc...", to: "0xdef...", value: "0.1"...
MetaMaskに接続
送金
![Page 17: Unityでつくる 楽しいブロックチェーンアプリ · WebGl_ Development Yuild Autoconnect Profiler Scripts Only Build Llnitv Android J :WebGC 'tv tvos Xbox One ps Vita](https://reader030.fdocuments.net/reader030/viewer/2022041105/5f0764c27e708231d41cc37d/html5/thumbnails/17.jpg)
①購入ボタンを押す
②MetaMaskが表示される
③支払う宛先・金額は設定済
![Page 18: Unityでつくる 楽しいブロックチェーンアプリ · WebGl_ Development Yuild Autoconnect Profiler Scripts Only Build Llnitv Android J :WebGC 'tv tvos Xbox One ps Vita](https://reader030.fdocuments.net/reader030/viewer/2022041105/5f0764c27e708231d41cc37d/html5/thumbnails/18.jpg)
これ使って払ってね
できた!
![Page 19: Unityでつくる 楽しいブロックチェーンアプリ · WebGl_ Development Yuild Autoconnect Profiler Scripts Only Build Llnitv Android J :WebGC 'tv tvos Xbox One ps Vita](https://reader030.fdocuments.net/reader030/viewer/2022041105/5f0764c27e708231d41cc37d/html5/thumbnails/19.jpg)
使いやすくなった!
でも…
楽しい…か?
![Page 20: Unityでつくる 楽しいブロックチェーンアプリ · WebGl_ Development Yuild Autoconnect Profiler Scripts Only Build Llnitv Android J :WebGC 'tv tvos Xbox One ps Vita](https://reader030.fdocuments.net/reader030/viewer/2022041105/5f0764c27e708231d41cc37d/html5/thumbnails/20.jpg)
3D化しよう!
![Page 21: Unityでつくる 楽しいブロックチェーンアプリ · WebGl_ Development Yuild Autoconnect Profiler Scripts Only Build Llnitv Android J :WebGC 'tv tvos Xbox One ps Vita](https://reader030.fdocuments.net/reader030/viewer/2022041105/5f0764c27e708231d41cc37d/html5/thumbnails/21.jpg)
![Page 22: Unityでつくる 楽しいブロックチェーンアプリ · WebGl_ Development Yuild Autoconnect Profiler Scripts Only Build Llnitv Android J :WebGC 'tv tvos Xbox One ps Vita](https://reader030.fdocuments.net/reader030/viewer/2022041105/5f0764c27e708231d41cc37d/html5/thumbnails/22.jpg)
家・キャラクタなどは既存のアセットを使った
![Page 23: Unityでつくる 楽しいブロックチェーンアプリ · WebGl_ Development Yuild Autoconnect Profiler Scripts Only Build Llnitv Android J :WebGC 'tv tvos Xbox One ps Vita](https://reader030.fdocuments.net/reader030/viewer/2022041105/5f0764c27e708231d41cc37d/html5/thumbnails/23.jpg)
どうやってUnityアプリとEthereumを連携させるの?
WebGL出力
MetaMask
![Page 24: Unityでつくる 楽しいブロックチェーンアプリ · WebGl_ Development Yuild Autoconnect Profiler Scripts Only Build Llnitv Android J :WebGC 'tv tvos Xbox One ps Vita](https://reader030.fdocuments.net/reader030/viewer/2022041105/5f0764c27e708231d41cc37d/html5/thumbnails/24.jpg)
WebGLとは?
Webブラウザで3Dコンテンツを動かせる
Unityから標準で出力できる
![Page 25: Unityでつくる 楽しいブロックチェーンアプリ · WebGl_ Development Yuild Autoconnect Profiler Scripts Only Build Llnitv Android J :WebGC 'tv tvos Xbox One ps Vita](https://reader030.fdocuments.net/reader030/viewer/2022041105/5f0764c27e708231d41cc37d/html5/thumbnails/25.jpg)
ハンバーガーに価格を設定
![Page 26: Unityでつくる 楽しいブロックチェーンアプリ · WebGl_ Development Yuild Autoconnect Profiler Scripts Only Build Llnitv Android J :WebGC 'tv tvos Xbox One ps Vita](https://reader030.fdocuments.net/reader030/viewer/2022041105/5f0764c27e708231d41cc37d/html5/thumbnails/26.jpg)
index.html
MetaMaskに接続
![Page 27: Unityでつくる 楽しいブロックチェーンアプリ · WebGl_ Development Yuild Autoconnect Profiler Scripts Only Build Llnitv Android J :WebGC 'tv tvos Xbox One ps Vita](https://reader030.fdocuments.net/reader030/viewer/2022041105/5f0764c27e708231d41cc37d/html5/thumbnails/27.jpg)
UnityのC#コードとMetaMaskのJavaScriptコードの
対応付け
![Page 28: Unityでつくる 楽しいブロックチェーンアプリ · WebGl_ Development Yuild Autoconnect Profiler Scripts Only Build Llnitv Android J :WebGC 'tv tvos Xbox One ps Vita](https://reader030.fdocuments.net/reader030/viewer/2022041105/5f0764c27e708231d41cc37d/html5/thumbnails/28.jpg)
ハンバーガーとぶつかったらMetaMaskに送金指示するコードをキャラクタに付加
![Page 29: Unityでつくる 楽しいブロックチェーンアプリ · WebGl_ Development Yuild Autoconnect Profiler Scripts Only Build Llnitv Android J :WebGC 'tv tvos Xbox One ps Vita](https://reader030.fdocuments.net/reader030/viewer/2022041105/5f0764c27e708231d41cc37d/html5/thumbnails/29.jpg)
![Page 30: Unityでつくる 楽しいブロックチェーンアプリ · WebGl_ Development Yuild Autoconnect Profiler Scripts Only Build Llnitv Android J :WebGC 'tv tvos Xbox One ps Vita](https://reader030.fdocuments.net/reader030/viewer/2022041105/5f0764c27e708231d41cc37d/html5/thumbnails/30.jpg)
これ使って払ってね
わぁい!
![Page 31: Unityでつくる 楽しいブロックチェーンアプリ · WebGl_ Development Yuild Autoconnect Profiler Scripts Only Build Llnitv Android J :WebGC 'tv tvos Xbox One ps Vita](https://reader030.fdocuments.net/reader030/viewer/2022041105/5f0764c27e708231d41cc37d/html5/thumbnails/31.jpg)
ブロックチェーン
×