GeoPublish Tutorial Part 14 – Free Flow Graphic Placement

I have two main `issues' with the graphic importing methods we have looked at so far. One is the uneven spacing, or discontinuity, in the text at the top and bottom edges of the regions created for Graphics (see Page #23). It is possible to reduce these but it takes extra time and effort and isn't always successful. The second issue is the amount of wasted space around an odd-shaped graphic if you reserve space for it with a region. This time out we will look at what I like to call Free Flow Graphic Placement - a process that takes care of both of my issues.

If you have been around the 64 scene for any length of time you may remember when Berkeley Softworks ran fancy ads in all of the C= magazines. With the introduction of GeoPublish (gP) in 1988 this trend continued and brought us one ad in particular that I felt displayed a flaw in the way gP handles text and graphics (or at the least in the way in which people place text and graphics).

The prescribed method for placing graphics is to go to Page Layout Mode (P.L.), create a region with the Open Region tool and then use either P.L. or Page Graphics Mode (P.G.) to place the graphic. This works fine if your image is of a blocky type, as the text re-formats around the region, but leaves lots of empty space if you are using an odd shaped picture.

This brings us back to the Berkeley ad I mentioned above which featured a giraffe in the middle of two columns of type. Looking at the ad you can see columns placed far apart, a region used for the graphic, and gutters that weren't used effectively. We will redo this ad to use free-flow graphic placement and show just how much more text can fit on a page and how your image becomes part of the page instead of standing out on its own.

Figure 1 (preview mode) & Figure 2 (zoom mode) show a reasonable facsimile of the original ad. The basic layout was created using the Master Page '2C Divider' Library file and the Page Layout '2C Title U' Library file. After some manipulation of the guidelines and regions I had the desired layout and was able to import my graphic (a Giraffe from The Newsroom publishing package by Springboard). I poured this article into the text regions, added the headline and separator graphic and had a completed page in no time flat. I used Screen2Paint for the screen captures and ScrapCan to create the Photo Scraps. Thumbnail, from RUN's GEOS Power Pak, was used to create Figure 3 and Figure 6 after printing the gP page to disk with the Paint Pages printer driver.

Using the original gP Library files and a region for the graphic allows a newsletter page to be laid out with very little effort and in a very short time. This process can, however, waste a lot of space and may lead to our newsletter taking up more pages than it needs.

As we redo this ad we will avoid the gP Libraries and we will not create a region for the graphic but will utilize the paragraph formatting of the gP Editor Mode to flow the text around our image.

This process takes careful planning and counting but can greatly reduce the wasted space around your images. There is also a bit of mode swapping as you must go from Editor to P.G. Zoom View and back to get the fit you want.

We will use this article and this Page (#24) to recreate the ad. Since we have already imported the text file our next step is to place our graphic on the page.

Make sure your graphic (the giraffe in this case) is in a Photo Scrap and choose the P.G. Bitmap Placement Tool. Move into the middle of the page (about 3 1/2" and 2 3/4") and place the graphic. You can now select it (with the Arrow tool), open the Attributes box (select Stretched & Scaled) and resize it however you wish. To create our faux ad I am going to stretch it down to the 9" mark and over to 5 3/4" on the horizontal scale (Figure 4). It is a little easier to do this if you use Guidelines or if you get it close to the size you want in Preview and then change to Zoom for final placement.

Get a piece of paper and get ready to count. Go into P.G. Zoom and locate the top of the image. Make note of the line of text directly above the graphic - you will want to make this the end of a paragraph. In our case the giraffe has been placed at a paragraph break.

Make note also of the ruler position at the left edge of the graphic - you will set the Right Margin of the new paragraph 1 or 2 ruler notches short of this. This is another one of those skills that you will develop over time as the P.G. ruler increments in 1/8ths of an inch while the Editor ruler increments in 1/10ths of an inch. I use the rulers as a bit of a guide but rely more heavily on text in the previous line to help me line things up the way I want. You will develop your own process.

Scroll down the page and count how many lines of text the graphic is tall - this is how many lines you need at that right margin setting. For the giraffe I counted 25 lines and added 3 more to allow for a caption.

At present we are only looking at the left side of the graphic. Go into Editor mode and make the changes to our margins in the left column. This will change the positioning of the text in the right column (as things move down). Return to P.G. and scroll down the left side of the giraffe and make sure your text lines up as you want (if it doesn't, go back to the Editor and make adjustments). The left column must be left alone once you start working on the right column.

When you are happy with the left side of the image start at the top and work down the right side. You will be counting the lines of text and deciding where to set the left margin of your text this time (Figure 5). You will see that I used a lot of single line paragraphs to mold the text to the shape of the giraffe.

I know that this may sound like a lot of work but, once you've done it a few times, you will find it quite easy to do with very little mode swapping. You will also find that, if your graphics are odd shapes like our giraffe, you can fit a lot more text on the page (compare Figure 6 with Figure 3). In this case we added three full paragraphs to the page using the Free Flow Graphic method. Your graphics will also appear to be part of the page instead of looking like a separate island.

ScreenShots

There are 6 other Photo Scraps that accompany this article. We will now import them and make use of some other geoPublish tools for accurate placement.

So far our Graphic Placement technique has relied on Regions, Guidelines and `close enough' placement. You know my feelings on Region Placement. Using Guidelines is great but there are a limited number of these and you can't change their location while in Page Graphics Mode. For the screenshots we have here we don't have a lot of extra space on the page and we want to ensure we have room for Captions under the images. In order to get the graphics placed exactly where we want them we'll use the line tool for help.

