Virtual Reality: CoSpaces & ISS

Today we are going to learn how to use the CoSpaces Edu platform to create Computer Generated Imagery (CGI) Virtual Reality experiences.

We will be representing our High School, Fray Diego Tadeo, and we will import a model of the International Space Station.

What is Cospaces?

CoSpaces is a web application for creating computer-generated Virtual Reality environments with a certain level of interactivity.

This is achieved by programming the objects we introduce using block-based coding.

How to access CoSpaces for the first time

Versión PC (Navegador)

Open your web browser and go to the CoSpaces website.

Click on the «Sign Up» or «Register» button to create a new account.

Now log in as a student:

Enter the code provided by your teacher and click on Continue:

Join your teacher’s class:

Tablet version (iPad)

Go to the App Store and search for the application:

How to access each day:

Click on «Log in«:

Fill in the required information, including your email address, password, and any other necessary details.

Scene creation

Creation of a 3D world

The first activity we are going to do is create a 3D Space.

Click on ‘Create CoSpace‘:

And now select ‘3D Environment‘ and ‘Empty scene‘:

Let’s now try the options at the bottom. First, those for the Scene (1), ground image (2), and background sound (3)

Add an Environment

We start with the Scene (Environment): Select one:

Insert an image

Now, let’s insert an image. Go to Google Maps and search for IES Fray Diego Tadeo González. Click on the ‘Layers’ icon:

Now, zoom in using the mouse wheel until you see the entire School grounds, and take a screenshot.

Save the screenshot with the name ‘IES Fray Google Maps’

Now, go back to CoSpaces. Let’s import the image we just saved. Go to the Environment tab (1), and then to the Floor Image tab (2):

Once the image is selected, it appears on the floor of your virtual world:

It’s time to build the buildings!

Add buildings

In the Library tab (1), select Building (2), and then choose the Cube (3):

Drag it into your scene:

If you right-click or double-click now, many more options will appear:

Click on Transform to adjust the rotation angle (Z):

To change the size, make sure that both upper controls (rotate and move) are disabled:

Don’t forget that all buildings seem to have the same orientation:

You can use the Duplicate option to save time:

Continue with the rest of the buildings:

Add vegetation

Try adding trees now:

Add characters

Now add the students from the class:

Add text

Now try inserting text and placing it over an object:

Character animation

Select one of the characters and double-click with the mouse to display the menu:

Try the different Actions.

Now let’s activate it to be able to add programming code. Double-click and select ‘Code,’ then ‘Use in CoBlocks‘:

Programming in CoSpaces

If you click on the programming button (Code), you will see an environment similar to Scratch:

Here is an example:

Here is another slightly more elaborate example:

Do you feel like programming?

Make sure the camera is in the position you want:

Click on ‘Play’ in the upper-right corner:

Here is the result:

Adding scenes

If you look at the left panel, we have one scene (you can change the name):

When you click on Play, you can move to the different scenes:

Creating a 360º virtual museum

If you insert images and text on the walls, you can create a small virtual museum with your projects:

Importing from Tinkercad

International Space Station

Let’s bring an object from Tinkercad to CoSpaces. In this case, a model of the International Space Station. Here I explain in detail what it is:

Open your design in Tinkercad, and click on Export

Select the format .OBJ:

After a moment (depending on the complexity of your design), a compressed (zipped) file will be saved to your computer:

If you double-click on the downloaded file, you’ll see what’s inside: an OBJ and a TINKER file:

Select them and drag them into your project folder:

Now go to CoSpaces and upload your design:

Here it is in our virtual world:

Let’s modify the scale. These are its specifications: 73 m long by 109 m wide.

From the Google Earth app, we can measure the actual surface area of our school:

Here we see that it is a bit longer than the soccer field:

Don’t forget to modify the Z angle to align it:

Here you can see a panorama of the whole set:

Tecnología E Ingeniería

Virtual Reality: CoSpaces & ISS

What is Cospaces?