Viewers: in countries Watching now:
Join Justin Seeley, lynda.com staff author and design enthusiast, each week for a new 5-minute, self-contained tutorial that you can use to instantly improve your design workflow. This series covers techniques for print, digital, and web design, addressing the tools that creative professionals like you use most. Learn new ways to leverage layer styles and vector shapes in Adobe Photoshop, work more efficiently with text in Illustrator, and embed videos and even tweets in WordPress posts, and much more. Check back each week for a new installment, and a new design hack.
Hi there, and welcome back to Creative Quick Tips. My name is Justin Seeley, and this week I'm going to be showing you how to create some really interesting product shots for your next website or app development project. And they're going to look something kind of like this. Or, like that. And the best part is, you can do it without really having to do a whole lot. And so, I'm going to show you how to do this on the web, and let's jump back over into my browser for a second. And on the web, you're going to go to placeit.net, that's P-L-A-C-E-I-T dot N-E-T.
And basically what this website is, is a place where you can go and pick what are called stages. So for instance this stage right here. And then you upload your image, or you grab a screenshot from a URL. So for instance, a website or something like that. And then you can upload it directly onto this screen. So, for instance, if I wanted to upload an image here, I've got a app mock-up that I've downloaded, so I'll just go find that really quickly. There we go. And we'll upload that. And it gives you the chance to crop it. And so, I'll just go ahead and crop it to the dimensions that it sets.
And then once it uploads, it's actually going to place this image, directly onto the screen that you see here. Creating a really interesting looking product shot. Then, once it's placed there, you have the option to actually download the file. So, in this case, I can click the download button once it's finished. And when I do that, I get several different options, the first of which is free. You get a small preview, 400 by 300 for this one. You can choose a normal size, which is 1280 by 960. That's going to cost you eight bucks.
And you've got a high res version, 1920 by 1440. That's going to cost you ten bucks. And then a super high res, 3300 by 2475. That's going to cost you 100 bucks. You also have the ability to do comp sizes, which is 1280 by 960, and you can do $12 a month, which gets you 75 comps a month. And so you can pick a plan if you want. This is a really interesting service. So, if you're just starting out with app developement, or website mock-ups, I highly recommend that you start off with the small, the freebies.
And you can still post stuff like this to, you know, various websites for your portfolio, whatever the case may be. As you start to gain a little bit more traction, maybe you bump up to the normal size. Or, if you really want to, you know, impress a client, or something like that, you can shell out ten bucks, and then once you get to the point where you need to print these things really large, or something, then maybe you go up to the $100 purchase. The best part about this is, there are multiple stages to choose from. So you can put the stages over here on the left. And they've got things like, you know, mocking up what the fingers do inside of the document.
You can also change the background on some of these as well. And they've got several different types, they've got two image formats where you can do an iPhone and an iPad. You've got bigger iPhone screens, you've got desktops, you've got all different kinds of stuff. And, I can tell you, these are really high quality photographs, and they really look good when you post them on the Web. And so, let's jump back over into Photoshop for a second, and in Photoshop, you can actually see, this is one that I downloaded, this is one of the free comps, so it's actually kind of small, and its 2720 pixels wide by 960 pixels tall.
Now that's fairly large for a website, but you're not going to be able to print that by any means, but you can kind of see here. That even at 100% that's pretty decent quality. They've got the perspective down. It looks as though it's right there on the screen. It matches the overall tone of the image very well. I really like it. This one is a little bit smaller. So when I zoom in, it's going to look a little bit more pixellated. And you can actually see the dimensions of this are 400 by 300. That's the free comp that I downloaded. But, it does look really good. The next time you have to create a product shot an app, or a website, or whatever the product is that you're working on that needs to be displayed on some sort of screen, try placeit.net.
It's a really interesting service, and I think it's really going to help you create some awesome stuff to show to your clients.
Find answers to the most frequently asked questions about Creative Quick Tips .
Here are the FAQs that matched your search "" :
Sorry, there are no matches for your search "" —to search again, type in another word or phrase and click search.
Access exercise files from a button right under the course name.
Search within course videos and transcripts, and jump right to the results.
Remove icons showing you already watched videos if you want to start over.
Make the video wide, narrow, full-screen, or pop the player out of the page into its own window.
Click on text in the transcript to jump to that spot in the video. As the video plays, the relevant spot in the transcript will be highlighted.