Go to Page 25 and change to Page Graphics Mode. Select Zoom View and place the Zoom Box so you catch the top right corner of the text region (about 1/2" and 2"). This placement puts the Toolbox in such a position that we can leave it visible while we are working. If the Toolbox gets in the way of our work we can hide it with the Toolbox item under the Options Menu or by using the C= T shortcut. The same options make it visible again (they toggle the Toolbox) when you want to see it.

Select the Line tool and draw a line straight down from the 3 3/4" mark on the top ruler. Draw another line across from the 1 1/8" side Ruler. Make sure you draw the lines long enough so that they intersect. If they don't you can erase them and draw them again or select them and use the black resize box to change the length.

From the GEOS menu open Photo Manager and Copy the Fig1 image to a Photo Scrap. Close Photo Manager and then choose the Bitmap Placement Tool. Move your Pointer onto the page and Click to place the image at the intersection of our two lines.

Now select the Pointer tool and then click on each of our two lines in turn and then click on the Scissors to cut the lines from the page. Select the Update Tool [gP Page 3-5] to redraw the page. Trust me. This graphic comes out crisp and clear when printed on a PostScript printer.

If you don't have an Accelerator on your system you will want to turn off the display of bitmaps in the 'disp' menu. This causes a grey box to be drawn in place of the bitmap, so you continue to have an idea of the actual size, and speeds up screen redraws.

Change back to Preview (disp menu) and then select Zoom again. Place the zoom box so it overlaps the lower left corner of the graphic we just placed (about 3.5" and 2"). Here we want to select the Line tool and draw a vertical line at the 3 3/4" mark and a horizontal line at the 4 1/2" mark. Copy the Fig2 graphic into a Photo Scrap with Photo Manager and then place it at the intersection of these two lines. Once the graphic has been placed erase the two lines and go back to Preview.

The two graphics that we have placed are screen shots of geoPublish while creating the simulated BSW ad. Our third image for this page is a thumbnail image of the ad once it was completed. The thumbnail is a lot smaller than the screenshots. Select Zoom View and place the box at about 7" down the page and as far to the right as it can go. Draw our two lines at 5 1/2" vertical and 7 3/4" horizontal. Copy Fig3 to a Photo Scrap with Photo Manager and place it on the page at the intersection of these two lines. Erase the two lines and change back to Preview.

Change to Page 26. Select the Zoom View again and place the box at the top right corner of the text column (1/2" and 2"). Draw a vertical line at the 3 1/4" mark. Draw the horizontal line at the 1 1/8" mark. Copy Fig4 to a Photo Scrap with Photo Manager and then place it on the page at the intersection of our lines. Erase the lines and return to Preview.

Use Zoom View to place Fig5 and Fig6 on the page. For Fig5 draw lines at 3 1/4" vertical and 4 1/2" horizontal. Place Fig6 with a 5" vertical line and a 7 3/4" horizontal line.

I hope you see the potential in using both methods of graphic placement that we have looked at this time. Be aware that you can also use the line method in the Lower Right corner of a graphic to aid in re-sizing efforts.

Next time we will start using Special Text to place Headlines, callouts, article continuation notes and end of article markers.

Until then, enGEOy your Commodore!

Previous Article – Importing Graphics Part 2
Next Article - Adding Special Text
Return to the GeoPub Index
Return to the Main CUE Web Page