3D Modelling/Create 3D Models/JSON3D4Aframe
![](http://upload.wikimedia.org/wikiversity/en/thumb/c/cb/Json3d4aframe_water_molecule.png/220px-Json3d4aframe_water_molecule.png)
JSON3D4Aframe is an AppLSAC to create 3D models for AFrame or AR.js. The OpenSource tool was created as support for the 3D modelling learning resource about 3D modelling.
Learning Tasks
[edit | edit source]3D models can be create as Aframe model or AR.js model. The Aframe model is used for 3D models e.g. on a mobile device where the object can be explored by moving around in the 3D space, while AR.js is used for placing the 3D object in a video stream or VR headset.
AFrame
[edit | edit source]Start to explore the JSON3D4Aframe and create your first 3D model in AFrame. Select a pre-defined 3D model with the "Init 3D" button and check the model in the preview modes:
- Aframe 3D
- AR Marker 3D
- (optional) AR Geolocation - export makes sense if and only if you preview the model with a mobile device (smartphone) with sensor for a globlal satellite navigation system and if you preview the model at the geolocation which close the latitude and longitude where the 3D model is placed.
AR.js
[edit | edit source]3D models are displayed in the video stream of the webcam with a marker as a 3D reference point.
Hiro Marker
[edit | edit source]Print out the PDF with markers and use the Hiro marker in your webcam to display the 3D model. Pattern Source: Hiro Pattern from AR-Toolkit
- Water Molecule - Hiro Marker - Marker: PDF
- Cristal Lattice - Hiro Marker - Marker: PDF
- Planet System - Hiro Marker - Marker: PDF - by Ina Shashkova (2021) - see Wikiversity
- Snow Man - Hiro Marker - Marker: PDF
Kanji Marker
[edit | edit source]Print out the PDF with markers and use the Kanji marker in your webcam to display the 3D model. Pattern Source: Kanji Pattern from AR-Toolkit
- Water Molecule - Kanji Marker - Marker: PDF
- Cristal Lattice - Kanji Marker - Marker: PDF
- Snow Man - Kanji Marker - Marker: PDF
Start to explore the JSON3D4Aframe and create your first 3D model in AR.js.
- (Attributes of 3D Elements) Explore the geometric purpose of the attributes and play around with these attributes in JSON3D4Aframe
Explore Models
[edit | edit source]JSON3D4Aframe ("JSON 3D files fo(u)r AFrame") is a tool created for the Wikiversity learning resource about 3D models on marker.
- Select a pre-defined model with the red "Init 3D" button (see screenshot above).
- Check the preview of the 3D model in different output format.
- choose a sky in the Aframe settings and preview the 3D model with sky. Please wait a bit until the sky images (equirectangular images) are loaded in the background.
Create Models
[edit | edit source]- JSON3D4Aframe was created for the Wikiversity learning resource for compose a basic 3D scene with geometric primitive.
- For more advanced realistic 3D scenes you may want to check out the open source software Blender and export the 3D models there with the Blender2Aframe exporter[1] installed in Blender.
See also
[edit | edit source]References
[edit | edit source]- ↑ Alessandro Schillaci (2021) Blender to Aframe exporter - plugin for OpenSource 3D modelling software Blender - URL: https://github.com/silverslade/aframe_blender_exporter