Skip to main content

3 Kinds of File Export for Photoshop Social Media Web & Print

Lesson 114 from: Adobe Photoshop Mastery

Daniel Walter Scott

3 Kinds of File Export for Photoshop Social Media Web & Print

Lesson 114 from: Adobe Photoshop Mastery

Daniel Walter Scott

buy this class

$00

$00
Sale Ends Soon!

starting under

$13/month*

Unlock this classplus 2000+ more >

Lesson Info

114. 3 Kinds of File Export for Photoshop Social Media Web & Print

Lessons

Class Trailer

Getting Started

1

Class Introduction

03:24
2

Before you get Started with the Photoshop Advanced Course

01:28

Selections & Masking - Advanced

3

The Easiest Way in the World to Mask a Person in Adobe Photoshop

24:23
4

Class Project - Select Subject

01:41
5

Select Mask & Changing a Color using Photoshop - Color Range

10:00
6

Using Photoshop Selection to Fix Grass & Sky - Color Range

07:20
7

How to Change the Color of Skin in Photoshop - Color Range

08:05
8

How to Create an Ink Splash Image Around Text - Color Range

15:02
9

Class Project - Color Range in Adobe Photoshop

01:54
10

Mask on a Group Rather than each Layer

11:18
11

Advanced Masking using a Channels in Adobe Photoshop

14:14
12

Class Project - Channel Mask

01:30
13

How to Make Selections in Photoshop Based on the Focus Area

22:53
14

Class Project - Focus Area

01:11
15

Selection Trick Using the Smudge Tool in Photoshop

04:16
16

Future of Selections in Photoshop with Adobe Sneaks

07:04
17

Quiz - Selection & Masking

Preferences & Workflow

18

Advanced Preference Changes for Adobe Photoshop

08:36
19

How to Speed up Adobe Photoshop if it’s Running Slow

07:48
20

Workflow Tips & Tricks Like a Professional in Photoshop

13:45
21

Advanced Layer Tricks in Adobe Photoshop CC

05:58
22

Automatically Add a Watermark Text or Logo in Photoshop

08:29
23

Batch or Image Process Multiple Images at Once in Photoshop

09:05
24

How to put Loads of Images into one Photoshop File Quickly

07:04
25

Weird Adobe Photoshop Features & Easter Eggs

06:37

Fixing Images

26

How to Enlarge Images Without Becoming Blurry in Photoshop

06:57
27

How to Fix Blurry Images in Photoshop Using Shake Reductions

08:17
28

Advanced Color & Tone Correction Using Levels in Photoshop

06:44
29

Advanced Curves in Adobe Photoshop CC

06:34
30

Quiz - Fixing Images

Cropping & Aligning & Distorting

31

How to Reshape Images Without Distorting in Photoshop Content Aware Scale

09:44
32

How to use Content Aware Move in Photoshop

08:38
33

How to use Content Aware Extend in Adobe Photoshop

07:28
34

Removing Objects Using Content Aware Fill in Photoshop

07:01
35

Class Project - Content Aware Fill

01:03
36

Cropping Tricks Delete Pixel & Reveal Cropped Content in Photoshop

06:11
37

Automatically Crop & Rotate Scanned Documents in Photoshop

05:35
38

Crop Angled Images to Straighten Perspective Cropping Photoshop

04:42
39

How to Trim the White Away from the Edge of an Image in Photoshop

01:52
40

Automatically Align Layers in Adobe Photoshop CC

07:38
41

How to Reshape Images using the Puppet Warp in Photoshop

18:10
42

Class Exercise - Puppet Warp

01:14
43

How to Change the Perspective in Photoshop Perspective Warp

05:47
44

Quiz - Cropping & Aligning & Distorting

Color

45

How to Color Black & White Image in Photoshop

09:42
46

How to Create a Duotone Effect in Adobe Photoshop CC

09:28
47

44. Class Project – Duotone in Adobe Photoshop

02:20
48

How to create the Glitch Effect in Adobe Photoshop

07:01
49

Class Project - Glitch Effect in Adobe Photoshop

00:44
50

Color Grading with Orange & Teal Effect in Adobe Photoshop

05:36
51

Class Project - Color Grading in Adobe Photoshop

00:49
52

Quiz - Color

CC Libraries

53

Advanced CC Libraries Tricks and Tips Photoshop

19:15

Typography

54

Advanced Type Trick & Workflows in Adobe Photoshop

19:38
55

Photoshop Can Guess your Font Using Match Fonts

10:43
56

Quiz - Typography

Artboards

57

52. Adding Artboards to your Photoshop Workflow Properly

05:24
58

How to Add Images Correctly to a Photoshop Artboard

08:17
59

