TechnoVisual Games

Rogue Engine gives you the ability to very quickly set up an Augmented Reality scene that can be viewed on any device that supports WebXR. That means most recent Android phone or tablets most VR headsets that support passthrough. First make a new project in Rogue Engine. From the default scene make sure your Wi-Fi broadcast address is set to use https protocol. Then open the marketplace window. Scroll down the list until you get to the AR Base Project package. Install the package to your project. It will appear in the Rogue Packages directory. Navigate down to the ar base project directory and double click the Base AR scene. This is a basic AR scene - if you browse to your IP address on a compatible mobile device you will be able to select Start AR. Move the device backwards and forwards to calibrate the floor level and then select a position to place your scene object. And that's how we setup an AR scene with Rogue Engine. We'll cover how the code works in the next video.

A new chapter in the ArcVenture series is available! Since 1991 ArcVenture has provided an educational adventure for thousands of young archaeologists and historians. The new series, ArcVenture Online, takes us to the Bancroft Villa to discover the mysteries of the Ancient Romans in Britain. Players will walk around and investigate a dig site and travel back in time to meet the inhabitants of the Villa. Extra online resources are available for parents, teachers and students including Augmented Reality and Virtual Reality activities. ArcVenture Online is available for PC and PCVR from https://arcventure.online/downloads/a... and soon Android Mobile and Meta Quest - join the newsletter at https://arcventure.online to keep up to date with release dates or follow on X(Twitter) @ArcVenture1

This Autumn will see a new chapter in the ArcVenture series! Since 1991 ArcVenture has provided an educational adventure for thousands of young archaeologists and historians. The new series, ArcVenture Online, takes us to the Bancroft Villa to discover the mysteries of the Ancient Romans in Britain. Players will walk around and investigate a dig site and travel back in time to meet the inhabitants of the Villa. Extra online resources will be available for parents, teachers and students including Augmented Reality and Virtual Reality activities. ArcVenture Online will be available for PC, PCVR, Android Mobile and Meta Quest - join the newsletter at https://arcventure.online to keep up to date with release dates or follow on X(Twitter) @ArcVenture1

Rogue Engine enables you to attach a sound to an object in the scene. So let's make an empty object and rename it. We are going to create a new component to start the sound playing so, create a new Component asset and call it, Object Audio. Now double click the component to open it in your code editor. We need to reference the Three.js library at the top of the file as we want to add a property to the component that is a Three.Audio type. The "true" parameter in the property indicates that this will be positional audio so that the sound will seem to come from the object in 3D space. If we save our code and go back to the Rogue editor, we can drag and drop the component onto the Audio Background object. We will now see the objectAudio property we have defined is "unset". So lets find some audio to go into this component. You can import an mp3 file into your asset panel and then drag and drop it into the objectAudio property. Now we can go back to our code. We can make the audio play as soon as the scene is loaded by adding the following to the Start method. First check that the objectAudio property has been set. Then add the objectAudio to the object3D that this component is attached to. We can set the audio to loop if we want to, then play the audio. Save your code and go back to the Rogue editor. Now when we play our scene, the audio will play. And that's how to attach audio to an object with Rogue Engine.

Components in Rogue Engine enable you to add code to objects in your scene. The Rogue Engine framework is built on top of the Three.js library. Any object in a Rogue scene can have code attached to it to use the power of Three.js. These bits of code are called components. Here is a very simple example of a Rogue Engine component. You can use the default cube for this example. First right click in the Assets panel and create a new component. Components can be javascript or typescript. We will use typescript. Give it a name and confirm. That will create a blank component in the asset panel. If you double click this icon it will open up in your default code editor. If you don't have one installed I would recommend downloading Visual Studio Code from Microsoft. The blank component already has somethings set up. All components import the Rogue Engine The component already has its class Export set up and three methods, awake, start and update. For this example we just need the update method. We are going to rotate the cube in the scene so in the update method that runs each time the screen updates, we can write this.object3d.rotateY and then give it an angle. This is fine but we don't know how fast the scene is updating so if we want to keep the rotation consistent whatever speed the scene is running, we can ask Rogue how long since the last update and use that value. We get this delta value by reading RE.Runtime.deltaTime. So that's our code - save it and go back to the Rogue Editor. If we run our scene without the component attached to the cube, nothing happens. But if we add the component to the cube by dragging and dropping it and then run the scene, you will see that the cube rotates smoothly. So that's how you add a basic component to an object in Rogue Engine.

How to export 3D models from Blender so you can import them into Rogue Engine. Rogue Engine allows you to import 3D models into your projects and use them in your scenes, but where can we get suitable models from? Blender is a great way of making your own models or using downloadable ones and it's free to use from blender.org. In blender you can create from scratch or load existing 3D models. To export for Rogue Engine, select the model, make sure all the transforms are applied, and then go to Export from the File menu. Export GLTF 2.0, and in the Format area, select .glb format and include selected objects. Choose a name and export. That's all we need to do in Blender so let's load our Rogue Engine Project. We probably don't need the default cube so we can remove that. Now in the assets panel we can create a new directory for our models and then right click and select Import Assets. Find our model from the Open dialogue and hit Open. That loads the model into the project and we can just drag and drop it into the hierarchy panel and it will appear in the scene. We can now position it however we want. And that's how we import 3D models from Blender to Rogue Engine.

