LabeLase® Producer
Tag Layout Tutorial

Introduction

The purpose of this tutorial is to present a step-by-step example of creating a tag layout using LabeLase® Producer tag production software for the LabeLase® 1000 metal tag printer.

We will begin by showing an image of the final tag and then lead you through the steps required to create the layout.   In the process, you will create fields that can be entered by an operator or downloaded by another computer (the host) during production.   You will add text, barcode and graphic fields to the layout.   You will also add an auto sequencing (serial) number that the software will update for you on each printed tag.

This tutorial assumes that you have already installed the software and connected the tag printer to your PC.

Objective

Before we begin creating the layout for your tag, it helps to have an idea of what the tag will look like as well as what data is needed and where that data is to come from.   Below is a figure showing the final tag we are going to create.   You may already be using a paper label that you are printing in a thermal or dot-matrix printer, and you want to replace it with a more durable metal tag.   In this case, your existing paper label is the perfect model for the new layout.

Figure 1

As you can see, this label has several text fields including fields that contain data that changes on each tag, as well as label fields that are fixed (do not change) and serve to describe the associated data fields.   There are two barcodes on this label, one that is a 1D code that contains a small amount of data, and one that is a 2D code that contains more information than can fit in a standard 1D code.  Finally, a company logo appears to identify your organization.

Creating a New Layout

The first step in creating a new layout is to tell Producer that you want to create a new layout.  From the main window of Producer, select the File menu and then New.

Figure 2

Producer will ask you for the Supervisor Password if you are not already in the supervisor mode.  Once you supply the correct password, Producer will open the Layout Designer.   As soon as the Designer starts, it will ask you how you want to create the new layout.   You have to choice to create a blank layout, start from a template, or use the Wizard.

Figure 3

For this tutorial, we will be starting with a blank layout, so select that option and then click OK.

The Designer will create a new layout that has no fields.   The size of the layout will be some default value, and must be set to the size of your tag material.   We will do this in the next step.

Specifying the Size of the Tag

The size of the layout must be the same as the size of the tag material on which it will be printed.  Before adding any fields to the layout, we must tell the Designer what size tag material we will be using.

Pull down the Setup menu and select Geometry.   This will open the Geometry editor.

Figure 4

The Geometry editor has multiple tabs that allow you to specify the tag size, location and size of holes or slots, bend points, etc.   For now, select the first tab Dimensions.   On this tab, enter the width and length of the tag material.   The length dimension is in the direction that the tag material feeds out of the printer as shown by the heavy black arrow in the accompanying figure.   For our example, enter a width of 3 inches and length of 3 inches.   Note that we are using English units for this tutorial.

Before we close this window, we are going to add a hole.   The tag material we are using has a hole punched in it at the factory to allow the tag to be wire-tied to the item it identifies.   We discuss adding this hole to the layout in the next section.

Adding a Hole to the Layout

Since our tag stock has a hole in it, we don't want to place any of our text, barcode or graphic fields over the top of the hole.   To help us avoid the hole, the Designer allows us to add an image of the hole to the layout.   The location and size of the hole is entered into the Holes tab of the Geometry form.

Figure 5

The Holes tab has a checkbox to enable the display of the hole.   Make sure you check this box and then enter the hole Diameter and X,Y coordinates of the hole's center location, relative to the lower left corner of the tag.   Use the accompanying diagram to see the relationship of the holes to the tag.

Producer allows you to have up to two holes shown on your layout, but we only have one hole in our tag material so we only have to provide X,Y coordinates for the first hole (X1 and Y1.)   We leave the second hole's coordinates (X2 and Y2) set to zero to indicate that the hole is not used.

Our tag material does not have a bend, bare edges or slots, so we can skip those tabs.

Click the OK button to save your tag Geometry settings.   The Designer will redraw the layout showing you the new tag size and the hole we just added.

Figure 6

Notice the arrow that indicates the direction of feed.   This shows that the side of the tag with the hole will feed out of the printer first.   We can consider this the top of the tag because we want the text to flow under the hole since the tag will be hanging from a wire that passes through the hole.   Because of this, we will have to orient our fields at 90 degrees rotation as we will discuss later.

