The AR learning app is an educational app that uses Augmented Reality technology to provide an interactive learning experience for students. The app allows users to learn about different animals or plants by placing them in a virtual world, where they can interact with them and learn more about their characteristics. The app uses augmented reality technology to overlay 3D virtual objects onto real-world images and videos. Students can use the app to learn about science topics through experiments, including chemical reactions and the effects of gravity on objects and similar many other concepts.
AR is a new technology that is being adopted by many developers and businesses. We have seen many examples of AR applications that have been developed. This AR learning application is built using the A-Frame framework. This app will help you learn how to create an augmented reality app using A-Frame and VSCODE, etc.
Please see below a sample solution kit to jumpstart your solution on the AR Learning Kit. To use this kit to build your own solution, scroll down to the Kit Deployment Instructions sections.
The library added in this section is primarily used to create this Immersive AR Learning project. The entire solution is available as a package to download from the source code repository.
For Windows OS,
Click on the button below to download the solution and follow the deployment instructions to begin set-up. This 1-click kit has all the required dependencies and resources you may need to build your AR Learning App.
Follow below instructions to run the solution:
For changing the images for your topics,
Create your own 3d images related to the themes that you would like to explain with AR features.
1. To add your 3d models, follow below procedure:
2. You can change the size of the 3d models by adjusting the scale values in "main.js" (eg:-scale: "0.2 0.2 0.2")
3. You can also change the voice assistant corresponding to the 3d image by changing the description name in "main.js" (eg:-description: "Earth")
4. Once changes are done, make sure to restart the application for the changes to be effective.
5. Now, you will experience your theme with AR in your Environment!
6. For more details or clarification please refer this Link
1. You can create your own 3d models by using open source IDE like unity3d, Blender, AutoCAD or you can get 3d models from open source websites given below
Note:- Kindly check the license of the 3d models before using them.
2. Make sure that 3d models should be in the form of ".gltf" format, if not so kindly change them to the respective format. You can refer to the below links to convert your 3d models in the ".gltf" format.
Visual studio code IDE is used for this development. It becomes easy to modify the code and the configuration with Visual studio code.
A-Frame is an open-source web framework used for building Augmented reality (AR) experiences. In the spirit of open-source software development, jQuery plays a vital role in community code contribution.
The below library could be used to create jQuery scripts and respective models.