A whistle-stop tour of the Rogue Engine Interface and Workspace. The Rogue Engine Editor workspace has several different parts to it. Let's look at the important parts. On the left is the Hierarchy tab. This lists all the objects that are in the scene and selects them. The objects may be meshes,cameras or lighting. By right clicking you will get a menu where you can add more elements to the scene. Below the Hierarchy tab and scene editor, you will find the Project asset list. This will display all the assets that you have in the current project. It has the project directory structure on the left and the contents of each directory on the right. You can add directories and new assets by right clicking and selecting the asset type from the menu. The inspector tab on the right hand side will provide details of any object currently selected. You can see the type of object, change the name, edit it's position and set several options such as shadow casting and geometry details. You can also edit materials and components associated with the object from this inspector. In the top left of the workspace are control buttons which alter the way you move objects in the scene editor. The first three change the transform widget on the currently selected object - movement, rotation and scale. The next sets the snap grid size - hold shift while moving an object to get it to snap to the grid. You can toggle between using global or local space and also change the camera movement between rotating around the centre of the view and the view rotating around the camera. Next to the inspector tab is the skybox tab where you can set the properties of your scene's skybox background. Right at the top right of the workspace you will find a link which will run your scene in your default browser and next to that, the marketplace button will open up a list of all the packages you can download to include in your project. The account button next to that will take you to your account dashboard on rogueengine.io. When you are ready to test your scene, you can play it in the scene editor window by pressing the play button, then pause it or stop it to return to editing. If there are problems when your scene runs, you will see error messages in the console at the bottom of the workspace. The workspace also includes a menu where you can perfom many tasks such as creating new projects, changing editor preferences and build or publish your project. If you run into difficulties, be sure to visit the Docs, Resources and Community links from this menu. And that's your whistle-stop tour of the Rogue Engine Workspace.

Gets started quickly with Rapier Physics in Rogue Engine. To set up a Rapier Physics scene in Rogue Engine, from your project list select New Project. Choose a name and location for the project, hit Create and wait for the project files to be generated. When the default project appears, select the default cube and make it into a floor shape using the transform inspector. Now create a new Object 3D in the Hierarchy and rename it "Config". To download the Rapier Physics components, go to the Marketplace - the button is top right in the workspace. From the marketplace, scroll down and find Rogue Rapier Physics and install the package. When that's done, go back to your Config object and add a Rapier Config component by clicking on the Add component area in the inspector Select the floor object and add a Rapier body and Rapier Cuboid component. Set the type of the Rapier body to Fixed. Add a box to the scene and give it Rapier Body and Rapier Cuboid components Make sure the type is set to Dynamic Now test the scene by pressing play. And that's your basic Rapier Physics scene in Rogue Engine

Rogue Engine is a 3D Programming framework using Three.js as its core. But what does that mean? Rogue Engine provides a toolbox of visual tools to construct 3D scenes and games on Windows, Mac or Linux. It has a visual editor and scene constructor with a component system to allow you to add scripts to every object. The scripts can be written in Typescript or Javascript and are reusable from scene to scene with a drag and drop user interface. The games and scenes you create will run on any modern browser so you can run them on almost any type of game device, desktop, mobile or even VR headsets. The core of Rogue Engine runs on the Three.js library which is one of the most advanced browser based 3D systems available And best of all, you can download and use Rogue Engine absolutely free - just head on over to rogueengine.io

How to move objects around the Rogue Engine Scene editor. Download Rogue Engine from https://rogueengine.io/ Let's see how you can move 3D objects around a scene with Rogue Engine. Here is your Rogue workspace. On the left is your scene hierarchy where all the objects in your scene are listed. Select the default cube and you can see it selected in the Scene view. Select the Main Camera object and you will see a window showing what the camera is seeing. Let's go back to the cube and move it in the scene by clicking and dragging the arrows. The red arrows are the x axis, the green ones the y axis and the blue arrows are the z axis. We can change the position in the transform panel on the right too. Use the mouse wheel to move your view towards an object then right click and drag to rotate around. Select toggle camera mode to rotate the scene around the camera with the right mouse button. Hold shift and right click to move your view up and down and side to side. Rotate object with the rotate widget or change the rotation values in the transform panel. To preview your scene hit the play button at the top of the window. Press the square stop button to go back to the editor. That's how to move objects in the Rogue Engine Editor.

How to download and install Rogue Engine, the 3D game engine for the web. This video gets you from a standing start to your first scene in sixty seconds.