Donate to Remove ads

Got a credit card? use our Credit Card & Finance Calculators

Thanks to johnstevens77,Bhoddhisatva,scotia,Anonymous,Cornytiv34, for Donating to support the site

How do they do this?

Straight answers to factual questions
Forum rules
Direct questions and answers, this room is not for general discussion please
Clitheroekid
Lemon Quarter
Posts: 2856
Joined: November 6th, 2016, 9:58 pm
Has thanked: 1384 times
Been thanked: 3771 times

How do they do this?

#358856

Postby Clitheroekid » November 21st, 2020, 6:01 pm

I enjoyed this short clip about a rather excellent painting, but I'd like to know how the 3D effect in the video was created out of a 2D object - https://www.sothebys.com/en/articles/an ... Y28udWs%3D

Itsallaguess
Lemon Half
Posts: 9129
Joined: November 4th, 2016, 1:16 pm
Has thanked: 4140 times
Been thanked: 10023 times

Re: How do they do this?

#358865

Postby Itsallaguess » November 21st, 2020, 6:29 pm

Clitheroekid wrote:
I enjoyed this short clip about a rather excellent painting, but I'd like to know how the 3D effect in the video was created out of a 2D object - https://www.sothebys.com/en/articles/an ... Y28udWs%3D


I think what we're seeing in the video is actually a 3D model of the original 2D painted scene, where they've used individual image masks of each of the major painted elements to help create the modelled elements in the 3D scene, and then they've navigated a camera around the digitised 3D scene to create the video...

It's a brilliant process, and it really brings the paining to life.

What a great way to use technology..

Cheers,

Itsallaguess

swill453
Lemon Half
Posts: 7962
Joined: November 4th, 2016, 6:11 pm
Has thanked: 984 times
Been thanked: 3643 times

Re: How do they do this?

#358875

Postby swill453 » November 21st, 2020, 6:46 pm

Itsallaguess wrote:I think what we're seeing in the video is actually a 3D model of the original 2D scene, where they've used individual image masks of each of the major painted elements to help create the modelled elements in the 3D scene, and then they've navigated a camera around the 3D scene to create the video.

It's a brilliant process, and it really brings the paining to life.

What a great way to use technology..

I agree it's impressive. But it does mean that someone has created (faked?), by computer, some parts of the scene that didn't exist because they were obscured by foreground elements.

Scott.

Itsallaguess
Lemon Half
Posts: 9129
Joined: November 4th, 2016, 1:16 pm
Has thanked: 4140 times
Been thanked: 10023 times

Re: How do they do this?

#358879

Postby Itsallaguess » November 21st, 2020, 6:49 pm

swill453 wrote:
Itsallaguess wrote:
I think what we're seeing in the video is actually a 3D model of the original 2D scene, where they've used individual image masks of each of the major painted elements to help create the modelled elements in the 3D scene, and then they've navigated a camera around the 3D scene to create the video.

It's a brilliant process, and it really brings the paining to life.

What a great way to use technology..


I agree it's impressive.

But it does mean that someone has created (faked?), by computer, some parts of the scene that didn't exist because they were obscured by foreground elements.


Yes, they have. It wouldn't have been possible to deliver these video results without some level of artistic-licence regarding that...

To be honest, they've done a brilliant job of that specific aspect alone, never mind all the other technological marvels required to produce the video...

Cheers,

Itsallaguess

onthemove
Lemon Slice
Posts: 540
Joined: June 24th, 2017, 4:03 pm
Has thanked: 722 times
Been thanked: 471 times

Re: How do they do this?

#358907

Postby onthemove » November 21st, 2020, 9:31 pm

Clitheroekid wrote:I enjoyed this short clip about a rather excellent painting, but I'd like to know how the 3D effect in the video was created out of a 2D object - https://www.sothebys.com/en/articles/an ... Y28udWs%3D


Not sure what they'll have used in their particular case, but here's how you can achieve it with blender 2.8, photoshop plus another utility.

https://www.youtube.com/watch?v=dHXRrpG_oSk

stewamax
Lemon Quarter
Posts: 2417
Joined: November 7th, 2016, 2:40 pm
Has thanked: 83 times
Been thanked: 781 times

Re: How do they do this?

#358908

Postby stewamax » November 21st, 2020, 9:48 pm

Very effective. But it doesn't look like true 3D but a series of 2D layers displayed using website HTML5 CSS3 transforms*. Among other things the latter allow page elements to be moved in perspective. So if the picture is turned into a series of slices ("foreground men" and so on), the slices can be moved relative to one another in an apparent 3D way.
CSS3 transforms are one way to provide the parallax scrolling effect used by many websites where the foreground (usually separate blocks of text) moves over a background (usually of photos), with the text moving faster than the photos. This gives an illusion of depth as it simulates parallax.

The 3-D acid test is simply whether the picture can be rotated such that a true side-view is displayed.

* notably the 2.5D scale3d transform that resizes elements in pseudo-3D and the perspective transform which gives 3-D depth.

Itsallaguess
Lemon Half
Posts: 9129
Joined: November 4th, 2016, 1:16 pm
Has thanked: 4140 times
Been thanked: 10023 times

Re: How do they do this?

#358911

Postby Itsallaguess » November 21st, 2020, 10:02 pm

