12/08/2018, 15:52

Tìm hiểu WebVR với A-Frame phần 1

Tìm hiểu Web VR với A-Frame. Thực tế ảo hay còn gọi là thực tại ảo (tiếng Anh là virtual reality, viết tắt là VR) là thuật ngữ miêu tả một môi trường được giả lập bởi con người. Các môi trường giả lập này là hình ảnh do con người chủ động thiết kế qua các ứng dụng phần mềm chuyên dụng, được ...

Tìm hiểu Web VR với A-Frame.

Thực tế ảo hay còn gọi là thực tại ảo (tiếng Anh là virtual reality, viết tắt là VR) là thuật ngữ miêu tả một môi trường được giả lập bởi con người. Các môi trường giả lập này là hình ảnh do con người chủ động thiết kế qua các ứng dụng phần mềm chuyên dụng, được hiển thị trên màn hình máy tính hoặc thông qua kính thực tại ảo nhằm đem lại những trải nghiệm thực tế nhất cho người xem như họ đang ở trong chính không gian đó. Để gia tăng tính trải nghiệm môi trường, các môi trường giả lập đều được tích hợp thêm giác quan khác như khứu giác (âm thanh).

Có rất nhiều "ông lớn" tham gia phát triển trong lĩnh vực này:

  • Facebook React VR
  • Valve Software Openvr
  • Googlevr Gvr nAdroid Sdk
  • Unity Technologies EditorVR
  • Samsung Gear VRf

Thị trường vr đang ngày càng nóng, không những ngày càng mở rộng lĩnh vực thiết bị VR như Oculus, Google Cardboard - Daydream, HTC Vive, Microsoft HoloLens ... với những thiết bị đem lại trải nghiệm tốt nhất cho người dùng, mà còn mở rộng sang cả thị trường WebVR. Các nhà phát triển đang ngày càng cố gắng đưa VR tiếp cận dễ dàng hơn với mọi người.

Có rất nhiều cách để tiếp cận với công nghệ VR. Phát triển từng ngày, hàng loạt skd để có thể làm việc với VR. A-Frame là dự án mã nguồn mở nhằm mục đích thiết kế WebVR dễ dàng hơn của Mozilla. A-Frame tạo với mục đích dễ sử dụng, dễ phát triển và dễ tiếp cận. Nhưng không vì thế mà trải nghiệm người dùng lại kém chất lượng. Chúng ta có thể viết code bằng html, javascript để tạo ra một ứng dụng phiên bản WebVR. Với sự hỗ trợ và phát triển mạnh mẽ từ Mozilla, A-Frame có nhiều ưu điểm mạnh mẽ và nổi bật:

  • Tạo - phát triển dễ dàng: chỉ cần sử dụng javascript, html để tạo ra một web vr, mọi thứ trở nên đơn giản, không cần phải cài đặt, thiết lập cầu kỳ.
  • Cú pháp dễ hiểu, dễ bảo trì: Sử dụng các cặp thẻ HTML, từ đó giúp nhà phát triển dễ dàng bảo trì, tái sử dụng. Không cần phải học thêm các ngôn ngữ khác mới có thể làm được.
  • Đa nền tảng: Đáp ứng được các nền tàng, các thiết vị VR khác nhau như Vive, Rift, Daydream, GearVR .... Không những thế, A-Frame còn hoạt động tốt trên các thiết bị thông dụng như máy tính hay điện thoại di động.
  • Quản lý component, entity là một framework sử dụng three.js làm core, A-Frame chia thành từng cấu trúc thành phần nhỏ, di động, dễ dàng tái sử dụng. Base là html nên chúng ta có thể thao tác bình thường với Javascrip, DOM API, tận dụng hết các tính năng của WebVR và WebGL.
  • Hiệu năng cao, dễ dàng nhúng các bên thứ 3 vào: chúng ta có thể dễ dàng sử dụng A-Frame cùng với các thư viện của bên thứ 3 chẳng hạn như React, Vue.js, d3.js, Ember.js, Jquery ... Còn nhiều những ưu điểm nữa, chúng ta có thể xem thêm tại đây Features
  • CORE API: Entity, Component, System, Scene, Animations, Mixins, Asset Management, Globals, Ultils.
  • COMPONENTS: Các thành phần như Camera, Model, Controls, Materials, Light, Sound....
  • PRIMITIVES: Bao gồm các element như camera, hình khối (box, cylinder, circle, sphere), media (video, image, sound) ...

Ở phần này chúng ta sẽ chỉ tìm hiểu một số tính năng cơ bản, tiếp xúc với đối tượng, cú pháp đơn giản của A-Frame thôi nhé             </div>
            
            <div class=

0