WEBVTT 1 00:00:04.458 --> 00:00:09.002 Realistic advanced Anamorphic 2 00:00:09.002 --> 00:00:11.613 GCC academy 3 00:00:24.842 --> 00:00:26.192 Hello 4 00:00:26.192 --> 00:00:31.544 This is Kim Saetbyeol for realistic media content lectures 5 00:00:31.544 --> 00:00:35.294 In this lecture, we will learn about anamorphic 6 00:00:35.294 --> 00:00:38.683 which is a method that gives unique immersiveness 7 00:00:38.683 --> 00:00:42.000 in visual arts and films 8 00:00:42.000 --> 00:00:45.550 Anamorphic is a technology 9 00:00:45.550 --> 00:00:49.732 which makes a distorted image on a flat surface 10 00:00:49.732 --> 00:00:52.307 look right on from a certain angle or through certain equipment 11 00:00:52.307 --> 00:00:57.000 This method is used in various realistic media 12 00:00:57.000 --> 00:01:01.000 like film, advertisement, and media art 13 00:01:01.000 --> 00:01:06.802 and gives visual amazement and depth to audience 14 00:01:06.802 --> 00:01:10.352 Through this lecture, we will learn anamorphic's principles, 15 00:01:10.352 --> 00:01:15.188 workflows, various use cases, etc. 16 00:01:15.188 --> 00:01:19.988 and see how you can apply it to your own creative process 17 00:01:19.988 --> 00:01:22.555 with practice examples 18 00:01:23.755 --> 00:01:27.428 Understanding Anamorphic 19 00:01:27.822 --> 00:01:29.972 First of all, what is anamorphic? 20 00:01:29.972 --> 00:01:35.000 It is a media facade visual distortion technique that allows you to see a complete image 21 00:01:35.000 --> 00:01:40.653 only from a specific location or viewing angle 22 00:01:40.653 --> 00:01:44.317 This technique utilizes precise punctuation 23 00:01:44.317 --> 00:01:48.067 that allows you to enjoy the fully aligned image 24 00:01:48.067 --> 00:01:50.822 at specific locations 25 00:01:50.822 --> 00:01:56.247 Even on flat surfaces of buildings or square LED screens 26 00:01:56.247 --> 00:01:59.597 it gives a three-dimensional effect to the audience 27 00:01:59.597 --> 00:02:04.000 giving them a sense of depth and space 28 00:02:04.000 --> 00:02:06.050 The principle of anamorphic 29 00:02:06.050 --> 00:02:10.564 were found in 16th and 17th century art 30 00:02:10.564 --> 00:02:14.114 In modern times, it is applied and utilized in 31 00:02:14.114 --> 00:02:17.663 media art and projection mapping 32 00:02:17.663 --> 00:02:21.198 This is when an optical illusion is used 33 00:02:21.198 --> 00:02:23.998 An optical illusion is a visual phenomenon that makes the object appear three-dimensional 34 00:02:23.998 --> 00:02:27.703 depending on the angle at which you look at it 35 00:02:27.703 --> 00:02:33.812 with a visual information in distorted images 36 00:02:33.812 --> 00:02:38.662 Anamorphic is a technology that projects a flat image 37 00:02:38.662 --> 00:02:43.000 that appears only at a certain angle and looks 3D 38 00:02:43.000 --> 00:02:47.000 The image is distorted based on the observer's point of view 39 00:02:47.000 --> 00:02:52.000 and only gives a sense of three-dimensionality at that point 40 00:02:52.000 --> 00:02:56.600 Actually, when you look at it from a different point than that point 41 00:02:56.600 --> 00:03:00.000 the illusion may not be visible 42 00:03:00.000 --> 00:03:05.450 The distorted image is transformed with the appropriate perspective and proportion 43 00:03:05.450 --> 00:03:10.000 to match the projection target 44 00:03:10.000 --> 00:03:13.850 So the main principle of this anamorphic is 45 00:03:13.850 --> 00:03:17.000 based on where the audience is standing 46 00:03:17.000 --> 00:03:21.218 distorting and projecting images 47 00:03:21.218 --> 00:03:26.574 For example, when looking from a certain direction on one side of a building 48 00:03:26.574 --> 00:03:30.774 it's as if objects are popping out of the screen 49 00:03:30.774 --> 00:03:35.346 or looks like it's floating in space 50 00:03:35.346 --> 00:03:37.746 Anamorphic media facade 51 00:03:37.746 --> 00:03:43.178 is widely used in shopping malls, advertising buildings, and art works 52 00:03:43.178 --> 00:03:48.778 Because it provides a very colorful and unique visual experience 53 00:03:48.778 --> 00:03:53.287 it has been getting a lot of attention recently 54 00:03:53.287 --> 00:03:59.137 Representative examples include COEX in Seoul and the Gwanghwamun History Museum 55 00:03:59.137 --> 00:04:02.237 Shibuya, Tokyo, Times Square in New York's 56 00:04:02.237 --> 00:04:04.673 digital signages 57 00:04:04.673 --> 00:04:09.773 These media facades are visible only when the audience stands in a certain position 58 00:04:09.773 --> 00:04:12.851 with the 3D effect revealed 59 00:04:12.851 --> 00:04:16.149 and this anamorphic has brought them popularity 60 00:04:18.604 --> 00:04:21.254 To create anamorphic 61 00:04:21.254 --> 00:04:24.257 we need various software 62 00:04:24.257 --> 00:04:28.707 3D programs that can create distorted images 63 00:04:28.707 --> 00:04:34.921 are Blender, C4D, Maya, 3D MAX, etc. 64 00:04:34.921 --> 00:04:39.471 Also, the corresponding real-time projection mapping program 65 00:04:39.471 --> 00:04:42.436 are used for the distortion 66 00:04:42.436 --> 00:04:45.836 MadMapper, Resolume Arena 67 00:04:45.836 --> 00:04:50.337 and TouchDesigner are utilized 68 00:04:50.337 --> 00:04:55.445 There are three steps in the anamorphic workflow 69 00:04:55.445 --> 00:05:01.762 First, the structure must be 3D modeled and simulated 70 00:05:01.762 --> 00:05:05.212 At this time, the outer and inner surfaces 71 00:05:05.212 --> 00:05:10.772 are both made and used 72 00:05:10.772 --> 00:05:14.172 Secondly, for visual illusions 73 00:05:14.172 --> 00:05:17.277 a distorted image must be created 74 00:05:17.277 --> 00:05:20.827 I would like to introduce Unreal Engine 75 00:05:20.827 --> 00:05:24.832 which uses N display 76 00:05:24.832 --> 00:05:27.832 Thirdly, by using software 77 00:05:27.832 --> 00:05:30.396 you need to set up a projection 78 00:05:30.396 --> 00:05:34.796 In order for the corresponding distortion phenomenon to be properly displayed 79 00:05:34.796 --> 00:05:38.634 it is important to get the illusion point exactly right 80 00:05:39.605 --> 00:05:43.377 Creating Round and Rectangular Images Using Optical Illusions 81 00:05:44.346 --> 00:05:48.346 Next is using optical illusions 82 00:05:48.346 --> 00:05:52.653 to create round and rectangular image production 83 00:05:52.653 --> 00:05:57.000 Round and rectangular images using optical illusions 84 00:05:57.000 --> 00:06:00.150 combined with digital signage formats 85 00:06:00.150 --> 00:06:02.450 provide interesting visual effects 86 00:06:02.450 --> 00:06:05.178 capturing the audience's attention 87 00:06:05.178 --> 00:06:08.678 Below are some of the different forms of digital signage 88 00:06:08.678 --> 00:06:13.376 where optical illusion effect was used 89 00:06:13.376 --> 00:06:16.526 In the case of round digital signage, 90 00:06:16.526 --> 00:06:21.000 there are circular, dome-shaped, and ceiling signage types 91 00:06:21.000 --> 00:06:25.700 The circular curved display has a visual focal point 92 00:06:25.700 --> 00:06:29.250 which makes it suitable for a circular image 93 00:06:29.250 --> 00:06:31.198 or rotating optical illusion 94 00:06:31.198 --> 00:06:36.713 For example, an optical illusion of waves spreading out within a circle 95 00:06:36.713 --> 00:06:39.563 or an image of turning gears 96 00:06:39.563 --> 00:06:44.614 can create an effect that makes it seem as if the structure itself is rotating 97 00:06:44.614 --> 00:06:49.814 The dome-shaped ceiling signage is a form that wraps around in all directions 98 00:06:49.814 --> 00:06:54.406 which makes optical illusions with the sky or space as a background suitable 99 00:06:54.406 --> 00:06:58.456 For example, through the effect of stars pouring down from the sky 100 00:06:58.456 --> 00:07:02.525 it can make the audience feel immersed inside the dome 101 00:07:04.723 --> 00:07:07.473 In the case of a multi-faceted book display, 102 00:07:07.473 --> 00:07:11.436 it is a structure that combines several rectangular screens 103 00:07:11.436 --> 00:07:15.436 Using the three-dimensional optical illusion effect of square signage 104 00:07:15.436 --> 00:07:19.586 an illusion of each side showing the same object from a different direction 105 00:07:19.586 --> 00:07:21.693 is possible 106 00:07:21.693 --> 00:07:24.993 This makes it seem as if the objects in the signage 107 00:07:24.993 --> 00:07:29.218 appearing from multiple angles 108 00:07:29.218 --> 00:07:33.218 Among the rectangular signage, utilizing the edges 109 00:07:33.218 --> 00:07:35.968 it can express three-dimensional cubes 110 00:07:35.968 --> 00:07:37.911 or stairs 111 00:07:37.911 --> 00:07:42.042 The edges of the screen appear to be connected to real space 112 00:07:42.042 --> 00:07:46.693 in the illusion, which makes it look like 113 00:07:46.693 --> 00:07:48.543 something is actually going to pop out 114 00:07:48.543 --> 00:07:51.792 of the screen with a strong sense of three-dimensionality 115 00:07:51.792 --> 00:07:57.327 For these signage types, the ratios vary greatly 116 00:07:57.327 --> 00:08:00.777 It must be able to respond in various ways to 117 00:08:00.777 --> 00:08:04.634 horizontal, vertical, square, etc. shaped signages 118 00:08:04.634 --> 00:08:07.812 and illusionary effects by shape 119 00:08:07.812 --> 00:08:10.162 reconstructs the audience's experience of space 120 00:08:10.162 --> 00:08:15.327 through various digital signage 121 00:08:15.327 --> 00:08:18.337 and lets the content feel richer 122 00:08:21.109 --> 00:08:25.809 Next is modelling the corresponding 123 00:08:25.809 --> 00:08:30.257 actual images according to these signage types 124 00:08:30.257 --> 00:08:33.857 A cube in Blender 125 00:08:33.857 --> 00:08:39.257 Simply press Shift+A and you will get Mesh→Cube 126 00:08:39.257 --> 00:08:42.327 This will show up when you do that 127 00:08:42.327 --> 00:08:45.735 The form I have created now is 128 00:08:45.735 --> 00:08:51.346 two parts, the outer and inner 129 00:08:51.346 --> 00:08:56.396 Even in the case of cubes, we adjust the size 130 00:08:56.396 --> 00:09:00.356 to make a long horizontal shape 131 00:09:00.356 --> 00:09:06.653 or also design vertically corresponding shapes 132 00:09:06.653 --> 00:09:10.303 So you have a space where you can screen 133 00:09:10.303 --> 00:09:14.554 and determine where exactly it will be 134 00:09:14.554 --> 00:09:19.104 Have the internal space of screening 135 00:09:19.104 --> 00:09:25.505 and also the cover space 136 00:09:25.505 --> 00:09:29.901 Let's try making it from the beginning together 137 00:09:29.901 --> 00:09:31.651 Open a new file 138 00:09:38.126 --> 00:09:39.584 Let's make one 139 00:09:39.584 --> 00:09:43.762 At first on Blender, there is a cube like this 140 00:09:43.762 --> 00:09:46.562 So you can use this as is, but 141 00:09:46.562 --> 00:09:52.129 first, let's erase it as if it doesn't exist 142 00:09:52.129 --> 00:09:56.455 Let's create a corresponding cube 143 00:09:56.455 --> 00:09:59.104 Press Shift+A to select Mesh 144 00:09:59.104 --> 00:10:02.337 and select Cube 145 00:10:02.337 --> 00:10:06.119 If you look at the bottom, you can see the size 146 00:10:06.119 --> 00:10:09.319 So in this part 147 00:10:09.319 --> 00:10:13.505 you can make it using ratio 148 00:10:13.505 --> 00:10:17.655 but in Blender, it would be great if you could include the actual size 149 00:10:17.655 --> 00:10:22.000 of the space where it will actually be shown 150 00:10:22.000 --> 00:10:26.050 Through this actual size 151 00:10:26.050 --> 00:10:30.000 with the decimal places 152 00:10:30.000 --> 00:10:34.584 we can reduce the margin of error considerably 153 00:10:34.584 --> 00:10:37.834 Even when this is brought to Unreal 154 00:10:37.834 --> 00:10:42.000 Of course, because the units of Blender and Unreal are different 155 00:10:42.000 --> 00:10:45.703 it may appear to be a different size in the field, but 156 00:10:45.703 --> 00:10:47.603 basically, the settings here 157 00:10:47.603 --> 00:10:49.564 can be set as the actual size in advance 158 00:10:49.564 --> 00:10:55.396 which helps to create videos that fit perfectly 159 00:10:55.396 --> 00:11:02.000 I'll try making it by selecting about 5m here 160 00:11:02.000 --> 00:11:06.475 Here we need to change the size again 161 00:11:06.475 --> 00:11:09.287 Adjust the size first 162 00:11:09.287 --> 00:11:13.767 and increase the scale 163 00:11:13.767 --> 00:11:17.099 and you'll be able to work very conveniently 164 00:11:17.099 --> 00:11:20.634 So one side is a square shape 165 00:11:20.634 --> 00:11:25.247 and the x-axis is now expanded by about 1.8 times 166 00:11:25.247 --> 00:11:30.970 For the y axis as well, corresponding to 5m, 167 00:11:30.970 --> 00:11:36.891 In this way, it becomes more distant or narrower 168 00:11:36.891 --> 00:11:41.040 You can implement various signage forms 169 00:11:41.040 --> 00:11:45.000 So, in the case of very large buildings that are difficult to measure 170 00:11:45.000 --> 00:11:50.450 using drawings or using a laser 171 00:11:50.450 --> 00:11:52.842 and such methods are used to calculate virtual numbers 172 00:11:56.743 --> 00:12:01.000 Let's finish it this way 173 00:12:01.000 --> 00:12:05.000 Let's make the outer cover and the inner cover 174 00:12:05.000 --> 00:12:10.683 I'll make two copies of the cube first 175 00:12:10.683 --> 00:12:13.317 I'll keep the second one closed like this 176 00:12:13.317 --> 00:12:16.000 Go to Edit mode with this one 177 00:12:16.000 --> 00:12:22.000 Select surface in Edit mode 178 00:12:22.000 --> 00:12:27.336 and select all the unnecessary faces 179 00:12:27.336 --> 00:12:29.643 and I'll erase them 180 00:12:33.455 --> 00:12:38.327 Then, the outer surface is included like this 181 00:12:38.327 --> 00:12:41.723 Unity, Blender, Unreal, all of them 182 00:12:41.723 --> 00:12:47.455 Although each quad unit has a different way of expressing a square, 183 00:12:47.455 --> 00:12:53.109 on this quad, the faces have directions 184 00:12:53.109 --> 00:12:57.703 So see if you'll use both faces 185 00:12:57.703 --> 00:13:01.891 or you'll use the one that's showing 186 00:13:01.891 --> 00:13:07.416 You can check with Gaioframe like this 187 00:13:07.416 --> 00:13:11.000 Let's leave this here with the eyes closed 188 00:13:11.000 --> 00:13:15.406 If you come back again, this guy is the one you have to see the inside of 189 00:13:15.406 --> 00:13:22.000 Enter Edit mode as well 190 00:13:22.000 --> 00:13:27.000 Let's erase the two outer sides 191 00:13:27.000 --> 00:13:32.148 Then the surface looks like this 192 00:13:32.148 --> 00:13:38.000 So I made both the inside and the outside 193 00:13:38.000 --> 00:13:41.000 I'm going to change the name 194 00:13:41.000 --> 00:13:45.000 Let's name them, according what we're seeing 195 00:13:45.000 --> 00:13:48.258 Outside and Inside 196 00:14:01.386 --> 00:14:06.297 Which direction the corresponding cube is facing 197 00:14:11.871 --> 00:14:16.168 Let's put that 198 00:14:16.168 --> 00:14:19.218 I showed you earlier on InSide 199 00:14:19.218 --> 00:14:23.030 There was thickness on the Blender screen 200 00:14:23.030 --> 00:14:28.000 Let's try making that thickness part 201 00:14:28.000 --> 00:14:30.750 In this inner space 202 00:14:30.750 --> 00:14:35.445 in Edit mode, select everything 203 00:14:35.445 --> 00:14:41.695 The corresponding surface on the inside 204 00:14:41.695 --> 00:14:45.000 we're going to give them thickness called bezel 205 00:14:45.000 --> 00:14:46.900 Here 206 00:14:46.900 --> 00:14:51.000 we have Extrude Along Normals 207 00:14:51.000 --> 00:14:58.554 If you pull it in slightly, the corresponding surface will appear 208 00:14:58.554 --> 00:15:03.297 So, it becomes thicker on the inside like this 209 00:15:03.297 --> 00:15:07.356 If you take a look at some examples of anamorphic 210 00:15:07.356 --> 00:15:10.000 they always utilize this thickness 211 00:15:10.000 --> 00:15:12.572 With this thickness 212 00:15:12.572 --> 00:15:16.396 the moment the thickness pops out from the inside 213 00:15:16.396 --> 00:15:20.574 people experience optical illusions 214 00:15:20.574 --> 00:15:23.129 So that part is very effective 215 00:15:23.129 --> 00:15:28.579 the object inside this thick part 216 00:15:28.579 --> 00:15:33.445 If you project upto the part that is poking out 217 00:15:33.445 --> 00:15:36.475 you can create an effective anamorphic 218 00:15:36.475 --> 00:15:41.000 You can check the corresponding offset at the bottom 219 00:15:41.000 --> 00:15:45.000 If you make it like this and leave 220 00:15:45.000 --> 00:15:48.218 this form is produced 221 00:15:48.218 --> 00:15:55.000 You can see OutSide and InSide together like this 222 00:15:55.000 --> 00:15:58.337 There is one more important part here 223 00:15:58.337 --> 00:16:02.218 You must check the part called UV 224 00:16:03.980 --> 00:16:08.000 Here, with the whole thing selected 225 00:16:12.000 --> 00:16:18.600 Next, Unwrap UV→Smart UV Project 226 00:16:18.600 --> 00:16:21.307 This is how it goes 227 00:16:21.307 --> 00:16:24.366 Let's take a look at UV Editing 228 00:16:24.366 --> 00:16:27.703 If you look here, it says this 229 00:16:27.703 --> 00:16:32.000 It's best to spread this out as much as possible 230 00:16:32.000 --> 00:16:39.683 Press the corresponding entire sections like this 231 00:16:39.683 --> 00:16:44.483 Stretch to the edge and fit it into this square 232 00:16:44.483 --> 00:16:49.148 as full as possible 233 00:16:53.168 --> 00:16:59.852 I will spread it out as much as possible 234 00:16:59.852 --> 00:17:02.852 Like this, without any remaining parts 235 00:17:02.852 --> 00:17:08.158 With that done 236 00:17:08.158 --> 00:17:11.408 back in Object mode 237 00:17:11.408 --> 00:17:14.723 let's export it 238 00:17:14.723 --> 00:17:18.373 I will print and save this 239 00:17:18.373 --> 00:17:22.436 InSide part and OutSide part 240 00:17:22.436 --> 00:17:26.000 You can export it from File 241 00:17:26.000 --> 00:17:30.218 You can save it as FBX 242 00:17:30.843 --> 00:17:34.813 nDisplay Screen Linkage 243 00:17:35.310 --> 00:17:38.782 Now open Unreal Editor 244 00:17:38.782 --> 00:17:44.000 I bring the Box, InSide, and OutSide that I created 245 00:17:44.000 --> 00:17:48.713 Let's learn how to integrate with NDisplay 246 00:17:48.713 --> 00:17:52.346 Basically, we'll start with an empty project 247 00:17:52.346 --> 00:17:56.158 Under the name Box Project_1 248 00:18:01.475 --> 00:18:03.753 I will make it like this 249 00:18:07.832 --> 00:18:10.396 When you open Unreal Editor 250 00:18:10.396 --> 00:18:15.146 I'll start assuming that you are familiar 251 00:18:15.146 --> 00:18:18.386 with working with Unreal 252 00:18:18.386 --> 00:18:22.604 In the case of NDisplay, it is an additional plugin 253 00:18:22.604 --> 00:18:28.000 so it is important to expand and install the plugin 254 00:18:28.000 --> 00:18:30.495 So I set up the project 255 00:18:30.495 --> 00:18:35.823 and we will practice 256 00:18:35.823 --> 00:18:37.802 making one that suits it 257 00:18:39.663 --> 00:18:43.495 Basically, the level is set to Main 258 00:18:43.495 --> 00:18:48.000 Let us bring NDisplay first 259 00:18:51.505 --> 00:18:56.905 If you look at the window, you will see Edit - Project Settings 260 00:18:56.905 --> 00:18:59.871 There is a settings corner 261 00:18:59.871 --> 00:19:01.000 Here 262 00:19:06.079 --> 00:19:09.317 NDisplay isn't set up right now, is it? 263 00:19:09.317 --> 00:19:13.346 So we're going to add a plugin 264 00:19:17.337 --> 00:19:22.792 Here it is, NDisplay is installed now 265 00:19:22.792 --> 00:19:27.624 There we go 266 00:19:27.624 --> 00:19:30.584 So for those of you who have this unchecked, 267 00:19:30.584 --> 00:19:37.139 if you check it, it will work when you restart this editor 268 00:19:37.139 --> 00:19:41.000 So, I'm going to try making an NDisplay 269 00:19:45.317 --> 00:19:48.317 When creating content, always 270 00:19:48.317 --> 00:19:51.000 it's good if you could organize the folders 271 00:19:51.000 --> 00:19:54.850 But I'm going to make NDisplay 272 00:19:54.850 --> 00:19:58.000 I'll install it like this 273 00:19:58.000 --> 00:20:00.000 If you right click 274 00:20:00.000 --> 00:20:02.160 various assets appear 275 00:20:02.160 --> 00:20:04.443 nDisplay Preferences 276 00:20:04.443 --> 00:20:06.640 You'll see it there 277 00:20:06.640 --> 00:20:12.440 If you proceed with the new settings, it will be created like this 278 00:20:12.440 --> 00:20:23.879 We will create it under the name nDisplay_BoxProject 279 00:20:23.879 --> 00:20:28.086 Okay, now let's bring in the FBX 280 00:20:31.680 --> 00:20:33.662 If you bring it, it will be like this 281 00:20:33.662 --> 00:20:38.160 set as FBX import options 282 00:20:38.160 --> 00:20:40.639 and there are many different options 283 00:20:40.639 --> 00:20:45.919 The most important of these is through normal map inversion 284 00:20:45.919 --> 00:20:51.708 finding and bringing the side that we can use 285 00:20:51.708 --> 00:20:58.599 If you press import all like this, it will come in like this 286 00:20:58.599 --> 00:21:04.440 There are currently two overlapping, so if you look at them separately, 287 00:21:04.440 --> 00:21:09.559 now, you can put the material into it like this 288 00:21:09.559 --> 00:21:18.080 We can basically see the box cube like this 289 00:21:18.080 --> 00:21:22.559 There are these screens that have an inner surface 290 00:21:22.559 --> 00:21:33.199 and the outer surface is like this 291 00:21:33.199 --> 00:21:36.749 Rename the corresponding side 292 00:21:36.749 --> 00:21:39.830 That looks better 293 00:21:48.720 --> 00:21:56.040 You can do that like this by pressing F2 294 00:21:56.040 --> 00:21:59.000 Actually, I'm not going to use any materials 295 00:21:59.000 --> 00:22:05.160 so you can just open nDisplay with the settings like this 296 00:22:05.160 --> 00:22:09.000 Move over to the nDisplay screen like this 297 00:22:09.000 --> 00:22:12.100 As you can see, there are various output mappings, clusters, 298 00:22:12.100 --> 00:22:14.479 components etc. 299 00:22:14.479 --> 00:22:16.559 First here is the nDisplay screen 300 00:22:16.559 --> 00:22:19.959 is provided by default 301 00:22:19.959 --> 00:22:22.880 Let me erase that 302 00:22:22.880 --> 00:22:28.520 Then it looks like this, so I'll add onto here 303 00:22:28.520 --> 00:22:32.679 The addition here is called a static mesh component 304 00:22:32.679 --> 00:22:37.379 Here is the screen we got from Blender 305 00:22:37.379 --> 00:22:40.000 and I can make it here 306 00:22:40.000 --> 00:22:42.399 I brought it as a static mesh 307 00:22:42.399 --> 00:22:45.679 and the mesh is currently disconnected 308 00:22:45.679 --> 00:22:47.800 It says None 309 00:22:47.800 --> 00:22:54.200 Here is the surface we have 310 00:22:54.200 --> 00:22:57.720 If you put the OutSide side like this 311 00:22:57.720 --> 00:23:01.720 this corresponding mesh will come in 312 00:23:01.720 --> 00:23:07.199 So basically we're moving 313 00:23:07.199 --> 00:23:09.360 As I said 314 00:23:09.360 --> 00:23:13.310 for anamorphic, a fixed position 315 00:23:13.310 --> 00:23:16.320 is the important thing to be checked 316 00:23:16.320 --> 00:23:22.679 so I'll try to find the center by rotating it 317 00:23:22.679 --> 00:23:36.559 Let's move to an appropriate location by entering 45 degrees as the number 318 00:23:36.559 --> 00:23:40.109 I'm not looking at the screen right now 319 00:23:40.109 --> 00:23:43.880 so it's shown in gray 320 00:23:43.880 --> 00:23:46.759 If you have finished connecting this mesh 321 00:23:46.759 --> 00:23:51.709 adjust the location so that 322 00:23:51.709 --> 00:23:56.000 it can be seen well from the corresponding viewpoint 323 00:23:56.000 --> 00:24:00.100 So that it's somewhat in the middle like this 324 00:24:00.100 --> 00:24:05.240 This is what it looks like from the viewpoint 325 00:24:05.240 --> 00:24:10.320 If you make it like this, you will need to add a cluster 326 00:24:10.320 --> 00:24:14.880 Add a new cluster node 327 00:24:14.880 --> 00:24:19.129 Adjust the preset resolution 328 00:24:19.129 --> 00:24:26.160 that you'll screen 329 00:24:26.160 --> 00:24:30.640 You can adjust the size here too 330 00:24:30.640 --> 00:24:36.920 When you do that, a viewpoint called VP is provided 331 00:24:36.920 --> 00:24:41.399 So we need to connect to this viewpoint 332 00:24:41.399 --> 00:24:44.929 If you click on this viewpoint, 333 00:24:44.929 --> 00:24:48.320 it is activated like this 334 00:24:48.320 --> 00:24:50.129 Let's change that 335 00:24:54.000 --> 00:24:58.700 To apply a screen to a viewpoint 336 00:24:58.700 --> 00:25:02.350 connect to mesh instead of simple 337 00:25:02.350 --> 00:25:04.320 in the projection policy 338 00:25:04.320 --> 00:25:09.399 Among the meshes, this is the StaticMesh we brought 339 00:25:09.399 --> 00:25:16.279 If you connect like this, the surrounding environment will be reflected 340 00:25:16.279 --> 00:25:22.920 and it is distorted for the optical illusion 341 00:25:22.920 --> 00:25:27.220 As you can see here, to fit this viewpoint 342 00:25:27.220 --> 00:25:31.559 The setting is such that the corresponding scene comes up 343 00:25:31.559 --> 00:25:35.409 So the most important thing is from the viewpoint 344 00:25:35.409 --> 00:25:42.399 the type must be set as mesh 345 00:25:42.399 --> 00:25:47.880 and since we created a viewpoint in OutSide 346 00:25:47.880 --> 00:25:54.343 let's compile and save then exit 347 00:25:54.343 --> 00:25:57.293 Then this box UV 348 00:25:57.293 --> 00:26:01.705 because it is connected to StaticMesh, we can delete it 349 00:26:01.705 --> 00:26:08.522 and let me show you this space 350 00:26:11.760 --> 00:26:16.510 If you bring it like this, the nDisplay screen will appear 351 00:26:16.510 --> 00:26:22.828 with the reflected environment on the screen 352 00:26:22.828 --> 00:26:25.440 This guy has a viewpoint 353 00:26:25.440 --> 00:26:35.200 So I'll turn it around like this and try to figure out the location 354 00:26:35.200 --> 00:26:38.533 If you set the location like this 355 00:26:43.279 --> 00:26:51.239 You can adjust it so that the corresponding scene is visible 356 00:26:51.239 --> 00:26:57.200 It doesn't fit well right now, so I'll adjust it and show you 357 00:27:10.399 --> 00:27:13.286 Yeah, it's almost right now 358 00:27:18.454 --> 00:27:25.225 Yes, then the part that is currently in this environment is being shown 359 00:27:30.399 --> 00:27:34.199 Let me turn it off and 360 00:27:34.199 --> 00:27:38.413 put some suitable materials in it 361 00:27:41.849 --> 00:27:45.320 Add one actor 362 00:27:45.320 --> 00:27:52.279 and give the motor green 363 00:27:52.279 --> 00:28:03.267 If you turn on the fijiball in nDisplay again, 364 00:28:03.267 --> 00:28:09.640 when the ball moves like this now, 365 00:28:09.640 --> 00:28:16.760 Do you see the screen being distorted and captured? 366 00:28:16.760 --> 00:28:20.210 So here's what we've created 367 00:28:20.210 --> 00:28:24.040 When passing through the thickness of the box 368 00:28:24.040 --> 00:28:30.920 you can see the distortion very effectively 369 00:28:30.920 --> 00:28:36.960 If you remap this part, 370 00:28:36.960 --> 00:28:40.510 the anamorphic illusion effect that makes it look like it's popping out 371 00:28:40.510 --> 00:28:42.235 is made 372 00:28:44.840 --> 00:28:49.137 With the set anamorphic display nDisplay 373 00:28:49.137 --> 00:28:51.880 I made a sequence 374 00:28:51.880 --> 00:28:54.080 I brought it as an example 375 00:28:54.080 --> 00:29:00.345 Here is a video that was previously closed in a box 376 00:29:00.345 --> 00:29:05.303 and as the box opens, it looks like the dinosaur inside is revealed 377 00:29:05.303 --> 00:29:08.159 I made an animation 378 00:29:08.159 --> 00:29:15.559 You can see the dinosaur properly only in the corresponding location 379 00:29:15.559 --> 00:29:20.402 If you move the angle like this, it gets distorted 380 00:29:20.402 --> 00:29:23.339 like the leg part not being visible 381 00:29:23.339 --> 00:29:26.760 This is also the case when going to the opposite scene 382 00:29:33.317 --> 00:29:35.840 You can't see 383 00:29:35.840 --> 00:29:38.340 But the 45 degree section 384 00:29:38.340 --> 00:29:43.799 If you see it from the section where we have a viewpoint 385 00:29:43.799 --> 00:29:47.359 the dinosaur's full form is revealed 386 00:29:47.359 --> 00:29:50.909 So when you look at it, to create the effect of the dinosaur popping out 387 00:29:50.909 --> 00:29:58.819 I positioned the nDisplay that 388 00:29:58.819 --> 00:30:04.840 mainly shows the frame here 389 00:30:04.840 --> 00:30:10.280 If you apply various animations within the sequencer, 390 00:30:10.280 --> 00:30:19.119 you can effectively do an anamorphic 391 00:30:19.119 --> 00:30:23.400 So try that with nDisplay 392 00:30:23.400 --> 00:30:29.440 Because what you see in the nDisplay screen is rendered 393 00:30:29.440 --> 00:30:34.390 when you turn off this nDisplay 394 00:30:34.390 --> 00:30:36.919 it looks completely different when you turn it on 395 00:30:36.919 --> 00:30:41.719 I have already intentionally created distortion on this display 396 00:30:41.719 --> 00:30:45.239 and that allows you to use it for optical illusions 397 00:30:45.239 --> 00:30:50.960 so make sure to check this part when applying it 398 00:30:50.960 --> 00:30:56.599 Let me show you how to render this 399 00:30:56.599 --> 00:30:58.999 If you press render 400 00:30:58.999 --> 00:31:03.719 the most important part here is the settings part 401 00:31:03.719 --> 00:31:10.359 If you go into settings, there are deferred, output, and .jpg 402 00:31:10.359 --> 00:31:13.809 You probably went through the settings 403 00:31:13.809 --> 00:31:15.880 in many different things as you want 404 00:31:15.880 --> 00:31:18.760 but nDisplay is set up like this 405 00:31:18.760 --> 00:31:22.159 First, delete the deferred 406 00:31:22.159 --> 00:31:25.799 and open one nDisplay setting 407 00:31:25.799 --> 00:31:29.280 then open nDisplay rendering 408 00:31:29.280 --> 00:31:32.599 Basically, I mainly extract as a png sequence 409 00:31:32.599 --> 00:31:36.880 Sometimes errors in nDisplay occur 410 00:31:36.880 --> 00:31:40.719 so I will output it as jpg 411 00:31:40.719 --> 00:31:42.823 The output resolution 412 00:31:42.823 --> 00:31:45.640 will be the nDisplay resolution 413 00:31:45.640 --> 00:31:49.359 If there are multiple root actors in nDisplay 414 00:31:49.359 --> 00:31:55.119 you need to set the target display as an actor 415 00:31:55.119 --> 00:31:59.969 Then in display rendering 416 00:31:59.969 --> 00:32:05.840 you can see that it is all well-confirmed like this 417 00:32:05.840 --> 00:32:09.040 I mainly use this custom frame rate, 418 00:32:09.040 --> 00:32:14.520 instead of the resolution in output 419 00:32:14.520 --> 00:32:17.239 Because I mainly use 30 frames 420 00:32:17.239 --> 00:32:21.679 for those who use 60 frames or 30 frames 421 00:32:21.679 --> 00:32:27.039 you can just apply it according to your purpose 422 00:32:27.039 --> 00:32:30.159 And in terms of frame processing number 423 00:32:30.159 --> 00:32:34.520 the number of frames you want will be increased like this 424 00:32:34.520 --> 00:32:40.200 Don't render all of these parts at once 425 00:32:40.200 --> 00:32:43.840 For example, go from to frames 900 to 2000 426 00:32:43.840 --> 00:32:48.440 or from 0 to 600 and such 427 00:32:48.440 --> 00:32:54.039 Basically, the entire settings are entered at the beginning 428 00:32:54.039 --> 00:32:59.200 and there is a high possibility that error frames will occur around 0~1 frames 429 00:32:59.200 --> 00:33:06.159 So basically, I recommend starting at 1 430 00:33:06.159 --> 00:33:11.200 Here, select the frames you want 431 00:33:11.200 --> 00:33:15.800 then using custom frames and custom frame rates 432 00:33:15.800 --> 00:33:17.679 you can bring it out 433 00:33:17.679 --> 00:33:22.559 One of the most important parts is the output directory 434 00:33:22.559 --> 00:33:26.840 Make sure to specify where it will be saved 435 00:33:26.840 --> 00:33:31.760 and to not overwrite it, 436 00:33:31.760 --> 00:33:38.880 I recommend saving it in a newly created folder 437 00:33:41.751 --> 00:33:47.415 And if you press render, the rendering will be done 438 00:33:49.840 --> 00:33:57.000 When configuring the environment, various lights and plugins 439 00:33:57.000 --> 00:34:00.640 will be brought from Quicksell Bridge a lot I assume 440 00:34:00.640 --> 00:34:04.840 If you raise that part to Nanite, it will get extremely overloaded 441 00:34:04.840 --> 00:34:08.760 so make sure you adjust the vertex number 442 00:34:08.760 --> 00:34:11.520 so that you computer doesn't get overloaded 443 00:34:11.520 --> 00:34:16.280 If you wait for the image to be captured on nDisplay, 444 00:34:16.280 --> 00:34:22.520 it will warm up and finish with the time showing up 445 00:34:22.520 --> 00:34:26.670 I'll explain the rendering, mapping and on-site projection of the final result 446 00:34:26.670 --> 00:34:29.799 separately 447 00:34:29.799 --> 00:34:32.149 Rendering, as you can see 448 00:34:32.149 --> 00:34:35.640 a finished video created in the computer program Unreal 449 00:34:35.640 --> 00:34:38.640 is produced digitally and printed in this stage 450 00:34:38.640 --> 00:34:42.717 In this process, colors, lighting, textures and such 451 00:34:42.717 --> 00:34:45.640 detailed time elements are reflected 452 00:34:45.640 --> 00:34:49.960 This rendered image can be output in various resolutions and ratios 453 00:34:49.960 --> 00:34:53.760 to fit the screen or display 454 00:34:53.760 --> 00:34:57.280 This is the finished video you see on the screen 455 00:34:57.280 --> 00:35:00.919 The final rendered image or animation 456 00:35:00.919 --> 00:35:05.280 must first be checked how it appears on your computer screen 457 00:35:05.280 --> 00:35:08.430 and then by playing it on the display 458 00:35:08.430 --> 00:35:13.119 and simulating the image with the optical illusion effect 459 00:35:13.119 --> 00:35:18.880 the final result is produced through repeated revisions 460 00:35:18.880 --> 00:35:23.080 Next, we map it and simulate it again 461 00:35:23.080 --> 00:35:26.730 In the mapping stage, the rendered image is 462 00:35:26.730 --> 00:35:32.520 adapted to the viewer's position in the actual installation or space 463 00:35:32.520 --> 00:35:35.520 and the location and shape to be projected is adjusted 464 00:35:35.520 --> 00:35:39.440 At this stage, the image is adjusted to a distorted form or 465 00:35:39.440 --> 00:35:41.890 the location where the image will be projected is specified 466 00:35:41.890 --> 00:35:44.790 so that we can adjust it according to 467 00:35:44.790 --> 00:35:48.080 how it will look in the real space 468 00:35:48.080 --> 00:35:50.480 It is the process of arranging the images 469 00:35:50.480 --> 00:35:53.520 according to the shape of space or object 470 00:35:53.520 --> 00:35:56.470 By using the model, 471 00:35:56.470 --> 00:36:01.055 the image is divided to fit each sides 472 00:36:01.055 --> 00:36:05.919 or the mapping layout is made using mapping software 473 00:36:05.919 --> 00:36:09.320 Lastly, there is the on-site projection stage 474 00:36:09.320 --> 00:36:14.170 The final projection is where the mapped image is projected into real space 475 00:36:14.170 --> 00:36:17.520 and where the audience can experience it 476 00:36:17.520 --> 00:36:22.960 The actual on-site specificity is different from the rendering and mapping stages 477 00:36:22.960 --> 00:36:24.710 as well as the environments that can be mapped 478 00:36:24.710 --> 00:36:27.960 and different environments depending on LED or projector 479 00:36:27.960 --> 00:36:31.610 Lighting, surroundings, and real space characteristics are all 480 00:36:31.610 --> 00:36:34.010 influential to the video 481 00:36:34.010 --> 00:36:37.840 so the results may vary 482 00:36:37.840 --> 00:36:42.140 The anamorphic technique and nDisplay introduced today 483 00:36:42.140 --> 00:36:46.840 are essential for expressing immersive, realistic media 484 00:36:46.840 --> 00:36:51.490 Please take a look at the program and production practice introduced in the latter half 485 00:36:51.490 --> 00:36:56.119 and I hope you can produce effective results 486 00:36:56.119 --> 00:36:58.129 This concludes the lecture 487 00:37:00.557 --> 00:37:01.357 Understanding Anamorphic Anamorphic A visual distortion technique on a media façade that makes the full image visible only from a specific position or viewing angle of the viewer 488 00:37:01.357 --> 00:37:02.157 By utilizing precise perspective, you can view a perfectly aligned image only from a specific location It gives a three-dimensional effect even on the flat surface of a building or an LED screen, giving the audience a sense of depth and space 489 00:37:02.157 --> 00:37:02.957 Principle of Anamorphic Mapping A technique that projects a flat image to appear in 3D only from a specific angle 490 00:37:02.957 --> 00:37:03.757 Distort the image based on the observer's point of view to create a sense of three-dimensionality only at that point Transform the distorted image into an appropriate perspective and ratio to match the projection target 491 00:37:03.757 --> 00:37:04.557 Anamorphic Production Programs 3D programs that produce distorted images: Blender, C4D, Maya, 3D MAX, etc. 492 00:37:04.557 --> 00:37:05.358 Real-time projection mapping programs: MadMapper, Resolume Arena, TouchDesigner, etc. 493 00:37:05.358 --> 00:37:10.371 Anamorphic Workflow 3D modeling and simulation for visual illusions Create distorted images Set up projections with software 494 00:37:10.371 --> 00:37:11.971 Creating round and rectangular images using optical illusions Various forms of digital signage Circular curved display: Suitable for expressing circular images and rotation effects due to its visual center point 495 00:37:11.971 --> 00:37:13.621 Dome-shaped signage: Wraps in all directions, ideal for sky or space illusions Polyhedral display: A structure that combines multiple rectangular screens to create the effect 496 00:37:13.621 --> 00:37:15.288 that objects in the signage appear to be revealed from multiple angles By utilizing illusionary effects by shape, you can reconstruct the audience's experience of space and enrich the content 497 00:37:15.291 --> 00:37:16.191 Making a Box in Blender It is effective to apply the actual space size to be used 498 00:37:16.191 --> 00:37:17.100 Create a new file, select [Shift+A]→Mesh→Cube, and adjust Scale to shape the signage Copy the cube, then delete unnecessary faces in Edit mode 499 00:37:17.100 --> 00:37:18.091 In Edit mode, delete two outer faces of the copied cube Use Extrude Along Normals from the toolbar's Extrude menu 500 00:37:18.091 --> 00:37:19.191 Adjust the thickness of the inner box by pulling the setting bar In Edit mode of Inside, select all, then select Unwrap in UV→Smart UV Project 501 00:37:19.191 --> 00:37:20.251 Modify to fit the size of the UV map created in UV Editing and save as File→Export→FBX 502 00:37:20.251 --> 00:37:21.101 nDisplay Screen Linking nDisplay Screen Linking In Unreal Editor, select Game→Basic→Empty Project and create BoxProject_1 503 00:37:21.101 --> 00:37:21.901 After creating the nDisplay folder in the content folder, select nDisplay→nDisplay Preferences→Create New Preferences 504 00:37:21.901 --> 00:37:22.751 After importing FBX to nDisplay folder, open nDisplay_BoxProject Add static mesh component, then select box_UV_OutSide in static mesh item 505 00:37:22.751 --> 00:37:23.551 Adjust the position and rotation values ​​to center the viewpoint Add a new cluster node and adjust the preset Change the viewpoint projection policy type to Mesh and attach a StaticMesh 506 00:37:23.551 --> 00:37:24.401 After compiling → saving, go to the level and drag and drop nDisplay_BoxProject into the world and adjust the position to fit the InSide part 507 00:37:24.401 --> 00:37:25.210 After creating the BasicAsset03 material, check the distortion effect when the ball passes through the thickness part of the box.