Build a Virtual World!

in less than an hour

Introduction

Virtual Reality is a rapidly growing technology with the potential to change the way we experience the web as a whole. With a huge number of applications, it is useful for both fun activities as well as serious research for the benefit of the open web.

Help bring this new kind of open technology to the web by learning and using an awesome open source web framework, A-FRAME, with HTML! Lead your Club to create Virtual Reality experiences that plays right in your web browser and is supported by Vive, Rift, desktop and mobile platforms. If this is your first time running a meeting check out the Great Meeting Planning Guide before getting started.

Your Mission: learn the basics of A-Frame so that your Club can create a virtual version of your University. Are you ready?

Introduce Web VR & A-Frame

project name
New

This activity will help your Club build your first VR experience! But first you need to get your members excited about Web VR and A-Frame.

WebVR is an experimental JavaScript API that provides access to Virtual Reality devices, such as the Oculus Rift, HTC Vive, Samsung Gear VR, or Google Cardboard, in your browser.

A-Frame is a web framework for building virtual reality experiences. It was created by Mozilla VR to make WebVR content creation easier, faster, and more accessible.

A-Frame lets you build scenes with just HTML while having unlimited access to JavaScript, three.js, and all existing Web APIs. A-Frame uses an entity-component-system pattern that promotes composition and extensibility. It is free and open source with a welcoming community and a thriving ecosystem of tools and components.

There are a few options for introducing your team to Web VR & A-Frame, take a look and choose the one that will work best for you and your club.


Share a slide presentation

Use this slide deck as is, or customize it to make it your own. Going through this will teach you everything you need to lead this activity with your club.

Intro to A-Frame Deck

Get Started

Now your Club is fired up and ready to go, we invite you to go through this A-frame getting started activity (it will take you less than an hour) either as individuals or together as a group and then and come back to start building your VR experience.

Activity's Slidedeck Facilitator

As the activity's facilitator open and share this slidedeck so your Club can go through the activity together.

Activity's Slidedeck

Fork our Repo Students

For going through the activity, students have to fork our GitHub repository and start working on the examples one by one. This requires you to be familiar with the tool Git and the GitHub ecosystem. In the Campus Clubs learning activities you can find two activities for mastering Git and learning how to contribute to Open Source on GitHub.


Fork

Now that you forked the repo, download it in your computer and open the example one by one, following the instructions in them and on the presenter.

Challenge

Now that you have completed the get started activity and customized the available examples it's time for you to build your own VR experience.

Build your University in VR

Combine what you just learned and build your University in Virtual Reality. A gray cube can be a building, a cylinder can be a tower building. Just use your imagination and combine all the A-Frame entities you just learned! You can build a part of your university (a classroom, the gym) or even the whole Campus! It's up to you and your imagination!

Bonus: Can't find the component you need? Take your skills and your contributions to the open web to the next level by building your own component.

Accept the challenge

    Fork
  1. Fork the Challenge's repo and download the repo into your computer.
  2. Create a new HTML file and name it after what you want to build. For example: AustriaUnibuilding.html.
  3. After you complete building your University in VR commit your changes.
  4. Open a pull request in our Repo.

Congratulations! You just learned and created a open VR web experience in less than an hour!

Are you ready for the next challenge on VR gaming? coming soon!