Uploading to Behance & ProSite
So now let's upload a project. Since we're in light room, let's go ahead and use one of the published services for that. So I'll go back to my grid, view the library by pressing G and choosing the collection of images that I want to use. Let's come over here to my Sunset book, and I'll change the size of my thumbnail by pressing the minus key on my keyboard. So let's say that I have completed a series of sunset images, and I am now ready to post them as a project on the hands. Well, you cannot post projects from inside any of the creative cod abs. You have to do that on the B Hance website, but you already know that were limited to eight megabytes per file. So we need to do a little bit of re sizing before we post those projects. So I've got a collection here that you can see on the left hand side of the screen, and I've got star ratings on my favorite sunset photos. So what I'm gonna do is filter what I'm seeing in light room by attribute, and I've already entered three stars right he...
re, so These are the photos that I think are my best sunsets ever. And let's say that's the project that I want to upload TV hands. So my point right now is to merely resize them. So do you all remember that? Uh, we made an 800 pixel watermark file yesterday or preset? Rather. So let's go ahead and make another preset that without the watermark. So we'll click the little plus sign next to publish services and will click, go to publish manager, and we're gonna click, Add and we're gonna name this one. Be hands, projects, and this really will automate and make the process a lot faster. So specific folder. Yes. So I'm gonna click, choose, and I'll come over here to my pictures folder and I'm gonna click new folder. And I'm gonna put a bullet just to make this folder appear at the top of that folder list when they're in alphabetical order. And I'm gonna make a bullet by pressing option or alter on a PC eight. That's how you make a bullet. Okay, option eight or all eight on a PC, and we're gonna call this one Be hands, projects click. Choose now, Let's come down here. I don't care about renaming the files. They're fine with whatever the heck there named. If I had a small video in light room like rooms. Happy to manage your videos for you to You can't edit them in light room. But if I wanted to include video files in this published service, I could. But as you know, you're gonna be hard pressed to create any video that's small enough to upload to be hands directly. Next, I'm gonna set J pay quality at 100. And if I didn't want to resize, I could just say limit file size to what is eight megs in K's 8000? Something like that. So what you could do is just enter the maximum file size and the light room's gonna make him however big it wants. That would be one way to handle it. But we know that be hands really wants them at 600 pixels anyway. So let's just go ahead and enter that for the long edge. 600 pixels do a little bit of sharpening for the screen. Absolutely. Don't want to add a watermark. No, you can read all about watermarks on be hands. Do a Google search for B hands watermark, and there's a lot of conversation about that. But for predominantly, the B Hands support team encourages you not to include watermarks on your images, so go ahead and click save. So now we've got a published service, really an expert preset just for the chance projects. So now, since I've already filtered down this collection into what I want to see, I can just click and drag those files over there. Come over to that published service and click publish. Now, this is not uploading them to be hands. This is merely re sizing them. We have to do that ill manually, so it doesn't take very long for that to finish. So now let's go find that folder on her hard drive so that we can click and drag those onto the B hands website. Well, what's a fast way to find that folder? Light room can help you go straight to it. So what you're gonna do is you're going to right, click or control. Click on that preset that we just made, and we're going to say go to published folder and it pops it right Open for you. Very, very handy. So here here are images right here. Now, this folder you'd probably want to clean out once you upload those files to be hands. Because if you're gonna use that same folder for that export preset, then that would pile up with images. And but I guess you could sort by date to tell which ones you just exported versus which ones you exported a month ago. Do you know what I mean? So you might sort him in the folder by date. I would probably come in here and clean these guys out because they live in light room. I only need them here temporarily. Just to upload is a project to be hands and I can throw him away. Yes. Do you have Teoh? Have all of your files in that project are ready to upload to be hands or can you add more leader to the same project? I think he can add one later to the same project. Yeah. Okay, so here we are. We're ready to go to be hands. So it's really a ranger desktop just to touch and let's go to the creative cloud at and click, be hands and we're click Add work and that pops open to be hands website. You can go straight to the Behan's website. If let's say you've got a bookmark for it, you wouldn't have to go the creative cloud at. But it's a nice path right to it if you if you haven't yet saved a bookmark. So here we are at the B hand side shows me all the projects that I've already uploaded. You can click each one to expand it and look at it. So if I click the masters of slack key guitar and in that particular page opens. So here's that YouTube video of my light ring slideshow. So as I scroll down the page, see how the files are nice and big, but not too big that anybody's gonna want to steal him. Max with of the B. Hance Thebe hands up support team has done quite a bit to give you a bit of direction, they say not to upload a bunch pictures. It's a really narrow your projects down to your best of the best of the best, you know, like 15 photos or list. That's not a hard rule. That's just their guidance, so you might want to keep that in mind. So let's say we want to upload our new project so we'll click, add work. And then from here you can also add a work in progress. But we want to add a project. So we're going to click at Project and everything you do on the hands is this easy. You get these nice, big explanations of exactly what to do and the rest of the screen is great out. I mean, woo, what button do I click? E don't know, but maybe the big blue one. So now we can go to that folder that we had, Ah, pictures you can drag and drop to you so sort by name. There's RB hands projects. So click the 1st 1 shift, click the last one and click open And there they go. You can change the order of the files in which they appear in your project. By clicking this button right here, you can set images for sale. To do that, you would need to input your tax. I d that kind of information. But you can actually sell these things or you could link to the site where you do sell those images. You know, Let's say you sell some fine art prints on Etsy or someone and so forth, and you might you might do that. You can add a caption to each image in your project. Ah, you can replace it. So the question that we had earlier can you add a file later to a project? Absolutely. Can you delete one? Absolutely. Throw it away right there with the trash can icon. So here you can see what we've gotten. Let's say I want this image to be the number one image in my pro site or my projects. Rather, I would just click this button right here, and it's a drag and drop situation. Isn't it? A dragon drop situation? My screen's a little big, so I can't see here. Okay, so it should just let us click and drag to reorder them. There we go. We're having a little fun with pop up when those here so you guys won't have this problem at home. But anyway, this poppet menu opens. You can see it, right? So there's these little handles on the left hand side of each image. So what you would do is just click and drag a little handle next to the image. So be Hance is having a little bit of trouble with Firefox here. So depending upon your Web browser, this will work either better or worse than it is for us right now. But it is a pop up window situation, and you just click and drag the little handles that are on the left hand side. Let's see if I zoom in, you can see that their actual handles, I just cannot get down there. That's so funny. But it's like a little Siris of lines. See right there. And you click and drag that and you can raise it up and down question. So if you put something in the garbage or move something around, what happens? All your comments to those just go away Or do you need a try to save those out some other place? Yeah, yeah, they go away. Okay, so that is uploading a A project so we can entitle it right here. We can click This will edit button, and we can say, What is it? Oh, this is my sunsets. Click save And so now my project is called sunsets, and I can continue, and I can choose to upload a poster image for the project so I could find that one that I like the best. Let's say it's that one right there and click open. So now that is gonna become my poster image, and this is gonna show up fairly small. It's gonna end up like a thumbnail on your projects, page there and be hands and also on your pro site. So what you want to do is use this crop box so that you're showing the most visually pleasing part of that photo. Because when people are surfing, Behan's either looking for people to do a job for them or what have you. They're going to be seeing your work initially as a thumbnail. It's not gonna be until they click the project. Are they going to see any of your images at a large size? So that fund nail is very, very important, and this is exactly what it's gonna look like right here on the left hand side at exactly that size. This is what they're going to see. So, you know, put your best image, foot forward, Position it so that the thumbnail looks as good as it can. Okay, actually, I could make a little bit bigger. I mean, I could make it as large as the photo if I wanted, but for a thumbnail, I might zoom in on what really sets this photo off, which I might consider is about right there. So be aware that people are gonna be saying your your images as thumbnails until they choose to click on it. That's the stock photography. Uh, tip. You need to crop your images when you're dealing with with stock photography as if they were going to be a thumbnail. Because that's all people see when they do. A search on the stock photography size is a little bitty thumbnails, so that will be thumbnails were very, very, very important. Any other questions on that? Yes. While you're on the camps website right there, notice it says embed media. Yeah, that's where you can put in that in bed code. Is that where you put the from the YouTube or absolutely so let's take a look at my pro site here. So I clicked on, add work, and then click on pro site. And if you have linked your adobe account with your be hands account like we looked at a little while ago, then, um, this is exactly what you're going to see. If you haven't linked that you're going to get a big old give me $99 message. So then you would have to go back and link those files. So let's go ahead and click Edit my pro site, and we'll just begin to look at the kinds of custom is ations than we can make. And then in the morning, we'll start out by building Franks pro site. So we're gonna build one from scratch, and we're gonna create this header file together. So basically, here's the pro site. When you first start out, you're going to see these templates. Okay, so this is the layout section. This is gonna be the first thing you see. So if we scroll down this panel on the left hand side, we've got several different layouts that we can choose as you click each one. You see example of what it looks like over here on the right hand side, and it's fully functional, so you can see the types of of websites that you can create on this. Also, for every single template you've got over here on the left hand side, you can click this little view customization examples, and that's where you can find inspiration on how you can further customize these templates. So there's people have done all kinds of things with them, and if we want to actually go visit that site, we click launch, and it will take us to another a tab on your Web browser here so we could explore this site if we wanted Teoh to get design ideas or to see what other people have done. So we'll go back to the pro site here. Once you pick a layout template, you just click the screen button right here. Use this layout. We'll pretend like we just did that. Then you can come over here to the design page. This is where you make all your customers ations, and it's so easy you're not even gonna believe it. So let's just trot through these things right here. So I'm on the styles button within design, and that is the first section that you go to when you click design. As you click on any of these items, a little pop up window comes up and thank goodness it will hurt. She the little poppet window comes up that gives you your customization options. If I want to change the fonts globally, see global styles and fun. Then I can I can choose any of these fonts right here. Tomorrow we're gonna learn how to incorporate some of the type kit fonts that we can download into this. You can use custom fonts on your website, and then you can also control what fun is used for your links. I tend to use the same fund for both for links, for titles and for links. So the titles here we close that are coming from your projects. That's how I know that sunsets project didn't actually upload cause it would be here if it did. So this is all coming from the information that you input when you upload a project. These are custom pages that I've added, and here's a text listing of the projects. Same as we've got over here. If I click background, if I just point my cursor at it, look how I get this Yellow Stripes situation. What be hands is doing is it's telling you what area of the Web page that's affected by that control. Seeing as how I point my mouse at all of these, it's showing me with that yellow, highlighting what area would be affecting. I have never seen any kind of busy wig or any kind of HTML editor in my entire life. That is this simple to use. I've never seen any of them do this kind of section highlighting as you roll over this kind of stuff. It's really incredible. So if I wanted to change the background of the pro site here, I just click on background. And then I get all the things that I can do to that background. Well, for background, I've only got 11 option really. Here, give it a click. A little pop up menu is going to come up, and it's gonna say, Hey, do you want to change your background color? Where would you like to upload a background image? Now? One background image type that would work well would be a little quality abstract photography. That would be a nice background image to make. I would not add shy away from adding just a regular photo to the background cause it be most likely to busy for that kind of, Ah, think is your projects are gonna be sitting on top of it. But what you might consider doing is uploading a texture. If you like to shoot textures, you might put a texture in the background. That might be a nice idea for that, but the interface is just so incredibly simple, so to change the background color if we want to, all we have to do is click this little color swatch and then choose another color. I mean, it's a simple is that now I've got the background color of my masthead or my logo baked in because that's a Photoshopped file that I uploaded her. It's a A P and G from Photoshopped that I uploaded, so that's why the gray is still staying around the logo. But that's how easy it is to change the color of the background. So I'm gonna click, cancel, and if I wanted to add a background image, I would just click upload image, and it would give me a dialog box where I could navigate toward that image lives. Now it's kind of keep going down here. So for the header, let's see what kind of options we have. So let's click Header and it expands, say, Oh, we've got some kind of a top bar that we can turn on. What the heck is that? Well, it's off right now, so let's give it a click, and now it appears on my side. And while I'm pointing out that I'm not pressing any buttons while I'm pointing out that section, Behanan says, highlighting that area all it is is a solid color bar. So I leave mine turned off. But if you want that solid color bar, you can. Now we've got a logo area. If I click logo, I get a little poppet window that lets me upload my logo. I can choose how that image is aligned, and I can choose the link, the hyperlink in which, if anybody clicks on that logo where they're going to go be, Hance recommends that you choose your gallery page, so that would be the kind of the index page, if you will, where all of your projects are listed. That's really what you should link Teoh, You're gonna be tempted to link that to your own website. If you have another website like I have photo lisa dot com. But if somebody clicks it, that's going to be a little jolting to the user because then they're gonna be leaving be hands and they're going to go to this other website, so that's a little bit confusing for them. So what you want to do is link that logo to your gallery page incredibly easy. If you want to create a text logo right here and be hands, you could do that. You've got all this kind of font format in control. Here. You've got your list of funds, you've got limited styles. So if I was going to create a typographical luego, I would do that in photo Shopper illustrator and upload it rather than try to do here. But for temporary uses while you're building this, there's nothing keeping you from adding and text logo right there. You can control the line height if you have ah, text logo where you press return, you've got two lines of text. It's kind of like you're letting control right here. Then you can control the color of the text. So you just click on any of these little color swatches and you get the same color picker and then you again. You can control where people go. Should they click on that logo so incredibly forgiving, Incredibly easy to build a very professionally looking site quickly. So it click. Cancel out of that so we can keep cruising down here. Let's click on navigation. So obviously Ah, the navigation is gonna affect this area right here. So I've got a page title so I can click on that and see what kind of options we got. I can choose to have a text or images here, all the same kind of situation that can control the rollovers. I can add dividers if I wanted to. So if I wanted dividers anywhere in this section right here, I could turn these guys on Really amazing. So now, as I point to my header image, I can add a section divider here. If you've got a bunch of projects that are, let's say I had did several sunset shoots and then I did several macro flower shoots or I did several abstract shoots. Then I might want to add a divider between those different listings of projects to kind of separate them a little bit and give. My visitors include that. Oh, hey, the theme of these projects is different from the ones above it. So you can add these section dividers if you want. It's really amazing project covers If we want to determine how big these guys are, we want to change out the images that were in our projects that the cover image that we set when we upload the project, we want to swap that out. We can do that right here. We can change the project text. So which project do you want to change? Click the one you want to change. So instead of masters of slack key guitar, you know, I could maybe just say slack key guitar show 2013. I can change the field. So this information right here is what we should have seen when we were uploading that sunset project a few minutes ago. So this is exact same information, so you get a second chance at changing it. If you want Teoh so we can click, confirm, and then it will automatically made our change there. We can change the cover effects. There's not a whole lot of them, but you can give them a stroke if you want a nice little outline, which, uh, might be neat so we can add a one pixel stroke on there may be at a a low opacity, so it just finishes off the edge of our cover shots in our projects, which is a nice thing to do. And we can control what happens to the projects when we roll over them with our mouths so we can change the, uh, stroke color on roll over. If we wanted to give our users a little bit more visual feedback that hey, you've just rolled over something that's clickable all kinds of neat things we can change the image opacity of our shots here in before somebody clicks on them or when they roll over them. So there's all kinds of custom is ations that that you can make with this, and I just love the way that when you mouse over these customization features on the left, the area that you're gonna effect on the site highlights so you know exactly what you're fixing. The change at at any given moment,