Creating Operator Entry / Host Download Fields

The text fields on a layout consist of fixed fields that never change (labels) and data fields that may be changed either by an operator, by downloading from another (host) computer, or that are auto created and/or sequenced by the Producer software.   The next step in creating our layout is to define those fields that will either be entered by the operator or downloaded from another computer.   We call these Operator Data Entry fields, but it is important to note that these fields can also be populated by another computer at the time the tags are printed.

If you want to have another computer download data to be printed on you tag, you must first create an Operator Data Entry field for that data, even if you do not intend to have an operator manually key in the data.

Let's add the Operator Data Entry fields for our tag.   Select the Setup menu and the Operator Data Entry menu item.   This will open the Operator Data Entry Configuration window.

Figure 7

At the top of this window is a grid that allows you to add as many fields as you need.  There is no limit placed on the number of fields you can add.   Buttons next to the grid allow you to Add, Delete and Insert fields and also to Clear the entire list.

Each entry in the list has three properties: Prompt, Verify and Sample Data

Prompt - This is usually the name of the field, and is presented to the operator to help her enter the right data into each field.   Pick a short, descriptive label or phrase that will be obvious to the operator.

Verify - The Verify property is optional, and allows us  to control the type of data that the operator can enter.   It is used during tag printing to check that the data entered by the operator has a valid format.   If we leave this property blank, then there are no restrictions placed on what the operator can enter.   See the manual for details of how to set the Verify property.

Sample Data - This property allows us to enter a sample of the data that will typically be entered by your operator (or downloaded) and will make it easier for us to create our text fields on the layout.

In our layout, we have seven fields that will either be entered by the operator or downloaded from another computer.   Lets add the first field.

You can begin entering a new field in the empty row at the end of the list.   If the list doesn't have an empty row, click the Add button and one will be added.   For the first field, we enter "SIZE:" for the Prompt, leave the verify empty, and "#43 METRIC (#14 BAR)" for the Sample Data.   Note that the quotation marks are shown here for clarity and are not actually entered.   

Figure 8

We continue entering fields until we have entered all seven Operator Data Entry fields.

Figure 9

Below the grid of data entry fields are additional fields that allow us to customize the operator interface.  Each field has a checkbox that will enable the display of the field on the main Producer window.   Along with the enable checkbox is a field that allows you to customize the prompt that the operator will see.   For our application, we are only going to enable the Serial Number and Quantity Required fields.   The default prompts are ok, so we will keep them.

Our final settings for the Operator Data Entry configuration are shown below.   Click OK to save these settings.

Figure 10

Adding Text to the Layout

Now it's time to start adding text fields to the layout.   We begin with the name of the company, XYZ Steel Co.   We want this text to appear at the top of the layout, straddling the hole.

First, we select the Text tool from the toolbar at the top of the Designer.  Once the tool is selected, we click on the layout in the location that will be the lower left corner of the text.   While continuing to hold down the mouse button, drag the mouse pointer up and to the "right" (remember our tag image is rotated 90 degrees) to size the text.

Figure 11

When we release the mouse button, the Text Field Editor window will open.   This editor allows us to specify the text to print along with other properties that affect its appearance.   Enter "XYZ STEEL CO." into the Text field.   We will keep the default font of "Arial" and size of 24 (which was determined automatically for us based on the size of the stretch box we drew.)   The Rotation of 90 degrees was determined for us also, based on the direction that we drew the stretch box (from lower right of the screen to upper left of the screen.)

Figure 12

Click the OK button to save the field.   The layout will be redrawn to show the new field.   You can move the field around using the mouse.   Simply click and hold the mouse button anywhere on the field and drag.  When you get it where you want it, release the mouse button and the field will be moved.   To resize the field, click and drag one of the blue squares located around the selected field.

Figure 13

Congratulations, you have just added your first text field to the layout.   Now, using the same techniques, add each of the fixed labels ("SIZE:", "LENGTH:", etc.) to the layout.   Don't worry too much about placement at this time, since we will be cleaning up the look of the layout later.   Once you have finished, you should have a layout that looks something like this:

