Dynamic Text: Creating Eye Catching Instagram Promos

1. Introduction: Dynamic Text: Hello, I'm Julian. I'm a filmmaker and occasionally I do graphic design. One day I was working on like a text-based poster for a band. While I was doing that, I just got really distracted. I went through Instagram and I just started scrolling. I looked at all these like videos of just like water refracting and how light would come in through a window and art being made. I got lost in this world of weird engaging abstract videos. Then I woke up and I was like, "What if I were to actually combine the text-based poster I was doing with some of these weird videos?" Then I started doing that. Throughout the year, I started working on this style where I combine text and video, where I'd make moving posters. I made them for my business, wild birds. Then I would make them for my shows, movies and I would use them to promote all the stuff that I was working on. Then I realized, "Oh, there's something actually really cool and interesting here. I think this is actually applicable to many different things in my life and possibly in your life." That was the genesis of this class. Dynamic text creating eye catching Instagram promos. In this class you're going to learn two basic styles. One of how to use a stencil to create really interesting background images and two how to do that same process but almost completely digital. Imagine if we were to use the positive space and texts as a green screen. Then you can put whatever trippy background images that you want. That's what we're going to learn how to do. You can use this style of fluid dynamic text to apply to almost anything. Whether it's your business or whether it's promoting an album that you made or just for fun. In this class you're going to learn the step-by-step process. We're going to get detailed into that, but we're also going to learn a little bit about graphic design and a little bit about videos too, because this is the marriage of those. We're going to make text that is fluid. We're going to make text that is like dynamic. We're going to make text that comes alive. It's going to be fun,and it's going to be a really visually engaging. Hopefully you're going to enjoy this process. Thank you so much. 2. What's Needed For The Class: So, what do you need for this class? Well, it's super important that you have a video editing software, and I do the whole tutorial using Adobe Premiere. So I highly suggest you have Adobe Premiere. I also use Photoshop and I apologize, I use an old version of Photoshop. It's like 2016, but it's the same thing basically and you can figure your way around both of them and if you don't have Photoshop, you can also use Legacy Title, which is an Adobe Premiere because basically we just have to do a texts layout and then color that text. It's as simple as that. Only reason why I say premiers, because it's slightly more intuitive and allows you to have more control over stuff. We'll get into everything with a little bit more detail later, but that's the basics of what you want for this class. 3. Choosing Fonts: First style is completely digital. What do we need to make this digital thing happen first? Well, I'll tell you. We need a font or multiple fonts that we really like. Because the fonts, they got to be thick, they got to be juicy. I don't know how they'll be juicy, but they've got to be juicy, and they have to be engaging. How and where do you get fonts from? You have them on your computer, that's totally fine. Maybe you can go through your fonts and then look through that way. I don't totally suggest that. I suggest using a website like the font.com. I love that place. You can download free fonts, you can peruse all the different types of fonts. A graphic designer or a filmmaker should really care about this, because fonts are conveying information for you. They are really engaging. Like the Obama campaign, they had their own font design for it because they wanted something unique that also was powerful, but also really strong. I'm like super into fonts. Attached here, you'll be able to find the favorite two fonts of mine. I love this one, called Heavitas, and I love this one called Navada. Especially for these because they're thick fonts. If you want to go to font.com and find those, great, use them. If you're using this for a big commercial shoot, like this is going everywhere, there is a way where you repay the people who made fonts. Because fonts just don't come out of nowhere. They're not like, where's the font, go there, there's a font. That's not how they work. Fonts are made by people and individually, and if you're going to use one, and you're using it for commercial thing, I suggest giving them a donation, which they have the links on the font.com. Get the fonts that are right for you, peruse all the fonts, download them and install them, simple from there. That is Chapter 1. 4. Background Videos: Finding or Making: For the digital aspect of this and creating cool digital fluid dynamic text, what you are going to need is, A, the font which we just went over but then you're going to replace the area where there is the font, the positive space on that and you're going to have a cool background videos. Your question is, I know, where do we get these videos? Well, I've got a couple of different ways for you to acquire or to make your own background videos. Simple as that. I'm thinking about you. I care about you doing this project whilst I want you to succeed here. Let's delve into this. What types of videos do you actually want happening behind your text? Okay. I suggest getting stuff that's like really visually engaging. A lot of that is nature. A lot of that is just like cool flowing lines. A lot of that is water, which is part of nature. A lot of that is fire. A lot of that is just cool, interesting stuff that's really engaging. You don't really want too complicated of an image, like a person thinking or maybe you do, but you want something that really pops within this tiny frame. Where do we find these videos? Well, they're everywhere because there's a thing called the Internet. There's some nice people on the Internet who have shot footage that are just willing to give it away for free to you. Thank you people. What you can basically do is Google royalty free websites. That's how you Google. You'll get a whole host of free downloads that you can get. I would suggest searching in the time-lapse area, searching in the area where there's nature, looking around and guess what I've already done for you right now. I've made websites. I found these websites ahead of time, and I have them below in a link that are attached in our project resources area, because I'm a nice guy, sometimes. Not other times. Sometimes I'm mean and [inaudible] like Julian, "You're so mean," and I'm like, "Sorry." What's another way to find these videos, these cool background abstract videos? You can shoot them yourself. Yes, you, and I actually find it a really beautiful, interesting process to be able to shoot videos that are just really pretty bits of life. They could be anything. They could be the way that light refracts through your window at a certain time or how water ripples. You have an amazing tool if you have an iPhone or just any phone at your disposal. Because an iPhone can do a lot of really cool stuff. You can shoot super slow motion and super slow motion is great for when you have something that moves really fast. I like to shoot fire and super slow motion. You'll probably see that later on, or I shoot like water moving really quickly in super slow motion. It's an incredible tool for that. I like super slow motion, but you also have time-lapse. Time-lapse is something that's really great for something that's slowly moves, but makes an interesting movement throughout the day. That could be all sorts of different things. Whatever floats your own boat, you can shoot that stuff. It's important to just stop sometimes. Look around your world and be like, "Okay, that's beautiful." That's where great art comes from sometimes. It's just stopping to observe something that's beautiful and then hit record or sketch it, or write a poem about it. That's where art comes from. It's about slowing down. Anyways, that's number two way to get abstract video. There's a third way of getting the videos and it's super easy because I have shot a lot of these stuff already. I'm willing to share it with you. I don't care. Use it however you want. Okay. We're going to layer this stuff in the background of stuff and you're going to alter it and you're going to change it. I have all of these videos that I've shot that are just like slow motion of water or just like lights because I made a whole music video that was essentially about, how does light and water interact with each other and I shot on a really high def camera and I'm just going to have all that footage available for you because I am nice sometimes. Ask my grandma if I'm nice. She'll probably say yes, maybe not. Last thing, we can actually use screen capture on our computers to record videos we see online or on our computers. Just quickly to go into that, this is actually really simple of a process if you have a Mac. If you have quicktime, which you do if you have a Mac, you go hit quicktime and it opens up. Then you go to file and you go screen record. You adjust the area and you hit record. Basically that records anything that's happening on your computer. That could be any video that could just be, you messing around with the mouse or it could just be a picture of a monkey looking sad on a bus. There you go, or maybe those last two combined. That's a really simple and effective technology that, it actually took me until this last year and I've been a filmmaker from 12 years, to figure out how to do. Once you hit record, you save it and then you have that video forever. You can also do the same thing on your iPhone. You just do a drop-down. Hit screen record and you can record all sorts of videos. These videos, they're copyright protected because if it's not something you've shot, you probably shouldn't be putting it out there. You can either cite your sources or be a bad kid and hide it. I don't suggest doing that, but if you do, I'm not going to judge you. Step two, right now, for your class project, either download the videos I've made or find new ones on the Internet, or screen capture ones that you find really engaging or create your own videos because you wouldn't need these abstract videos. Anyway, you get your video's great. You want as many as possible because that gives you as much ability to change things up. 5. Digitally Dynamic Text : First thing first, you want to figure out what you want to say. I suggest keeping it really simple, two, three lines of text. The simpler it is, the more easier it is to read. If you have a lot to say, you're going to be looking around, this is going to be a visually overwhelming thing. She probably want text, but you could also do something like your company's logo, that's an also really simple thing where you're going to be able to take out the positive space in the logo and then put video behind it. Now that you have your fonts, now that you have your cool abstract videos, we are prepared to make this happen. This is the first stage of what we're doing, now, I'm going to go into screen capture mode where you're seeing what I've done on my computer and I'm going to give you a little narration to guide you along. "I'm in the computer, this is crazy." , all goofing aside, let's get to this since you can take away. Different people move at different speeds, I'm actually going to do a brief overview slash of a really fast tutorial if you just want to get down to the meat and bones of it. Basically what we're doing is we're making it a text-based image, then we're going to use the Chroma key effect to get rid of the color and then underlay a video underneath there and then our video will appear where the positive space and the letters is, simple as that. But now, here's a longer version of this where we do a step-by-step break down and we get into a little bit more into the art of this process, as well as learning the technical aspects of all this stuff. First things first, open up Photoshop, once again, I say use Photoshop because it's a slightly more intuitive, but you can use legacy title that's in Premiere, that completely works fine. In Photoshop, start by hitting File New, give your project a name and adjust the aspect ratio. Make your dimensions square because you'll actually see more of an image if it's square, it'll get cropped if you make a rectangular image. I made this 3000 by 3000 pixels. Then click "Okay", let's get started from there. First thing I do is I unlock my background, make a new layer, and then I just delete my background, I like it to be fresh. Then on my new layer, I select text and I do my first word. I like each individual word to be on its own layer. That way I can adjust the size of each word individually, so I have a little bit more control of how the lettering looks together. In the end, I'm going to experiment a lot and see which size of which word is better, how to increase or decrease one, there's a lot of experimentation that goes along with this. It's really important that you have the flexibility to change the size of each of your words, allows you to be free from the tyranny of similar size words. Couple notes if you're not too familiar with this, I have the arrow button selected and then I have auto select also selected so that when I go and I press each individual word, I'm able to get the wire-frame and change the size of it. When I'm changing the size of it, I'm holding down shift so the size changes perfectly in proportion, you'll get the hang of it and if not, just re-watch the video and look at the exact things and buttons that I'm hitting. Also note, forgot to make the initial letters green, so I went back them and change that, you want to green so it's easy to color cue them out later. Last thing we're going to do is we want to actually have a separate background, our background is going to be a separate color that we're going to see and we're going to try out first. I actually know I liked this pink color, I really just like pink, it's pretty color, but here's a little bit of a pro tip, if you don't know which colors work well together, Google color palettes. I've oftentimes just googled Wes Anderson color palettes, and you'll see just a link of resources of various different color palettes where you can choose and mix and match to different colors or a couple of different colors that already are curated to work well with each other. I know I like this pink, I'm going to use this pink, so what I do is I make a new layer and then I put that layer behind all the texts. I select the entire area, click " Fill", and fill that with that pink color, which I love. Now we're ready, save this as a "PSD file", and we're going to import that PSD file into Adobe Premiere, we're moving forward. We're in the Adobe Premier part of this, first thing you want to do is do file, open up a new project, name the project, whatever you like. Then we are going to import our PSD file, then I go to File and I make a new sequence, when you're doing your sequence, make sure your settings are properly set to square, so when you go to your file sequence settings, you make it 1080 by 1080. Then drag your PSD file onto the sequence, then we're going to expand the length of the PSD, all you have to do is take your cursor and put at the end of the file and make it longer. Then drag it up the video track number two, we put it on video track number two because any track that is below video check number two, that's what we're actually going to see when we color key out the footage. What you're going to see is it's a little bit too big for the screen because I made it 3000 by 3000, what you're going to do is right-click and then you could do scale to frame size. Now, we're going to go file and we're going to import our background video. Once again, you can import any of the videos that I shot as my background videos or the ones you've downloaded online. There's a plethora stuff for you to choose from, I'm going to import these cool squiggly lines because I think it's going to look really good. Then when I take the background video, I put it on video check number one. Notice how it only lasts for so long so what I do is I just copy it and then I paste it because it's a abstract squiggly video so you can of watch it and loop it doesn't really matter. Now that the video is underneath there, I go to effects and I type in color key. Then the color key effect comes up and I drag it onto my PSD file. Now that it's on my PSD file, I double-click my PSD, and I go to effects control. I scroll down and I find the color key, click the eyedropper, and then I click the green part of my texts, what happens is once you turn the color tolerance up right around like 6070 or so, you'll find that all the areas where there's green are now gone and what you have is what is underneath it, which is the background video. All I'm doing now is adjusting the length of this, I'm extending the length of my PSD and doubling the amount of footage of my squiggly lines. Now, I'm done, I'm ready to export because I think this looks really good. Go to File, Export, Media, then I go to Format, and I want to make sure my format is H264. Then I scroll down and I go to the video setting, I want to make sure I click render maximum depth, then I want to scroll down further, and I want to go to target bit rate. Your target bit rate determines what size video you're actually going to do and also the quality of this, we go from left to right, you'll see that it changes the estimated file size. Instagram allows you to have up to four gigabyte video that you can put on to Instagram, the rules have changed it used to be you could only have a 100 megabytes or less, but your phone probably can't handle that huge size of the thing. What you're going to probably want to do is still do the H264, you're going to adjust your target bit rate and you can make them much higher and then that'll give you much higher quality, but you can also determine the size it's going to be, which will allow it to fit on your phone easier and make your transfer easier. I would suggest going over 200 megabytes if you want a high-quality thing, you can adjust and see what works for you. For me, I'm still keeping it relatively small because this is a short video and it's going to maintain the integrity of the background videos in the text. Then I go to output name, I click that and that allows me to change the name of the piece and also click where I want to save this. Once you get that ready, then you can click export. Class project tab, and I think you know what to do, follow the steps exactly and make your own, have fun with it, you can do this in like an hour, not even, go forth, do stuff. 6. Digitally Dynamic Letters (More Advanced): All right, so we learned how to do a basic layer of one singular background video over our text. Now, how do we do it if we want each individual text to have it's own background video? Let's get into that. Yes. All right, so first thing you want to do is open up a new project and premier, give it a title then we're going to import our new PSD file. Then we're going to import a folder of abstract footage that we can use behind our letters. Once again, the more the merrier, the more options you have to choose from, the better. Next thing you want to do is File, do a new sequence. Once again, we're going to make a frame size 1080 by 1080 so that we have a square dimension. Then you drag your PSD file onto your timeline, right-click it and do scale to frame size. We've done this before, you can do it again. Then we put our cursor at the end of the PSD file and make it longer. Next thing we want to do is click in the left area of our timeline, in one of our video areas, and right-click and then add video tracks. We're going to add seven video tracks that we have 10 overall. I'm doing that because I have nine letters and a PSD file, so I need 10 video tracks, so each individual letter can have its own background video. You'll know what I mean in a second. If you have 20 letters or if you have five letters, then just add the corresponding number of video tracks with that, as simple as that. Then drag your PSD file to your top video layer, for me, is video track 10, V10. This is important because anything underneath your PSD file or video track 10, that's what is going to be seen when we take out the green and the lettering. Then I'm going to go double-click one of my abstract videos, and then I'm going to do an in and out point, and put that underneath my Fluid Text. I do this, so when I color key out the green, I'll have something I can see. Next, we're going to go to Effects, Color Key. Drag the color key effect onto there, double-click our PSD file, go to Effect Control, then go to the color key, little clicker thingy, click the green, and then change your color tolerance, probably around 60, 70 some point at that. But notice right now, the whole Fluid Text is being taken up by this one individual background video. What you can do is double-click the background video, go to Effects Control and click "Scale", hit it where the text is, Premier is very finicky about where you click, you won't have the ability to do that. If you hit the scale text about that area, you'll see a wireframe, you'll be able to adjust your wireframe to make your video smaller. At this point, what I'm going to do then is I've made it smaller, but it doesn't perfectly fit in the letter F, so what I'm going to do is I'm going to go to effects, I'll type in crop and I'll go down to transform, and there is Crop and I drag crop onto my background video. Then I double-click my background video and I go to Effect Controls and adjust where things are cropped. If you click the "I" button, it'll show you where your video is not. I'm going to crop it in the left, I'm going to crop it in the right, I'm may crop in the top a little bit. I'm just going to adjust it where basically the only area you're going to see, my background video is in the F. Now, hit the "I" button again so you can see it, make your final crop adjustments and scroll over. We did the main thing. We put the video underneath our letter F. Yes. Now, I'm ready to move on to my next video. I double-click my abstract video, I insert an in and out point. You had I for in, O for out, if you don't know that already. Then I drag it on the video number 8, i.e, beneath the previous infinity room abstract video. From there, it's a little short, the area which I've selected, so I copy, I paste it, I right-click it, I put it in reverse so it looks like one fluid thing. Then I've gotten the scale and I hit the scale, then I'm adjusting the scale with the wire-frame, and then I'm able to actually just move it around with my mouse. One thing I'm doing right now, just so I can see this video a little clear, is I've hidden the I thing. Whenever you hit one of those I things, that means that video track will not be seen. Each individual video you're going to put underneath the previous video and you're going to fit it using crop and scale to whichever letter that you have there. I'm going to skip ahead because I think you understand this process, you're doing this for each individual letter. Eventually each video track from video 10-1 is filled with a fun background video that's going in behind my text. Eventually if you come look, what you're going to see is if I were to get rid of the actual Fluid Text part of this, my PSD file, each one of these videos is stacked on top of each other. Once you have all the videos underneath all the letters, you are basically done. Watch it over one time, It may be a little hard because it's a lot of information, so your computer may not be able to handle that. But, we're able to export if it looks generally good. Hit "File, Export, Media". When you're exporting, the format you're going to want is H.264. Go to Format and hit "H.264", then go down your output name, change whatever name you want the file to be called, and give it a location where that's easy and accessible for you to keep your file at. Then scroll down into your video settings, hit "Render at Maximum Depth". Then go to Target Bitrate. See as you adjust this up and down, it changes the estimate of file size. Instagram allows you to have up to four gigabyte video that you could put on to Instagram. The rules have changed, used to be you can only have a 100 megabytes or less, but your phone probably can't handle that huge size of the thing. What you're going to probably want to do is still do H.264. You're going to adjust your target bit rate and you can make them much higher, and then I'll give you much higher quality. You can also determine the size, which will allow it to fit on your phone easier and make your transfer easier. I would suggest going over 200 megabytes if you want a high-quality thing, you can adjust and see what works for you. For me, I'm still keeping it relatively small because this is a short video, and it's going to maintain the integrity of the background videos and the text. Then hit "File, Export" and bangers we're done. You've done this. Oh and last thing, if you have an iPhone, the best way for you to get your footage is to AirDrop it onto your phone, that allows it to maintain its integrity, which is important. You want to make sure your videos have integrity, but they're actually not compressed so that your quality is not lost. All right, so once it's on your phone, upload that bad boy to Instagram. When you're uploading this to Instagram, I want you to do me a favor, I want you to do hashtag dynamic text because this is going to make you look cool, and everyone will be like, "Man, your text is dynamic." But also it's going to allow me in the digital world to see what we've been doing and it gives us a cool framework for all the stuff that's going on, so hashtag, dynamic text. All right, thank you people, I will see you later on the robot side. I'm leaving the computer, I'm leaving it, good bye. Wait, I'm back in the computer because it's Class Project Time and I think you know what to do. Do one of these with whatever words you want, with whatever background videos you've compiled, go forth, create, have fun, enjoy it. Yes, and then upload this to Skillshare so I can check out, give you feedback, if you would like. Yes, have fun. Bye. 7. GIF Making: Little bonus video here. We're going to learn how to turn to our little video projects and turn them into a short GIF. Pretty simple, all it did was google, make GIF from video. I checked out a couple of websites, the first one, ezgif.com, actually really simple. You choose your video project and then you upload it. It'll take a second for it process. Then basically, you can just mess around with the settings. If you want a higher frame rate, a lower frame rate, you can use Optimize to make it a little bit smaller, but eventually when you're done messing around, just click Save and you have yourself a short GIF. I include this so that you could easily upload a GIF to Skillshare. Has to be less than eight megabytes, but that's pretty simple. Anyways, have fun. Make some GIFs, it doesn't have to be for this class, do whatever you want. You are free. Do me a favor now, share your GIFs with us. Upload them on Skillshare, I'm sorry for that stupid joke. 8. Analog Stenciling for Dynamic Text: You did the digital part, now we want to actually take up physical stencil that you can either make or you just Google it and order it online, I have links available for you and your project resources down here. You can get a special custom stencil made for you. This is what a customer stencil, I got made for my business, which is called Wild Birds, looks like. Right here, you can see that there is the part of this space in my letters that is not there. This is where we're going to learn all of these various techniques on how to make the stuff pop out. I'm outside, I have my stencil and luckily I got myself a model, she's beautiful. Cellalia do it again, wow, and she's holding my sign. I'm going to flip it around and you'll see that I literally, I'm just using the outside in nature to frame all of this. Yes, your hand is a great tool to hold this, it allows you to put it anywhere in the world. Go to France or go on the streets of New York like I just did right here, I think it gives you a really cool background. We are here at my final location, I have printed the work for the stencil over here. I have my fake cop chasing me off. Basically I just colored it in, I have my camera right over here and I'm going to pretend like I'm doing the last thing because I'm adding a little bit of motion and a little bit of a narrative in this story. Just to note, I'm the lease holder of this building, just in case if you think I'm some scofflaw, I'm not. Anyways, it's pretty simple, we're going to record this and you'll see what comes out here because you can actually use this tensile as the stencil. One of my favorite techniques you can do is you just use reverse. When you put something in reverse, people are like, "What's happening?" It's a really simple, easy thing to do. When you're going to premiere, all you do is right-click, go to Speed and click Reverse. It's that simple. One technique that you can do that I've done before in my smoovies intro right here, is I just used the natural light and I used the reflection and the shadows that come from natural light and the sun, to spell out my words. You could do something really cool like a time-lapse like this, whatever your hearts desire. I'm going to be honest with you, there is an infinite amount of things you can do with your stencil. Light it on fire, put it underwater, eat it like a meal. For our class project, I want you to do something unique and creative with your stencil. Find someplace to put it that it's very engaging and has natural movement to it, and then place it online, post it into the class project, share it with the world. Make one, make a couple, do whatever is in your heart, go forth. 9. Outro: Duper excited. I want to see what you make. I really liked this process and I think you are able to use this text-based video style as a fun canvas for you to explore life and to make visually, eye-catching promos for Instagram.