Blog Post for Week 7 (5/11-5/17)

Posted by VR Capstone Team 1 on 5/17/19

Update on code, links to relevant code added this week

There are three key components of our project.

  1. Server
  2. Webpage on the computer
  3. Magic Leap page

Server (app.js)

On the server we completed the following components:

  • We added support for cone. To do this we first need to find the shape to link to in the source of the ml-model. Since we later added lighting we eventually switched to glb files. This glb file for cone was created using blender (more detail of how the final glb files are create can be found in the bullet for lighting in this section). Positioning the cone was found to be close but definitely not the same as the cylinder. Therefore understanding how to convert the equation to the cone required a lot of trial and error to discover the right mappings of values.
  • We added the support for ellipsoid. To this we use the sphere glb file which contains lighting (more detail of how the final glb files are create can be found in the bullet for lighting in this section). We can use the sphere glb file because an ellipsoid is a stretched out sphere in the x, y, or z directions. The most difficult thing we found with the ellipsoid was understanding the mapping of equation parameters to model-scale parameters within the ml-model. We have understood and finished this mapping. We also worked on the positioning of ellipsoid which is different that any other shapes than we have used because it can be elongated in x, y, and z at the same time.
  • One of the largest contributions this week was adding "lighting" or more specifically texture. To do this we needed to create the shape in blender and add texture within blender. Then we export it as a fbx file. Then using a online converter, we convert it to a glb file. Then we open this glb file with 3D viewer and enable the texture. Then we switch our fbx files in the source of the ml model with this glb file. We do this for all our shapes: cone, sphere, and cylinder.

Webpage on the computer (index.html and index.js)

We made the following changes to the web interface:

  • Spent a significant amount of time improving the UI of the web interface. One of the points of feedback we got last week was to improve the interface to make EasyMath feel more like a real app. That is why we spent such a significant amount of time on this point. More specifically, we improved the css styling to make the EasyMath web interface look more professional. We did the same for all the pages of the lesson plan as well.
  • Added the cylinder to the lesson plan with the sphere.
  • Added the ability to create and delete ellipsoids and cones equations.

Magic Leap page (magicleap.html)

We made the following changes to the magic leap page:

  • We switched from fbx to glb files so that textures are embedded within the file that is linked to in the source of the ml-model tag.
  • We tested to ensure that our current code within magicleap.html supports the creation and deletion of ellipsoid and cone.

Demo

Below is the video of our current progress.

Plan for next week

Our plan for next week is to finish:

  1. Ability to interact with the cones and elipsoids. This means moving and resizing the cone and ellipsoid on the Magic Leap.
  2. Fix cylinder bug, if rotate the cylinder then can't move in z direction. This is a bug we discovered recently and will work hard to fix this week.
  3. A brand new lesson plan for the cone
  4. Improve the magicleap UI so it has more necessary information about current state, like current radius of the shapes.
  5. Increase the font size on the web interface and change the font color.

What every member did this week and will do next week

Our team believes we work more efficiently in pairs. Therefore, we paired into the following pairs:

  1. Matthew and Simon
  2. Esteban and Tanuj

Since we are in pairs each person completed the work together. Matthew wrote the blog. Simon, Esteban, and Tanuj provided content to the blog as well.

The first team (Matthew and Simon) worked on the changes to the Magic leap page as described in the previous sections. The first team also made all the changes to indicated in the app.js section above. This next week, team 1 will implement the first two next week's tasks.

The second team (Esteban and Tanuj) worked on the changes to the index.html and index.js as described above and the parts of the server to ensure their index changes don't break anything on the server side. The second team will complete the last three tasks from the next week section above.

Both teams worked together to film the demo video.

Blocking Issues

We have no immediate blocking issues.