Using Smart Objects & Relinking Images in Photoshop

04:10
60

Advanced Speed Tricks for Updating Artboards in Photoshop

04:09
61

Export Artboards as PDF & Separate JPGs in Photoshop

05:38
62

Quiz - Artboards

Retouching

63

Advanced Tricks for Healing Brush for Retouching in Photoshop

08:24
64

Don’t Forget About Clone Tool Stamp in Photoshop

06:09
65

How to use the Patch Tool for Retouching in Photoshop

06:41
66

Class Exercise – Retouching in Photoshop

01:15
67

How to Retouch in Photoshop Using Face Aware in Liquify

06:50
68

How to Use Vanishing Point to Mocking up Designs in Photoshop

12:19
69

Vanishing Point - Cloning & Healing at an Angle in Photoshop

11:19
70

64. Class Exercise - Vanishing Point in Photoshop

00:51
71

Fixing & Retouching Skin Tone in Adobe Photoshop

06:01
72

Retouching Eyes by Enhancing in Adobe Photoshop

08:00
73

Retouching Eyes with a Little Bit of Fakery in Photoshop

09:00
74

Fully Faking Believable Eyes in Adobe Photoshop

06:45
75

Class Project – Eyes in Photoshop

00:51
76

70. How to Realistically Whiten Teeth in Adobe Photoshop

11:44
77

Class Project – Teeth in Photoshop

00:57
78

Quiz - Retouching

Layers

79

Difference Between Place Linked vs Place Embedded in Photoshop

08:22
80

What is the Difference Between Fill & Opacity in Layer

01:11
81

How to Use & Export Layer Comps in Adobe Photoshop

03:27

Visual Styles & Effects

82

75. How to Create a Double Exposure in Adobe Photoshop

11:07
83

Class Project - Double Exposure in Photoshop

01:17
84

How to Create a Watercolor Painting Effect in Photoshop

09:23
85

Class Project – Watercolor in Photoshop

00:32
86

How to Decay Pixel Explosion Dispersion Method in Photoshop

13:47
87

How to Make Exploding Shoe Effect in Adobe Photoshop

10:49
88

Class Project – Decay in Photoshop

00:51
89

Quiz - Visual Styles & Effects

Video & Animated Gifs for Social Media

90

How to Edit Video in Adobe Photoshop

25:42
91

Parallax Effect to Make Photos Move in Photoshop

13:22
92

Class Project – Parallax in Photoshop

01:15
93

How to Create Live Images - Cinemagraphs in Photoshop

13:19
94

Class Project – Cinemagraph in Photoshop

01:35

Web Design

95

How to Setup a File Ready for Web and UI Design in Photoshop

09:32
96

How to Export Your Web Design UI Project for Dreamweaver

07:57

3D

97

How to Make 3D Text & 3D Logos in Photoshop

11:52
98

How to Add and Change 3D Materials & Textures in Photoshop

08:42
99

Using Cameras & Depth of Field in 3D Photoshop

05:12
100

Adding Lights & Casting Shadows Using Photoshop 3D

10:01
101

How to Export a High Quality 3D Image from Photoshop

04:42
102

Class Project – 3D in Photoshop

01:08
103

How to Create Fake 3D Lines & Type in Photoshop

09:33
104

Fake 2.5D Gradient Effect with Paths in Photoshop

07:10
105

Class Project - Fake 3D in Photoshop

00:46

Mock-ups & Presenting Your Work

106

Using Free Templates & Adobe Market to Mockup in Photoshop

11:07
107

How Make a Reusable Mockup in Photoshop Using Smart Objects

06:40
108

Mockup Poster Against a Wall Using Photoshop

08:16
109

How to Make a Simple UI App Web Design Mockup Using Photoshop

06:06
110

Class Project – Mockups in Photoshop

01:00

Exporting

111

How to Proofing Colors in Adobe Photoshop Ready for Print

04:04
112

How to Tidy Up your Photoshop Files Before Sending Them Out

10:21
113

How to Package Your Photoshop File to Include Linked Images

07:22
114

3 Kinds of File Export for Photoshop Social Media Web & Print

12:59
115

Quiz - Exporting

What’s Next

116

What’s Next After Your Photoshop Advanced Course

01:05

Final Quiz

117

Final Quiz

Lesson Info

3 Kinds of File Export for Photoshop Social Media Web & Print

Hi there, this video is all about exporting our files. We're gonna look at three use cases, we do social media will do web and we'll do print, we've covered some of these in kind of specific areas. But I want to condense it down into one kind of usable video just so you know, these are the definitive rules for exporting the different formats all in one handy place. So social media first, we'll look at just doing a single document plus a multiple art board export. So this one here, easiest way and best way is file export and no, not file export file save as because what we want is a J Peg. So we're using just a regular old Jpeg, not a safer web because social media doesn't need to be condensed and the data pulled out to make the file size smaller, we just want a really good looking image. I'm gonna put it on the desktop. I'm going to put it in a folder called export. This one's gonna be called grow, This is gonna be July 19. Let's save quality slider because we aren't worried, we're goi...

