Trước đây, Flash của Adobe là xu hướng chủ yếu trong phát nội dung đồ họa và 3D trên nền tảng Web. Tuy nhiên Flash đã kết thúc và WebGL đã được phát triển mạnh mẽ để thay thế trong những năm gần đây.
Lần này ONETECH xin giới thiệu BabylonJS, một công cụ được khuyến khích dùng để tạo các ứng dụng 3D trên Web mà hiện tại công ty cũng đang triển khai trong các dự án 3D Web App của mình.
BabylonJS là gì?
BabylonJS là một công cụ 3D sử dụng Javascript hoặc Typescript do Microsoft phát triển.
Gần đây BabylonJS đã trở nên rất phổ biến với các bản cập nhật mới đã mở rộng rất nhiều chức năng, và đã có thể hỗ trợ cho WebXR.
Điểm khác nhau giữa BabylonJS và ThreeJS
Có rất nhiều Framework WebGL trên thị trường hiện nay. Công nghệ nổi tiếng nhất là ThreeJS? sự khác biệt giữa BabylonJS và ThreeJS là gì? Tại sao BabylonJS được nhắc đến nhiều hơn? Tôi xingiải thích về những điều này.
ThreeJS là một thư viện sử dụng WebGL để hiển thị 3DCG trên web.
Có chức năng tương tự như BabylonJS; BabylonJS dường như được sử dụng chủ yếu trong phát triển trò chơi 3D trên Web. Nó không chỉ là một thư viện để hiển thị 3DCG, mà còn hỗ trợ Collider(Va chạm vật lý) và đổ bóng.
Nó có thể được kết nối với các HMD khác nhau như Oculus. Phát WebXR và hỗ trợ input vào bộ điều khiển HMD.
Điểm mạnh của BabylonJS
Có Editor trên Web
Khi sử dụng các framework để phát triển web, chúng ta thường nghĩ đến việc cài đặt các thư viện với npm và gọi các hàm của thư viện trong mã nguồn.
Ví dụ: Khi sử dụng thư viện React và phát triển giao diện người dùng, trước tiên phải cài đặt nó trong Terminal bằng lệnh “npm install react”.
Tiếp theo, kiểm tra giao diện người dùng đã tạo bằng lệnh “npm start”.
Nhưng phát triển ứng dụng 3D thì khác, cần một cái gì đó giống như cửa sổ Scene như của Unity và Unreal engine để bạn có thể quan sát được kết quả công việc của mình trong môi trường đồ hoạc 3D.
ThreeJS không có màn hình giống như giao diện người dùng, vì vậy nếu muốn kiểm tra nó, cần phải làm mới trình duyệt của mình. Ứng dụng 3D sẽ mất nhiều thời gian vì thường thiết lập nhiều vật thể và màu sắc.
Mặt khác, BabylonJS có Editor trên web, có giao diện người dùng quen thuộc cho người dùng Unity hoặc Unreal. Có thể sử dụng BabylonJS ngay lập tức mà không cần phải cài đặt thêm bất cứ thứ gì.
Sửa đổi mã nguồn hoặc nội dung được phản ánh ngay lập tức, vì vậy tiện lợi hơn khi không cần phải làm mới lại trình duyệt.
https://playground.babylonjs.com/
Đa nền tảng
Đối với các ứng dụng web, BabylonJS hỗ trợ các trình duyệt trên PC và thiết bị di động, cũng như HoloLens2 và Oculus.
Oculus hỗ trợ ThreeJS và Aframe, nhưng HoloLens2 chỉ hỗ trợ BabylonJS.
HoloLens2 và BabylonJS đều là của Microsoft, vì vậy chúng có tính tương thích rất cao. Các tính năng của HoloLens2 như theo dõi bàn tay, nhận dạng giọng nói, v.v. có thể được sử dụng với BabylonJS.
Bạn có thể trải nghiệm quá trình phát triển Hololens với babylonJS tại Github sau đây.
https://github.com/iwaken71/babylon_hololens_piano
Hỗ trợ AWS
Dịch vụ AR / VR của AWS là của Sumerian, nhưng đã được thông báo rằng nó sẽ kết thúc vào ngày 23 tháng 1 năm 2023. Thay vào đó, AWS sẽ có thể phát triển các ứng dụng VR / AR kết hợp với BabylonJS và Amplify.
Hiện tại, AWS cung cấp một thư viện cho BabylonJS được gọi là AWS SDK cho Javascript.
Sumerian Hosts in Babylon.js – Amazon Sumerian
Mô hình 3D có thể được lưu trữ trong Amazon S3 và được đọc từ BabylonJS để hiển thị mô hình 3D. Nó cũng có thể được công khai cho toàn thế giới bằng cách sử dụng CloudFront và Route53.
AWS cũng cung cấp Avatar miễn phí và BabylonJS sử dụng dịch vụ AWS Polly để ghi lại giọng nói của người dùng và tự động phản ánh chuyển động của miệng, cử chỉ và giọng nói của Avatar.
Phản ánh cử động Avatar của AWS Polly.
→Các ứng dụng web thường được vận hành trên AWS và BabylonJS có hỗ trợ AWS chính thức dễ dàng tích hợp và quản lý chi phí.
Có thể sử dụng Typescript
Có thể không phải là một lợi thế lớn, nhưng các Framekorks khác thường sử dụng Javascript. Với Typecript và Javascript, thì Typescript là ngôn ngữ dễ hiểu hơn.
Trong bài viết này sẽ không so sánh chi tiết giữa Javascript và Typescript, nhưng lý do Typescript dễ hiểu hơn là vì biến số được tổ chức rõ ràng. Các loại cơ bản không chỉ là Integer(Số nguyên) ,String (Chuỗi), mà còn là Camera、Sphere(Hình cầu)、Material(vật liệu)、Light( ánh sáng) v.v., được định nghĩa rõ và dễ quản lý. Và Typecript là sản phẩm của Microsoft, nên có tính tương thích cao.
Mặt khác, Javascript không có kiểu biến số, vì vậy có nhiều kiểu và lớp mới cần phải học để lập trình 3D.
Tổng kết
BabylonJS vẫn là một công nghệ mới so với các framework khác. Đồng thời, công nghệ và ứng dụng trên WebXR cũng đang phát triển. Trong tương lai, tất cả các ứng dụng sẽ được sử dụng trên Web.
Tôi tin rằng WebXR bắt đầu sẽ phổ cập từ các trò chơi 3D. Tuy nhiên, vì chúng ta đang ở trong thời đại 5G, tôi nghĩ WebXR cũng sẽ phát triển trong nhiều ngành công nghiệp khác.
Có một số thư viện cho WebXR, nhưng BabylonJS có độ ổn định cao vì Microsoft đang nỗ lực rất nhiều để phát triển. Microsoft cập nhật thư viện hàng tháng để sửa lỗi. Một ưu điểm lớn khác là dễ dàng tích hợp các dịch vụ khác (Azure, AWS, Hololens2). Tôi cho rằng nên sử dụng BabylonJS để phát triển các ứng dụng 3D cho web.
Tuy nhiên, một số người có thể gặp rắc rối vì họ không biết bắt đầu phát triển WebXR từ đâu. ONETECH có rất nhiều kinh nghiệm sản xuất WebXR bao gồm 3D web và WebGL.
Một trong những điểm mạnh của chúng tôi là chúng tôi có các nhà thiết kế và lập trình trên mô hình 3D giàu kinh nghiệm, chúng tôi cũng các kỹ sư có thể tạo WebGL cho 3D web.
Kết quả phát triển XR của ONETECH: https://onetech.jp/works-category/ar-vr-mr-jp
Bên cạnh đó, ONETECH đang tập trung vào phát triển phần mềm XR tại Việt Nam. Vui lòng liên hệ với One Technology để được tư vấn về các giải pháp công nghệ phù hợp với doanh nghiệp của bạn.
