Gift Sender

Inspiration

I was inspired to create this app because of the fact that some people are not able to celebrate the holidays together with their friends and family, and cannot exchange gifts.

What it does

This app gives you the ability to give presents to your friends and family virtually as an in-person alternative.

How we built it

I built it using three.js, sveltekit, and typescript. Threejs was used for the 3D rendering, Sveltekit as the web framework, and typescript as the front-end scripting language. I used 3D models from Sketchfab in the project.

Challenges we ran into

I ran into challenges for loading the 3D models using the GLTF format, because some of the materials were not compatible. I also spent a considerable amount of time optimizing the scene to make sure that it would run smoothly. I also ran into challenges setting the size of the canvases in the app, and integrating it with sveltekit.

Accomplishments that we're proud of

I'm proud that I was able to make the frontend working, and mostly I am proud of the 3D rendering. I find it surprising how the scenes are able to render so smoothly on the browser.

What we learned

I learned how to use Threejs, and I gained more experience in web development. I also learned how to use blender to correct the materials to make them compatible.

What's next for Gift Sender

I planned on creating a backend to make the application actually send gifts, but due to the limited time and the fact that I was working solo. I had trouble integrating Auth0 with sveltekit, and I also thought about using cockroachDB for storing the information about the presents. The project currently is quite plain, and should have more features such as a designated time to open the presents.

Built With

• sveltekit
• three.js
• typescript