Chapter 15 ■ 3D Gameplay UI CreatIon: UsInG the sphere prImItIve to Create a UI noDeWith the Background layer selected, make sure the Foreground (FG) Color swatch is set to white
and use the Edit ➤ Fill with FG Color (White) option to create the white center for all four quadrant
texture maps at the very bottom of the compositing layer stack, as shown in Figure 15-4. Right-click your
Background layer, use the New Layer command, and create a new layer named GameBoardQuadrant.
Use the Select ➤ Invert menu sequence to invert the selection and select the GameBoardQuadrant layer
to designate that layer to hold your outer color fill. Open the gameboardsquare3.png file and use the
Eyedropper tool to select its orange color value. Click your FG Color (foreground) swatch, invoke the color
picker dialog, and set the Value (V) slider to 60 percent color (40 percent white) to create a pastel version of
the corner square’s color for the quadrant located diagonally from it. Use Edit ➤ Fill with FG Color to fill the
area around the center circle with the color, use File ➤ Export As to save the file to the project’s /src folder,
and name it boardgamequad1.png, as referenced in your Image object code in Figure 15-2. Repeat this
process: create a new layer, get a corner square color value, lighten by 40 percent, fill with the foreground
color, and export the image as PNG24 to create the other three numbered boardgamequad PNG24 assets,
which are shown in their own layers on the far left side of Figure 15-4. You can also see the gameboardsquare
3, 8, 13, and 18 image assets I opened to sample color values from at the top-right corner of Figure 15-4. The
Eyedropper tool is on the lower right of the Ellipse Select tool.
While we’re here in GIMP, let’s open our texture map creation GIMP XCF file with all of the different
map types we created during Chapter 13 , covering shaders and materials, and use your beach ball diffuse
texture to create a 3D spinner Sphere texture that reads “SPIN” as it spins around, with S and I in white (over
color) and P and N in black.
Figure 15-4. Create the four quadrant texture maps at 512-pixel resolution using 60 percent of the corner
square color value