Introduction to Metaverse 1

Create Metaverse in Spatial

1 Overview
Spatial is dedicated to helping creators and brands build their own metaverse spaces to share
culture. Empower users to leverage their beautiful spaces to share eye-popping content, build a
tight-knit community, and drive meaningful sales of their creative works and products. Spatial
also empowers users to create beautiful and functional 3D spaces they can mint as NFTs and
sell/rent to others looking to host mind-blowing experiences.

The followings are the tasks to be completed in this workshop:

• To create an account using Spatial.

• To create an avatar and explore a Spatial scene.
• To create and modify a scene using Spatial template.
• To create an empty scene and customize the environment.
• To search and download 3D models assets from Sketchfab.

2 Workshop Tasks
2.1 Create Spatial account

• Enter Spatial website: https://www.spatial.io and click “Log In”.

Figure 1: Spatial main page

• Select a login method.

Figure 2: Spatial login page

Introduction to Metaverse 2

Single Sign-On & Digital ownership

Single Sign-On (SSO) is an authentication method that allows users to sign into multiple
systems, platforms, or services using one set of login credentials. By simplifying the
authentication process, SSO improves user experience and increases security by minimizing
the risk of lost, forgotten, or weak passwords.

Digital ownership, on the other hand, relates to the rights a user has over digital assets, such
as digital content, software, digital currencies, or non-fungible tokens (NFTs). With the rise
of blockchain technology, digital ownership is becoming increasingly decentralized and
verifiable. This advancement allows for clear and transparent tracking of who owns what,
providing undeniable proof of ownership.

In essence, SSO pertains to access and authentication, while digital ownership relates to the
possession and rights of digital assets. Together, they are essential in the modern digital
landscape, playing crucial roles in enhancing user experience, security, and the management
of digital assets.

• Read and agree the terms & privacy and click the next button.

• Enter a name and click the next button.

Figure 3: Spatial register page Figure 4: Spatial register page

Introduction to Metaverse 3

2.2 Create avatar and explore the tutorial scene

Digital identity & MMORPGs

Digital identity refers to the online persona of an individual, organization, or device that
exists in the digital realm. It is a set of specific data attributes, including usernames, email
addresses, and personal preferences, that are used for identification and authentication.
Digital identities enable secure access to various digital services and help maintain privacy
and security in online transactions and interactions.

Massively Multiplayer Online Role-Playing Games (MMORPGs) are online games where
many players interact within a virtual game world. In MMORPGs, players create characters
(digital identities) and embark on quests, explore vast landscapes, engage in battles, and
interact with other players or in-game characters.

In essence, the digital identity in an MMORPG gives a player their unique presence and
characteristics within the game world, while the MMORPG itself provides a platform for
these identities to interact and evolve, fostering socialization, cooperation, and competition
among players.

• Customize your avatar.

• You can view your avatar from different angles by dragging the avatar.

• Click “Save”.

Figure 5: Create avatar page

Introduction to Metaverse 4

• Explore the tutorial scene, press WASD key to move.

• Follow the instructions to complete the tasks.

Figure 6: Spatial tutorial scene

2.3 Create new space using Spatial template

3D coordinate system

In game development, the XYZ axis system represents a three-dimensional space where game
objects reside. Each axis corresponds to a dimension of space:

X-axis: Often represents horizontal "width." Movement along this axis typically
involves left or right shifts.
Y-axis: Depending on the game engine, this may stand for vertical "height" (up or
down) or "depth" (forward or backward).
Z-axis: Conventionally used for "depth," indicating forward or backward
movement, but in some engines, it represents "height" instead.

The position of an object in this 3D space is determined by a set of coordinates (X, Y, Z). For
instance, an object at the center of the scene would be at (0, 0, 0). The XYZ coordinates also
underpin more complex transformations like rotation and scaling, which adjust objects around
or along these axes. This 3D coordinate system allows for a precise, mathematical description
and manipulation of game space
Introduction to Metaverse 5

