We organized second meetup of Babylon.js. The post shows the meetup reports.
- 1. What is Babylon.js Japan?
- 2. Preesntations
- 2.1 Opening
- 2.2 Introducing Babylon.js 6 -What's new with it-
- 2.3 A year activities of Babylon.js JAPAN
- 2.4 Case study of Babylon.js 1
- 2.5 Case study of Babylon.js 2
- 2.6 LT1 A peti digital twin
- 2.7 LT2「Try to make an app that converts 2D images into 3D models and displays them」
- 2.8 LT3「Implemented a WebXR Feature on Babylon.js and established to commit on OSS 」
- 2.9 LT4「Try Babylon.js」
- 2.10 LT5「 Tried to make WebAR contents with Babylon.js x 8thwall」
- 3. Conclusion
1. What is Babylon.js Japan?
It is the community that not only organizes meetups regarding Babylon.js, but also provides relationship opportunity for community members. It has been established on April 2022.
You can see the meetup in the following YouTube. Around 110 members (including onsite/offsite) participated the meetup.
"かーでぃ", "Ricky", "nagauta", and "Yamayu"(one of organizers) who are attendees and presenter, kindly published clear reports (only in Japanese).
@iwaken71 hosted the event. He considered how to get excited hall.
I could not go to the real space (Microsoft Japan office) due to sudden my child's getting sick. Therefore I could not take pictures of him. See the YouTube Live above.
2.2 Introducing Babylon.js 6 -What's new with it-
Presenter: Limes (@limes2018) / Twitter
Here is my presentation. Babylon.js will contains not only new feature but also performance improvements. Initial v6.0 release date was March 30th but was postponed to April 20th. (The meetup was scheduled for original release date)
In this presentation, I introduced possible new features of v6.0 with using official BJS twitter, documentations, GitHub histories.
- WebGPU based performance optimization
- Collaboration with GUI Editor and Playground
- Fluid Renderer
- Screen Reader
- Texture Decal
- Screen Space Reflections (SSR) Rendering Pipeline
My presentation materials introduces them in detail.
I also introduced a sample BJS work based on "Screen Space Reflection", "Post Process", "WaterMaterial", and "LensFlare"
2.3 A year activities of Babylon.js JAPAN
They kindly introduced activities as Babylon.js JAPAN. Let me share contents they shared during their presentation.
それを #BabylonJS と組み合わせる話が、 #BabylonJS勉強会 の Discord で出ていたので、Hands との組み合わせを試してみた！
Sphere の位置を、手の動きで操ってみるテスト！#MadeWithTFJS #TensorFlow #TensorFlowJS pic.twitter.com/sBoVpzt5yo
2.4 Case study of Babylon.js 1
Presenter: やまゆ💝💯 (@akai_inu) / Twitter / Affiliation: VirtualCast, Inc.
The presenter has tackled with Babylon.js for several years. One of his great contribution is babylon-vrm-loader.
He is a creator of the loader. We can check his contribution in this official Babylon.js document.
In this presentation, he showed why he selected Babylon.js for VRM playback feature and issues for implementations.
Issues for implementations
Port MToon Material→Eventually he made it by himself.
2.5 Case study of Babylon.js 2
Presenter: Shogo Hiruma / Affiliation: Hitachi R&D
He introduced industrial metaverse concept on his company.
There were several reaction on Twitter. All of them within my observation were positive and contain curiosity.
原発施設を再現モデルに選ばれるのがまたスケールの大きさを感じます！ #babylonjs勉強会— Ricky (@N1809031125) 2023年4月1日
紙のマニュアルが淘汰されて、メタバース空間とコンテンツがマニュアルになる世界線は胸アツ。#BabylonJS勉強会— のぶ (@mininobu) 2023年4月1日
2.6 LT1 A peti digital twin
His definition of digital twin
- With using sensing technologies, reproduce physical state in virtual world.
- Forecast near future vision based on sensing data.
- Based on the results, they can act with best move.
2.7 LT2「Try to make an app that converts 2D images into 3D models and displays them」
Preesnter: nagauta (@nagauta_jp) / Twitter
I have not used Babylon.js yet, but I am interested in it, so I joined this LT session.
What I want to try: Convert a 2D image selected by the user into a 3D model. Display the converted 3D model with Babylon.js.
It's a new fiscal year, so I want to try new technologies.
I want to test if it can be used for a hair catalog related app that I am planning to develop with my friend.
・2D images to 3D models : To generate AI based Model, utilized Global-Local Path Networks(GLPN)
Done to generate 3Dmodel from a picture.
超高速理解過ぎる— きょうすけ (@kyo_chan1357) 2023年4月1日
え？今年の3月？— かーでぃ@Babylon.jsレシピ集発売中 (@_0447222690292) 2023年4月1日
His next goal : Understand more and try to generate hair model from hair style images.
2.8 LT3「Implemented a WebXR Feature on Babylon.js and established to commit on OSS 」
Presenter: にー兄さん (@ninisan_drumath) / Twitter
I proceeded while complying with the WebXR Device API specification, understanding the contents of the Docs, and discussing with the maintainer.
His PR has been merged on Babylon.js v5.49.1
Tips：We should not implement a feature that just returning a raw data of WebAPI in this PR.
If the PR returns ArrayBuffer and WebGL Texture, the PR is meaningless, he guess.
He start to work at HoloLab, Inc. since today!
2.9 LT4「Try Babylon.js」
Presenter: Ricky (@N1809031125) / Twitter
Goal: He try to know what he can do on Babylon.js
- Generated 3D model with "Scaniverse" app.
- Exported the models as glb format and show them on Babylon.js
- Actually, it is not easy to play these 3D models for VR with Unity
(Fit Unity version, take care of various settings, building time...)
・Without uploading data on cluster and VRChat, we can realize VR environment with Babylon.js. It's fantastic!!
・On the other hand, Unity is better in regard with particle settings. Pros and Cons.
・If we use Babylon.js, just typing several lines and save 3D model folders is enough.apps.apple.com
2.10 LT5「 Tried to make WebAR contents with Babylon.js x 8thwall」
- He is a front dev engineer.
- three.js is one of his main program language. He is a beginner of BJS.
- Organizes a WebGL meetup
第一回WebGLゆる勉強会ですが、一旦— Yuki Tanabe (@tanabee_8) 2022年11月15日
- What he did: A WebAR content on an advertisement article. If users see the article through their smartphone camera, huge number of rabbits are showed and run around.
- The advertisement was showed in multiple common newspaper in Japan.
- The app was developet on Babylon.js x 8thWall.
We can see his company's content in this article.
- Why they adopted Babylon.js?
- One of their main requirements were showing huge number of animated rabbits. It was equal to realize instancing 3D models with bone animation.
- three.js was not compatible with such fature but BJS was.
Furthermore, a simple trial app could establish 60fps.
What were difficulty of Babylon.js from the point of view of a three.js user?
There were a few reference info in regard with Babylon.js.
His company looks for front dev engineers.
Iwaken-san, who is a MC of this event, kindly shared a photo on Twitter.
In this meetup, new technical words such as digital twin and 2Dimages to 3Dmodels were showed. Such new story made me feel a new possibility of Babylon.js. Most of attendees on this meetup were new to Babylon.js. If you have interested in BJS, let's join discord of Babylon.js JAPAN!!