Khóa luận tốt nghiệp: Design and implementation of a cloud-based Metaverse system

Defined as a collective virtual shared space, the metaverse represents a new frontier where individuals can interact, create, and explore digital realms that blur the lines between the r

VIETNAM NATIONAL UNIVERSITY HO CHI MINH CITY

UNIVERSITY OF INFORMATION TECHNOLOGY

FACULTY OF INFORMATION SYSTEM

TRUONG VAN SY - 18521698

GRADUATION THESIS

INFORMATION SYSTEMS ENGINEERING

SUPERVISOR Ph.D NGUYEN THANH BINH

INFORMATION ON THE THESIS DEFENSE COMMITTEE

The thesis defense committee is established according to Decision No

¬¬ date DY the Rector of the University of

— - ChairmanP a - Secretary

ẤT iiccccccccecscscssssssssssssssssseeseesseseseeess - Member

I would like to express my sincere gratitude to the individuals andorganizations who have assisted and supported me throughout the process ofcompleting my thesis It is my continuous effort, coupled with the supportfrom the professors, staff and the collective efforts of the Ho Chi Minh City

University of Information Technology (UIT)

Furthermore, I deeply appreciate Ph.D Nguyen Thanh Binh, myinstructor, for his dedicated guidance and mentoring since my entrance intouniversity Particularly, he provided me with support and encouragementduring challenging times in the research process

Finally, I want to extend my gratitude to the faculty of the Information

System Department for dedicating their time and invaluable knowledge toimpart to me throughout my learning and research journey Despite myefforts in completing this thesis, my knowledge and experience are limited

I welcome constructive feedback from my esteemed instructors to improveand perfect my work

Sincerely grateful.

Truong Van Sy

UNIVERSITY OF INFORMATION TECHNOLOGY

AdvancedADVANCED PROGRAM Evisainn

IN INFORMATION SYSTEMS Program

THESIS PROPOSAL

THESIS TITLE: Design and Implementation of a cloud-based Metaverse system

Advisor: PhD Nguyen Thanh Binh

Duration: 09/2023 - 12/2023

Students: Truong Van Sy - 18521698

Contents:

In recent years, the metaverse has emerged as a groundbreaking concept that has captivated the

imagination of both tech enthusiasts and mainstream society Defined as a collective virtual shared space, the metaverse represents a new frontier where individuals can interact, create, and

explore digital realms that blur the lines between the real and virtual world While the metaverse has predominantly been associated with gaming and social experiences, its applications extend

far beyond leisure activities.

One such a compelling application lies in exhibition environments, where the metaverse can revolutionize how we engage with art, culture and history The concept of creating a web app for the metaverse in exhibition environments is an immensely significant topic This research

explores the convergence of cutting-edge technology and the world of exhibitions, aiming to

The choice to delve into this topic stems from the recognition that the metaverse has enough capacity to democratize access to exhibitions, transcend physical boundaries, make cultural

treasures and educational resources accessible to a global audience By creating a web app that

leverages the metaverse, we can unlock a multitude of possibilities, from immersivity virtual tours of museums to collaborative learning experiences that transcend geographical limitations This research seeks to explore the methodologies, challenges, and opportunities involved in

developing web applications for the metaverse within exhibition environments, ultimately

paving the way for a new era of cultural and educational exchange.

1 Work to be done:

Learn about Mozilla's Hubs and Reticulum.

Conduct systematic analysis and design.

Create a Web UI and RESTful API for managing a virtual communication and exhibition

system.

Utilize third-party services such as AWS for hosting and Ready Player Me for creating

avatar.

Scope:

Learning and Research: Learn about technologies such as Mozilla's Hubs and Reticulum,

conduct systematic analysis and design, explore best practices in creating a virtual

communicative learning and exhibition environments.

Development: Create a comprehensive Web UI and a RESTful API to manage, build the

virtual communication and exhibition environments These include frontend and

backend development.

Integration: Integrate third-party services, such as AWS for cloud hosting and Ready

Player Me for avatar creation, to enhance the user experience.

Objectives:

Enhanced User Experience: Enable users to enjoy various activities, including

communication, content viewing, and material sharing, by accessing virtual rooms.

Cross-Platform Accessibility: Ensure that users can access the system from various

devices, including mobile devices (Android, i0S), PCs, and VR devices (Meta Quest 2).

Avatar Customization: Allow users to create and personalize avatars through the Ready

Player Me service, enhancing their presence in the virtual environment.

Room Scheduling: Implement the ability for users to set open and close times for virtual

rooms, providing flexibility for different user cases.

Content Creation and Sharing: Enable users to create, share, collaborate and quiz within

the system for presentations, training, and educational purposes.

Methodologies:

Agile Development: We will adopt an Agile development approach to ensure flexibility, collaboration, and iterative improvements throughout the project's lifecycle.

User-Centered Design: The user experience will be at the front of our design process, with

user feedback and usability testing that will inform our decisions.

Cloud Integration: We will leverage cloud services, specifically AWS, to ensure

scalability, reliability, and security in our systematic architecture.

Third-Party Integration: The integration of third-party services like Ready Player Me will

be carried out following the industry best practices and security guidelines.

AWS Lambda is used for image resizing, video transcoding, and website thumbnailing Uploaded assets are stored in EFS, static assets (JS/CSS/images) are stored in S3.

A fully functional virtual communication system accessible across devices.

Improved user engagement in virtual rooms.

Efficient room scheduling capabilities.

Seamless content creation, sharing, and collaboration features.

7 Research timelines:

Week 1: Project Initiation and Planning: Establish project objectives, team roles,

and initial planning.

Week 2-4: Research and Learning: Study Mozilla's Hubs and Reticulum

technologies, explore system analysis and design, and research best practices in virtual

communication and exhibition environments.

Week 5-7: Development Kickoff: Begin developing the Web UI and setting up the

