Skip to main content

JavaScript Libraries and Flow Charts

This sprint we focused on the laying the groundwork for the project and writing the design document.  For the design document, I outlined the Technical Requirements, Technical Features, Interaction Features, and created a user experience flow chart (~4-5 hours).  The rest of the sprint was spent testing the JavaScript packages we plan to, or are interested in, implementing in the project (~4-6 hours).  

Creating the user experience flow chart took a few iterations as we weren’t certain of the final gameplay.  The current version is fairly linear, but the gameplay is straight forward to make it easy to pick up and play.  


A part of the final user experience flow chart.


The packages I tested for our project were aframe-extras, aframe-physics, and aframe-click-drag-component.  ‘Extras’, as the name suggests, adds some extra functionality to A-Frame, including controller support, ‘Physics’ adds a physics system, while ‘Click-and-Drag’ is supposed to add mouse click and drag support for objects, but I was never able to get it working while testing, so we will likely have to find another option.  I also investigated a few more libraries that could come in use as we continue development:

  • Three.js: the 3D infrastructure for JavaScript that A-Frame is built on.  Using this package will allow for some powerful manipulation of 3D objects in our scenes.
  • Socket.io: supports the implementation of multiplayer servers.
  • Networked A-Frame: A more powerful, A-Frame specific version of Socket.io that has some added features such as voice chat and cross-play support.

Unfortunately, not having a working click and drag system made it difficult to test any modular components, so I was not able to get far with that this past week.


Comments

Popular posts from this blog

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...

Building the Shelf and Chairs

With the final submission looming closer, most of my effort was directed at replacing some hard-coded game-play functionality with dynamic data from the Builder and Finder systems (~3 hours), assisting my team with issues they encountered (~2-3 hours), and getting the shelf and chair ready to be built by the players (~8 hours). The Builder and Finder systems still had a few hard-coded values from the Beta build of the project that were specific to constructing the table, so I worked on replacing those with the data that is contained in the instructions arrays that Priscilla and Maxime created this week.  I was initially have problems accessing this array before I discovered that JavaScript arrays can be accessed by string, which simplified it a lot.  Below is an example of the before and after of this process. // Before socket . on ( 'setFurn' , function ( data ) { this . current = data . id ; // Where data.id was always "table" this . step = ...

Controllers and Game-state Management

The two issues I worked on this past week were getting game-pad controllers working with our project (~6 hours), and general work on the game-state systems to iron out some of the kinks and add some more functionality (~3-4 hours).  Unfortunately neither of these tasks proved 100% successful due to some set backs. The game-pad controllers are so close to working, movement and look controls are fully functional, but I cannot get the Super Hands components to pick up the button events from aframe-extras.  The easiest way to see this is by looking at some code: <!-- Camera --> <a -entity id= "rig" movement-controls position= "0 0 0" > <a -entity id= "camera" camera wasd-controls= "acceleration: 125" look-controls= "pointerLockEnabled:true" position= "0 1.6 0" capture-mouse st...