Yoobae Kim: Project 3 Classroom and Architectural Mapping (Week 6-10)
Two Photographs as Input
Two Music Videos as a background
Concept and Process
For this project I took two photographs and two
videos downloaded from some open sources.
The photographs I have used as the base are one in
Santafe Art School building which I took during my travelling, and another in
Korean Traditional Palace downloaded from the Korean Magazine.
The first step for this process was to find out interesting
areas of space. After exploring and collecting photos, I selected out the music
videos that I thought would be interesting to work with.
For this project, I primarily focused on projecting onto
sites and architecture located in the two different cultural regions. I explored
the spaces and architecture in these two areas and thus with comparison to
project onto these surfaces. With my compositions, I wanted to focus on
the synthesis of the oriental and western cultures presented in the
architecture itself and visual structures seen in the digital space.
When we where assigned the project of lighting up the room, I knew where to start first. Finding music. Nothing ever looks that great when you looking at it in silences, watching images and animation scroll around without having some kind of music in the background. I spent some time on YouTube, finding a song that would be my inspiration for my work. I usually base everything from traditions, to what the imagery would look like, all from the song itself. So when I came across the song, "HYPERDRIVE - Epic Powerful Futuristic Music Mix | Epic Sci-Fi Hybrid Music" I knew exactly what I was going to do; Space. When listening to the song, I usually let my imagination take over and I heard and felt was like I was traveling across the universe. So I had the idea of space, and traveling, but I didn't know exactly how to portray that in a unique way. My fellow students, Victor, from the graduate class, and other fellow classmates, gave me the idea of telling some sort of story. How I should start my story at one end of the room, then move it across the walls and end at the other side. I loved the idea of taking the viewer across space on a journey....a Journey Across Space.
Process
Once I had my idea down it was time to start the most important step, edge blending. After helping the professor set up the projectors and map out the room the way we liked, as well as sending a few hours fixing one projector I got to work. Spending around 6 hours I moved from between the four work stations, edge blending the room to make sure I had a nice seamless edge throughout the room. When the edge blending was complete and everything looked good, I saved the MadMapper files and moved my work to After Effects
I first got to work on my Lion. The geometric tape Lion was a design I created for Project 2 and I knew before I even came up with my design I wanted to use it for something. So I decided that it would be a form of a signature, because I am apparently known for my lions in the class (lol). The first thing I started with was talking to Jeremiah because I wanted to do something similar to what he did with the lion for Project 2 with the different shapes of the lion faded and changed different colors. I used his same technique for the Lion face. Having it grey scaled, and fading to different shades. I put the Lion into Photoshop first, each shape in the face being a different layer. Imported the layers into after effects and used a wiggle code effects; wiggle(5, 60). 5 for the speed, and 60 for the range of grey scale I wanted.
When the face was finished I found a gif image of a purple nebula online and masked it out so it just appeared inside the lion and put it on repeat. Then for a final touch, I decided to create the Leo Constellation inside the lion. It is a lion after all. I made ellipsis, put a two glow effect on each circle and made them look like they where flickering like stars. Then used a line, adding the same glow effected and added a Trim Path add-on to make it outline the Leo constellation.
Once the lion signature was completed I started on the main story-telling piece of the project. This is where I ran into two trouble spots. My first idea was to have MadMapper run AfterEffects inside of them, but when I tried that, the image became so pixelated, it just looked awful. My second options was to have one long composition, almost 5,000pix in length, where it would be cut up into pieces and then imported as a movie file into MadMapper and plained that way. But again, it was all pixelated and didn't look right. So I found myself talking to Victor, from the graduate class, about my problem. He gave me the idea of having each of the wall compositions be one long file, but have then all black out when they are not needed. This was a great idea! The only small problem was, I would need to have four people on each station, and press play at the exact same time. But that was pretty easy.
First thing I created in AfterEffects where all the compositions; Back Wall, Comp 2, Lantern Wall, Lion Wall, Comp 3 and Front Wall. Then a master composition that would hold all the other comps, but I could see how it all worked together. As well as how everything was timed in sync with the music.
Of course the first thing I started with was the Back Wall. This was the wall thats the furthest away from the main door of entry. This is where the story would start, and with the beginning of the music starting slow, I decided to start the journey I would take everyone with a Galaxy. The Galaxy was created in AfterEffects with Cinema 4D plug-in that comes with AfterEffects. Of course I did seek the help from tutorials online to help me out. The music is slow, and the turn of a galaxy is slow so I thought this would be perfect. Using the rotate tool, I rotated the galaxy and keyframe it so it would move slowly. I also scaled the video at the end so the galaxy would be spinning as well as zooming it before fading to the next scene.
The transition from each scene of the story shouldn't be just a simple fade, thats not how your travel through space anyways. I used the same idea that Star Trek's Enterprise, and Star Wars Millennium Falcon use to travel around space; hyperdrive or warp speed as Star Trek calls it. I used different effects and presets After Effects have to first create as stary background. Then another preset called Echo to create the effect of the stars zooming past you, before slowing back down as if your coming out of warp speed. This is the main transition used to go between every scene of the storytelling.
So after coming out of warp speed from the galaxy you are taken to a planet that is slowly being destroyed. The planet appears at one of the main beats of the song. At first I wasn't sure what to put on the lantern wall, and rumbled through a bunch of ideas before coming with the idea of traveling to an alien planet. I spent a lot of hours rumbling through YouTube to find a planet animation that didn't consist of any planet from out own solar system. Everyone already knows what are planets look like, so I needed something different. Most of what I found where a lot of still images, and I didn't want that for my project, thats boring. So I finally came across this video that I used for this section of the wall. It also helped that the video had complementary colors from the purple and blues from the galaxy.
After you visited the planet and saw it break apart from some unknown force, you are shot through a warm hole. The wormhole starts right as the music picks up to a very fast beat. The twisting and turning of a wormhole at a fast paced seemed to just make since. Plus you can't travel through space without having the joy of riding through a wormhole. The wormholes where created in AfterEffects using Cinema 4D as well as Video Copilot's Element 3D plugin I got from watching a tutorial on how to make wormholes. It started with making a cylinder ring, that was connected at the ends to make an endless loop. I then applied four different nebula cloud textures to the ring which stretched the texture out to fit around it. Making a cool affect as if your flying forward. I placed a camera inside the ring and moved it around as well as the direction so you not just traveling in a circle. You get the feeling of flying all around.
After you come out of the wormhole you are transported to a supermassive black hole. At first I wasn't sure what you where going to come to at this part of the journey, but 'seeing' a black hole seems pretty cool to visit if your traveling through space. I spent time online looking for a black hole animation that looked cool, would match the rest of my project, and wouldn't look too fake. I found a lot of silly, lazy looking black holes that just didn't peek my interest. But finally I came across this video that had a supermassive black hole, having light beaming out of it into space. The movement and speed of the light and puffs of cloud that came out of the black hole matched up perfectly with the music. Plus it fits perfectly into the pace where it would go.
Finally after your journey across space you journey ends at a White Dwarf Star thats has come to an end of its life. This 10 second section ending of the song isn't the original ending. The music actually stops with the black hole before continuing on with a new chorus. I ended up editing the end of the song to have this part play, plus i liked how it sounded and the explosion of the White Dwarf was perfect. For this explosion I used two different videos. One video I took the beginning of the explosion, with the star glowing and shaking. The second video i took the back half of the explosion, with the bright white light that fads to a beautiful nebula. At the time the music drops to silence, I scaled the video down at that lest second, before scaling it back when the white light appears.
With the white light William gave me the idea to have the white light wash over all the other walls and fade back down to the Front Wall. I loved the idea and gave it a shot. Adding a white panel to all the other compositions and faded them so the back wall faded first, then comp 3, then lantern etc. It turned out to be a really cool effect.
Everything was finally finished after that! I rendered out a total of 7 video files as mp4's. I then took the four MadMapper files, one for each computer station. Put the video files corresponding with one of the four MadMapper files. Put everything into a folder labeled, 01, 02, 03, 04, to match the computer stations, and then put one file on four different USB Drives to keep everything separated and organized. I would then have each state load the MadMapper file, import the video files that go with each projector. Once everything look good I made a preset in MadMapper, so when the project is ready to be played, I would have four people press the preset all at the exact same time.
Concept: We are in this 21st century, and we take advantage of advanced technology to let our daily life more and more convenient. I consider 21st century as a “Digital Century”. Everything is binary 0 & 1 combinations in digital world which is extremely simple but ordered. The shapes are based on circle, triangle and square.
Inspiration: TRON
Process:
First thing: Set up & Blend Edges
We have to use multiple projectors to cover whole studio. When we set these projectors up, it came a problem – Edges. The edges were sharpe, so we needed to smooth them. We used a skill called blend edges, to overlap the projection's canvas and used madmapper to blend/soft the edges.
Blend Edges
Projector Set up
Second thing: Activate Every Pixel in 3D studio
After setting up 4 work station to control 8 projector to cover the whole space, it was time to put our content into madmapper and let them come alive! At this project 03, I didn't want to get rid of the previous project 02 – tape mapping, so I combined these great work into my new project to make these tapes come alive/ be meaningful again!
Project 02: Tape Mapping
Lantern Real time PIP
Third: Be Coherent
Because projector's light bulb is a consumption, the condition of light bulbs have slightly different on each projector. As the result, I would like to make the whole space have a coherent experience, I needed to adjust the parameters on every 4 work stations to make them(color and contact) united.
I jumped right into the project without first knowing what I wanted the goal to be at the end. I started putting together a composition that I thought would be interesting if it reacted to audio sound. It was then that I decided to design a program that small creators on YouTube and SoundCloud could purchase and use in their content to give viewers and listeners something interesting to look at while they listened.
I initially worked in only black and white, focusing on the animation and effects before jumping into what color scheme I wanted to roll with. While I was playing with the RGB values of the circular arc, its values feathered out into the rest of the composition where I realized I could just change the color of one element of my piece and it would gray out toward the edges. This is where I decided it was going to be monochromatic, and I found myself picking a blue-turquoise color. There is a lot going on with the shaky lines and two audio-visual elements at play, so Professor Scott suggested I include something slow for the viewers' eyes to have something to rest on. Behind the scene in the background is a Cosmic animation very similar to watching the waves in water, acting much more slowly than the animations in front of it.
There were a lot of issues concerning speed and the animation of the lines during this project. The speeds had to be different to create an offset and create interest without being so dramatically different, and the lines couldn't be too calm nor too outrageous. I also explored more with masks and differently-shaped layers stacked on top of and inside each other.
Lion Composition 2: Space Lion
Following the first idea I had earlier in the project, I set out to create another visual that reacted to audio and was interesting to watch. This time, I wanted to do something with a little more color and a little more action happening throughout the canvas instead of just in the center.
I once again began working in black and white and messing around with layers. I learned that you could get some interesting animations if you multiplied an animation on top of another and get more action and composition out of it. I also learned that not all of the animations are listed in the menu, that you can go to the MadMapper website and find free downloads to add to your library. I discovered this one called "Plane Deform," which looks like an old screensaver on computers and threw it into my program, layering a Caustic animation on multiply on top so that certain areas would feel more natural like it would appear in space. I did another experiment with the lines dancing in the background to the audio, where I multiplied a sort of barcode animation on top.
Working with how to make the color in the lion's mane stand out more involved more practice with masks. I originally had it so the entire face was lit up with the "northern light"-ish animation, but I wanted the mane to be more of the focus and the lion's face to actually look like it was looking straight ahead. So I applied a mask over the face to darken the values of the color (basically dim them) and filled in the eyes and the nose with a basic white. I think this version is more interesting than the one before just because of the different animations going on in a single space.
Crane Composition 1: Data
For the origami paper crane, I wanted to do something calm and peaceful because when I think of the art of Origami, I think of something that should be relaxing. While thinking over the themes or aesthetic use of the Crane, I eventually found myself associating pixels to the piece. A majority of the animations used in this project are squares or pixelated objects. When playing around with timing and layering, I decided on doing something that looked like a rainy day on open water.
I did an overlay of two square arrays with two different colors for the background and then applied a layer on top that multiplied to make it look like there were waves coming in and out of the display. To make the rain, I used basic lines with Chase and flickering animations, then spaced them out across the canvas. The pixels inside the crane fade in and out like it does in the background, but the color is just a basic white to help the figure stand out.
I think this piece could be successful if I had added audio of a thunder storm or a rainy day on top of it to help with the mood. The colors used are in a triad color pallet that would most likely resemble water and floating flower petals. The lines of the Crane still fall in with the pallet but are brighter and softly fade to at least maintain a "shadow" of the crane when the white squares fade.
Crane Composition 2: 5Gum
For the commercial aspect of the project, I immediately thought of 5Gum after finishing Data. I had to watch a few of the intro and outro sequences of their commercials to get an idea of what it should look like. I wanted to try and stay on the same path of Data and explore the possibilities of MadMapper, but that simply wasn't going to work. Professor Scott recommended that I start working with After Effects, to which I admitted I had no idea how to use. He insisted that I at least try, and so I took an online tutorial to creating the TV glitch and wave effect.
I first laid out the composition in MadMapper to place where I wanted my elements to go. There was some more playing around with layers and masking in this project. I had to record the background in MadMapper and convert the video file over into After Effects where I applied the glitch and wave animations. I did something similar where I typed the text in Photoshop and transferred it into After Effects. I then took the video files after the changes and assembled it all back together in MadMapper.
For having not heard or worked with After Effects, I think the project worked out really well, and now I'm addicted to watching all sorts of effect tutorials online. I did my best to stay close to the color pallets used in the 5Gum commercials to make it seem as legitimate as possible, as well as give the viewer some sense of motion.
Crane Composition 3: Super Crane
After discussing my compositions with Professor Scott, he suggested I should try something "out there," so I played around a lot more with MadMapper and made a third composition for the Crane. No plan, no idea, not even a clue as to what I wanted the end to look like - all I knew was that it had to be exciting. Bright colors, fast animations, and some action.
I played around with the plane deformations inside the crane's body, messed with the perspective in my new Plane Deform animation until it looked like the Crane was actually flying, and tweaked the values of the spinning color wheel animation. I wanted the crane to also be a bright color that changed over time, so I applied a different color hue changer over the animations and reduced the amount of green that appeared. The lines of the crane were left as a basic white that stands out from the background and the colors inside, to outline the different patterns and colors dancing around inside and behind the figure.
I definitely had fun with this piece just because of the color and making it look like something was "flying." Someone recommended to me during the critique that the background should have been synced to audio, to which I had no idea that that was possible. I haven't had the chance to do so yet, but I definitely think that would put an extra edge to this piece and make it more visually interesting.
