Skip to content

Commit 8421438

Browse files
Lewis-lv0Lewis-lv0
authored
Add files via upload
1 parent 563846b commit 8421438

File tree

2 files changed

+49
-29
lines changed

2 files changed

+49
-29
lines changed

‎index.html‎

Lines changed: 45 additions & 28 deletions
Original file line numberDiff line numberDiff line change
@@ -217,7 +217,7 @@ <h4 class="pb-2">Method</h4>
217217
<div class="col-md-8 mx-auto">
218218

219219
<div id="multi-scaffold">
220-
<h4>Results</h4>
220+
<h4>Applications</h4>
221221
<h5>Interactive view and pose synthesis</h5>
222222
<p class="text-justify">
223223
Leveraging the unified framework, we enable interactive synthesis of human avatars, allowing
@@ -244,33 +244,56 @@ <h5>Interactive view and pose synthesis</h5>
244244
</div>
245245
</div>
246246
</div>
247+
<div class="row mb-4 pt-2">
248+
<div class="col-md-8 mx-auto">
247249

250+
<div id="multi-view-video">
251+
<h5>4D Consistent Multi-view Video Generation</h5>
252+
<p class="text-justify">
253+
By alternating the sampling between view and pose synthesis, we can generate synchronized multi-view videos of human performers from only a single image.
254+
</p>
255+
<div class="slider-container">
256+
<div class="slider" id="slider2">
257+
<video class="video-slide" src="./assets/videos/subject_200973_grid.mp4" controls
258+
width="80%" playsinline="" autoplay="autoplay" loop="loop" preload=""
259+
muted=""></video>
260+
<video class="video-slide" src="./assets/videos/subject_200970_grid.mp4" controls
261+
width="80%" playsinline="" autoplay="autoplay" loop="loop" preload=""
262+
muted=""></video>
263+
<video class="video-slide" src="./assets/videos/subject_200986_grid.mp4" controls
264+
width="80%" playsinline="" autoplay="autoplay" loop="loop" preload=""
265+
muted=""></video>
266+
<video class="video-slide" src="./assets/videos/subject_200972_grid.mp4" controls
267+
width="80%" playsinline="" autoplay="autoplay" loop="loop" preload=""
268+
muted=""></video>
269+
<video class="video-slide" src="./assets/videos/subject_200992_grid.mp4" controls
270+
width="80%" playsinline="" autoplay="autoplay" loop="loop" preload=""
271+
muted=""></video>
272+
</div>
273+
<button class="prev" onclick="changeSlide(-1, 'slider2')">&#10094;</button>
274+
<button class="next" onclick="changeSlide(1, 'slider2')">&#10095;</button>
275+
</div>
276+
</div>
277+
</div>
278+
</div>
248279
<div class="row mb-4 pt-2">
249280
<div class="col-md-8 mx-auto">
250281

