Sidhya Tikku
Resume About Art Design Web UX
Sidhya Tikku Dihydrogen Earth 3D model
Dihydrogen Monoxide
This project was made during Spring 2022 for my Core 2: Interaction Studio class. In this project, we had to collect data and make a table using airtable. Then our professor randomly swapped our airtables. I inherited my classmate’s airtable which was about oceans and seas.
Ideation
My design was inspired by Google Earth as I wanted the user to interact with the water bodies instead of just looking at data. I also wanted the website to have a "scientific" feel with clear grid systems, hierarchy, clean typography, and most importantly, minimal design. The website is responsive with help of media queries. On mobile, the user can view the 3D model as an AR model in real life.
f1gif
Execution
After I inherited my Airtable data table from my classmate, it was a difficult task to code my JS files as I had never worked with APIs before. I'm using the Airtable API to fetch data from the data table. The JS functions are using principles of object-oriented programming with filters looking for a keyword after the div is pressed. I also made sure to make the functions with least lines of code.
screenshot screenshot screenshot screenshot
For the 3D model, I am using a model of Earth from Sketchfab. Using Sketchfab's tools, I was able to embed the model and features like hotspots. On Safari mobile, users can view the .USDZ file in AR with help of Quick Look and interact with the model in their surroundings.
View Project Live GitHub Repository