Introduction
The best way to predict future is to invent it - Alan Kay
Meta means beyond and verse is universe or planet. So, the metaverse is beyond the universe. By 2026, 25% of people will spend at least one hour a day in the metaverse for work, shopping, education, social and/or entertainment, according to Gartner, Inc. By 2026, 30% of the organizations in the world would have products and services ready for the metaverse. Following in this year 2023, Gartner warns that the metaverse is still in the nascent stages and the visibility of long-term investments are uncertain, it predicts that by 2027, over 40% of large organizations worldwide will be using Web3, spatial computing, and digital twins to increase revenue through metaverse based projects. This clearly shows this technology is here to stay in long run, as it takes internet and web world to the next level of user experience and utilize the multidimensional space effectually.
I remember transition of user experience from keyboards (though before it we had punch cards), then to mouse, later to mobile, further to anywhere and anytime access though touch pads and now touch sensitive and in future spatial computing through sensors and glasses. To step into his virtual reality or mixed reality we can start taking the baby steps in building Webverse technology.
Business benifits of developing much deeper censorial immersive experience with the new generation technology, bringing in better user training, gamification, digitization and collaboration.
Tech Stack
Today's metaverse or XR including (AR/VR/MR) comprises of multiple emerging technologies that promise next level of interaction in the virtual and physical worlds. Below are the differences of the below:
- AR: Augmented Reality - Digital real world character in virtual world
- VR: Virtual Reality - Completely different virtual world
- MR: Mixed Reality - Combination of real and virtual world
Programming Languages
In general, C++, C#, HTML, Javascript, GIS and Python are used to develop Webverse apps. Few frameworks such as Unity, Unreal Engine, Blender, A-Frame, Three.js, Babylon.js and so on.
Cloud
The metaverse and cloud computing are inseparable and will remain interconnected. Building a metaverse is almost impossible without highly available and scalable premises and hosting grounds. As the metaverse matures, it will add more layers of complexity and it will need a solid base to hold on to the heavy replica and provide a seamless experience to the users without any integration hassles or other bottlenecks at the backend.
Spatial Computing
Spatial computing seamless integrate the virtual and physical worlds enhancing how we visualize, simulate and interact. This broadly characterizes the processes and tools used to capture, process and interact with 3D data. Components of spatial computing can include IoT, digital twins, ambient computing, augmented reality, virtual reality, AI and physical controls. Spatial computing is human interaction with a machine in which the machine retains and manipulates referents to real objects and spaces. As it is just not the display technology, but complex and computationally demanding "Sensor fusion systems".
Users interact with spatial computing applications through screens embedded on physical devices, VR headsets that mirror the physical world, mixed reality device or could be even through usual input devices that overlay data onto a view of the physical world.
Spatial computing mirrors how we interact with objects, people in the real world. There are two methods one of its through real time photography and creating 3D models. And the other is using AI techniques make sense of imagery. There are several papers published from Google's AI, NVIDIA's New AI, Microsoft AI, DeepMinds AI and so on.
To build this one can use mostly the above described programming languages. Yeah today we would see the integration with the VR devices, but it is not blocker for us from developing the Webverse (in simple terms as like any web applications).
Blockchain
The system that has a growing list of records (i.e. blocks) that are linked to one another is known as a blockchain. Fundamentally, the data stored in a blockchain must have the following characteristics:
- Immutable
- Unhackable
- Persistent (no loss of data)
- Distributed
These qualities are necessary to maintain the integrity of the blockchain and the security of the network within which the transactions occur.
The proof-of-work system makes it progressively more difficult to perform the work required to create a new block. This means that someone who modifies a previous block would have to redo the work of the block and all the blocks that follow. The proof-of-work system requires scanning for a value that starts with a certain number of zero bits when hashed.
Blockchain plays a vital role in metaverse development because the future of the web i.e Web 3.0 is all about the decentralization. It combines of many websites and platforms that may be accessed through a single browser. Also, on the metaverse blockchain, smart contracts are programs that may be used to automatically control the transfer of digital assets. The decentralized character of the blockchain technology with multi-nodes operates independently for synchronization. Specifically a blockchain powered metaverse would also make it fully independent and decentralized, allowing all users to participate, connect and contribute.
Example 1
Using the A-Frame we can have the below webpage created.
Note:
- environment : japan, there are other options as well like default, egpyt, forest and so on: https://supermedium.github.io/aframe-environment-component/#
- gltf images can be easily sourced this site : https://market.pmnd.rs/model/low-poly-farm
<html>
<head>
<script src="https://aframe.io/releases/1.3.0/aframe.min.js"></script>
<script src="https://unpkg.com/aframe-environment-component@1.3.1/dist/aframe-environment-component.min.js"></script>
</head>
<body>
<a-scene gltf-model="dracoDecoderPath: https://www.gstatic.com/draco/v1/decoders/;
meshoptDecoderPath: https://unpkg.com/meshoptimizer@0.16.0/meshopt_decoder.js;">
<a-assets>
<a-asset-item id="cyber_truck" src="https://vazxmixjsiawhamofees.supabase.co/storage/v1/object/public/models/ankou-with-cart/model.gltf"></a-asset-item>
<a-asset-item id="korrigan" src="https://vazxmixjsiawhamofees.supabase.co/storage/v1/object/public/models/korrigan-taning/model.gltf"></a-asset-item>
<a-asset-item id="house2" src="https://market-assets.fra1.cdn.digitaloceanspaces.com/market-assets/models/house-3/model.gltf"></a-asset-item>
<a-asset-item id="house3" src="https://market-assets.fra1.cdn.digitaloceanspaces.com/market-assets/models/low-poly-farm/model.gltf"></a-asset-item>
</a-assets>
<a-sky color="#ECECEC"></a-sky>
<a-entity environment="preset: japan;"></a-entity>
<a-entity position="3.5 0 -15" gltf-model="#cyber_truck"></a-entity>
<a-entity position="2 6 -14" rotation="0 -90 0" scale="1.25 1.25 1.25" gltf-model="#helicopter"></a-entity>
<a-entity position="0 0 -15" scale="9 9 9" gltf-model="#house"></a-entity>
<a-entity position="-14 0 -15" scale="7 7 7" gltf-model="#house2"></a-entity>
<a-entity position="14 0 -15" scale="7 7 7" gltf-model="#house3"></a-entity>
</a-scene>
</body>
</html>
Output:
Example 2
Using Babylon.js we can have the below we have default sample interactive webpage created.
Download: https://editor.babylonjs.com
For Mac OS requires explicit verification: https://www.lifewire.com/fix-developer-cannot-be-verified-error-5183898
 |
| Create a new project with default one player |
 |
| Default Code Created |
Below is the sample output:
We can have multiple players added and different keys for each, in later blogs we will look into more details of each of the framework.
Conclusion
Seeing the number of developments, patents and research in the field of metaverse and immersive visualization, one could confidently say we will in very much better state including the cost, security and performance.
What a time to be alive!
References and Credits
https://indianexpress.com/article/technology/crypto/8-things-you-cant-do-in-the-metaverse-a-look-into-this-new-virtual-world-8156570/
https://www.youtube.com/watch?v=VONPW9tTGJw&list=PLhzcBQ1X_V6w_DbD_kCMezizEpxfxtE7O&index=1
https://www.gartner.com/en/webinar/452064/1065306
https://medium.com/@Hackyroot/https-medium-com-hackyroot-happy-birthday-using-aframe-9d2f0d177853
https://aframe.io
https://threejs.org/examples/#webgl_animation_keyframes