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?
Forum rules
Direct questions and answers, this room is not for general discussion please
Direct questions and answers, this room is not for general discussion please
-
- Lemon Quarter
- Posts: 2858
- Joined: November 6th, 2016, 9:58 pm
- Has thanked: 1385 times
- Been thanked: 3772 times
How do they do this?
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
-
- 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?
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
-
- 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?
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.
-
- 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?
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
-
- 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?
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
-
- Lemon Quarter
- Posts: 2417
- Joined: November 7th, 2016, 2:40 pm
- Has thanked: 83 times
- Been thanked: 782 times
Re: How do they do this?
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.
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.
-
- 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?
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...
Can HTML5 CSS3 transforms display that sort of stuff too?
Cheers,
Itsallaguess
-
- Lemon Quarter
- Posts: 2417
- Joined: November 7th, 2016, 2:40 pm
- Has thanked: 83 times
- Been thanked: 782 times
Re: How do they do this?
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!
Have a look at the rotating cube on https://css-tricks.com/how-css-perspective-works/ for example
But I am open to persuasion!
-
- 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?
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
-
- 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?
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.
-
- Lemon Quarter
- Posts: 2417
- Joined: November 7th, 2016, 2:40 pm
- Has thanked: 83 times
- Been thanked: 782 times
Re: How do they do this?
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
* 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
Who is online
Users browsing this forum: No registered users and 10 guests