251282
<div id="nvs">
283+
<h4>Results</h4>
252284
<h5>Novel view synthesis</h5>
253285
<p class="text-justify">
254286
We demonstrate the capability of our method to synthesize view-consistent avatars from a
255287
single image.
256288
</p>
257289
<div class="slider-container">
258-
<div class="slider" id="slider2">
290+
<div class="slider" id="slider3">
259291
<video class="video-slide" src="./assets/videos/celeb-nvs.mp4" controls
260292
width="100%" playsinline="" autoplay="autoplay" loop="loop" preload=""
261293
muted=""></video>
262-
<!-- <video class="video-slide" src="./assets/videos/novel-view.mp4" controls
263-
width="100%" playsinline="" autoplay="autoplay" loop="loop" preload=""
264-
muted=""></video> -->
265-
<!-- <video class="video-slide" src="./assets/videos/novel-view-comparison-1.mp4" controls
266-
width="100%" playsinline="" autoplay="autoplay" loop="loop" preload=""
267-
muted=""></video>
268-
<video class="video-slide" src="./assets/videos/novel-view-comparison-2.mp4" controls
269-
width="100%" playsinline="" autoplay="autoplay" loop="loop" preload=""
270-
muted=""></video> -->
271294
</div>
272-
<button class="prev" onclick="changeSlide(-1, 'slider2')">&#10094;</button>
273-
<button class="next" onclick="changeSlide(1, 'slider2')">&#10095;</button>
295+
<button class="prev" onclick="changeSlide(-1, 'slider3')">&#10094;</button>
296+
<button class="next" onclick="changeSlide(1, 'slider3')">&#10095;</button>
274297
</div>
275298
</div>
276299
</div>
@@ -285,25 +308,19 @@ <h5>Novel pose animation</h5>
285308
single image.
286309
</p>
287310
<div class="slider-container">
288-
<div class="slider" id="slider3">
311+
<div class="slider" id="slider4">
289312
<video class="video-slide" src="./assets/videos/novel-pose-4.mp4" controls
290313
width="100%" playsinline="" autoplay="autoplay" loop="loop" preload=""
291314
muted=""></video>
292315
<video class="video-slide" src="./assets/videos/novel-pose-5.mp4" controls
293316
width="100%" playsinline="" autoplay="autoplay" loop="loop" preload=""
294317
muted=""></video>
295-
<!-- <video class="video-slide" src="./assets/videos/novel-pose-comparison-1.mp4" controls
296-
width="100%" playsinline="" autoplay="autoplay" loop="loop" preload=""
297-
muted=""></video>
298-
<video class="video-slide" src="./assets/videos/novel-pose-comparison-2.mp4" controls
299-
width="100%" playsinline="" autoplay="autoplay" loop="loop" preload=""
300-
muted=""></video> -->
301318
<video class="video-slide" src="./assets/videos/novel-pose-3.mp4" controls
302319
width="100%" playsinline="" autoplay="autoplay" loop="loop" preload=""
303320
muted=""></video>
304321
</div>
305-
<button class="prev" onclick="changeSlide(-1, 'slider3')">&#10094;</button>
306-
<button class="next" onclick="changeSlide(1, 'slider3')">&#10095;</button>
322+
<button class="prev" onclick="changeSlide(-1, 'slider4')">&#10094;</button>
323+
<button class="next" onclick="changeSlide(1, 'slider4')">&#10095;</button>
307324
</div>
308325
</div>
309326
</div>
@@ -318,7 +335,7 @@ <h5>Comparison with baselines</h5>
318335
We show the comparison with baselines on the task of novel view synthesis and novel pose animation.
319336
</p>
320337
<div class="slider-container">
321-
<div class="slider" id="slider4">
338+
<div class="slider" id="slider5">
322339
<video class="video-slide" src="./assets/videos/novel-view-comparison-1.mp4" controls
323340
width="100%" playsinline="" autoplay="autoplay" loop="loop" preload=""
324341
muted=""></video>
@@ -332,17 +349,17 @@ <h5>Comparison with baselines</h5>
332349
width="100%" playsinline="" autoplay="autoplay" loop="loop" preload=""
333350
muted=""></video>
334351
</div>
335-
<button class="prev" onclick="changeSlide(-1, 'slider4')">&#10094;</button>
336-
<button class="next" onclick="changeSlide(1, 'slider4')">&#10095;</button>
352+
<button class="prev" onclick="changeSlide(-1, 'slider5')">&#10094;</button>
353+
<button class="next" onclick="changeSlide(1, 'slider5')">&#10095;</button>
337354
</div>
338355
</div>
339356
</div>
340357
</div>
341358

342359
<script src="./static/js/script.js"></script>
343-
<div class="row mb-4" id="main-video">
360+
<!-- <div class="row mb-4" id="main-video">
344361
<div class="col-md-8 mx-auto grey-container">
345-
<h4 class="pb-2">Main Video</h4>
362+
<h4 class="pb-2">Video</h4>
346363
<p>
347364
In this video, we demonstrate results for in-the-wild avatar synthesis, comparisons with
348365
baselines, ablation analysis and additional applications.
@@ -354,7 +371,7 @@ <h4 class="pb-2">Main Video</h4>
354371
allowfullscreen></iframe>
355372
</div>
356373
</div>
357-
</div>
374+
</div> -->
358375
<div class="row mb-4" id="reference">
359376
<div class="col-md-8 mx-auto grey-container">
360377
<h4 class="pb-2">BibTeX</h4>

‎static/js/script.js‎

Lines changed: 4 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -3,7 +3,8 @@ let slideIndices = {
33
slider1: 0,
44
slider2: 0,
55
slider3: 0,
6-
slider4: 0
6+
slider4: 0,
7+
slider5: 0
78
};
89

910
function changeSlide(n, sliderId) {
@@ -36,6 +37,7 @@ showSlides(0, 'slider1');
3637
showSlides(0, 'slider2');
3738
showSlides(0, 'slider3');
3839
showSlides(0, 'slider4');
40+
showSlides(0, 'slider5');
3941

4042
let autoplay = true;
4143
let autoplayInterval = 10000; // Change slides every 10 seconds
@@ -46,5 +48,6 @@ if (autoplay) {
4648
changeSlide(1, 'slider2');
4749
changeSlide(1, 'slider3');
4850
changeSlide(1, 'slider4');
51+
changeSlide(1, 'slider5');
4952
}, autoplayInterval);
5053
}

0 commit comments

Comments
 (0)