-
Notifications
You must be signed in to change notification settings - Fork 0
/
Copy pathindex.html
140 lines (115 loc) · 6.39 KB
/
index.html
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
<!DOCTYPE html>
<html lang="en" dir="ltr">
<head>
<!--Metadata-->
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1">
<!--Add title and favicon-->
<title>Johaan Paul - 360 Interactive Photos</title>
<link rel="icon" type="image/jpg" href="https://www.johaan.org/Assets/Local/Icons/Transparent Icon.png">
<!--Link Global and Local CSS Files-->
<link rel="stylesheet" type="text/css" href="https://www.johaan.org/global.css"><!--Global-->
<link rel="stylesheet" type="text/css" href="/local.css"><!--Local-->
<!--Link Global And Local JS Files-->
<script src="https://www.johaan.org/global.js"></script><!--Global-->
<script src="./local.js"></script><!--Local-->
<!--Addons-->
<script type="module" src="https://unpkg.com/ionicons@5.5.2/dist/ionicons/ionicons.esm.js"></script>
<script nomodule src="https://unpkg.com/ionicons@5.5.2/dist/ionicons/ionicons.js"></script>
</head>
<!--Title-->
<header class="section">
<h1>Johaan Paul</h1>
</header>
<!--Navigation Bar-->
<nav class="flex-container section">
<a id="Home-Button" class="flex-child" href="https://www.johaan.org/home/">
<ion-icon id="Home-Icon" name="home-outline"></ion-icon>
Home
</a>
<a id="About-Me-Button" class="flex-child" href="https://www.johaan.org/about-Me/">
<ion-icon id="About-Me-Icon" name="person-circle-outline"></ion-icon>
About Me
</a>
<a id="My-Projects-Button" class="flex-child" href="https://www.johaan.org/projects/">
<ion-icon id="My-Projects-Icon" name="game-controller-outline"></ion-icon>
My Projects
</a>
</nav>
<!--Main Page Content-->
<body>
<!--Coontent Box 1-->
<div class="section">
<h1>360 Interactive Photos</h1>
<iframe
src="https://lumalabs.ai/embed/962175e1-ba3a-4e10-8889-653bc5dcfe69?mode=sparkles&background=%23ffffff&color=%23000000&showTitle=true&loadBg=true&logoPosition=bottom-left&infoPosition=bottom-right&cinematicVideo=undefined&showMenu=false"
width=100%
height=100%
frameborder="0"
title="luma embed"
style="border: none;">
</iframe>
<p>
This project demonstrates the seamless integration of video technology and artificial intelligence to create high-quality 3D models.
By leveraging <a class="link" href="https://lumalabs.ai" target="_blank">Luna-AI's</a> capabilities, I was able to transform a simple video into a valuable digital asset, opening up numerous possibilities for innovation and application in various fields.
</p>
<h2>capturing the video:</h2>
<p>
I started by using a phone camera to capture a video that orbits around the object making sure a to capture all parts of the object.
This video footage was taken from multiple angles to ensure comprehensive coverage of the object’s dimensions and features.
</p>
<h2>Uploading to <a class="link" href="https://lumalabs.ai" target="_blank">Luna-AI</a>:</h2>
<p>
The recorded video was then uploaded to <a class="link" href="https://lumalabs.ai" target="_blank">Luna-AI</a> after creating a free account with them.
<a class="link" href="https://lumalabs.ai" target="_blank">Luna-AI</a> is a sophisticated AI platform designed for 3D modeling.
<a class="link" href="https://lumalabs.ai" target="_blank">Luna-AI</a> specializes in processing visual data to create accurate and detailed 3D models.
</p>
<h2>AI Transformation:</h2>
<p>
Once the video was uploaded, <a class="link" href="https://lumalabs.ai" target="_blank">Luna-AI</a> analyzed the footage, extracting key details and spatial information from the multiple perspectives provided in the video.
The AI then used this data to generate a precise 3D model of the object, capturing its intricate details and textures.
</p>
<h2>Results:</h2>
<p>
Once the 3D model was created in <a class="link" href="https://lumalabs.ai" target="_blank">Luna-AI</a> I had the choice of exporting in multiple formats, including GLTF, USDZ, OBJ, PLY, a 360 Image or sharing as a Link, or Iframe element.
These files and results have many applications like for VR enviroments, E-commerce, Digital Archiving, Visual Aids for Educational settings, 3D models in games, Digital replicas of artifacts ensuring thier preservation,
this is just a few examples of the uses of this.
</p>
</div>
</body>
<!--Footer-->
<footer class="section flex-container">
<a id="Facebook-Icon" class="flex-child" href="https://www.facebook.com/JohaanPaul1234/" target="_blank">
<ion-icon name="logo-facebook"></ion-icon>
</a>
<a id="Github-Icon" class="flex-child" href="https://github.com/dinnerbone422" target="_blank">
<ion-icon name="logo-github"></ion-icon>
</a>
<a id="Instagram-Icon" class="flex-child" href="https://www.instagram.com/johaan_paul/" target="_blank">
<ion-icon name="logo-instagram"></ion-icon>
</a>
<a id="Steam-Icon" class="flex-child" href="https://steamcommunity.com/profiles/76561199037617555/" target="_blank">
<ion-icon name="logo-steam"></ion-icon>
</a>
<a id="Tiktok-Icon" class="flex-child" href="https://www.tiktok.com/@dinnerbone422" target="_blank">
<ion-icon name="logo-tiktok"></ion-icon>
</a>
<a id="Twitter-Icon" class="flex-child" href="https://twitter.com/paul_johaan" target="_blank">
<ion-icon name="logo-twitter"></ion-icon>
</a>
<a id="Whatsapp" class="flex-child" href="https://api.whatsapp.com/send?phone=64224240565" target="_blank">
<ion-icon name="logo-whatsapp"></ion-icon>
</a>
<a id="Xbox-Icon" class="flex-child" href="https://account.xbox.com/en-us/profile?gamertag=DinnerBone65174" target="_blank">
<ion-icon name="logo-xbox"></ion-icon>
</a>
<a id="Youtube-Icon" class="flex-child" href="https://www.youtube.com/channel/UCORvL_etj1agiFdXrmos_fg" target="_blank">
<ion-icon name="logo-youtube"></ion-icon>
</a>
<a id="Mail-Icon" class="flex-child" href="https://mail.google.com/mail/?view=cm&fs=1&to=feedback@johaan.org" target="_blank">
<ion-icon name="mail"></ion-icon>
</a>
<!-- add More social-Icon Links here--->
</footer>
</html>