• Click “Explore” and “Leave Space” to leave the tutorial scene.

Figure 7: Leave tutorial scene page

Key Components of Creating Immersive Virtual Environments

Virtual spaces in a game or a simulation consist of numerous elements, each contributing to

the creation of a believable and interactive environment.

Terrain:
The terrain forms the bedrock of your virtual world and often sets the stage for the visual
aesthetics and gameplay mechanics. It includes all geographical features like mountains,
valleys, rivers, or plains. Designing the terrain requires a balance between realism and
playability. It's not just about creating visually stunning landscapes, but also about shaping the
environment to facilitate gameplay, create challenges, or guide player movement. Terrains can
be sculpted manually, algorithmically generated, or some combination of both. Tools like
Introduction to Metaverse 6

heightmaps and textures are commonly used to enhance the visual appearance of terrains.

3D Objects:
The visual elements that populate your game world are 3D objects. These can be characters,
props, buildings, or anything else the player can see. Each 3D object is made up of a 3D
model, which defines its shape, and a texture or material, which dictates its appearance. 3D
models need to be detailed enough to look good but simple enough to perform well. Texturing
brings models to life, adding colors, patterns, and intricate details like rust on a metal surface
or the glint in a character's eyes.

Collider:
Colliders are an integral part of the physics system in a game, they define the physical
boundaries of an object. When two colliders interact, the game detects a collision. This
information can be used to implement game rules or trigger events, for instance, stopping a
character from walking through a wall or bouncing a ball off a paddle in a game of Pong.
Colliders come in various shapes (boxes, spheres, capsules, meshes) to accommodate different
object geometries. Complex objects may require multiple colliders for accurate collision
detection.

Lighting:
Lighting is a powerful tool in a game developer's arsenal. It can create mood, guide the player,
or even tell a story. It's not just about making a scene visible; it's about shaping a player's
experience. Lighting can make an environment feel warm or cold, scary or safe, real or
fantastical. Developers have access to a variety of lighting tools, including point lights,
directional lights, spotlights, and ambient light. Each has different properties and can be used
to create a specific effect. Realistic lighting also involves calculating how light bounces off
surfaces (global illumination) and how objects cast shadows.

Skybox:
A skybox is a method of creating backgrounds to make a 3D environment larger than it
actually is. It's often a panoramic image projected onto a large cube or sphere that surrounds
the entire scene.

Particle Systems:
These are used to create effects like fire, smoke, rain, or magic spells.

Sounds:
Audio is also an essential component, providing environmental sounds, character dialogues,
Introduction to Metaverse 7

music, and sound effects to enhance immersion.

UI Elements:
These are on-screen displays providing information to the player such as health status, score,
maps, or menus.

• Click “Create a Space”.

Figure 8: Spatial main page

• Select a gallery template.

Figure 9: Create new space page

• You will be in a space made with template.

Figure 10: Gallery template page

3D objects (Polygon/Mesh) and Texture

3D Objects:
These are the visual elements within a virtual environment, such as characters, buildings,
trees, or any other entity the player can interact with or see. At their core, these objects are
comprised of polygons, most commonly triangles, which when connected together form a
'mesh'. This mesh is essentially a digital sculpture of the object, creating its shape and form.
Introduction to Metaverse 8

The level of detail within this mesh can vary, with more polygons resulting in smoother and
more detailed objects, but also requiring more processing power.

Texture:
A texture is like a digital paint coat for a 3D object. It's an image file that is mapped onto the
surface of the 3D mesh to give it color, detail, and realism. Textures can depict simple color
variations, complex patterns, or intricate details like the grain of wood or the wrinkles on skin.
Additionally, other types of textures can be used to simulate properties such as shininess,
bumpiness, or transparency. When combined, 3D meshes and textures allow for the creation
of visually complex and realistic objects within a virtual environment.
Introduction to Metaverse 9

• Go to the wall and click “Upload Art”.

Figure 11: Gallery template page

