Hi, could you please tell me how to do this slanted layout? the-borgias*tumblr*com/post/695485491217334272/one-chicago-appreciation-week-day-one-favorite
Hi, Anon! I'm sorry this took me a few days to answer but I struggled making this tutorial (not because the process itself is difficult but it is difficult to explain it properly.) Anyway, here's the gifset Anon is asking about. I hope this is easy to understand and I also included a .psd file of the layout :)
PSD FILE OF THE GIF ABOVE & TEMPLATE
What you'll need:
Basic Photoshop knowledge (I use Photoshop 2023)
Basic knowledge on how to make layouts (here are a couple of tutorials: x x)
Basic knowledge about layer masks (tutorial)
STEP 1: Make a basic layout
You can do pretty much any layout you want but for the sake of the tutorial I tried to recreate the same template I used in that gifset. I'm assuming you already know how layouts/templates work so I created a 540x540px canvas and went to View > Guides > New guide layout. I used these settings:
And this is how my canvas looked like:
Now I pressed (M) to use the Rectangular Marquee tool and create the rectangles I wanted. This is my end result:
STEP 2: Tilt the layout
This is actually pretty easy. First we're going to select all our layers. I paired mine in groups so they looked like this:
Once we've selected all of them (groups, layers, whatever you're working with) press Ctrl + T. Your canvas should look like this:
And we're going to tilt it by changing the angle to -2.00 in here:
Now our layout is slanted! But as you can see we have transparent spaces we need to fill. I don't know if this is the easier method to do it but I use the Polygonal Lasso tool (L). I'll use the first orange box as an example:
As you can see I use a ridiculously big zoom so I can be as accurate as possible but it's basically impossible to create a perfect box, so this will work. Once we have selected our desired shape we'll use the Brush tool (B) to paint in the layer of our original orange box:
You have to do this with every box so it's a bit tedious but that's the way I did it 🤷♀️ This is the end result:
STEP 3: Place the gifs (using Layer Masks)
But now, how do I know which size my gif should be? Our initial measures won't work because our final boxes are bigger so here's what I do. I'll select the Polygonal lasso tool again and make sure I select a little bit more of the box I'm measuring, like this:
It's a little hard to see it but the dots are just a little bit bigger than the orange shape. To be more accurate, my original box was 178x87px and the shape I selected is 174x100px. So I'm going to make a 174x100px gif and place it right above the background, like this:
Now we're going to select the layers of our gif (I'm assuming you're working with a Group because it's easier) and click Ctrl + the orange box. You should see this in your canvas:
And now create a layer mask in your gif group (if you don't know how to do it check out the tutorials I liked at the start of the post.)
Now you can delete the orange box. And, once again, you have to do this with every box and write down the measures (and remember that all your gifs must to have the same number of screencaps!)
I hope y'all don't mind that I didn't create 8 different gifs lmao I was too lazy so I just used a big gif as a background and made 4 small gifs. This my end result:
For the background I merged the remaining boxes and used that to create the layer mask. I'm not going to explain it since I believe it's much easier if you check out the psd file.
And that's pretty much it! It's the same as making a standard layout you just have to be careful with your gif measures. Oh and also see how my gifset shows those white marks between the gifs under a dark background?
Well, that can't be avoided since we aren't working with straight lines (you can see the same effect in the 2nd gif of this set, different layout but also not straight lines) so we'll just ignore them.
I hope this was helpful (I lowkey feel like this tutorial is a mess) and if you have any questions feel free to ask :)
agustd3′s 4k followers celebration psd pack!!
i’m so thankful for everyone who follows and interacts with my posts so i wanted to post a little gift ♡ you can download it here!
now, these psds are quite simple but i tend to go all in with colors so adjusting is likely to be needed! hope you enjoy! if you have any questions feel free to send me a message ♡
— tagged by the amazing @aejeonghae, @taeminie and @smittenskitten! tysm for thinking of me for this ♡
media: till the end of the moon, summer strike, the eighth sense and back from the brink
looking back from my previous before and after coloring tag i think i improved a lot, especially when it comes to color correcting, started to use more color balance and channel mix, a lot more to improve but still these colorings made me really happy with the result i got.
Don't you hate it when some assholes book the best spot in the library a week in advance so you don't get to use it (<- was going to do the exact same thing)
sure!! this is the basic coloring i do for all my 9-1-1 gifs (certain sets have different processes, especially if it's more of an edit and less of a set, if that makes sense lol), so i'll show you how i color like this:
after i sharpen (rn my settings are smart sharpen > amount 500 > radius 0.4 > remove gaussian blur), i do a curves layer & a brightness/contrast layer.
for curves i use the bottom dropper (the white one) to pick the lightest part of the gif, and the top dropper (the black one) to pick the darkest part; for brightness/contrast, i adjust these manually, usually raising the brightness and lowering the contrast quite a bit.
next, i'll do a color balance layer and a gradient map layer.
for the color balance, 9-1-1 is obsessed with making their scenes yellow af, so I'll bring out the cyans and magentas, and lesson the yellows by playing with the yellow/blue layer.
then, i do a b&w gradient map, set to soft light and anywhere between 10% and 50%, depending on the gifs. this just darkens the blacks, but i really like the way it looks!
after that, i play with the selective color layers.
for selective color, it's different for every gif i make, but the processes is generally the same; i make sure skin tones aren't washed out by playing with the reds/yellows, i brighten the whites and darken the blacks. if the characters are wearing a specific color (usually blues) I'll brighten those as well in the cyan/blue layers. i also always use the settings shown for magenta (unless the character is wearing the color) to brighten lips/buck's birthmark.
then, after i'm happy with the colors, i'll add a vibrance layer for vibrancy, and usually will increase the brightness a smidge just to account for darkening the blacks.
finally, the thing i always do: another gradient map layer, this one in pink! lately I've been using my photoshop's preset gradients -- the one i used in this gif is Pink_08, and I'll set that to soft light and anywhere between 10%-50%, depending on the gif.
and that's it!! then i save my gif and post :^)
i hope this helps, but if you have any other questions feel free to shoot me another ask!! <33
1st PSD pack by noorasaertre ♡ in celebration for finally reaching 1.5k followers were goes a psd pack with some of my personal favorite gifsets! tysm for all the support, it means the world!
examples:
skam (x);
1917 (x);
lydia martin (x) (x);
wanda maximoff (x);
noora x eva (x);
daenerys targaryen (x) (x);
vilde lien (x);
battle of bastards (x)
I hope you enjoy it! Feel free to play with the layers and tag me on your edits using one of those psds, i’d love to see your results (#userzmari).
Please, LIKE/REBLOG if you download and don’t repost or claim as or own! (DOWNLOAD)
