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

[WEEK 6] Back from Reading Week

We got back from Reading Week and reviewed what each of us accomplished. Expected deliverables for this week include: moodboards for the Living Room and the Warehouse, basic recolouring for the Living Room, a completed final Warehouse environment, and a working spawning objects prototype.

Sprint 4 - Alpha Presentation and Furniture

This week, the team presented our proposal for our project as well as demonstrated the alpha build. In its current state, the living room and warehouse environments are at their most primitive states and will be developed further over time. In future plans, I will have to redesign the living room to allocate more space to the user. It's currently too small and claustrophobic, which makes it difficult for a VR user to have enough building space. I spent the days prior to the presentation polishing the design comps then producing OBJ files of the environments to insert into A-Frame. I did this by going back and forth between a-frame and Maya and resizing the scene until it was the ideal size. This way, Mitchell is able to simply drag and drop the obj into the project without having to tweak the transformations (~5hrs). Table Model with UVs Chair Model with UVs Shelf Model with UVs After the presentations, I began working on modelling the 3 pieces of furniture that pl...

Sprint 2 - 3D Modelling the Environments

This week's focus has mainly been on writing the design document and preparing for the alpha prototype (~2hrs). A great majority of the written sections in our proposal is complete while a large chunk of graphics remains to be developed in the coming week. The sooner the design document is complete, the better of an idea we have in how the project will turn out in the end.  On my end, I am responsible for 3D modelling the environments that will be used in the alpha demo. These are also necessary for producing design comps. The environments will be very low poly environments using primitive shapes and basic forms to form the rooms, nothing too extravagant. Below are a few screenshots of the environments in their current state: Living Room (~3hrs) that will be played in VR and the Warehouse (~4hrs) on desktop; all modelled in Maya. Warehouse Back Side Warehouse Front Gate Warehouse Top-Down View Living Room Back View Living Room Front View Living Roo...