Skip to content

Commit

Permalink
Update README.md
Browse files Browse the repository at this point in the history
  • Loading branch information
wesleysutrisna authored Nov 5, 2023
1 parent fd38f3d commit 2613541
Showing 1 changed file with 19 additions and 19 deletions.
38 changes: 19 additions & 19 deletions README.md
Original file line number Diff line number Diff line change
Expand Up @@ -4,55 +4,55 @@ _BlankDeadSnail_'s submission

## Inspiration

Immersio is a ecommerce platform focused on providing the most immersive shopping experience possible to the user.
The first branch of this project is a movie store realised with a 3D environment that allows to select and buy movies choosing from over 45000 entries.
Immersio is an eCommerce platform focused on providing the most immersive shopping experience possible to the user.
The first branch of this project is a movie store realized in a 3D environment that allows one to select and buy movies from over 45,000 entries.

We cannot wait to show you what we have in store for the future!

## What it does

The user is presented with a compelling 3D rendered environment where a small selection of the available movies is presented to them as posters.
The user can then select a movie, verify the details and buy it.
While the selections starts of random, and can be refreshed an infinite number of times, the user can also search for a specific movie by title or some keywords.
The user is presented with a compelling 3D-rendered environment where a small selection of the available movies is presented to them as posters.
The user can then select a movie, verify the details, and buy it.
While the selections are random and can be refreshed an infinite number of times, the user can also search for a specific movie by title or some keywords.

## How we built it

The project is made of different componets.
The frontend is a React application that uses Three.js library to render the 3D visuals in a canvas, allowing great flexibility in the camera movement and the rendering.
The project is made of different components.
The front end is a React application that uses the Three.js library to render the 3D visuals on a canvas, allowing great flexibility in the camera movement and the rendering.
The backend is a [Google Cloud Function](https://cloud.google.com/functions?hl=en) written in Python.
When the frontend need to retrieve the list of movies, it calls the backend, which in turn queries the [Google Cloud BigQuery](https://cloud.google.com/bigquery?hl=en) database.
It has has been pre-populated with the data from the [Kaggle dataset](https://www.kaggle.com/rounakbanik/the-movies-dataset), containing over 45000 movies.
When the frontend needs to retrieve the list of movies, it calls the backend, which in turn queries the [Google Cloud BigQuery](https://cloud.google.com/bigquery?hl=en) database.
It has been pre-populated with the data from the [Kaggle dataset](https://www.kaggle.com/rounakbanik/the-movies-dataset), containing over 45000 movies.
A quick script featuring the [pandas](https://pandas.pydata.org/) library cleaned up the data before the upload.
Since querying the database is a costly operation, if the operation is successful the backend will cache the result in a [redis](https://redis.io/) database, so that the next time the same query is performed the result will be retrieved from the cache instead of the database.
Since querying the database is a costly operation, if the operation is successful, the backend will cache the result in a [redis](https://redis.io/) database, so that the next time the same query is performed, the result will be retrieved from the cache instead of the database.

![Architecture](./.github/img/architecture.svg)

## Challenges we ran into

Getting each single part of the project to work was challenging a time.
Getting every single part of the project to work was challenging.

The backend proved to be very slow, so we had to implement a caching system to speed up the process.
Since we also wanted to have both a random and a search functionality, we had to implement a way to query both tipes of requests, including a way to seed the randomness.
Since we also wanted to have both random and search functionality, we had to implement a way to query both types of requests, including a way to seed the randomness.
The latter was achieved by using the MD5 hashing function.

The frontend was probably the most challenging part of the project.
Just understaing the innerworking of the Three.js library took a lot of time, and we had to learn a lot about 3D rendering and the different types of cameras and their settings.
The front end was probably the most challenging part of the project.
Just understanding the inner workings of the Three.js library took a lot of time, and we had to learn a lot about 3D rendering and the different types of cameras and their settings.

## Accomplishments that we're proud of

Although it may not be the most innovative project ever presented, we thing thet the final product is very polished and easy to use and test.
Although we ran into many struggles in the development of this project, we believe that the final product is polished and easy to use and test.
We are hosting it on a GitHub page, so anyone can try it out without having to install anything.

## What we learned

We learned a lot about 3D rendering and the Three.js library.
We also learned how to use the Google Cloud Platform, and how to use and query the BigQuery in less obvious ways and how easy it is to deploy Cloud Functions services after testing it locally.
We also learned how to use the Google Cloud Platform, how to use and query BigQuery in less obvious ways, and how easy it is to deploy Cloud Functions services after testing them locally.
Finally, it was the first time we used redis, and we learned how to exploit it to speed up the backend significantly.

# What's next for Immersio

The project could easily be expanded in the future.
More movies could be added, toghether with an integrated streaming service.
It would be possible to widen the scope of the project to include other types of products, like videogames, books or even general merchandise.
More movies could be added, together with an integrated streaming service.
It would be possible to widen the scope of the project to include other types of products, like videogames, books, or even general merchandise.
The 3D environment could be expanded to include more elements, like a shopping cart or a checkout counter.
Finally, it would be possible to add AI-powered shopping assistants to help the user in their virtual trip to the store.
Finally, it would be possible to add AI-powered shopping assistants to help the user on their virtual trip to the store.

0 comments on commit 2613541

Please sign in to comment.