2.5.8. Editing raster graphics with Gimp

As described in Section 2.5.7, there are two types of graphics: vector graphics (generally diagrams in .ai, .eps, .pdf, or .svg format) and raster graphics (generally photos in .gif, .jpg, or .png format). This tutorial will teach you how to edit raster graphics with Gimp, an open-source raster graphic editing program, by creating a head shot for a website.

2.5.8.1. Concepts

The exercise below will introduce you to the following key concepts of raster graphic editing:

  • Zooming

  • Adding layers

  • Selecting regions

  • Expanding selections

  • Clearing selections

  • Filling selections

  • Changing the color mode

  • Cropping images

  • Rescaling images

2.5.8.2. Required software

This tutorial requires Gimp.

On Ubuntu, Gimp can be installed by running this command:

sudo apt-get install gimp

2.5.8.3. Exercise

In this exercise, we will learn how to edit raster graphics by creating a head shot of President Obama for a website. This will include selecting the face, removing the background, cropping the image, resizing the image, and exporting the image for fast.

  1. Download a photo of President Obama

  2. Open Gimp

  3. Open the photo

  4. Add an alpha channel to enable a transparent background (“Layer” >> “Transparency” >> “Add a alpha channel”)

  5. Use the Intelligent scissors select tool (“Tools” >> “Selection Tools” >> “Intelligent scissors”) to select only the face. Zoom in to select the face precisely. Note, Gimp provides several additional selection tools including tools to select rectangles and ovals and to select regions by color.

  6. Type enter to accept the selection

  7. Feather the selection so that the transition between the face and background is not so abrupt when we cut out the background (“Select” >> “Feather…”)

  8. Select the background by inverting the selection (“Select” >> “Invert”)

  9. Delete the background (“Edit” >> “Clear”)

  10. Change the color mode to gray scale (“Image” >> “Mode” >> Select “Grayscale”)

  11. Crop the head and make the image square (“Tools” >> “Transform Tools” >> “Crop”).

    1. Disable “Current layer only”

    2. Drag a rectangle over the photo

    3. In the “Tool Options” pane,

      1. Set “Size” >> 10, 10

      2. Enable “Fixed” >> “Aspect ratio”

    4. Adjust the size and shape of the selection box

    5. Type enter to crop the image

  12. Scale the image (“Image” >> “Scale Image…”)

  13. Export the image (“File” >> “Export As …”)

2.5.8.4. Additional tutorials

Learn GIMP has several helpful short tutorial videos.