Skip to content

Commit

Permalink
update project page
Browse files Browse the repository at this point in the history
  • Loading branch information
Alvin Liu authored and Alvin Liu committed Oct 9, 2023
1 parent 400bf8b commit e91d33b
Show file tree
Hide file tree
Showing 2 changed files with 105 additions and 111 deletions.
Binary file modified content/hyperhuman.pdf
View file
Binary file not shown.
216 changes: 105 additions & 111 deletions index.html
View file
Original file line number Diff line number Diff line change
Expand Up @@ -99,15 +99,15 @@
</a>
</span> -->
<!-- Code Link. -->
<!-- <span class="link-block">
<span class="link-block">
<a href="https://github.com/snap-research/HyperHuman"
class="external-link button is-normal is-rounded is-dark">
<span class="icon">
<i class="fab fa-github"></i>
</span>
<span>Code</span>
<span>Github</span>
</a>
</span> -->
</span>
<!-- Dataset Link.
<span class="link-block">
<a href="./#BibTeX" class="external-link button is-normal is-rounded is-dark">
Expand All @@ -119,6 +119,104 @@
</div>

</div>
<div class="container" width=1000px>
<div id="results-carousel" class="carousel results-carousel">
<div class="card-image" style="text-align: center;">
<img src="./content/examples/baby girl.png" width="80%">
<div class="card-content has-text-centered">
A baby girl with beautiful blue eyes standing next to a brown teddy bear.</div>
</div>
<div class="card-image" style="text-align: center;">
<img src="./content/examples/little girl.png" width="80%">
<div class="card-content has-text-centered">
A little girl with wavy hair and smile holding a teddy bear.</div>
</div>
<div class="card-image" style="text-align: center;">
<img src="./content/examples/A man and woman.png" width="80%">
<div class="card-content has-text-centered">
A man and woman seated at a table in a restaurant.
</div>
</div>
<div class="card-image" style="text-align: center;">
<img src="./content/examples/A cow laying.png" width="80%">
<div class="card-content has-text-centered">
A cow laying on the grass behind a man holding a cup of coffee.</div>
</div>
<div class="card-image" style="text-align: center;">
<img src="./content/examples/A young kid.png" width="80%">
<div class="card-content has-text-centered">
A young kid stands before a birthday cake decorated with captain America.</div>
</div>
<div class="card-image" style="text-align: center;">
<img src="./content/examples/A man who is sitting.png" width="80%">
<div class="card-content has-text-centered">
A man who is sitting in a bus looking away from the window.</div>
</div>
<div class="card-image" style="text-align: center;">
<img src="./content/examples/a man in a red.png" width="80%">
<div class="card-content has-text-centered">
A man in a red shirt is holding a skate board up over his head.</div>
</div>
<div class="card-image" style="text-align: center;">
<img src="./content/examples/two mean who are.png" width="80%">
<div class="card-content has-text-centered">
Two men who are sitting next to each other with a large pizza in front of them.</div>
</div>
<div class="card-image" style="text-align: center;">
<img src="./content/examples/two children.png" width="80%">
<div class="card-content has-text-centered">
Two children carry an enormous stuffed teddy bear.</div>
</div>
<div class="card-image" style="text-align: center;">
<img src="./content/examples/the upper half.png" width="80%">
<div class="card-content has-text-centered">
The upper half of a man posing for a photograph wearing a suit with a blue tie and matching pocket corner.</div>
</div>
<div class="card-image" style="text-align: center;">
<img src="./content/examples/an older man.png" width="80%">
<div class="card-content has-text-centered">
An older man is wearing a funny hat in his dining room.</div>
</div>
<div class="card-image" style="text-align: center;">
<img src="./content/examples/young man.png" width="80%">
<div class="card-content has-text-centered">
Young man on top of a snowboard wearing maroon jacket.</div>
</div>
<div class="card-image" style="text-align: center;">
<img src="./content/examples/man seating.png" width="80%">
<div class="card-content has-text-centered">
Man sitting on brick covered ground, appearing dirty and tired.</div>
</div>
<div class="card-image" style="text-align: center;">
<img src="./content/examples/a man wearing.png" width="80%">
<div class="card-content has-text-centered">
A man wearing a purple neck tie and glasses while sitting in a car.</div>
</div>
<div class="card-image" style="text-align: center;">
<img src="./content/examples/a man standing.png" width="80%">
<div class="card-content has-text-centered">
A man standing on grassy area next to trees.</div>
</div>
<div class="card-image" style="text-align: center;">
<img src="./content/examples/a girl with blue.png" width="80%">
<div class="card-content has-text-centered">
A girl with blue hair is taking a self portrait.</div>
</div>
<div class="card-image" style="text-align: center;">
<img src="./content/examples/a man wearing a helmet.png" width="80%">
<div class="card-content has-text-centered">
A man wearing a helmet is sitting on his blue motorcycle.</div>
</div>
<div class="card-image" style="text-align: center;">
<img src="./content/examples/a person dressed up.png" width="80%">
<div class="card-content has-text-centered">
A person dressed up taking a picture at a street with his fist up.</div>
</div>
<!-- <div class="item item-clevr" style="text-align: center;">
<img src="./content/our_more3.png" width="90%">
</div> -->
</div>
</div>
<!-- <div class="link">
<a href="https://arxiv.org/pdf/2212.02350.pdf" target="_blank">[Paper]</a>&nbsp;
<a href="https://github.com/alvinliu0/ANGIE" target="_blank">[Code]</a>&nbsp;
Expand All @@ -129,114 +227,6 @@
<!-- === Home Section Ends === -->

<!-- === Result Section Starts === -->
<div class="section">
<!-- <div class="title">More Qualitative Results (1024x1024)</div> -->
<div class="body">
<!-- Adjust the number of rows and columns (EVERY project differs). -->
<!-- <table width="100%" style="margin: 0pt 0; text-align: center;"> -->
<div class="container">
<div id="results-carousel" class="carousel results-carousel">
<div class="card-image" style="text-align: center;">
<img src="./content/examples/baby girl.png" width="90%">
<div class="card-content has-text-centered">
A baby girl with beautiful blue eyes standing next to a brown teddy bear.</div>
</div>
<div class="card-image" style="text-align: center;">
<img src="./content/examples/little girl.png" width="90%">
<div class="card-content has-text-centered">
A little girl with wavy hair and smile holding a teddy bear.</div>
</div>
<div class="card-image" style="text-align: center;">
<img src="./content/examples/A man and woman.png" width="90%">
<div class="card-content has-text-centered">
A man and woman seated at a table in a restaurant.
</div>
</div>
<div class="card-image" style="text-align: center;">
<img src="./content/examples/A cow laying.png" width="90%">
<div class="card-content has-text-centered">
A cow laying on the grass behind a man holding a cup of coffee.</div>
</div>
<div class="card-image" style="text-align: center;">
<img src="./content/examples/A young kid.png" width="90%">
<div class="card-content has-text-centered">
A young kid stands before a birthday cake decorated with captain America.</div>
</div>
<div class="card-image" style="text-align: center;">
<img src="./content/examples/A man who is sitting.png" width="90%">
<div class="card-content has-text-centered">
A man who is sitting in a bus looking away from the window.</div>
</div>
<div class="card-image" style="text-align: center;">
<img src="./content/examples/a man in a red.png" width="90%">
<div class="card-content has-text-centered">
A man in a red shirt is holding a skate board up over his head.</div>
</div>
<div class="card-image" style="text-align: center;">
<img src="./content/examples/two mean who are.png" width="90%">
<div class="card-content has-text-centered">
Two men who are sitting next to each other with a large pizza in front of them.</div>
</div>
<div class="card-image" style="text-align: center;">
<img src="./content/examples/two children.png" width="90%">
<div class="card-content has-text-centered">
Two children carry an enormous stuffed teddy bear.</div>
</div>
<div class="card-image" style="text-align: center;">
<img src="./content/examples/the upper half.png" width="90%">
<div class="card-content has-text-centered">
The upper half of a man posing for a photograph wearing a suit with a blue tie and matching pocket corner.</div>
</div>
<div class="card-image" style="text-align: center;">
<img src="./content/examples/an older man.png" width="90%">
<div class="card-content has-text-centered">
An older man is wearing a funny hat in his dining room.</div>
</div>
<div class="card-image" style="text-align: center;">
<img src="./content/examples/young man.png" width="90%">
<div class="card-content has-text-centered">
Young man on top of a snowboard wearing maroon jacket.</div>
</div>
<div class="card-image" style="text-align: center;">
<img src="./content/examples/man seating.png" width="90%">
<div class="card-content has-text-centered">
Man sitting on brick covered ground, appearing dirty and tired.</div>
</div>
<div class="card-image" style="text-align: center;">
<img src="./content/examples/a man wearing.png" width="90%">
<div class="card-content has-text-centered">
A man wearing a purple neck tie and glasses while sitting in a car.</div>
</div>
<div class="card-image" style="text-align: center;">
<img src="./content/examples/a man standing.png" width="90%">
<div class="card-content has-text-centered">
A man standing on grassy area next to trees.</div>
</div>
<div class="card-image" style="text-align: center;">
<img src="./content/examples/a girl with blue.png" width="90%">
<div class="card-content has-text-centered">
A girl with blue hair is taking a self portrait.</div>
</div>
<div class="card-image" style="text-align: center;">
<img src="./content/examples/a man wearing a helmet.png" width="90%">
<div class="card-content has-text-centered">
A man wearing a helmet is sitting on his blue motorcycle.</div>
</div>
<div class="card-image" style="text-align: center;">
<img src="./content/examples/a person dressed up.png" width="90%">
<div class="card-content has-text-centered">
A person dressed up taking a picture at a street with his fist up.</div>
</div>
<!-- <div class="item item-clevr" style="text-align: center;">
<img src="./content/our_more3.png" width="90%">
</div> -->
</div>
</div>

<!-- </table> -->

</div>
</div>
<!-- === Result Section Ends === -->

<!-- === Overview Section Starts === -->
Expand Down Expand Up @@ -296,6 +286,10 @@
<div class="teaser">
<img src="./content/teaser_half.png">
</div>
<i>Top:</i> The proposed <b>HyperHuman</b> simultaneously generates the coarse RGB, depth, normal, and high-resolution images conditioned on text and skeleton.
Both photo-realistic images and stylistic renderings can be created. <i>Bottom:</i> We compare with recent T2I models, showing better realism, quality, diversity, and controllability.
Note that in each 2x2 grid (<b>left</b>), the upper-left is <i>input</i> skeleton, while the others are jointly denoised normal, depth, and coarse RGB of 512x512.
With full model, we synthesize images up to 1024x1024 (<b>right</b>).
</div>
<!-- === Overview Section Ends === -->

Expand Down

0 comments on commit e91d33b

Please sign in to comment.