RESTful API, focusing on front-end components and backend infrastructure.

Week 8: Third-Party Service Integration: Integrate third-party services, including

avatar creation, for compatibility with the core system.

Week 9-11: User-Centered Design: Prioritize user experience through iterative design and user feedback.

Week 12-15: Agile Development: Build core features of the virtual system,

emphasizing room management and scheduling functionalities.

Week 16: Content Creation and Sharing: Develop features for document and quiz creation and sharing.

Week 17: Finalization and Deployment: Finalize the project, prepare for

deployment, complete thesis report.

Approved by the advisor(s) Ho Chi Minh city, / /

Signature(s) of advisor(s) Signature(s) of student(s)

Nguyen Thanh Binh Truong Van Sy

(From the instructor)

(From the thesis advisor)

1.4 Our methodology eee eee ceecseecseceeceeessseessseassseecsesessesaesseeessesaeeeaes 7

1.5 Contributions of the Thesis -.- G1 ng ng ng 91.6 Thesis STUCẨUTC Ghi HH Hi Hư 10

CHAPTER 2: LITERATURE REVIENW - LH HH HH HH key 11

2.1 Related apDpÏICAf{IOTIS - 5 G6 1E nh ng TH ng tr 11

2.1.1 Altspace V RA 2⁄ cit À, À Le 11

2.1.2 REC ROOIM cọ HH ng 12

2.2 Current technỌOB1€S - - - - c3 1319991119101 9930 1991119 ng ngư 14

2.2.1 Unity 3D and Unreal EngIne - s5 + + + Esesseesskssersree 14

'VĐ VI Bố ĐH cv a - 15

2.2.3 WebVR and WebXR frameWOTK - «+ xxx svSseesskessersvee 162.2.4 PlatfOrms nh dđODŨDŨDŨDỮẦầẫŸẢ 17

2.3 The Metaverse framework in culture and education -«-s« 17

CHAPTER 3: LARCHIVEUM - OUR METAVERSE SYSTEM FOR

CULTURE AND EDUCATION 00 ccecceccecceeseseseeseeeseeesececeeseceaeeeaeceeneseaeeeeeeaees 19

3.1 Major apDTOACH - G0 SH ng HH nh 193.2 Software requireMent 1 21

3.2.1 Functional reQUIT€IT€TIES - - - 5 c1 111910111930 11911 9 kg cư, 21

3.2.2 Non-functional requirements ccceeeseeeseeeseeesceeeseeeeseeeeaeceeeeeeseeeaes 233.3 Analysis and IDeSIT - «1 vn HH ng TH TH HH Hàng Hư 25

3.3.1 System ATCHIf€CfUT€ - ĩc E1 25

3.3.2 Use-case Diagram - - ng TH HH Hit 263.4 Use-case specification and activity điagTaTm - 55-55 s++ssssssss 30

3.4.1 ROOM T€S€TVAfOII - << << << E1 EEEEEE1111 111111111119 1983555555511 1k kkkkkrer 30

EE VẦ/ Aiov)0(/ uđdđiii 313.4.3 VIEW StatiStiCs HT TH TH TH HH Hệ 32E09 7a 2 333.4.5 Join VITfUaÏ TOOTT SG 3 119911911910 911 111911 nệt 353.4.6 Manage TOOI - c1 HH HH nh 37

3.4.6.1 non 373.4.6.2 Update n6 ẦẦ 393.4.6.3 Delete rOOM ee eeeeseesesseceseessecnsecseesseesseceesseesseesaessaesseesseesaeenees 413.4.7 Manage QUIZ 1n 42

3.4.7.1 Insert QU1Z 7G SH HH gi, 42

Ko To 43

3.4.7.3 Delete QU1Z G1 120111530 120119 0v HH 45

3.4.8 Manage (OCUTm€TIẨ - - - - 2c E1 E221 11910 18 1119 1 11 ng ng ng 47

3.4.8.1 Insert dOCUMENE Da 473.4.8.2 Update OCUINTI( - 6 G2 E6 E311E23 E911 9119 1 9111 re 483.4.8.3 Delete OCUIN€TIE - G5 + 1119 99v ng ng ngư 503.4.9 Manage SC€NG - Q0 101 HH TH HH HH HH giết 52

3.4.9.1 Insert SC€T€ SG HT TH TH HH 523.4.9.2 Update SC€TG - LG 1111.911 ng ngư 543.4.9.3 Delete SCONC UtẦậùỌẦầâầậầâầẳđdaa 563.5 Sequence diagram and class đ1aðTa1m - 5 <5 ++skE+seeesseesseers 59

3.5.1 ROOM T€S€TVAfIOII - Gv HH HH nề 59

3.5.1.1 Sequence điaØTAIN - c- + + 3 3x 1 vn ng nh nưệt 593.5.1.2 Class uc na na 603.5.2 View Zcooi na c4 603.5.3 Join in VITfUẠ TOOIT - 4 s1 1190 9v nh ng nến 613.5.4 DO QUIZ eee e 623.5.5 MaMage US€T cv 63

3.5.5.1 Sequence (Ï1aðTAT - - c 3192112911911 111 1 1 1 nh ng Hy 63

3.5.5.2 Class in 663.5.6 Manage QU1Z c1 111911211 9111191 11H HH Hy 67

3.5.6.1 Sequence Aiagram ecceescceseecssceesneeeeneceseecseecseeesaeceeessaeeseaeees 673.5.6.2 Class na a®ễễẰ: 703.5.7 Manage OCUIT€TI - 6 5 +3 31919191 1n TH ng ng ng tưệt 71

3.5.7.1 Sequence (đÏ1aØTATH - - s1 99011 ng ngư 713.5.7.2 Class in ah na 75

3.5.8 Manage SCONE n 76

3.5.8.1 Sequence (Ï1aØTATm - c1 11991993119 1119 11H vn ng ngư 763.5.8.2 Class ro nn 803.5.9 Manage TOOIT - - -G c0 HH nh rry 80

3.5.9.1 Sequence (Ì1aØTATm - -c s 3 v91 91H ng ng cư, 80

3.5.9.2 Class (1aØTAIM c5 11901911 HH 85

3.5.10 View S{A{ISECS Ghi g nH H g ghHnrờ 863.6 Database HH HH ng ng HT HH Hiện 86

CHAPTER 4: IMPLEMENTATION AND RESULT -<<<<<++ 88

4.1 Implementation enVITOnIN€III 5 c5 1 323113511 E311 11 ksrkrrree 88

4.2 Final product T€SỤ( c2 612211222113 211 3351111119 11 9 11 111g vn ngư 88

4.2.1 Main features for all S€TS - - c6 3+ E*E+*kEseEEeerrreerkrerkrree 88

4.2.1.1 HOME 9 “43 884.2.1.2 SiQT Up 89

“ơn - 904.2.1.4 Forgot DASSWOT Ăn SH TH HH TH HH kg rry 90

“hp i0 7 914.2.1.6 Virtual Space cceescceesceseecsseeceseeeeneceseeceseeceaeeesaeceseeceeeseneeeseeetaees 914.2.1.7 Change avatar in virtual TOOIT «+ «+ sxc+eeesesseeserseree 924.2.1.8 Interaction in virtual TOOIN - c- 5s s3 9v vn ven 924.2.2 Main features for managers and adm1ns - «5 =<s++s<+sx++ 95CHAPTER 5: CONCLUSION AND FUTURE WORK - 101

h ®u/ (0i), gqcc âi.iiiảiảảii 101

5.2 LlmIfafIOTIS ĐC Ề233030303013031010 11 vn ng 1 51 và 1015.3 Future WOTK - - 203030303010101010 1K SĐT 5 vu 102

CHAPTER 6: CASE STUDY - THE RESTORATION OF JEUNGPYEONG

CATHOLIC CHURCH AND JEUNGPYEONG HOSPITAL [10] 103

REFERENCES SH HH HH HH HH 110

LIST OF FIGURES

Figure 1.1 Second life application 5

Figure 1.2 Facebook's Horizon Workrooms virtual reality working application 5Figure 2.3 Unity to create scene 12Figure 2.4 Rec Room tools 13Figure 3.1 Functional requirements 21Figure 3.2 System Architecture 25Figure 3.3 Use-case Diagram for user 26Figure 3.4 Use-case Diagram for Manager/Admin 27Figure 3.5 Extend use-case 28Figure 3.6 Activity diagram — Room reservation 31

Figure 3.7 Activity diagram — View document 32

Figure 3.8 Activity diagram — View statistics 33

Figure 3.9 Activity diagram — Do quiz 35Figure 3.10 Activity diagram — Join virtual room 37

Figure 3.11 Activity diagram —Insert room 39Figure 3.12 Activity diagram —Update room 40Figure 3.13 Activity diagram —Delete room 41Figure 3.14 Activity diagram —Insert quiz 43Figure 3.15 Activity diagram —Update quiz 45Figure 3.16 Activity diagram Delete quiz 46Figure 3.17 Activity diagram —Insert document 48Figure 3.18 Activity diagram —Update document 50Figure 3.19 Activity diagram —Delete document 52Figure 3.20 Activity diagram —Insert scene 54Figure 3.21 Activity diagram —Update scene 56

Figure 3.22 Activity diagram —Delete scene 58

Figure 3.23 Sequence diagram — Reservation 59Figure 3.24 Class diagram — View reservation 60

Figure 3.25.Sequence diagram — View document

Sequence diagram —Manage quizSequence diagram —Insert quiz

Sequence diagram —Update quizSequence diagram —Delete quizSequence diagram —Search quizClass diagram —Manage quiz

Sequence diagram —Manage document

Sequence diagram —Update documentSequence diagram —Insert documentSequence diagram —Delete documentSequence diagram —Search documentClass diagram —Manage document

Sequence diagram —Manage scene

Sequence diagram —Insert scene

Sequence diagram —Update scene

Sequence diagram —Delete sceneSequence diagram —Search sceneClass diagram —Manage scene

Sequence diagram —Manage room

Sequence diagram —Insert roomSequence diagram —Update roomSequence diagram —Delete room

606162

63

6465666667

68

69697070

71

72

73

7475

75

76

7778

79798081828384

Figure 3.55 Sequence diagram — Search room

Figure 3.56 Class diagram — Manage room

Figure 3.57 Sequence diagram — View statistics

Figure 3.58 Database

Figure 4.1 Home page UI

Figure 4.2 Sign up UI

Figure 4.3 Sign in UI

Figure 4.4 Forgot password UI

Figure 4.5 Manage profile UI

Figure 4.6 Virtual space for education

Figure 4.7 Change avatar in virtual room UI

Figure 4.8 Open video in virtual room

Figure 4.9 Share screen in virtual room

Figure 4.10 Drawing in virtual room

Figure 4.11 Drag and drop 3D model in virtual room

Figure 4.12 Chat in virtual room

Figure 4.13 Do quiz in virtual room

Figure 4.14 Read document in virtual room

Figure 4.15 Manage quiz

Figure 4.16 Create/Edit quiz

Figure 4.17 Manage document

Figure 4.18 Create/Edit document

Figure 4.19 Manage room

Figure 4.20 Create/Edit room

Figure 4.21 Spoke

Figure 4.22 Manage scene

Figure 4.23 Manage avatar

Figure 4.24 View statistics

Figure 4.25 Manage user

Figure 4.26 Manage quizzes of the system

85858687898990

90

9191929293

93

94

94

949595

96 96

96979797

98

98989999

Figure 4.27 Manage documents of the system 100

Figure 4.28 Drag and drop quiz/document 100

Figure 6.1 Release of product 103Figure 6.2 Application in culture 104

Figure 6.3 In the real - virtual world (1) 105Figure 6.4 In the real - virtual world (2) 106

Figure 6.5 In the real - virtual world (3) 107Figure 6.6 In the real - virtual world (4) 108Figure 6.7 Do quiz and read document 109

View statistics

Do quizJoin virtual room

Insert room

Update roomDelete roomInsert quiz

Update quizDelete quiz

Insert document

Update documentDelete document

Insert sceneUpdate document

Delete scene

LIST OF TABLES

2929

3031323435373941424445

4148

51535556

LIST OF ABBREVIATIONS

AWS Amazon Web Services

AR Augmented Reality

AZs Availability Zones

API Application Programming Interface

MREs Mixed Reality Extensions

NPC Non-player characters

SDK Software Development Kit

URL Uniform Resource Locator

UI User Interface

XR Extended Reality

VPC Virtual Private Cloud

VR Virtual Reality

Although the Metaverse has existed for many years, it has only recentlycaptured significant attention Functioning as an open virtual world, it provides ashared space for people to collaborate in work, creation and recreation, regardless

of their physical location The transformative potential of the Metaverse extends

to reshaping how we work, live, and communicate Instead of learning in such abroad and abstract field, this thesis focuses on the analysis, design andimplementation of cloud-based metaverse systems In particular, I focus on appliedaspects of culture and education such as museums, exhibitions and virtualclassrooms

The thesis introduces an innovative approach to creating virtual realitysolutions through a socially accessible virtual environment readily available on

smartphones The developed virtual space is constructed using Mozilla's Hubs ascore framework and the Spoke 3D scene editor Integration with Ready Player Me[5] simplifies the process of creating and editing avatars Besides, there is asolution to drag and drop documents, quizzes and any links into virtual rooms toprovide seamless interaction without interruption Moreover, I created a webapplication to easily manage virtual spaces, system users, content, resources such

as 3D models, images, etc To keep everything running at its best, easily scalable,accessible, and interoperable without interruption all modules are deployed in thecloud

The metaverse app developed in this thesis represents a pioneering effort in

creating a holistic platform that seamlessly integrates communication, interaction,education, and cultural exploration, fostering a new era of immersive learningexperiences in the digital realm

CHAPTER 1: INTRODUCTION

This section introduces the background, problem, objectives, methodologies,contributions of the thesis, and finally with an overview of the thesis structure

1.1 Background

The term "metaverse" originates from science fiction and was popularized

by Neal Stephenson's 1992 novel "Snow Crash." In the book, the metaverse is avirtual reality space where users interact with each other and digital environments.Over time, technological advancements, the rise of virtual worlds, and theevolution of digital communication have contributed to the development of the

metaverse.

The metaverse is a collective virtual shared space that combines aspects of

social media, online gaming, augmented reality (AR), virtual reality (VR), and

decentralized technologies It represents a paradigm shift from the traditionalinternet, offering users an immersive and interconnected digital experience thatgoes beyond mere consumption to active participation

Culture is one of the most crucial areas where Metaverse applications can

play a positive role In this field, the metaverse can provide users with unique and

powerful interactive experiences, opening up new spaces for exploration and

cultural immersion like never before Metaverse applications in culture mayinvolve creating virtual spaces that simulate historical sites, cultural landmarks, oreven traditional cultural events Users can engage in virtual experiences such asvisiting virtual museums, participating in traditional festivals, or even joiningevents featuring music and artistic performances from around the world

In the field of education, the metaverse can become a powerful learningtool Teachers and students can interact in virtual environments, engaging increative and dynamic learning activities The metaverse offers space for virtualexperiments, group discussions, and even learning from experts worldwide.Furthermore, leveraging metaverse technology in education and culture also helpsexpand access, eliminate geographical barriers, and create equal learning

opportunities for everyone From experiencing diverse cultures to accessing newknowledge, the metaverse has the potential to positively shape the future ofeducation and culture.

The metaverse's influence extends to the corporate world, redefining thelandscape of meetings and collaboration Virtual offices and meeting spacestranscend the limitations of physical locations, enabling teams to connectseamlessly from across the globe This shift towards digital collaboration enhancesproductivity and flexibility, opening new possibilities for remote work and globalpartnerships The role of the Metaverse application in the fields of culture andeducation is extremely important; however, as far as I know, there are very fewapplications that fully meet the necessary elements because they mostly focus onentertainment Based on this reality, I have chosen the topic "Design andImplementation of a Cloud-Based Metaverse System" as the focal point of my

thesis

1.2 Problem

In the past, virtual spaces were mainly created through 360-degree imagescaptured by cameras While it provided virtual space experiences, its efficiencywas not high The existing methods of creating virtual spaces for education andculture lack efficiency and interactivity The need for a more robust and engagingsolution becomes apparent to enhance user experiences and promote effectivelearning and cultural immersion

In recent times, several metaverse applications have emerged to address

various challenges and provide diverse solutions Apps like Second Life [1] and

Facebook's Horizon Workroom [2] have been created with specific purposes inmind Second Life primarily focuses on creating a virtual world where users can

be creative, build communities, and even engage in virtual businesses However,

it faces challenges related to community consensus, inappropriate content, anduneven technological capabilities Facebook's Horizon Workroom is designed to

about privacy and online security emerge, especially when users utilize services

from a major corporation like Facebook There are also challenges related to

interaction dynamics and work performance compared to traditional workenvironments

The current metaverse system faces several challenges that necessitate acritical examination of its existing structure and functionality One prominent issue

is the lack of comprehensive integration with cloud-based technologies, limitingtheir scalability, accessibility, and overall performance The absence of a robustcloud infrastructure hinders the system's ability to handle increasing user loads,resulting in potential performance bottlenecks during peak usage periods

Moreover, the current system exhibits deficiencies in providing a diverse range ofinteractive and immersive experiences within virtual environments This limitationimpacts user engagement and hampers the system's effectiveness in catering tovarious educational, cultural, and recreational needs

Furthermore, the Metaverse system falls short in addressing the evolvingdemands of users for more dynamic and interactive content The lack ofadaptability to emerging technologies and trends may lead to a stagnant userexperience, hindering the system's ability to stay relevant and competitive in therapidly evolving landscape of virtual environments

In light of these challenges, there is a compelling need for the design andimplementation of a cloud-based Metaverse system that can overcome the existinglimitations, enhance scalability, and provide a more versatile and engaging userexperience Addressing these issues will contribute to the evolution of metaversetechnologies, ensuring their alignment with contemporary expectations and

requirements

Meta About ¥ Work Solutions ¥ Meta Quest ¥ Horizon Workrooms v Workplace ¥ - Pricinc Support +

Figure 1.2 Facebook's Horizon Workrooms virtual reality working application

1.3 Objectives

In response to identified gaps in existing research, this application aims toaddress the following inquiries through the development and deployment of aninnovative application:

1 Create a metaverse system deployed on the AWS cloud:

With outstanding features, develop effective management tools Thissystem boasts exceptional features and seamlessly integrates robustmanagement tools, setting it apart in the virtual realm Develop functions invirtual rooms, create 3D resources and manage systems Users are

empowered with the ability to personalize virtual spaces, tailored to their

preferences and conducive to learning and cultural exploration

2 Installation-Free Customizable Virtual Rooms:

The system is deployed as a website service, no installation required.Everything about virtual rooms, content, scenes, management is donethrough the browser The emphasis here is on flexibility and ease of use,ensuring a hassle-free environment for users to connect, interact, and createpersonalized virtual spaces

3 Integrated Avatars and 3D Model Customization:

The second goal is to enhance user identity and interaction by integratingavatars and enabling 3D model customization through Spoke [3] Users willhave the capability to craft unique avatars, fostering a sense of individualitywithin the virtual environment The integration with Spoke will furtherempower users to create and personalize 3D models, contributing to a

visually appealing and immersive user experience Features such as sound

and image visualization within the virtual space and the ability to attachlinks or quizzes directly to the room interface will streamlinecommunication and interaction

4 Efficient Management Tools for Virtual Rooms:

This can be considered the core part of virtual room content management.

Researching and developing this multimedia embedded function takes a lot of

time and effort I used A- Frame to develop them In pursuit of effectivemanagement in a virtual environment, the application equips assignedmanagers with a powerful set of tools This includes an intuitive managementinterface to seamlessly monitor and organize virtual rooms Managers willhave the ability to upload and manage documents, manage questions, andallocate resources effectively The aim is to provide user-friendly controls thatenhance the management experience, ensuring smooth operations in virtualenvironments

In summary, this thesis seeks to not only bridge the existing gap but also redefinethe virtual experience by designing and implementing a metaverse system under

the name “Larchiveum” This envisioned solution prioritizes customization, user

engagement, and effective management control in the virtual space, setting thestage for a new era in virtual interaction and collaboration

1.4 Our methodology

Building a metaverse is a complex task that demands structures supporting

interoperability and persistent features, closely mirroring real-worldsynchronicity Moreover, the virtual realm should be rich in content andexperiences that authentically align with its intended purpose In broad strokes,the key steps in constructing a metaverse app involve:

e Step 1: Research on Metaverse and applications in educational culture

e Step 2: Choose technology and framework that supports 3D, VR, AR

e Step 3: Design the virtual space

e Step 4: Develop an interaction layer

e Step 5: Integrate Avatars

e Step 6: Deploy Interactive Content

e Step 8: Deploy on the cloud

Nowadays, the application of metaverse is very useful, however in the field

of culture and education very few systems have been created Therefore, throughresearch, I realized that creating a metaverse system in this field is necessary

To solve the problem, we choose the Hub core engine [4] It is a virtualcollaboration platform accessible via the web and offered as an open-sourcesolution It facilitates the processing of AR, VR and 3D models With my system,the front-end uses React for easy A-frame integration and Three.js for multimediaembedding Back-end NodeJS with Express framework combined with MySQLdatabase

To design the virtual 3D space, I installed Spoke as a 3D editor that runsentirely in the browser and allows users to upload their own models, images, and3D files to use in their projects Therefore, creating virtual spaces that are almostidentical to the real world

The interaction layer establishes user controls, empowering individuals tonavigate, communicate, and participate effectively The application supports thegeneration of interactive objects within the room, enhancing the overallimmersive experience

Avatars take center stage as virtual representations of users in themetaverse Ready Player Me integration allows for personalized avatar creation,

ensuring a unique and identifiable presence for each user Avatars become the

conduit for users to interact and engage with the virtual world, bridging the gapbetween the digital and physical realms

The challenge of embedding diverse content such as links to websites,videos, and quizzes directly into virtual space This complex task is efficientlyaddressed, creating a seamless experience for users, eliminating the need to open

external browser windows The metaverse becomes enriched with interactive

elements, providing a holistic and engaging user experience

Implement a manager application to monitor and deploy virtual roomswith different options Allows administrators to effectively manage rooms,

documents, quizzes, and resources in virtual rooms These resources can be

embedded and used in the virtual room creating a seamless experience instead of

having to open in a new browser window

With the foundational elements in place, the next crucial step is deployingthe metaverse application on the cloud Leveraging cloud infrastructure providesscalability, accessibility, and reliability By deploying on the cloud, the metaversebecomes easily accessible to users across various devices without the need forcomplex installations This step ensures efficient resource utilization, seamlessupdates, and the ability to scale the application as user demand grows Clouddeployment enhances the overall performance and accessibility of the metaverse,contributing to a dynamic and user-friendly virtual environment

1.5 Contributions of the Thesis

The dissertation encompasses:

- This thesis presents the design and implementing of a metaverse system in

the fields of culture and education Leverage the power of A-Frame increating components in virtual space

- The main focus is virtual culture and education This system also serves to

restore forgotten cultural values, taking advantage of the super universe toovercome geographical and space barriers and time By exploiting virtual

environments, learners can engage in rich cultural experiences that go

beyond traditional constraints This approach provides a unique anddynamic platform for cultural exploration and education The application

is designed with versatility in mind, making it suitable for deployment in

integration into different environments, ensuring that cultural andeducational content can be presented and accessed with ease.

Build applications without installing anything, providing necessary

functions for users and managers Allows real-time interaction and chat,multimedia embedding The metaverse system is designed for deployment

on the cloud This cloud-native approach not only enhances the system'sreliability and responsiveness but also provides a foundation for seamless

updates and expansions

1.6 Thesis Structure

The thesis includes 6 chapter:

Chapter 1: Introduction: Overview of the thesis topic includingbackground, problems, objectives, methods and contributions of the thesis.Chapter 2: Literature review: Research about related applications and

technologies used in the metaverse

Chapter 3: Larchiveum - Our metaverse system for culture andeducation: This chapter presents the analysis and design of the functions

of the entire system

Chapter 4: Implementation and result: Focus on system design,

implementation and results achieved

Chapter 5: Conclusion and future work: Finally, Chapter 6 willsummarize the results achieved in the thesis, discuss further ideas and futuredevelopment directions for the thesis topic

Chapter 6: Case study in restoring forgotten cultural values:

Introducing the application of our system in restoring forgotten cultural

values The virtual room ordered by achievement JeungPyeong

CHAPTER 2: LITERATURE REVIEW

This chapter reviews existing applications and techniques being applied to

implement the metaverse

2.1 Related applications

2.1.1 AltspaceVR

AltspaceVR [5] has evolved into a central hub for diverse live experiences,spanning concerts, conferences, comedy shows, festivals, tech talks, teammeetings, and collaborative work across geographical boundaries To use theapplication, we need to download it Altspace VR permits a maximum of 50 avatarswithin a single room, and there is the flexibility to duplicate the room an unlimitednumber of times

AltspaceVR provides a platform for shared VR experiences, enabling users

to participate in public events organized by others or host their own private orpublic gatherings accessible to the broader virtual community AltspaceVR curates

a dynamic calendar featuring a plethora of events, encompassing spiritual meetups,educational sessions, entertainment, and more This includes church services,group meditation, cryptocurrency discussions, science sessions, workshops, live

music, and karaoke, all within the immersive VR environment Users can explore

a diverse array of pre-built VR environments, referred to as worlds, withinAltspaceVR These worlds range from public spaces like streets and rooftops tofantastical locations such as enchanted meadows and mythical libraries Eventhosts can select these worlds when planning and organizing virtual gatherings.AltspaceVR empowers users with movement capabilities, allowing them to walk,run, turn, or shuffle, with controls specific to their devices The platform alsofacilitates interaction with objects, enabling users to grip, grab and throw Avatarcustomization fosters self-expression, contributing to a sense of connection withinthe social VR environment

Destinations © Clothing

Enter Code @ ro

Tutorial ® Top Accent

@ Bottom

Figure 2.3 Unity to create scene

Additionally, Altspace VR builds 3D world extensions using NodeJS The platformalso provides a user-friendly World Editor, allowing users to manipulate theirhome space by placing 3D objects, teleporters, and Mixed Reality Extensions(MREs), and altering the world's skybox With Unity Uploader, users gainadditional tools to enhance their virtual experiences

2.1.2 Rec Room

Rec Room [6] serves not only as a virtual entertainment space but also as ahub for learning and socializing Users can engage in activities such as games,virtual classes, sports arenas, and various other events Provides a virtual store forusers to customize their avatars It offers a variety of gaming rooms and diverseevents Utilizes Unity 3D and supports VR platforms, creating conditions forinteraction and entertainment

f a

ì v

k: Snapping Settings (Grid)

Sr Circuits & Debugging

“ Edit Mode Settings

Figure 2.4 Rec Room tools

Rec Room is a dynamic and immersive virtual reality (VR) platform that

transcends traditional gaming, providing users with a versatile space for social

interaction, entertainment, and creative expression Developed by Against Gravity,

Rec Room is accessible across various VR platforms and devices, serving as a

shared virtual environment where users can engage in a wide spectrum ofactivities

One of the key features of Rec Room is its multifaceted entertainment

offerings It goes beyond the realm of traditional gaming, providing users with a

diverse range of activities such as gaming challenges, virtual classes, social events,

and interactive experiences This versatility positions Rec Room as a hub for both

entertainment and learning

In Rec Room, users have the freedom to personalize their avatars, givingthem a unique and customized identity within the virtual space This avatar

customization not only enhances the visual appeal but also fosters a sense of

individuality and self-expression, contributing to a more immersive socialexperience

The platform leverages the capabilities of virtual reality to enable users tophysically interact with the virtual environment From walking and running tohand gestures, Rec Room enhances the overall immersive experience, makingvirtual interactions feel more natural and engaging.

Rec Room stands out for its emphasis on user-created content The platformprovides a variety of creation tools, empowering users to design their own games,rooms, and activities This focus on user-generated content ensures a dynamic and

ever-expanding virtual landscape, where creativity knows no bounds

2.2 Current technologies

2.2.1 Unity 3D and Unreal Engine

Unity 3D is a cross-platform development engine that supports variousoperating systems and devices, ranging from computers to mobile and even virtualreality (VR) devices Unity provides a user-friendly and easy-to-learn developmentenvironment, suitable for both beginners and seasoned developers It supportsmultiple programming languages, from C# to JavaScript, enhancing flexibility

Unity boasts a large development community with abundant online resources and

support This facilitates knowledge sharing and efficient problem-solving fordevelopers

Unreal Engine is renowned for its high-quality graphics and powerfulperformance Widely used in the gaming and film industries, it contributes tometaverses with impressive and realistic visual experiences Unreal Engine

primarily uses the C++ programming language, providing substantial power for

developers experienced in this language This makes Unreal Engine a popularchoice for large and complex projects Unreal Engine is one of the fewtechnologies with robust support for powerful extensions in virtual reality (VR)and extended reality (XR), providing an excellent foundation for metaverseapplications

Both of these technologies play a crucial role in the development of themetaverse, each bringing its own advantages and unique characteristics depending

on the specific requirements of the project These engines provide developers witharich set of tools and assets to bring their creative visions to life, shaping the visualand interactive aspects of the metaverse

2.2.2 AI

In recent years, artificial intelligence (AI) has found extensive applications

in our daily lives, from strategic business planning, decision-making, facialrecognition, to faster computations, and more Recently, AI experts have been

exploring the potential of applying AI to create dynamic metaverses AI possesses

the capability to process large volumes of data at incredibly high speeds Whencombined with machine learning techniques, AI algorithms can learn from pastiterations, considering historical data to provide unique results along with detailedinformation

In the metaverse, AI can be applied to non-player characters (NPCs) invarious situations NPCs are present in most games; they are part of the gamingenvironment designed to express emotions and respond to players' actions Withthe processing power of AI, NPCs can be placed in a 3D space to engage in lifelikeconversations with users or perform specific tasks Unlike human users, an AI-driven NPC can operate autonomously and cater to millions of playerssimultaneously NPCs can also function in multiple languages

Another potential application of AI is in creating metaverse avatars Users

can utilize AI tools to analyze 2D images or conduct 3D scans to generate avatarsthat look more realistic and accurate To make the process more flexible, AI canalso be employed to create various facial expressions, hairstyles, clothing, anddifferent features, making the digital personas we create appear more vibrant

2.2.3 WebVR and WebXR framework

WebVR is a JavaScript API designed to facilitate communication betweenweb browsers and VR devices Given the ubiquity of browsers as the primarygateway to the internet, this technology ensures that VR experiences, whenaccessible through a browser, become widely available to users

A-Frame is a powerful WebVR framework that empowers developers to

create immersive experiences, including AR, VR, and other web-based

applications At its core, it utilizes the three.js framework, bringing the

entity-component-system pattern to the Document Object Model (DOM) A-Frame's

capabilities encompass the creation of augmented reality (AR) and virtual reality

(VR) experiences, manipulation of 3D models, viewing and interaction with

360-degree images and videos, design and implementation of responsive userinterfaces, as well as hand tracking in VR and AR applications

Three.js emerges as a cross-browser JavaScript library, opening the

gateway to creating and displaying animated 3D computer graphics through

WebGL This powerful tool facilitates the development of immersive content for

the web, enhancing the visual richness of digital experiences

WebXR represents a more advanced iteration of WebVR, boastingexpanded support, enhanced features, superior performance, and comprehensivecompatibility with both Virtual Reality (VR) and Augmented Reality (AR) TheWebXR Device API serves as a gateway, granting access to the input, whichincludes data output from headsets and controllers, as well as the output, pertaining

to the hardware display functionalities of VR and AR devices This API empowersdevelopers to craft and showcase immersive VR and AR experiences directly onthe web platform

In conclusion, these frameworks and technologies exemplify the innovativestrides taken in the development of immersive digital experiences As we navigatethe expansive world of WebVR, these tools empower creators to shape the future

of augmented and virtual realities, bringing unprecedented richness to the digitalrealm

2.2.4 Platforms

In the metaverse landscape, collaboration tools stand as the linchpin,propelling shared experiences and social interaction to the forefront of digital

realms Platforms like Mozilla Hubs [7] and AltspaceVR play a pivotal role in

shaping the metaverse's technological fabric, transforming it into a dynamic spacewhere users can collaborate seamlessly and engage in immersive social

interactions

Mozilla Hubs, leveraging spatial computing technologies, offers users a

virtual canvas where collaboration transcends physical boundaries It becomes a

versatile space for real-time interactions, allowing individuals to communicate,collaborate, and connect as if they were physically present The expressive avatarsused in these platforms create a sense of presence, enhancing the feeling of sharedexperiences

Similarly, AltspaceVR emerges as a leading platform for live mixed reality

experiences, with a primary focus on fostering collaboration and social

engagement Through AltspaceVR, users can participate in a spectrum of events,

ranging from artistic showcases to business conferences, all within a shared virtualspace The platform's immersive capabilities contribute to the creation ofmemorable and interactive experiences, making social interaction a cornerstone of

the metaverse

These collaboration tools redefine the dynamics of shared experiences,providing users with the means to break free from the limitations of traditionalcommunication The metaverse becomes a stage for diverse activities, fromprofessional meetings to casual social gatherings, where users, represented byexpressive avatars, interact in real-time

2.3 The Metaverse framework in culture and education

The metaverse comprises three fundamental components: hardware,software, and content The content component can be further subdivided into user

interaction, implementation, and application These integral elements collectivelydefine the intricate structure of the metaverse, forming the basis for its

functionality and user experience [8]

The technology infrastructure required for the educational Metaverse includesseveral key components:

1 High-Speed Networking and Communication:

Ensuring a seamless experience between the real world and the Metaverse

necessitates robust high-speed networking and communication Thisinfrastructure is vital for maintaining fluidity, facilitating efficient data

transfer, and enabling real-time feedback

Computer Technology:

The processing of data between the virtual and real worlds relies oncomputer technology This encompasses crucial tasks such as storage, datatransmission, and synchronization, forming the backbone of the

technological framework for the educational Metaverse

Modeling and Rendering Technology:

The creation of immersive 3D digital spaces that seamlessly integratevirtual and real worlds is pivotal This goes beyond traditional VR or ARand includes advanced technologies like digital twins and mixed reality

(MR), contributing to a richer educational experience

Interactive Technology:

Vital for the Metaverse, interactive technology offers unique alternativesand multimodal interactions that surpass conventional Internet experiences.Fueled by VR, sensors, and real-time tracking, these interactions enhancethe educational journey within the Metaverse

Authentication Technologies:

To ensure transparency, decentralization, and user privacy, authenticationtechnologies and tools like blockchain play a crucial role Thesetechnologies contribute to establishing a secure and trustworthyenvironment within the educational Metaverse

CHAPTER 3: LARCHIVEUM - OUR METAVERSE SYSTEM FOR

CULTURE AND EDUCATION

Based on the technologies and frameworks mentioned in Chapter 2, thischapter will focus on presenting the analysis, design, implementation of ametaverse system to meet the needs of cultural exchange and learning The content

of this chapter includes 3 parts Part I will present the major approach, part 2 willanalyze the necessary features, including features from basic to complex Part 3,design the system according to the given function

3.1 Major approach

Through surveying and researching some deployed metaverse applications,

I found that some applications are developed based on Hub's core engine.Developing the system from scratch takes a lot of effort and is not technicallyguaranteed Therefore, the approach is to take advantage of Hub's core engine todevelop the system, taking advantage of 3D processing capabilities and availableeffects Parts related to AR, VR, 3D processing take advantage of the core engine,combined with A-Frame to help process quickly and effectively Systemcomponents, including basic to complex functions and features, are independentlydesigned and deployed in the cloud to meet specific requirements and goals I call

my system “Larchiveum”.

“Larchiveum” is a system developed by me using new technologies with

many outstanding features that provide virtual spaces where people can interact,share and experience diverse cultures from around the world This app aims tocreate a vibrant space to connect the community and promote culturalunderstanding

It provides immersive and educational experiences that beckon users todelve into the vast tapestry of global cultures From historical landmarks to artisticmasterpieces, the Metaverse transforms learning into an enchanting journey Ittranscends geographical boundaries, creating a space where individuals from

diverse cultural backgrounds converge This global nexus facilitates connectionsthat extend beyond the digital realm, fostering a sense of unity among a community

driven by curiosity

Embarking on the "Larchiveum" metaverse journey, the exploration goesbeyond the initial conceptualization, delving into the intricacies of scenecustomization and web management With a strategic focus on empowering users,the system introduces cutting-edge features that enhance the overall metaverse

immersive scenes

Drag and drop functionality has been integrated, simplifying the process ofincorporating 3D models into scenes This intuitive feature not only enhancesaccessibility but also empowers users to effortlessly arrange and rearrangeelements within the virtual environment, fostering a more engaging and dynamicexperience

The establishment of a dedicated web management room serves as a pivotalcomponent in the "Larchiveum" ecosystem This centralized interface caters toadministrators and content curators, providing a comprehensive space to overseeand organize various facets of the metaverse Here, content organization andcuration become streamlined processes, emphasizing simplicity and efficiency in

managing the diverse cultural content within the system Develop embedded

multimedia features in the room Users can seamlessly embed images, videos, andaudio, enriching their virtual scenes and ensuring a more captivating exploration

of global cultures A-Frame's capabilities contribute to the creation of immersiveenvironments, transcending traditional boundaries of learning

In line with the commitment to accessibility and scalability, "Larchiveum"

is deployed on a scalable cloud infrastructure This strategic decision ensuresefficient resource distribution, facilitating a smooth and responsive experience forusers across the globe The cloud deployment not only allows for seamless updatesbut also ensures accessibility from various devices, fostering widespreadparticipation and cultural exchange

3.2 Software requirements

3.2.1 Functional requirements

The Real World fo heiMotaverse Avatar , seems 1

Customization interactive and

= Enter Flexible Design virtual

Laptop / Wearable Room Access context

Figure 3.1 Functional requirements

e Avatar Customization:

Avatar customization is the heartbeat of the virtual realm, offering users the thrill

of shaping digital identities The freedom to customize appearance, clothing, andexpressions to transform an avatar is essential This process is not just exciting butfosters inclusivity, embracing diversity within the Metaverse The system allows

you to create your own avatars through Ready Play Me, upload arbitrary avatarsand choose available images in the system's collection, these images are allmanaged by the administrator through the admin page.

e Event Hosting and Scheduling:

The Event Planning and Archiving functionality in Metaverse is an important

feature, empowering users to organize and coordinate a wide range of eventsseamlessly From business meetings to social gatherings, the platform provides anintuitive interface for users to plan, schedule, and organize events with ease Userscan tailor events to their needs, whether it's a virtual conference, an educationalseminar or a regular meet-up, enhancing the platform's flexibility Real-timeplanning capabilities ensure that participants can easily sync with events, drivingengagement and participation

e@ Flexible Room Access:

Access to the room is not subject to specific time restrictions Users can flexiblyset opening and closing times for the Room, ensuring convenience and adapting to

different schedules The host can adjust the options allowed in the room such asallowing flying, teleportation, chatting, microphone, creating objects into the

room, taking photos, sharing the screen, changing avatar or name, drawing andcreating emoji Users can invite others via the invite link

e Flexible Multimedia Embedding:

Allowing embedding 3D models, images, videos, even web pages, pdf files andscreen sharing creates a seamless virtual world Picture yourself effortlesslyembedding intricate 3D models, exploring lifelike images, and engaging withcaptivating videos

e Real-time interactive and communication:

Ensuring smooth and instantaneous interactions and communications enhances thecoherence of conversations Real-time Interactive and Communication feature isdesigned to break down barriers, fostering a sense of connection that mirrors real-world interactions The result is an elevated user experience that goes beyond theexpected, making every virtual encounter a memorable and engaging affair