VR for Enterprise Developers

VR for Enterprise Course
Course Description

Designed and led by our highly skilled consultants, the Aquent DEV6 "VR for Enterprise" course offers a very unique opportunity for enterprise developers to get ahead in the VR and AR space. In only two full days, the course will thoroughly cover two cutting edge Web VR frameworks: React 360 and A-Frame. 

React 360 is built on top of React. It is optimal for creating 2D and 3D user interfaces and interactivity in 360 spaces on a PC, mobile, or VR device. 

Based on top of HTML, A-Frame is an ideal framework for building detailed 3D worlds and scenes. It is less geared towards user interaction than React 360. 

Through a combination of hands-on application and lecture, you or your organization will gain a comprehensive understanding of these cutting edge technologies. 

This course can either be offered at the location of your organization or the Aquent DEV6 Mississauga office. 

Cost
$999 CAD / $999 USD

Duration

2 Days 

Pre-Requisites

  • Understanding of HTML, CSS, and React
  • Some understanding of JavaScript
  • No prior understanding of A-Frame, React 360, and WebVR is required

Lab Work

  • Development Environment Setup
  • Writing Your First React 360 Application
  • Writing Your First A-Frame Application

Classes

Jun 24, 2019 - Jun 25, 2019 Mississauga LC or Client Location Register
Jul 22, 2019 - Jul 23, 2019 Mississauga LC or Client Location Register
Aug 12, 2019 - Aug 13, 2019 Mississauga LC or Client Location Register
Sep 9, 2019 - Sep 10, 2019 Mississauga LC or Client Location Register
Oct 14, 2019 - Oct 15, 2019 Mississauga LC or Client Location Register
Nov 11, 2019 - Nov 12, 2019 Mississauga LC or Client Location Register

Course Outline

Part 1: React 360 

Module 1: Introduction

  • Introduction to WebGL and WebVR
  • Three.js
  • 3D Coordinate System
  • What is React 360?
  • React 360 Features

Module 2: Environment Setup

  • Essential tools and plugins
    • NPM/Yarn
    • React 360 CLI
  • Local Development with React 360

Module 3: Code Structure

  • Index.js – Application code
  • Client.js – Runtime code
  • Static Assets – Application media
  • Index.html – Application mounting point
  • Main Components
    • View
    • Image
    • Text
    • Entity
    • VrButton

Module 4: 360 Images and Videos

  • Supported image and video formats
  • How to display Panoramic Images
  • How to display videos
  • Clearing background images and videos

Module 5: 2D Interfaces and 3D Models

  • Surfaces
    • Types of Surfaces
    • Rendering to a Surface
    • Modifying a Surface
    • Using Multiple Surfaces
    • Detaching a Surface
  • 3D Objects
    • Where to get 3D Objects
    • Entity Component
    • Mounting 3D Models
    • Locations
  • User Interfaces
    • Using Layout

Module 6: Audio

  • Background Audio
  • Sound Effects
  • Audio Controls

Module 7: VR Interactions

  • Button inputs
  • VR Buttons
  • Raycasters

Module 8: Native Modules

  • What are Native Modules?

Part 2: A-Frame

Module 1: Introduction

  • Introduction to WebGL and WebVR
  • Three.js
  • What is A-Frame?
  • A-Frame Features

Module 2: Environment Setup

  • Using Glitch
  • Local Development with A-Frame

Module 3: Primitives

  • What Are Primitives?
  • Attaching Components to Primitives
  • How to Register a Primitive

Module 4: Entity Component System

  • What is the Entity Component System?
  • Composition Over Inheritance
  • Breakdown of the ECS
  • A-Frame APIs Based on ECS
  • Benefits of ECS
  • How Does ECS Apply to A-Frame?
  • Declarative ECS
  • Basic Component Structure
  • Community Component Ecosystem

Module 5: Entities, Events and DOM APIs

  • What are Entities?
  • Retrieving an Entity
  • Entity Properties
  • Entity Methods

Module 6: Writing Components

  • How to Register a Component
  • Using a Component from HTML and JavaScript
  • Component Schema
  • Lifecycle Handler Methods

Module 7: System

  • How to Register a System
  • Properties and Methods
  • How to Access a System
  • Separation of Logic and Data

Module 8: Developing with Three.js

  • Relationship between A-Frame and three.js Scene Graphs
  • Accessing the three.js API
  • Working with three.js Objects

Module 9: 3D Models

  • Asset Management System
  • Loading 3D Models
  • Animating 3D Models

Module 10: VR Interactions and Controllers

  • Gaze-based Interactions
  • VR Controllers
  • Raycasters

 

Registration for DEV6 Training

Course Title


Dates: dates

Location: location

Price: price

DEV6

4 Robert Speck Parkway, Suite 240

Mississauga ON L4Z 1S1

Canada


Toll Free: 866.464.7790

Office: 905.897.7790

Fax: 905.897.9952

After pressing Register, someone from DEV6 will call/email to confirm registration details, answer questions and take payment.