料理の注文メニューの3D化への挑戦

Babylon.jsゆるほめLT会

料理の注文メニューの3D化への挑戦

Transcript

1. Babylon.jsゆるほめLT会
   2022年7月8日
   料理の注文メニューの3D化への挑戦
   長田英幸
   スライドのSNS投稿 大歓迎
   事後レポート掲載 大歓迎
   

   View Slide

2. 自己紹介
   • 長田英幸 (ながた ひでゆき)
   • 大阪の会社で、製造業向けのWebシステムの開発しています。
   • 3D表示には憧れがあったので、Babylon.jsに俄然興味が出ました。
   • 個人開発でスマートスピーカーのアプリを開発しています
   (最近公開出来てません😿)
   

   View Slide

3. かつ丼ARが流行っていたので
   思いついたのですが
   

   View Slide

4. 初めてPlaygroundを触ってみました。
   •ゆるく褒めてください(涙)
   •https://playground.babylonjs.c
   om/#K8NRJG#9
   

   View Slide

5. 解説-1
   • BABYLON.SceneLoader.ImportMesh("", "scenes/Dude/", "Dude.bab
   ylon", scene, function (meshes) {
   • scene.createDefaultCameraOrLight(true, true, true);
   • scene.createDefaultEnvironment();
   •
   • });
   

   View Slide

6. 解説-2
   • https://doc.babylonjs.com/toolsAndResources/assetLibraries/availabl
   eMeshes
   • The Meshes Library に自由に使えるオブジェクトが掲載されている。
   • 特殊なのしかないのですか。
   

   View Slide

7. 解説-3
   • 環境構築しなくても試せるので、Playground、ありがたいですね。
   • // 調理台と思ってください。
   • const box = BABYLON.MeshBuilder.CreateBox("box", {height: 35, wi
   dth: 100, depth: 50});
   • box.position.x = 10;
   • box.position.y = 20;
   • box.position.z = 35;
   

   View Slide

8. まとめ
   • 簡単に3Dが試せて、新鮮な驚きがあった。
   • 構想の十分の一も出来なかった。もっとBabylon.jsを触りたい。
   • 今後、音声入力も挑戦したいです。
   • https://aws.amazon.com/jp/blogs/news/aws-how-to-hands-free-
   interaction-ar-vr-amazon-lex-babylon-js/
   

   View Slide