A project sponsored by the Dhakira Centre of Heritage Studies at NYUAD.

Install Node dependencies: if you haven't already installed Node.js, visit the site below and lay it down https://nodejs.org/en/download/

next, open terminal or cmd and install the http-server module globally on your machine:
sudo npm install http-server -g

To run server:

Go to repo:
cd 3D_how

run simple http-server:
python3 -m http.server [port#]

Running a simple server is necessary as some of the models are only displayed in the website if its hosted on a simple local server.

Some useful tutorials and resources I have relied on along the way:

• Babylon's Tutorial: https://doc.babylonjs.com/babylon101/about101

• TutorialsPoint : https://www.tutorialspoint.com/babylonjs/index.htm

• https://doc.babylonjs.com/how_to/load_from_any_file_type

• https://www.youtube.com/watch?v=3D6BtdMnnQI

• GamesfromScratch Tutorial Series: https://www.youtube.com/watch?v=X_a_PyV_wt4&list=PLS9MbmO_ssyCT1KHSi1GYX73ayv_9GusY
  https://www.gamefromscratch.com/page/BabylonJS-Tutorial-Series.aspx

• https://medium.com/@babylonjs/exporting-3d-content-for-babylon-js-76cb71a2df01

• Babylon's Medium Page: https://medium.com/@babylonjs

• Babylon's sandbox to play around with models: https://sandbox.babylonjs.com/

• Floating Water Example: https://www.babylonjs-playground.com/#L76FB1#49

• Simple Search App in React: https://medium.com/developer-circle-kampala/how-to-create-a-simple-search-app-in-react-df3cf55927f5

• React Slider: https://sghall.github.io/react-compound-slider/#/getting-started/tutorial

• Learn how to use Agisoft Metashape and Blender for photogrammetry and 3D model editing.
• Learn how to create a backend (probably using Node.js)to deal with the "database aspect" of the project. -Learn how to incorporate user interaction to a Babylon project.
• Continue Babylon.js self-learning and apply changes to project as learning progress continues.

Robert's Comments:

• Receive information to add to the website via Google Drive.
• We will have several different models, each with its own "playground" mode to interact with.
• Start working on adding different layers of interaction. Click on hotspots to get information and see videos about the boat.
• For Later: historical pictures processed in a 3d way, depth of the picture, timeline scroll bar to change background over time.