-
Notifications
You must be signed in to change notification settings - Fork 0
Expand file tree
/
Copy pathindex.html
More file actions
412 lines (365 loc) · 24.4 KB
/
index.html
File metadata and controls
412 lines (365 loc) · 24.4 KB
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
141
142
143
144
145
146
147
148
149
150
151
152
153
154
155
156
157
158
159
160
161
162
163
164
165
166
167
168
169
170
171
172
173
174
175
176
177
178
179
180
181
182
183
184
185
186
187
188
189
190
191
192
193
194
195
196
197
198
199
200
201
202
203
204
205
206
207
208
209
210
211
212
213
214
215
216
217
218
219
220
221
222
223
224
225
226
227
228
229
230
231
232
233
234
235
236
237
238
239
240
241
242
243
244
245
246
247
248
249
250
251
252
253
254
255
256
257
258
259
260
261
262
263
264
265
266
267
268
269
270
271
272
273
274
275
276
277
278
279
280
281
282
283
284
285
286
287
288
289
290
291
292
293
294
295
296
297
298
299
300
301
302
303
304
305
306
307
308
309
310
311
312
313
314
315
316
317
318
319
320
321
322
323
324
325
326
327
328
329
330
331
332
333
334
335
336
337
338
339
340
341
342
343
344
345
346
347
348
349
350
351
352
353
354
355
356
357
358
359
360
361
362
363
364
365
366
367
368
369
370
371
372
373
374
375
376
377
378
379
380
381
382
383
384
385
386
387
388
389
390
391
392
393
394
395
396
397
398
399
400
401
402
403
404
405
406
407
408
409
410
411
<!DOCTYPE html>
<!--
Delex by TEMPLATE STOCK
templatestock.co @templatestock
Released for free under the Creative Commons Attribution 3.0 license (templated.co/license)
-->
<html lang="en">
<head>
<!-- Meta Tags -->
<meta charset="utf-8"/>
<!-- Site Title-->
<!-- <title>Delex HTML5 Free Responsive Template | Template Stock</title>-->
<title>2021 Y-BASE AI Symposium</title>
<!-- Mobile Specific Metas-->
<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1"/>
<!-- Google-fonts -->
<link href='http://fonts.googleapis.com/css?family=Signika+Negative:300,400,600,700' rel='stylesheet' type='text/css'>
<link href='http://fonts.googleapis.com/css?family=Kameron:400,700' rel='stylesheet' type='text/css'>
<!-- Bootstrap -->
<link rel="stylesheet" href="css/bootstrap.min.css"/>
<!-- Fonts-style -->
<link rel="stylesheet" href="css/styles.css"/>
<!-- Fonts-style -->
<link rel="stylesheet" href="css/font-awesome.min.css"/>
<!-- Modal-Effect -->
<link href="css/component.css" rel="stylesheet">
<!-- owl-carousel -->
<link href="css/owl.carousel.css" rel="stylesheet" type="text/css" media="screen">
<link href="css/owl.theme.css" rel="stylesheet" type="text/css" media="screen">
<!-- Template Styles-->
<link rel="stylesheet" href="css/style.css"/>
<!-- Template Color-->
<link rel="stylesheet" type="text/css" href="css/green.css" media="screen" id="color-opt" />
</head>
<body data-spy="scroll" data-offset="80">
<!-- Preloader -->
<div class="animationload">
<div class="loader">
Please Wait....
</div>
</div>
<!-- End Preloader -->
<nav class="navbar navbar-default navbar-fixed-top navbar-custom">
<div class="container">
<!-- Brand and toggle get grouped for better mobile display -->
<div class="navbar-header">
<button type="button" class="navbar-toggle collapsed" data-toggle="collapse" data-target="#bs-example-navbar-collapse-1">
<span class="sr-only">Toggle navigation</span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
</button>
<a class="navbar-brand" href="#">2021 Y-BASE AI SYMPOSIUM</a>
</div>
<!-- Collect the nav links, forms, and other content for toggling -->
<div class="collapse navbar-collapse" id="bs-example-navbar-collapse-1">
<ul class="nav navbar-nav navbar-right">
<li><a href="#home">Home</a></li>
<!-- <li><a href="#services">Services</a></li>-->
<li><a href="#organizers">Keynote Speaker</a></li>
<!-- <li><a href="#twitter_tweet">Testimonials</a></li>-->
<li><a href="#abstract">Abstract</a></li>
<li><a href="#tentative">Tentative Schedule</a></li>
<li><a href="#ats">About The Speaker</a></li>
<li><a href="#registration">Registration</a></li>
</ul>
</div><!-- /.navbar-collapse -->
</div><!-- /.container -->
</nav>
<!-- /HOME -->
<section class="main-home" id="home">
<div class="home-page-photo"></div> <!-- Background image -->
<div class="home__header-content">
<div id="main-home-carousel" class="owl-carousel">
<div>
<h1 class="intro-title"><b>What You Need to Know About the METAVERSE: <br/>Quality of Experience (QoE)</b><h1>
<p class="intro-text">Metaverse is a concept that can be described as a combination of physical and virtual reality. Users can experience a virtual space <br/>
where the physical world links with the virtual world. They can share experiences and interact in real-time within virtual scenarios.</p>
<a class="btn btn-custom" href="https://yonsei.zoom.us/j/82491402631?pwd=dnVzRm9qVFBIUUZqRkhCaHQ1ckJ6Zz09">Get started</a>
</div><!--slide item like paragraph-->
</div>
</div>
</section>
<!-- /End HOME -->
<!-- / SERVICES -->
<section id="organizers">
<div class="container">
<div class="row">
<div class="col-md-12">
<h3 class="title text-center">Keynote Speaker</h3>
<div class="titleHR"><span></span></div>
</div>
</div>
<div class="row">
<div class="col-sm-3"> <!-- Service-item -->
<div class="text-center services-item">
<div class="col-wrapper">
<div class="icon-border">
<a href="http://live.ece.utexas.edu/" class="instructorphoto"><img src="images/bovik.png" alt="" /></a>
<!-- <i class="icon-design-graphic-tablet-streamline-tablet color-l-orange"></i> -->
</div>
<h5><a href="#ats">Alan Conrad Bovik</a></h5>
<p>The University of Texas at Austin.</p>
</div>
</div>
</div>
<div class="col-sm-3"> <!-- Service-item -->
<div class="text-center services-item">
<div class="col-wrapper">
<div class="icon-border">
<a href="https://www.linkedin.com/in/ioannis-katsavounidis-a736503/" class="instructorphoto"><img src="images/loan.png" alt="" /></a>
<!-- <i class="icon-design-graphic-tablet-streamline-tablet color-l-orange"></i> -->
</div>
<h5><a href="#ats">Ioannis Katsavounidis</a></h5>
<p>Research Scientist, Facebook</p>
</div>
</div>
</div>
<div class="col-sm-3"> <!-- Service-item -->
<div class="text-center services-item">
<div class="col-wrapper">
<div class="icon-border">
<a href="https://www.linkedin.com/in/lihao" class="instructorphoto"><img src="images/li.png" alt="" /></a>
<!-- <i class="icon-design-graphic-tablet-streamline-tablet color-l-orange"></i> -->
</div>
<h5><a href="#ats">Hao Li</a></h5>
<p>CEO and Co-Founder of Pinscren</p>
</div>
</div>
</div>
<div class="col-sm-3"> <!-- Service-item -->
<div class="text-center services-item">
<div class="col-wrapper">
<div class="icon-border">
<a href="http://insight.yonsei.ac.kr/gnuboard/" class="instructorphoto"><img src="images/lee.png" alt="" /></a>
<!-- <i class="icon-design-graphic-tablet-streamline-tablet color-l-orange"></i> -->
</div>
<h5><a href="#ats">Sanghoon Lee</a></h5>
<p>Yonsei University, Korea.</p>
</div>
</div>
</div>
</div> <!--/.row -->
</div> <!--/.container -->
</section>
<!-- / End services-->
<!-- TWITTER TWEET -->
<section class="abstract parallax" id="abstract" data-stellar-background-ratio="0.5">
<div class="container">
<div class="row">
<div class="col-md-12">
<h3 class="title-white text-center">Abstract</h3>
<div class="titleHR"><span></span></div>
</div>
</div>
<div class="row">
<h4>Today, the metaverse is a shared virtual space where people are represented by digital avatars (think Ready Player One). The virtual world constantly grows and evolves based on the decisions and actions of the society within it. Eventually, people will be able to enter the metaverse, completely virtual (i.e. with virtual reality) or interact with parts of it in their physical space with the help of augmented and mixed reality.<br/><br/>
The metaverse can be said to be a revolutionary change by merging the 2D natural scenes with 3D computer graphic scenes. First, there is a difference between the existing PC and mobile-based internet era and the metaverse era in terms of convenience, interaction method, and screen/space expandability. Specifically, it is evolving from a 2D web screen to a 3D spatial web where the limitations of the screen have disappeared. The second is the technical aspect. The technology that implements the metaverse is a composite of General Purpose Technology, XR+DNA (eXtended Reality + Data, Network, and Artificial intelligence). These core technologies aim to implement virtual space as it really is, to perceive it as a person perceives it, and to break down reality and virtual barriers. However, making fully interactive 3D metaverse with high-quality video has never been easier.<br/><br/>
Therby, it is necessary to assess the quality of experience (QoE) perceived by users adaptive to those future multimedia systems. In this context, this tutorial aims at bridging METAVERSE media with QoE assessment. Through evaluating the QoE of media experiences, we aim to quantify the users’ perceived quality of a system or service that affects their experience. Moreover, this symposium does not only focus on QoE but aims to understand and quantify the overall user experience, by taking into account personal and situational factors. Finally, we will discuss how to evaluate the QoE for next-generation multimedia from the human cognitive perspective, present the latest articles aligned with the recent industrial trends, contents acquisition, and quality assessment, and have technical exchanges.</h4>
</div>
</div> <!-- container -->
</section>
<!-- End TWITTER TWEET -->
<!-- CONTACT -->
<section id="tentative">
<div class="container">
<div class="row">
<div class="col-md-12">
<h3 class="title text-center">Tentative Schedule</h3>
<h4 class="title text-center"><a href="https://zoom.us/">October 27, 2021 PST: UTC-8 [October 28, 2021, in Korea Time]</a></h4>
<div class="titleHR"><span></span></div>
</div>
</div>
<div class="row services-item">
<p><span class="announce_date"><b>21:00-21:10 [13:00-13:10 in Korea Time]</b></span> </br>
Opening remarks<a href="https://www.yonsei.ac.kr/en_sc/yonsei_news.jsp?article_no=182123&mode=view"> - Seounghwan Suh (President of Yonsei University)</a> </p>
<p><span class="announce_date"><b>21:10-21:20 [13:10-13:20 in Korea Time]</b></span> </br>
Congratulatory remarks<a href="https://english.msit.go.kr/eng/contents/cont.do?sCode=eng&mPid=19&mId=20"> - Hyesook Lim (Minister, Ministry of Science and ICT)</a> </p>
<p class="subtitle"><span class="announce_date"><b>21:20-22:00 [13:20-14:00 in Korea Time]</b></span> </br>
Predicting the Quality of Foveated Compressed Videos in VR <a href="#ats"> - Alan Conrad Bovik</a></p>
<p class="subtitle"><span class="announce_date"><b>22:00-22:40 [14:00-14:40 in Korea Time]</b></span> </br>
Immersive media coding quality optimization<a href="#ats"> - Ioannis Katsavounidis</a></p>
<p class="subtitle"><span class="announce_date"><b>22:40-23:20 [14:40-15:20 in Korea Time]</b></span> </br>
Enabling the metaverse with AI-driven 3D avartars <a href="#ats"> - Hao Li</a></p>
<p class="subtitle"><span class="announce_date"><b>23:20-24:00 [15:20-16:00 in Korea Time]</b></span> </br>
Towards hyper-realistic human virtualization: data acquisition and applications<a href="#ats"> - Sanghoon Lee</a></p>
</div>
</div> <!-- container -->
</section>
<!-- End CONTACT -->
<!-- CONTACT -->
<section class="ats" id="ats">
<div class="container">
<div class="row">
<div class="col-md-12">
<h3 class="title text-center">About The Speaker</h3>
<div class="titleHR"><span></span></div>
</div>
</div>
<div class="row services-item">
<p><a href="http://live.ece.utexas.edu/"><b>Alan Conrad Bovik</b></a>
</br>holds the Cockrell Family Endowed Regents Chair in Engineering at The University of Texas at Austin, where he is Director of the Laboratory for Image and Video Engineering (LIVE). He is a faculty member in the Department of Electrical and Computer Engineering, the Wireless Networking and Communication Group (WNCG), and the Institute for Neuroscience. His research interests include digital television, digital photography, visual perception, social media, and image and video processing. He has published over 900 technical articles in these areas and holds several U.S. patents. His publications have been cited more than 120,000 times in the literature, his H-index is above 120, and he is listed as a Highly-Cited Researcher by The Web of Science Group. His several books include the The Handbook of Image and Video Processing (Academic Press, 2000, 2005), Modern Image Quality Assessment (2006), and the companion volumes The Essential Guides to Image and Video Processing (Academic Press, 2009).</p>
<p><a href="https://www.linkedin.com/in/ioannis-katsavounidis-a736503/"><b>Ioannis Katsavounidis</b></a>
</br> is part of the Video Infrastructure team, leading technical efforts in improving video quality and quality of experience across all video products at Facebook. Before joining Facebook, he spent 3.5 years at Netflix, contributing to the development and popularization of VMAF, Netflix's open-source video quality metrics, as well as inventing the Dynamic Optimizer, a shot-based perceptual video quality optimization framework that brought significant bitrate savings across the whole streaming spectrum. VMAF and the dynamic optimizer awarded Netflix two technical Emmys in 2020. He was a professor for 8 years at the University of Thessaly's Electrical and Computer Engineering Department in Greece, teaching video compression, signal processing and information theory. He was one of the cofounders of Cidana, a mobile multimedia software company in Shanghai, China. He was the director of software for advanced video codecs at InterVideo, the makers of WinDVD, the most popular SW DVD player, in the early 2000's and he has also spent 4 years working in high-energy experimental Physics in Italy. He is one of the co-chairs for the statistical analysis methods (SAM) and no-reference metrics (NORM) groups at the Video Quality Experts Group (VQEG). He is actively involved within the Aliance for Open Media (AOM) as co-chair of the software implementation working group (SWIG). He has over 150 publications, including 50 patents. His research interests lie in video coding, quality of experience, adaptive streaming, and energy efficient HW/SW multimedia processing.</p>
<p><a href="https://jw09191.github.io"><b>Hao Li</b></a>
</br> is CEO and Co-Founder of Pinscreen, a startup that builds cutting edge AI-driven virtual avatar technologies. He is also a Distinguished Fellow of the Computer Vision Group at UC Berkeley. Before that, he was an Associate Professor of Computer Science at the University of Southern California, as well as the director of the Vision and Graphics Lab at the USC Institute for Creative Technologies. Hao's work in Computer Graphics and Computer Vision focuses on digitizing humans and capturing their performances for immersive communication, telepresence in virtual worlds, and entertainment. His research involves the development of novel deep learning, data-driven, and geometry processing algorithms. He is known for his seminal work in avatar creation, facial animation, hair digitization, dynamic shape processing, as well as his recent efforts in preventing the spread of malicious deep fakes. He was previously a visiting professor at Weta Digital, a research lead at Industrial Light & Magic / Lucasfilm, and a postdoctoral fellow at Columbia and Princeton Universities. He was named top 35 innovator under 35 by MIT Technology Review in 2013 and was also awarded the Google Faculty Award, the Okawa Foundation Research Grant, as well as the Andrew and Erna Viterbi Early Career Chair. He won the Office of Naval Research (ONR) Young Investigator Award in 2018 and was named named to the DARPA ISAT Study Group in 2019. In 2020, he won the ACM SIGGRAPH Real-Time Live! “Best in Show” award. Hao obtained his PhD at ETH Zurich and his MSc at the University of Karlsruhe (TH). </p>
<p><a href="http://insight.yonsei.ac.kr/gnuboard/"><b>Sanghoon Lee</b></a>
</br> joined the faculty of the Department of Electrical and Electronics Engineering, Yonsei University, Seoul, Korea, where he is a full professor. He has been an Associate Editor of the IEEE Trans. Image Processing (2010-) and an Editor of the Journal of Communications and Networks (JCN) (2009-), and the Chair of the IEEE P3333.1 Quality Assessment Working Group (2011-). He served as the Technical Committee of the IEEE IVMSP (2014-), the General Chair of the 2013 IEEE IVMSP workshop, and a guest editor of IEEE Trans. Image Processing 2013. He has received a 2012 special service award from IEEE Broadcast Technology Society and 2013 special service award from IEEE Signal Processing Society. His research interests include image/video quality assessments, medical image processing, cloud computing, wireless multimedia communications and wireless networks. </p>
</div>
</div> <!-- container -->
</section>
<!-- End CONTACT -->
<section id="registration">
<div class="container">
<div class="row">
<div class="col-md-12 text-center">
<h3 class="title text-center">Registration</h3>
<div class="titleHR"><span></span></div>
</div>
</div>
<div class="row services-item">
<form class="gform well form-horizontal" action="https://script.google.com/a/yonsei.ac.kr/macros/s/AKfycbyfAeD8FdfTysYaMi0nC1QtNqb9srAexoZaZdtfdA/exec" method="post" id="contact_form">
<fieldset>
<div class="form-group">
<label class="col-md-4 control-label">First Name</label>
<div class="col-md-4 inputGroupContainer">
<!-- <div class="input-group"> -->
<!-- <span class="input-group-addon"><i class="glyphicon glyphicon-user"></i></span> -->
<input name="first_name" placeholder="First Name" class="form-control" type="text" minlength="1" required>
<!-- </div> -->
</div>
</div>
<div class="form-group">
<label class="col-md-4 control-label" >Last Name</label>
<div class="col-md-4 inputGroupContainer">
<!-- <div class="input-group"> -->
<!-- <span class="input-group-addon"><i class="glyphicon glyphicon-user"></i></span> -->
<input name="last_name" placeholder="Last Name" class="form-control" type="text" minlength="1" required>
<!-- </div> -->
</div>
</div>
<div class="form-group">
<label class="col-md-4 control-label">Department / Office</label>
<div class="col-md-4 selectContainer">
<!-- <div class="input-group"> -->
<!-- <span class="input-group-addon"><i class="glyphicon glyphicon-list"></i></span> -->
<select name="department" class="form-control selectpicker" required>
<option value="">Select your Department/Office</option>
<option>Department of Engineering</option>
<option>Department of Agriculture</option>
<option >Accounting Office</option>
<option >Tresurer's Office</option>
<option >MPDC</option>
<option >MCTC</option>
<option >MCR</option>
<option >Mayor's Office</option>
<option >Tourism Office</option>
</select>
<!-- </div> -->
</div>
</div>
<div class="form-group">
<label class="col-md-4 control-label">E-Mail</label>
<div class="col-md-4 inputGroupContainer">
<!-- <div class="input-group"> -->
<!-- <span class="input-group-addon"><i class="glyphicon glyphicon-envelope"></i></span> -->
<input name="email" placeholder="E-Mail Address" class="form-control" type="email" required>
<!-- </div> -->
</div>
</div>
<!-- Success message
<div class="alert alert-success" role="alert" id="success_message">Success <i class="glyphicon glyphicon-thumbs-up"></i> Success!.</div> -->
<!-- Button -->
<div class="form-group">
<label class="col-md-4 control-label"></label>
<div class="col-md-4 text-center"><br>
  <button type="submit" class="btn btn-warning" >        SUBMIT <span class="glyphicon glyphicon-send"></span>        </button>
