💡 Inspiration
We all know how thought to under and the complex and difficult structures in chemistry. And we all have experienced online classes are monotonous, the concept taught is not retrainable and practical are most important for subjects like chemistry, etc which require physical practice and visualization
💻 What it does
Chem Learn is an AR-based web platform where students come across and learn about various complex chemical structures. Learn with the help of interactive 3D Models and AR. Chem Learn can help students achieve better results through visualization and full immersion in the subject matter.
🔨 How we built it
- React Js: For the frontend
- TypeScript: Frontend using React Typescript
- Firebase: For user authentication and database
- Three Js: For rendering 3D Models
- Tailwind CSS: For styling
Best Domain Name from Domain.com
- chemlearn.com
⛅ Use of Google Cloud
- We built Chem Learn's authentication system with Google Cloud's Firebase. We chose this because we wanted to make an application that was very very secure. We learned how robust & fast Google Cloud services are and seeing that Firebase had a free plan that was great for us student hackers, using Google Cloud was kind of a no-brainer. Additionally, Firebase Authentication provided a backend service, easy-to-use SDKs, and ready-made UI libraries, and the ability to authenticate using passwords, phone numbers, Google, Facebook and Twitter, and the like. Thus, implementation was easy and we are pretty sure we made it incredibly convenient for our users while keeping it secure.
- We are using Firestore as our primary database to store user login/sign up details and Chatroom conversations.
🧠 Challenges we ran into
The biggest challenge was to rendering the 3D model and adding AR functionality to them, which I overcome using three js and echoAR.
🏅 Accomplishments that we're proud of
Completing the project under the given time frame
📖 What we learned
Working with three js and using echoAR
🚀 What's next for Chem Learn
- Add Virtual Reality (VR) functionality
- Add more subjects and Customized 3D model
Built With
- echoar
- firebase
- firestore
- react
- react-three-fiber
- three.js
- typescript
Log in or sign up for Devpost to join the conversation.