Due to the coronavirus, learning has moved online. Although there are a lot of platforms out there that provide educational information, few use AR technology to improve the learning environment.

What it does

By going to our website, you can read about detailed descriptions about different chemistry-focused topics, and by clicking "view," scan a QR code that lets you look at the molecule from any angle with your phone's camera.

How we built it

  • echoAR - We uploaded and stored our 3D models on echoAR and used their QR codes for an augmented
  • experience
  • ReactJS - We built the frontend using ReactJS
  • Material-UI - A ReactJS UI framework that helped us make a good-looking website
  • Firebase Hosting - Used for hosting our website

Challenges we ran into

One of the main challenges we ran into while developing our website was finding different models to represent molecules. Many of them required payment or were unable to download. We also had problems implementing Firestore as our database for this project.

Accomplishments that we're proud of

  • A well-designed website using ReactJS
  • Incorporating echoAR into a website

What we learned

  • How to use echoAR to store models and create the AR experience
  • Using ReactJS to design a website
  • Using Firebase to host a website
  • A lot of interesting facts about chemistry!!!

What's next for MoleculAR

  • Implement a feature that allows users to add new information to the website
  • Add more information about different topics related to science
  • Possibly use surface-detection AR
  • Search bar
  • Implement Firestore

Our domain is

Built With

Share this project: