Realistic Skin Rendering in WebGL

http://alteredqualia.com/three/examples/webgl_materials_skin.html

by mef • 15 years ago

270 54 15 years ago

alteredqualia.com

grantjgordon• 15 years ago

So impressive, but so creepy.

beaumartinez• 15 years ago

There's a certain "plasticity" to the skin—very uncanny valley.

tsumnia2• 15 years ago

I think the plasticity comes from the ears and eyes, which to me seem a bit doctored.

I think the uncanny valley could be overcome with some subtle rigging to simulate a person's micro-gestures. Its not often you look at a human completely motionless, sans a wake.

zephjc• 15 years ago

Its the bloom shader if I get what you mean

ph0rque• 15 years ago

I kept thinking, "please don't open your eyes!" If he (it) did, I would have freaked out.

5hoom• 15 years ago

Beautiful.

It's great seeing advanced 3D effects (sub-surface scattering and normal mapping? I think thats what we're seeing here) escape the realm of typeA games and show up on a web browser, running at a very acceptable framerate.

Looks like web3D really is taking off, can't wait for more 3D engines written on top of webGL so non openGL-wizards can get in on the fun :)

aj700• 15 years ago

impressive. the lighting is a bit clipped - not smooth.

why didn't they do a beautiful girl's face instead?

tsumnia2• 15 years ago

My guess is to show off a realistic skin, showcasing a five o'clock shadow helps.

drivebyacct22• 15 years ago

>why didn't they do a beautiful girl's face instead?

Because it's a tech demo and it's a known texture in the OpenGL community? Not everyone in CS wants to stare at "beautiful girls", fortunately the Internet has created an outlet for such desires.

drivebyacct22• 15 years ago

I'm sorry. I completely understand karma grubbing is frowned upon and I couldn't care less, especially about this post, but I really don't understand how people are downvoting this post. Feel free to downvote this one... I'm just genuinely curious what part of my post above this one is at all controversial.

Am I supposed to like women? Am I supposed to objectify women at every turn, especially in an industry where they're already highly objectified and slighted?

dtf• 15 years ago

High-quality head scans that are free for general use are not easy to come by. Lee Perry-Smith has somewhat immortalized himself by releasing his scan to the community:

http://www.ir-ltd.net/royalty-free-high-quality-scan

But... for another angle on why not use a beautiful girl's face, here's an interesting theory:

http://filmicgames.com/archives/679

syaz1• 15 years ago

I actually think it's better to use imperfect skin for the purpose of showing off rendering engines. I really like how you can see some spots, scars, small details on the skin rather than a smooth silky pretty girl skin.

wccrawford2• 15 years ago

Anyone got a screenie for those of us who don't have a computer than can handle WebGL right this second?

vidar• 15 years ago

http://imgur.com/vFpwu

wccrawford2• 15 years ago

Thanks!

pbhjpbhj• 15 years ago

The head moves with mouse drag to present different angled views of the head with the light source staying static.

drivingmenuts• 15 years ago

OK, that's just creepy if you have a large screen.

Very good. But creepy.

rplacd2• 15 years ago

The face is cool, but three.js - the engine behind this - actually has quite a pleasingly orthogonal API as well. Worth taking a look at alongside this.

(And where is the save button when I need it ;_;)

dualogy4• 15 years ago

Upvote the story and it's in your "saved stories". Your submissions too -- so in fact, HN has become my new bookmarks manager.

rplacd2• 15 years ago

Thanks - I think I've actually had someone remind me of that before as well. Damn embarrassing.

saturn2• 15 years ago

Amazing. We are surely looking at the future of porn.

dualogy4• 15 years ago

Downvotes notwithstanding, I think saturn is fundamentally right.

clistctrl• 15 years ago

Anyone looking to use this mans idea, and is looking for a domain name I own meatgalore.com, give me an email if you're interested!

mikedmiked• 15 years ago

though pleasant, I didn't think he was that attractive...

zerostar07• 15 years ago

:( 3d.xxx is already taken. Definately skin games are going to be popular there.

yangyang• 15 years ago

Some of the other examples are pretty impressive too: https://github.com/mrdoob/three.js

simonw• 15 years ago

Here's the texture it uses (just from viewing source) - kind of interesting: http://alteredqualia.com/three/examples/obj/leeperrysmith/Ma...

moultano• 15 years ago

Is this actually doing subsurface scattering or just taking normals that are barely in shadow and giving them a red glow? I can't tell which it is (and I'm not sure how I would visually.)

bd3• 15 years ago

Author here.

It's approximation of subsurface scattering, modeled by combination of multiple Gaussian blurs done in texture space (there are 4 blur layers plus original normal mapped Blinn-Phong layer).

If you are interested in details, it's basically a simplified implementation of Nvidia's advanced skin rendering presented at GDC 2007:

http://developer.download.nvidia.com/presentations/2007/gdc/...

aschwo• 15 years ago

This is awesome! Are you able to implement the physically based specular term and still have acceptable performance?

You'll need the precomputed Beckmann distribution in a texture: http://developer.nvidia.com/node/171

roel_v2• 15 years ago

Is there a review of the state of the art in skin rendering somewhere? Maybe I'm wrong, but wasn't it concluded several years ago that for realistic skin we would have no option but to use multi layer subsurface scattering? (honest question, I seem to remember that the last time I read about this around 2007-2008 the consensus had just about converged to that conclusion).

czhiddy• 15 years ago

It's a little amusing how popular these WebGL reimplementations of 2004-era OpenGL demos are.

saturn2• 15 years ago

That's like saying "It's a little amusing how popular these web reimplementations of 2004-era word processors are". Dude, being on the web makes a huge difference. No software to install is massive. You can't link to a program running on your desktop. It's a great leap forward.

mrdoob2• 15 years ago

bugsbunnyak• 15 years ago

Hopefully JS/WebGL will help enable a client-server model for medical image analysis analogous to AWS/Hadoop/etc. JS has been successful not only for its ubiquity, but also because it - warts and all - hits a development sweet spot. Right now the big open source med image projects (MITK, Slicer, etc.) are almost all C++, so the barrier to entry is too high for some people who might be able to contribute substantially within the JS sweet spot.

Here's a really neat step in this direction: http://www.nmr.mgh.harvard.edu/~rudolph/webgl/brain_viewer/b...

roel_v2• 15 years ago

Really? You feel that reimplementing a word processor on the web is a major leap forward? To me it looks like old wine in new bags. I could link to word processor-like Java Applets in 1998. I realize it's not 100% the same, but trying to re-implement all these things we've had for 10 years in substandard technology just seems like a procession of Echternach.

(btw current web word processors barely approach Wordpad level - the level of functionality we had on the desktop in 1995).

dualogy4• 15 years ago

It's kind of a gift for those of us who are really late to the 3D CG game and have to play catch-up with all the awesome techniques, algos and shaders that were developed over the last 8-or-so years but who have been working on the web all these years... for once, us old dogs can learn old tricks and still be totally cutting edge!

But personally I think this is just the beginning. To get from 1994 quality (Doom) to 2004 levels (as you say) in-the-browser didn't take "us" 10 years but more like 1-3. When WebGL and "desktop GL" will slowly but surely converge over the next 3-8 years, it will be a real game changer. People will rave about popping up completely new kinds of "3D games" casually and instantly "in the browser". It'll be awesome. It's not too late to jump on the bandwagon and finally we're now also at a fairly stable point where it's not too early either. WebGL in Chrome and Firefox is solid these days. Keeps getting better. Opera is committed to it too. It's cross-platform. And IE? There's 'Chrome Frame' for that (or alternatively some obscure plugin called "iewebgl" or some such, although Chrome Frame should be more sensible).

zokier• 15 years ago

WebGL and desktop GL will slowly converge? Isn't WebGL already basically just a JS API for OpenGL? Doesn't that make them already relatively converged?

code_jockey• 15 years ago

I half expected it to suddenly open it's eyes and cause me to change my pants.

sirwanqutbi• 15 years ago

everything in this looks real, except the eye lids dont have eye lashes so the light rebounding off the sealed eyelid looks crap. otherwise cool stuff

mxavier• 15 years ago

I opened the tab and then forgot about it while reading other stories. Scared the shit out of me when I got around to this tab.

nextparadigms• 15 years ago

Any way to see what's there besides visiting the link? (no WebGL) - like picture or video?

Ryan_IRL• 15 years ago

I think the lighting is more impressive than the skin. Still, a cool tech demo!

palish• 15 years ago

Nice. I've actually been working on this. Work in progress: http://content.screencast.com/users/shawnpresser/folders/Jin...

antimora• 15 years ago

For fun, the figure should open eyes after a minute so of viewing =)

delackner• 15 years ago

Firefox 4.0 Mac, hung for about 10 seconds with a black screen, popped open a window saying the script is unresponsive so I told it to Stop. It hung another 2-3 seconds, finally showed a face, and crashed the browser. Fun!

ericHosick• 15 years ago

Macbook Pro 13" Core 2 Chrome. Worked for me and a little "choppy".

tintin• 15 years ago

Maybe a silly question, but can you abuse WebGL for lets say multi-channel audio processing (byte array, data URI)?

Realistic Skin Rendering in WebGL

Related Stories