Figure 14

Now that we have our fixed text prompts, the ones that never change, we can begin adding our variable text fields.   Remember, we want to link these variable fields to the Operator Data Entry fields we created earlier.   Let's begin with the first field, "SIZE".    Select the Text Tool if it isn't already selected.   Draw a stretch box like before, but begin next to the "SIZE:" prompt as shown below.

Figure 15

This will bring up the editor as shown below.   In the Text field, we need to enter a special "flag" that tells Producer that what you really want to print here is the first of the Operator Data Entry fields.   This flag is "%1V".   The percent character tells Producer that what follows is a special "flag" field.   The "1V" indicates the first of the Operator Data Entry fields.   There are many such flags that allow you to insert automatically generated or sequenced data.

Figure 16

When you click the OK button, the layout will be redrawn as shown below:

Figure 17

Notice how we made the data portion of this field a bigger font than the label that goes with it.   This is purely individual preference, but I feel that it makes it easier to locate the data from the labels.   Now go ahead and add the remainder of the variable data fields, except for the "BUNDLE#" since we plan to make that an auto sequencing field.   Remember, that to refer to the second Operator Data Entry field, you would use %2V, etc.   Once your finish, your layout should look something like this:

Figure 18

Again, don't be too worried about how the fields line up at this point.   Just get everything placed about where it belongs and we'll clean it up later.

Adding an Auto Serializing Text Field

Now that we have placed all of the fields for the Operator Data Entry, we need to add our automatically serializing BUNDLE number.   This field will not be entered into the Operator Data Entry fields like the others, so we do not refer to it using the %V flags.   There is a different flag for the Serial Number fields, and that is %S.   Putting a number between the percent character and the letter S indicates how many digits you want to display.   For our layout, we want a three digit serial number, so we enter %3S as the text for our Text Field.   Create a new text field like you did the others, positioning it next to the "BUNDLE#:" label and then enter %3S for the text.

Figure 19

As you can see here, the layout now contains a three digit serial number starting with 001.   We have allowed the operator to specify the starting serial number by check the box "Enable Serial Number" in the Operator Data Entry configuration screen.   As each tag is printed, the serial number will increment by one (the default.)

Adding a Barcode to the Layout

Let's begin adding our barcodes to the layout.   As we said, our layout must contain a plain 1D barcode, plus a 2D barcode that contains more information.   Let's start with the 1D code.

Select the Barcode Tool and then click on the layout where you want the code to be located.   Drag a stretching box up and to the right to size the barcode.

Figure 20

When you release the mouse button, the Barcode Field Editor will open.   In this editor, you must specify the barcode symbology, scale, rotation, and link.   For our example we are going to use the Code128 type of barcode.   We chose scale 4 (X dimension is 4 pixels wide) and rotation 90 degrees.   For the link field, we have pulled down the selector and chosen the field that contains the variable text fiield 7 (which is the heat number.)   This happens to be field 16 in our example because it was the 16th field we added to the layout.   The link in your own layout may be different.   

Figure 21

After you make your settings and click the OK button, your layout will be redrawn showing the new barcode field.

Figure 22

Adding a Second Barcode

Now we can add our second, 2D barcode.   Select the Barcode Tool if you haven't already and click in the area under the Bundle number.   Be sure to click outside the blue selection box that surrounds the first barcode we place (see above) because that space is reserved as "quiet zone" and must be free of other text or codes.

In the Barcode Field Editor, we are going to specify the DataMatrix symbology.   This is a very robust 2 dimensional barcode that will allow us to encode a large amount of data.   Select a scale of 8 and rotation angle of 90.

Rather than linking directly to the other text fields that we have already placed, we are going to directly encode the barcode's contents into the link field.   Our application requires us to encode the date, the heat and the bundle number, with each field separated by a TAB character.   To do this, we must enter the following into the link field:

:%5V\<TAB>%7V\<TAB>%3S