</div>
</div>
</fieldset>
<div style="display:none" class="thankyou_message">
<!-- You can customize the thankyou message by editing the code below -->
<h2>Thanks! We will get back to you soon!
</h2>
</div>
</form>
</div>
</div> <!-- container -->
</section>
<!-- End CONTACT -->
<!-- FOOTER begings -->
<footer id="footer">
<div class="footer-widgets-wrap">
<div class="container text-center">
<div class="row">
<div class="col-sm-4 col-md-4">
<div class="footer-content">
<h4>KEEP IN TOUCH</h4>
<div class="footer-socials">
<a href="#"><i class="fa fa-facebook"></i></a>
<a href="#"><i class="fa fa-google-plus"></i></a>
<a href="#"><i class="fa fa-twitter"></i></a>
<a href="#"><i class="fa fa-pinterest"></i></a>
</div>
</div> <!-- end footer-content -->
</div> <!-- end col-sm-4 -->
<div class="col-sm-4 col-md-4">
<div class="footer-content">
<h4>ADDRESS</h4>
<p>C703, Engineering Hall C,<br>
50 Yonsei-ro, Seodaemun-gu,<br>
Seoul, Korea</p>
<p>02-2123-7734<br>
<a href="http://insight.yonsei.ac.kr/gnuboard/">http://insight.yonsei.ac.kr/gnuboard/</a></p>
</div> <!-- end footer-content -->
</div> <!-- end col-sm-4 -->
<div class="col-sm-4 col-md-4">
<div class="footer-content">
<h4>SUPPORT</h4>
<p>You need support? Visit our support forum and open tickets for you questions.</p>
<p><button type="button" class="btn btn-custom-sm">forum</button></p>
</div> <!-- end footer-content -->
</div> <!-- end col-sm-4 -->
</div> <!-- end row -->
</div> <!-- container -->
</div>
<div class="footer-bottom text-center"> <!-- Footer-copyright -->
<p>© insight.yonsei.ac.kr All rights reserved.</p>
</div>
</footer>
<!-- End footer begings -->
<!-- Scroll top -->
<a href="#" class="back-to-top"> <i class="fa fa-chevron-up"> </i> </a>
<!-- JavaScript
================================================== -->
<!-- Placed at the end of the document so the pages load faster -->
<!-- initialize jQuery Library -->
<script src="js/jquery.min.js"></script>
<!-- jquery easing -->
<script src="js/jquery.easing.min.js"></script>
<!-- Bootstrap -->
<script src="js/bootstrap.min.js"></script>
<!-- modal-effect -->
<script src="js/classie.js"></script>
<script src="js/modalEffects.js"></script>
<!-- Counter-up -->
<script src="js/waypoints.min.js" type="text/javascript"></script>
<script src="js/jquery.counterup.min.js" type="text/javascript"></script>
<!-- SmoothScroll -->
<script src="js/SmoothScroll.js"></script>
<!-- Parallax -->
<script src="js/jquery.stellar.min.js"></script>
<!-- Jquery-Nav -->
<script src="js/jquery.nav.js"></script>
<!-- Owl carousel -->
<script type="text/javascript" src="js/owl.carousel.min.js"></script>
<!-- App JS -->
<script src="js/app.js"></script>
<!-- Thank you message -->
<script data-cfasync="false" type="text/javascript" src="js/form-submission-handler.js"></script>
<!-- <script type="text/javascript" src="js/a.js"></script> -->
<!-- Switcher script for demo only -->
<script type="text/javascript" src="js/switcher.js"></script>
</body>
</html>