ng up to facebook, facebook twitter instagram, they'll do the image resizing. We don't want to do it for them. If you're uploading 1000 of these, you probably want to keep the file size a little smaller. But jpeg like that is a really good quality and it's going to be ready to go, let's say you've worked on something that has multiple outboards. So we want to export these for our different social media platforms. So we need to do is go to file and we're going to use this export option. What we want is export to files. Put them all in my this stock folder called export click open. This is going to be my illustrator course and you can decide on the format. It's going to be a Jpeg and the quality sliders at eight run I could drag it up to 10. Successful. And now on my desktop I have in the export folder you can see there. Okay, I it's got my illustrated course. It's taking the rest of the file name from your art board name. So just make sure you're naming your outboard something that you want the file to be. All right. Let's move on to print exports the nice simple one. Switch one here, let's say this thing we've made it, we've fixed it, it needs to go out to a poster or a printer. What kind of file format should I use? The most versatile is file save theirs and in here you're going to use, you can see in PST s just leave them as they are. The file sizes are quite big. So what we're going to use is the Photoshop pdf method. The cool thing about that, if there is text or vector graphics, it will be retained inside this pdf plus the file size is really small and quite interchangeable in a format that is expected I guess it's easily emailed. Let's put it on my desktop, You can see I've got to export folders just to mess with everyone. This one here is going to be called Prince smoothie. Thank you very much. Okay, and in this pdf settings because it's going out to commercial print, just pick high quality print and just turn that off. Why? Because that's going to basically just make a pdf with this turned on, basically all you have is a PSD super big, fully editable. All the layers, but it's just called a pdf can cause problems with printing rips. Makes the file size super huge. We just don't need all this kind of malaya masks and things. Now we're sending it to the printer, they don't need that stuff so we can turn it off, then click save as and if we check it in my export files there, he is there 2.2 MB or is this actual file here is about 50 MB. Let's do the last one. Let's do web design. So in your exercise files, if you want to play along in 17 exporting, I've got this web designer example, I've got a slightly different version that we've been using before. So it's kind of two ways. Let's say I like this graphic here, I'm gonna make my latest pal nice and big so you can see it. Okay, so I've got this thing called image books layer. I'm going to right click it and just say export as well. You can use the quick export. That's the quick way of just getting a single layer out. Okay, and that's doing it one at a time so I can decide I want to be a PNG no, jpeg. Do I want it to be 70% like, like export? So that's one at a time, which is quite cool, but if you want to do lots of them, we're going to use adobe generate. So we're gonna take it even further than we did earlier in the course. So file, let's make sure that generate image assets is on. Actually, I'm gonna save my document somewhere, make it easy to see. I'm going to say that you don't have to do this, but I was going to make a folder on my desktop called generate and I'm going to pop this in. Cool, so the way generate works is it looks to wherever you've saved the PSD there is, there is an affordable generate. When you turn this on file, generate, Image assets, nothing really happens except you get this kind of folder that's where it's going to stick all our images. So let's say this background graphic here. I want to save this out as a dot jpeg magically in my Image assets. There is my Jpeg. Okay, and I can work my way through and say actually I want that to be a jpeg as well. Image books, you're going as a jpeg, But I want to take it a bit further. What I'd like to do is I want this to be a really low quality version but at least I know that it looks good at 40%. You just take 40% of the end and it has to be this syntax okay, can't have other spaces. It has to be dot j p G And then straight into the 40%. The cool thing about that is it will do image books at a 40% quality. Let's do it at 10%. So you can really see that it's actually doing what I say, it's regenerated it and you can see it's pretty pixelated So you might be happy that this one is at 40 but this one here because it's background we can get away with like I don't know 30% the lower. Now this syntax we're going to cover quite a bit in this course and it's hard to remember the syntax. Okay what has to go where? So if you google, adobe, Photoshop layer syntax, you'll end up here. Okay. It's the top results, adobe help dot com And here is the big long version. I'm going to give you the skinny version but it has all the syntax written out in here before you finish the syntax. What I want to do is let you know that you can export groups because at the moment I've got this graphic and this graphic, they're two separate graphics so I could name them but they'd come out separately so I can slip both of them have a group name, this group logo dot PNG And let's say I wanted to be an eight bit or a bit or a 32 bit PNG. Okay you can just add that there as well, we'll just leave it as a normal PNG which is a bit and hopefully hear that group gets exported now if we check you can see mine's not appearing sometimes this happens sometimes you just need to turn generate off and back on again. There's my logo, leave that in there. It's an issue that I had. You'll probably run into it as well and you can see I guess the thing I want to show you is that can you see a group them together to just name the group. So let's look at some different syntax. Just know that you can do three of them, you can do PNG, you can do gift and you can do jpeg you can see there's my gift there. What else can you do? Let's say you're doing responsive design and you need a couple of versions of this background. Okay so um let's get rid of the 30%. Let's just try and keep it clean. So I got bricks But I want a smaller version, I want a 50%, goes at the beginning with a space. What it'll do is it'll generate whatever sizes in the document, half sized version. So we gotta bricks there is there now it is, how big is it? This one here is 603 that's half of what it is in this document. But often when you're doing response of what you want is you want a comma, you want two of them. So I'm going to copy this, you could put 100% in but you don't really need that. So a comma and a space. And what you need to do is these need different names because we're going to create two files. Now the comma means making two versions of this. This one is going to be my maybe at two X. Or maybe this one is just number two or her is So once a 50% ones just normal and hopefully now I have got to look close it down there's bricks, it's bricks high. Res you might be using the at times to suffix, you can add that there too. So that's re sizing it. Let's look at another way of re sizing it. So instead of doing 50% you can actually say I would like it to be let's say 200 boxes across space X. Space. So 200 times and let's say you know you need it to be 200 width but you're not too sure how high it is just like make it whatever height it is proportionately So 200 wide and if you use question mark, you have to use the lower case X. You have to use all these spaces. It will guess the hype for you. So now in here I'm going to have a bricks that is 200 pixels wide. Okay, copy that. I'm going to have another one that is 500 pixels wide. This one is going to be called maybe 500. Hopefully. Now I got my syntax right? There's a version and there's a 500 version. Go on now let's say you want to take that to another level. Okay, because you need a high res and low res you don't want to have to be copying and pasting and changing the names. So what we're gonna do is just going to call him brooks. Mm bricks even man, Is that bricks having a bad day which is the regular day. Anyway, we've got bricks and let's do a few other ones. We've got that one. So image books is done. Let's do some of these PNG So there's my icon for print. This is going to be dot PNG this one here is going to be my app dot PNG. These are all going to be dot PNG totally name your layers as you go. So we could go through all of these. Right? So we've named all the layers. Adobe is generating them all as we go. There's my icons But let's say I need two versions. I need a high res and low rez you might need uh 50% 100% 203 100 for all the different mobile phones or media queries. So what you can do is make a new layer. It doesn't matter where it is. I'm going to put mine to the top of my group here so it's easy to find and you have to use this syntax, you have to say default Hi res you don't have to say Hi res, you can call this that this is naming your folders. Whatever you say here could be the dan folder. I'm going to create a folder called Hi res. It knows it's a folder because you put a forward slash just in front of it. I have to say default have to put a forward slash straight afterwards and let's look what happens. It's the blank layer Photoshop gives. I'm going to put all them into this default folder for you which is not that exciting until you put two of them in here. So you put a little plus and you have a low reservation. Everybody needs a little slash at the end To say I've got two folders. And the trouble now is there's nothing different about these two Genered two folders but they're exactly the same. Exactly the same size. So what we can do this low res folder here. Okay, Remember when we did our scaling earlier, we put 50% in front of it. It's the same here. I want everything in this folder to be 50% the size. Alright we're there. Let's have a look now so you can see bricks hold it smaller than the bigger bricks go on. If you want to get even more nerdy you're like there's no way to get more nerdy than that. Okay you can say straight up to here is I want you to append it with the at two X which is really common in web design and mobile design as an indicator for the high res version. So now I've got all these at two X files Now. Don't worry if you're like that blew my mind. He went far too fast. All you need to do is type it out once and just do what I do like I can never remember that all of my heart, I just opened up a previous file that I've worked on. I copy it out and I paste it into this or I just go to the I just google layer syntax for Photoshop and you can kind of pull it from the adobe web site. Alright. We've got a bit nerdy there at the end but I hope you can see especially if you are a regular web designer, you need to get assets out for either yourself building websites or for your developer. It's really good now, especially if you're making amends, you go through and say actually this thing here needed to be switched out to a different color. And I've got my bricks at times too. And I've got my smaller version now, all ready to go super quick. Super easy. You just gotta put that kind of initial effort in. All right. That ends nice lengthy exporting files from Photoshop. Hope you learn something new. Let's get on to the next video.

Class Materials

Bonus Materials with Purchase

Exercise Files
Completed Files Part 2
Completed Files Part 1

RELATED ARTICLES

RELATED ARTICLES