Summary

Tools - Image Editor

Walkthrough

  • Now we're going to look at Editing Images and how to crop and resize in particular
  • We'll be doing this using one of the freely available tools for download from the web
  • In the first example we're showing the SelfAssemblySites logo, it's quite a big version on the screen
  • If you look at the tab, you'll see the name of the image and it's dimensions, of 900 x 600 pixels
  • In a new tab go to www.paint.net if you're using Windows
  • Click on the link on the right for downloading Paint.Net
  • Over on the right column its says Get it Now Free Download, click the link below to download it
  • This is a very useful tool, that's more advanced that the MS Paint program that comes with Windows
  • If you're using MacOS there's another program called PaintBrush, simply google "PaintBrush MacOS"
  • Click the link and on the homepage, the left sidebar, click Download, and then the download link
  • We also use Adobe Photoshop as an image editor but the majority of functions can be done with Paint.net
  • So download Paint.net if you us Windows or PaintBrush if you use a Mac
  • Find a sample image that you can use to edit, right click it and scroll down to Open With
  • Let the options slide out and then choose Paint.NET
  • The Paint.NET program should open with your image
  • In our example the image was quite large, with plenty of space surrounding so we want to crop it down
  • On the sidebar called Tools, press the top left icon, the area select tool
  • Select the area surrounding your image you want to crop down to, by left clicking and draggin the box
  • Let go of the mouse when you have the area you wish highlighted and included
  • Now go up to the list of icons along the top, and choose the Crop icon, beside the icon of a clipboard
  • Click the File Menu option at the top and click to Save
  • In the Save Configuration box there's a couple of options, but i'm just going to go with the default, and click Save
  • In our example we refreshed the page and the image reduced in size, the pixels to 691x201
  • This was just for illustrative purposes and you don't need to repeat this
  • But it is smaller and will fit much better on a webpage
  • In Paint.Net, now go to Image, and click Resize and an options box will pop up. Make sure you have an image open
  • There are lots of options, you can resize by absolute size or resize by percentage which we did
  • We chose to resize from 100% to 60% and hit Ok
  • Instead of hitting Save under the File list, this time we'll hit Save As, so as to have a new and separate file
  • This new file needs a new name, so in our example we call it SasLogoSmall and hit Save
  • In our example we opened the two different images in Firefox in side by side tabs to illustrate the differenence
Making an Image a Specific Size [Video Time 3:52mins]
  • Open your sample image in Paint.net once again
  • Go up to the top and click Image, then Resize
  • Keep the Absolute Size box checked and in our example we changed the Width to 300 pixels
  • You'll notice that the Height automatically adjusted as the default is to keep the image in the correct ratio
  • Click Ok to save the changes
  • Now we have a 300 pixel wide image we can save now, under a new file name or the same file name
  • So this is useful if you've a webpage and you're told the space for the image to fit into is 300 pixels wide you can do it
  • There are other tools here, for example on the left Tool bar, at the bottom the T is for adding text. Click it
  • Now select a place on your image and click, now you can type text across your image
  • You can also change the colours that you're using, and different thickness or paintbrushes
  • You can play with the different tools and learn more about them
  • Usefully over on the right hand side is the History list, and you can click back to any previous stage
  • This allows you to experiment and not worry about making errors
  • In the Adjustments button at the top, you have a range of highly useful tools
  • You can change the image to Black and White, or play with it's Brightness & Contrast or Hue and Saturation
  • These features in particular can make a strong noticeable difference to any image
  • Another useful area is the Effects menu, where you can add blurs or artistic effects
  • If you want an image to look rougher you can add Noise to an image under Effects
  • So there's plenty in there to play and experiment with
  • Paint.Net is a great tool and it's free!

Leave a Reply

Your email address will not be published. Required fields are marked *