DVDBuilder

Create Text-only Menu Background and Mask in GIMP

This topic shows how to use GIMP to create a background and a mask for a text-only DVD menu.

Project Directory

You need a directory to store the source images and the DVDBuilder project. This can be anywhere on your machine. For example create C:\TextTitleMenuDVD directory. We will refer to that as the DVD Project Directory.

Create Menu Background

We will create a GIMP project that has all required layers that are needed for the DVD menu. At the time of writing the latest available GIMP version was 2.8.14.

Background Image

Download the image AquaBlue.jpg from the Internet Archive to the DVD Project Directory.

The size of AquaBlue.jpg is 1600 x 1024 which is roughly 16:10 width to height ratio. That must be cropped to 720 x 480 for the NTSC system. We can do the dropping in GIMP.

  1. Open the AquaBlue.jpg image in GIMP 2. GIMP will create a new project for you.
  2. Crop it to width x height: 1440 x 960, i.e. double the NTSC resolution of 720 x 480.
  3. Save the GIMP project as AquaBlue_1440x960.xcf.

Background Crop 1440x960 1 Background Crop 1440x960 2 Background Crop 1440x960 3

Scale Background to 720×480 (NTSC)

  1. Open AquaBlue_1440x960.xcf in GIMP
  2. Scale the image to 720×480
  3. Save the project as AquaBlue_720x480.xcf
  4. Rename the AquaBlue.jpg layer to Background
  5. Save the project one more time as Text_Menu_NTSC.xcf

Background Scale 720x480 1 Background Scale 720x480 2 Background Scale 720x480 3

Background Scale 720x480 4 Background Scale 720x480 5 Background Scale 720x480 6

  1. Open Text_Menu_NTSC.xcf in GIMP
  2. Create a new layer group with a name MenuBackground
  3. Move the Background layer to the MenuBackground layer group
  4. Save Text_Menu_NTSC.xcf

Background Layers 1 Background Layers 2 Background Layers 3

Export Background As JPEG

  1. Open Text_Menu_NTSC.xcf in GIMP
  2. Export as Text_Menu_NTSC.jpg

Background Export 1 Background Export 2

Here is the final background image:

Text_Menu_NTSC.jpg

Create Menu Mask

  1. Open Text_Menu_NTSC.xcf in GIMP
  2. Create a new layer group with a name MenuMask. Place that above the existing MenuBackground layer group.
  3. In the MenuMask layer group, add a new layer group with a name DisplayPattern.
    1. In the MenuMask layer group, add a new layer group with a name SelectionPattern.
  5. In the MenuMask layer group, add a new layer with a name BackgroundPattern
  6. In the MenuMask layer group, rearrange the layers from top to bottom in this order: DisplayPattern, SelectionPattern, BackgroundPattern
  7. Save Text_Menu_NTSC.xcf

Mask Layers 1 Mask Layers 2

Display Pattern

  1. Open Text_Menu_NTSC.xcf in GIMP
  2. Select the DisplayPattern layer group
  3. Using the Selection tool, select a rectangular area at position 170 x 200, and size 120 x 50.
  4. Type the text “Elephant DVD Title” on two lines, using the Text tool, “Sans” Font, Font Size 20, Bold Face, No Anti-aliasing, and White (HTML Notation: ffffff) color.
  5. GIMP will create a new text layer. Rename the text layer to ElephantDisplayPattern
  6. Repeat steps 3. 4. and 5. but this time select a rectangular area at position 410 x 200, and size 120 x 50, type the text “Hippo DVD Title”, and finally name the text layer HippoDisplayPattern.
  7. In the DisplayPattern layer group, rearrange the layers from top to bottom in this order: ElephantDisplayPattern, HippoDisplayPattern.
  8. Save Text_Menu_NTSC.xcf

Mask Display 1 Mask Display 2 Mask Display 3

Selection Pattern

  1. Open Text_Menu_NTSC.xcf in GIMP
  2. In the SelectionPattern layer group, add a new layer with a name Pattern
  3. In the SelectionPattern layer group, add a new layer with a name Buttons
  4. In the SelectionPattern layer group, rearrange the layers from top to bottom in this order: Pattern, Buttons.
  5. Save Text_Menu_NTSC.xcf

Mask Selection 1

Buttons Layer

The Buttons layer will not be visible on the final mask, but it is nice to have it at design time, so we can see the button highlight rectangles.

  1. Open Text_Menu_NTSC.xcf in GIMP
  2. Select the Buttons layer
  3. Using the Selection tool, select a rectangular area at position 120 x 150, and size 200 x 150.
  4. Using the Fill tool, fill the selection with blue (HTML Notation: 0000ff) color.
  5. Repeat steps 3. and 4. but this time select a rectangular area at position 370 x 150, and size 200 x 150.
  6. Save Text_Menu_NTSC.xcf

Mask Selection 2 Mask Selection 3

Pattern Layer

  1. Open Text_Menu_NTSC.xcf in GIMP
  2. Select the Pattern layer
  3. Using the Selection tool, select a rectangular area at position 120 x 280, and size 200 x 20.
  4. Using the Fill tool, fill the selection with green (HTML Notation: 00ff00) color.
  5. Repeat steps 3. and 4. but this time select a rectangular area at position 370 x 280, and size 200 x 20.
  6. Save Text_Menu_NTSC.xcf

Mask Selection 4 Mask Selection 5

Background Pattern

  1. Open Text_Menu_NTSC.xcf in GIMP
  2. Select the BackgroundPattern layer
  3. Using the Fill tool, paint the whole layer in black
  4. Save Text_Menu_NTSC.xcf

Mask Background 1

Export Mask As Windows Bitmap

  1. Open Text_Menu_NTSC.xcf in GIMP
  2. Select the MenuMask layer group
  3. Deselect the Buttons layer
  4. Deselect the MenuBackground layer group
  5. Export as Text_Menu_NTSC_Mask.bmp. In the advanced export options select the 24-bit option.

Here is the final mask image:

Text_Menu_NTSC_Mask.bmp

Last updated on May 19th, 2015 12:00:00 AM