stewamax wrote:
Very effective. But it doesn't look like true 3D but a series of 2D layers displayed using website HTML5 CSS3 transforms*. Among other things the latter allow page elements to be moved in perspective. So if the picture is turned into a series of slices ("foreground men" and so on), the slices can be moved relative to one another in an apparent 3D way.
CSS3 transforms are one way to provide the parallax scrolling effect used by many websites where the foreground (usually separate blocks of text) moves over a background (usually of photos), with the text moving faster than the photos. This gives an illusion of depth as it simulates parallax.

The 3-D acid test is simply whether the picture can be rotated such that a true side-view is displayed.

* notably the 2.5D scale3d transform that resizes elements in pseudo-3D and the perspective transform which gives 3-D depth.


I wondered if they were using 2D slices in that way at first, but then I saw the 3D turning barrel that comes in from the right hand side from around 26 seconds into the video, and you can clearly see a proper 3D turning effect on that barrel, rather than just 'slicing' of 2D depth-fields...

Image

Can HTML5 CSS3 transforms display that sort of stuff too?

Cheers,

Itsallaguess

stewamax
Lemon Quarter
Posts: 2417
Joined: November 7th, 2016, 2:40 pm
Has thanked: 83 times
Been thanked: 781 times

Re: How do they do this?

#358978

Postby stewamax » November 22nd, 2020, 10:34 am

Hmm.... I can't see anything in the second photo that isn't a 2.5D skewed or distorted version of the first photo, bearing in mind that a skewing can reveal something that was squashed to invisibility before the transform was applied (and vice versa).
Have a look at the rotating cube on https://css-tricks.com/how-css-perspective-works/ for example

But I am open to persuasion!

Itsallaguess
Lemon Half
Posts: 9129
Joined: November 4th, 2016, 1:16 pm
Has thanked: 4140 times
Been thanked: 10023 times

Re: How do they do this?

#359004

Postby Itsallaguess » November 22nd, 2020, 1:00 pm

stewamax wrote:
Hmm.... I can't see anything in the second photo that isn't a 2.5D skewed or distorted version of the first photo, bearing in mind that a skewing can reveal something that was squashed to invisibility before the transform was applied (and vice versa).

Have a look at the rotating cube on https://css-tricks.com/how-css-perspective-works/ for example

But I am open to persuasion!


No, I think it's you who's persuaded me!

It's been a long time since I've done much on the CSS side of things, and the page you linked to was really interesting, so thanks for that, but the icing on the cake for me, and the moment when I was completely persuaded that you're right, and they've done the video linked in CK's first post in the way you've suggested, was when I opened one of the sub-links contained on the CSS page above, which led to this CSS-Perspective demo page, which includes the all-important image-masks too -

https://codepen.io/amit_sheen/pen/WNweryv

It's just amazing that those pages are being fully turned in CSS..

Cheers,

Itsallaguess

onthemove
Lemon Slice
Posts: 540
Joined: June 24th, 2017, 4:03 pm
Has thanked: 722 times
Been thanked: 471 times

Re: How do they do this?

#359010

Postby onthemove » November 22nd, 2020, 1:43 pm

Itsallaguess wrote:
stewamax wrote:
Hmm.... I can't see anything in the second photo that isn't a 2.5D skewed or distorted version of the first photo, bearing in mind that a skewing can reveal something that was squashed to invisibility before the transform was applied (and vice versa).

Have a look at the rotating cube on https://css-tricks.com/how-css-perspective-works/ for example

But I am open to persuasion!


No, I think it's you who's persuaded me!

It's been a long time since I've done much on the CSS side of things, and the page you linked to was really interesting, so thanks for that, but the icing on the cake for me, and the moment when I was completely persuaded that you're right, and they've done the video linked in CK's first post in the way you've suggested, was when I opened one of the sub-links contained on the CSS page above, which led to this CSS-Perspective demo page, which includes the all-important image-masks too -

https://codepen.io/amit_sheen/pen/WNweryv

It's just amazing that those pages are being fully turned in CSS..

Cheers,

Itsallaguess


How did they get the undulations in the landscape at 0:56 to 1:00 if it's done with css?

As the camera pans back, you can see it isn't a simple geometric transform - watch the grass/ground on either side of the river... there are 1 or 2 2d planes for some of the trees, but the ground is not flat.. it has undulations in it that are continuous in the depth plane, but not uniform/geometric.

While I doubt they used the Blender (it's free software), I suspect they used one of the other commercial 3d modelling packages that provides similar functionality.

The really interesting bit for me is the 'context aware fill' in photoshop, and according to the comments below the video I linked to, similar is also available in gimp. If you watch the video I linked, they use it to fill in the gaps in the background behind where the foreground elements have been cut out.

stewamax
Lemon Quarter
Posts: 2417
Joined: November 7th, 2016, 2:40 pm
Has thanked: 83 times
Been thanked: 781 times

Re: How do they do this?

#359206

Postby stewamax » November 23rd, 2020, 10:09 am

Yes - something like Photoshop's Context-aware Fill* is needed to fill in parts of a background layer that are obscured by a front layer. But it is not clairvoyant and cannot automatically fill in features that are not already anywhere in the picture to copy!

* for Photoshop non-users this is a clever combination of the familiar 'magic wand' tool (to delineate the area to be filled) and the 'rubber stamp' tool to copy the fill from an adjacent area


Return to “Does anyone know?”

Who is online

Users browsing this forum: No registered users and 7 guests