• Select UPLOAD and click “Select From Your Device”.

Figure 12: Images upload page

Introduction to Metaverse 10

• Select an image from your computing.

You can download images from internet or download this poster:

https://metaverse-zh.comp.polyu.edu.hk

Figure 13: Select image page

• Upload the images in gallery one by one.

Figure 14: Gallery template page

Introduction to Metaverse 11

• To change color of template, click the menu button and select “Environment”.

Figure 15: Spatial scene menu

• Select a new color from environment settings.

Figure 16: Spatial environment setting page

Introduction to Metaverse 12

• Try to create a new space with another Spatial template.

• To share your space, click the share button in the upper right corner.

Figure 17: Spatial share button

• Click the "Copy" button to copy the link of the scene and share it with others.

Figure 18: Spatial share page

Introduction to Metaverse 13

2.4 Spatial APP

• To install the Spatial App, go to your mobile app store and search for Spatial.

Figure 19: Google Play

• Open the Spatial APP and click the menu button > Your Spaces.

Speech volume increases or decreases depending on distance in the virtual space.

Figure 20: Spatial APP

x
Introduction to Metaverse 14

• Select and enter your space.

Figure 21: Spatial APP – Your Spaces

• Explore your space and invite others to join. Click microphone button to unmute.

Speech volume increases or decreases depending on distance in the virtual space.

Figure 22: Spatial APP and microphone button

Introduction to Metaverse 15

2.5 Create and customize your own scene

• Back to home page and click “Create a Space”.

Figure 23: Spatial main page

• Click Upload Custom Space to customize your own scene.

Figure 24: Create new space page

• You should see an empty scene like the one below.

Figure 25: Empty scene

Introduction to Metaverse 16

• Click the “+” button at the bottom.

Figure 26: Menu button

• Click “UPLOAD”.

Figure 27: Upload page

• Click “Select From Your Device”.

Figure 28: Upload page

Introduction to Metaverse 17

GLB Format:
GLB is a 3D model file format created by the Khronos Group as part of the glTF 2.0
specification. It is a binary file format that bundles all the assets necessary for a 3D model
(including textures, meshes, and other data) into a single, portable file. Because of its
efficiency and compactness, GLB has become a popular choice for sharing 3D models online,
particularly in web-based applications. Platforms like OpenSea, an NFT marketplace, utilize
the GLB format extensively. When it comes to minting NFTs, especially 3D art or virtual real
estate, the GLB format's balance of detail, file size, and compatibility makes it an excellent
choice.

• Select a 3D scene model. You can download a classroom scene here:

https://drive.google.com/file/d/1N-z-gOWf6JC_HygOxusn0paSthYHugA9/view?usp=sharing

Figure 29: Select file page

Introduction to Metaverse 18

• You can see the 3D model imported into your scene.

Figure 30: Spatial empty scene

• Click to select the 3D model and click “Set Custom Environment”.

Figure 31: Scene bottom menu

Introduction to Metaverse 19

• Select “Environment”.

Figure 32: Set Custom menu

• Once the 3D model is set as the environment, click “Looks Good”.

Figure 33: Customize environment scene

Introduction to Metaverse 20

• Import other 3D models into the scene.

You can click on the 3D model and adjust its size and position.

Figure 34: Customize environment scene

2.6 Download 3D modes from Sketchfab

• You can enter “Sketchfab” website to search and download some 3D models

https://sketchfab.com/

Some 3d models are charged, you can download free 3d models.

Figure 35: Sketchfab main page

Introduction to Metaverse 21

• Click “Download 3D Model”. You may need to log in to download.

Please choose a login method, such as Google.

Figure 36: Sketchfab download page

• Select and download the GLB format with the smallest file size.

Figure 37: Sketchfab download page

Introduction to Metaverse 22

• Upload the GLB file and adjust its size and position.

Figure 38: Spatial customize scene

3 Additional – Connect to Unity

◼ https://docs.spatial.io/getting-started