Note that this field begins with a colon character.   This is very critical.  When the link field begins with a colon character, Producer knows that we are not linking to other text fields in the layout, but are instead directly encoding the data.

The %5V is the link to the 5th Operator Data Entry field, which is the Grade.   The %7V is a link to the 7th entry field which is the Heat and the %3S encodes the three digit serial number.   The \<TAB> flag inserts an ASCII TAB character between the fields.   This TAB serves to separate the fields when the barcode is read later in the production process.

Figure 23

Click the OK button to see your barcode in the layout.   You should see something like the following:

Figure 24

Adding Your Company Logo

Now we can add our last field to the layout: the company logo.   You can create your logo using any Windows painting program that will create BMP (bitmap) files.   I like to use Paint, the painting program that comes with Windows.

When you create your logo, you should try to size the bitmap to approximately the size it will be on the layout.   The model 1000 printer has a resolution of about 333 pixels per inch.   We want our logo to be about a quarter inch square, so we are going to use Paint to create a bitmap that is 83 x 83 pixels.   Save the logo in Monochrome bitmap format if you can, because Producer cannot print colored logos.

Once you have saved your BMP logo file to disk, select the Graphic Tool  in the Designer an click on the layout where you want the logo to appear.   We chose to put it next to the company name, in the corner of the tag.   The Graphic Field Editor will allow you to specify the name of the file that contains your logo, as well as scale and rotation values.

Figure 25

In the BMP Filename field, you may type the complete path to the logo bitmap file, our you may click on the Browse button and locate it in the File Open dialog.   The X and Y scale fields allow you to resize the logo as needed to fit your layout.   I have selected 90 degrees rotation to match the other fields in the layout.

Click the OK button and the Designer will redraw the layout showing you the logo.

Figure 26

Note that your logo will look different than my made-up example.

Aligning Fields

Now that we have added all of the fields that we need to our layout, it is time to clean things up and make them look more professional.   Notice in Figure 26 above that each field has a red dot in its lower left corner.   This is called the "anchor" and indicates the fixed point of the field.   If your Designer does not show the anchors, select the View menu and click on Anchors.

You can use the mouse to individually grab and move each field, trying to line them up visually.  Or you could also edit each field individually using the associated editor (double click a field to open its editor.) and manually edit the X and Y starting locations.   But there is a better way.   At the top of the designer, there is an Alignment toolbar.   If you can't see it, select View / Toolbars / Alignment.

For the Alignment tools to work, you must first select more than one field.   Do this by clicking on one field, holding down the CTRL key and then clicking on the additional fields you want to select.   Each selected field will have a blue selection box around it.

Figure 27

As you can see, I have selected five of the labels that I want to align on their "bottom" edge.   This is not the bottom of the fields themselves, but the bottom of the display.

Once you have the fields selected, select the Align Bottom tool (fourth from the left in the toolbar) and the fields will all be aligned to the "bottom-most" field.

Figure 28

Using this technique, align the fields as needed to clean up the appearance of the layout.   Remember, if you make a mistake, you can use the Undo and Redo features to backup and correct.   Once you have cleaned up your layout, it should look something like this:

Figure 29

That's it.   We have successfully created our layout.   All that's left to do is save our work.

Saving Your Work

Although we have saved this step for last, we recommend that you save your work often when designing your layouts.   Although the Undo/Redo feature can save you if you make a mistake, it can't save you from an unexpected power failure or system crash.

To save your work, select the File menu, Save menu item.   Locate a folder where you want to put the layout and give it a descriptive name.

When you exit the designer, your layout will be loaded and ready to print.   Your operator data entry fields will be presented to the operator, along with the starting serial number.   All your operator has to do is enter the data and begin printing.

Conclusion

This concludes our tutorial on tag layout creation.   In this tutorial we showed how to create a new layout, specifying the tag dimensions and the location and size of the tag's hole.   We added multiple text fields, with both fixed and variable data.   We created two barcodes, one that was 1D Code128 and the other 2D DataMatrix.  We also added a logo to the layout and used the alignment tools to clean it up.