Skip to main content

Adding the Models and Socket.io

This week involved touching on a few different systems to fine tune existing modules as well as create new modules.  Two components that had the most focus were replacing the primitive models with the GLTF models Max created (~8-10 hours), and separating the living-room and warehouse into two separate HTML files as well implementing Socket.io to allow player game-mode selection (~4-5 hours). The rest of my time was spent on smaller functionality like player speed tweaks and consolidating a-mixins for the for their data to be move to the object JSON file (~2 hours)
https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiWbOzK0jaA6visJrl1eMlWexGo9_sXEfVXRq-MJq7oFLQAN2uS9SUfqsDVkjYKxb9AZtGsbt3jkSSuAYtvV9GV1sF8TDyjrK0Wb_9a0XUagH5gU5Z2EGpI2CUJHQW62cFXxqBD3_N5s6k/s1600/Alpha_Example.png
Alpha Table
Beta Table

Replacing the primitive chair pieces with their models proved to be far more difficult than anticipated, as usual.  The process should have just involved replacing the 'geometry' with the 'gltf-model' component and then adjusting the aframe-physics 'shape' components to create bounding boxes that fit the models, but there were some unexpected side effects.  First, since the shape component relies on 'half-extents' to create the bounding box, we needed to find the dimensions of each model in Maya and them to dimensions in Aframe.  The second issue I faced involved strange behaviours that the models exhibited when interacting with the physics system.  All the table legs behaved like they had very low centres of gravity and they could not be knocked over, but the table top was totally fine.  I eventually narrowed the issue down to the fact that the table leg model was not properly zeroed, so Max exported a new version for me.  Another issue with the models was that they were much more difficult to pick up and they oscillated when picked up and moved quickly.  This seems to have been mostly fixed by increasing the scale of the models, though it still occurs if the user quickly rotates the view while holding an object, so is something I am still working on.

Since we have two different environments that offer different gameplay I needed to separate the warehouse and living-room into two HTML files and then create a nexus room that allows players to select and navigate to either room. This meant I also had to recreate an normal HTML navigation link as an Aframe component.  As it turned out, this was quite simple:

AFRAME.registerComponent('navigate',
{
    schema: {
        url: { default: '' }
    },

    init: function ()
    {
        var data = this.data;
        var el = this.el;

        el.addEventListener('click', function ()
        {
            window.location.href = data.url;
        });
    }
});        

The next few days will be spent implementing the game system that will co-ordinate the two players as they construct the furniture. 

Comments

Popular posts from this blog

[FINAL] - Where to find our game

Hello future builders, we're 3 programmer-artists that make up the Seismic Octopus team: Mitchell Koch - lead programmer, game tester, researcher  Priscilla Lo - project manager, sound design, lead 2D artist, programmer, documentation  Maxime Vincent - lead 3D artist, lighting designer, game tester We finished this course in May 2020 with a final release of Build-a-Furniture available on GitHub: https://github.com/Areizza/Build-a-Furniture Although this semester was full of hardships and unprecedented times near the end, we got through it together and are proud to present our simple web-VR game. Check it out and let us know what you think! :)

Making Instructions

This week, I worked on creating all the instructions images for both the Warehouse and the Living Room. Although this was not a very difficult task, it was tedious to work on and took around 3hrs to complete. It was a challenge to adjust to our new schedules given the current circumstances and allot appropriate time to spend on each of our classes. The instructions in the Living Room show the current required furniture pieces and their quantities, which the Builder will need to communicate to the Finder in the Warehouse. See below for an example of pieces required for a table. On the other hand, the instructions in the Warehouse would show the symbols on the different furniture pieces that should touch in order to be combined, which the Finder will need to communicate to the Builder in the Living Room. See below for an example where the green heart marking should be made to touch the green circle marking. I will be putting the source link for these instructions into arr...

Catalogue, Sound Effects, JSON for Instructions

This week I updated the image for the catalogue and added it to the Living Room environment as an image plane (~2hrs). I am currently adding smaller clickable planes on top of it to represent the different furniture options to choose to build. A screenshot of this can be seen below. I also looked for some sound effects to use for user feedback (~2hrs) when pieces are combined together correctly, incorrectly, pieces are dropped, etc. These sound files have been added to the shared drive and will be implemented in the code in the next few days. Some example sounds can be listened to at the following links: https://freesound.org/people/NenadSimic/sounds/150879/ https://freesound.org/people/grunz/sounds/109662/ https://freesound.org/people/GabrielAraujo/sounds/242501/ https://freesound.org/people/kirbydx/sounds/175409/  I also worked on adding JSON for the builder.js and finder.js files to store the required information for the instructions (~1hr). An example o...