1 Hour Quickstart Tutorial

In less than an hour,

completing this tutorial
will give you a basic
working knowledge of
CitectHMI/SCADA
software.

Learn how to build a

small project, create
dynamic graphics,
configure alarms and
trends, then run your
project like a real plant.

This tutorial will also

show you some
shortcuts, that over time,
will save you far more
than the one hour you
may take to complete
the tutorial.
 1 Hour Quickstart Tutorial

Definition of Terms......................................................................................................4
Create a New Project Folder.......................................................................................5
Configure an I/O Device..............................................................................................6
Configuring Tags.........................................................................................................8
Creating Graphic Pages............................................................................................12
Creating Graphic Pages, Creating a new page ........................................................13
Creating Graphic Pages, Saving your page..............................................................14
Creating Graphics pages, Configuring buttons. ........................................................15
Creating Graphics Pages, Configuring Symbol Sets ................................................21
Testing Graphics Pages, Computer Setup Wizard ...................................................24
Testing Graphics Pages, Runtime ............................................................................25
Creating Graphics Pages, Precision Drawing...........................................................27
Creating Graphics Pages, Analog Indicators & Controls ..........................................29
Creating Graphics Pages, Configuring Numbers......................................................35
Creating Graphics Pages, 3D rectangles..................................................................36
Creating Graphics Pages, Pumps & Piping ..............................................................37
Creating Graphics Pages, Change Background Color .............................................40
Configure an Alarm Display Page.............................................................................43
Configuring Trends ...................................................................................................45
Configure a Trend Page............................................................................................46
Runtime.....................................................................................................................48
Backing Up Your Project...........................................................................................50
Restoring Your Project..............................................................................................51
Troubleshooting. .......................................................................................................53

Page 2 of 53
 1 Hour Quickstart Tutorial

Disclaimer
Citect Pty Ltd makes no
1 Hour Quickstart Tutorial
representations or warranties
with respect to the contents or Welcome, and thank you for purchasing CitectHMI/SCADA. We would like your
use of this manual and, to the
extent permitted by law, experience with the product to be a pleasant one, so we have created this tutorial to
expressly limits its liability for help new users get familiar with some of the fundamental features of the product.
breach of any warranty that
may be implied to the
replacement of this manual The tutorial is designed so that you can complete it in under one hour. The tutorial is
with another. Citect Pty Ltd not intended as a substitute for attending a CitectHMI/SCADA training course. We
assumes no responsibility for
any errors that may be in this encourage you to attend a training course to complete your basic training, learn how to
document and reserves the use time saving tools or go on to learn some of the more advanced features of the
right to revise this document at product.
any time without incurring an
obligation to notify any person
of the revision. Repetition is an important part of learning or memorizing. One way you can speed up
your familiarization is to take a few minutes to click through all the menus in the
Copyright product and (briefly) try and figure out what each thing might be for, if you can’t make
© Copyright 2002, Citect Pty
Ltd. All rights reserved. No part sense of something, don’t be concerned just move on to the next thing anyway. You
of this document may be may not consciously remember everything you see, but it helps to set a framework for
reproduced, photocopied, or
transmitted in any form or by
the mind to put things when you revisit these places in the tutorial and in this way you
any means (electronic or will remember them much better.
mechanical), for any purpose,
without the express written
permission of Citect Pty Ltd.
By completing this tutorial you will learn the following…
Trademarks
Citect, CitectHMI, • Creating a New Project
CitectSCADA and
Plant2Business are registered • Setting Up Communications with a PLC
trademarks of Citect Pty Ltd. • Configuring and deleting tags
All other brand or product
names may be trademarks of • Creating New Graphics
their respective holders. o Use Templates
o Button Commands
o Disabling Buttons
o Dynamic Symbols
o Drawing objects
o Manipulating objects Copy, Paste, Align, Mirror, Send to Back, Size,
Move
o Drawing Text
o Displaying analog values
o Drawing Pipes
o Grouping Objects
o Change background color
o Defining Alarms
o Configure an alarm page
o Storing Trend Data
o Configuring a trend page
• Operating Runtime Displays
• Backing up and restoring a project

Page 3 of 53
 1 Hour Quickstart Tutorial
Definition of Terms
Click = Briefly press left mouse button

Double Click = Press left mouse button twice – quickly

Right Click = Briefly press right mouse button

Check = A tick or cross in an options box

Type Text = Type in the word Text

Drag = Position mouse, click and hold left mouse button, move
mouse, then release mouse button.

Alt+Tab = Press the Alt key, hold it down, then press the Tab key.

Single Click

Double Click

Type

Citect is made up of a several configuration tools and a runtime section.

Citect Explorer – Top level configuration interface

Citect Project Editor – Mainly used for entering database type information

Citect Draw – Used for creating graphics

Citect Runtime – Provides the active operator interface

You can switch between these applications

1. using the icons at the top left of each application, or
2. hold down the Alt key, then press Tab until the application you want is selected,
then release the alt key.
3. Clicking on the icons that appear near the start button as shown below.

To make sure that you have selected the correct icon you can let the mouse hang over
the icon for about 2 seconds and a tool tip will appear to guide you.

Page 4 of 53
 1 Hour Quickstart Tutorial
As you go through this Create a New Project Folder
tutorial you might like
to click on the Help Run the Citect Explorer. The Citect Exporer allows you to create and manage your
button located on CitectHMI/SCADA projects. It is also the controlling configuration application from
many of the dialogs as
which you can run the Project Editor, Graphics Builder and Cicode Editor.
this will show you
some of the other
things available to you Click on Start, Click Programs, Click Citect, Click Citect Explorer.
that are not covered by
this tutorial. On the Tool Bar, Click on the New Project icon.

Project Folders store

all of the Citect files for
your project including
graphic pages, tag
definitions, code etc.
You can combine
multiple projects into
one project using the
“include” function
described in the on
line help.

Tips.
Consider using the
Quickstart Project as
this can save you a lot
of time.

Use the Example In the New Project Dialog Box, type Tutorial in the Name field to give the new
project to get ideas project a name, then Click OK.
and learn how things
are made, by pulling
them apart.

Page 5 of 53
 1 Hour Quickstart Tutorial

You may notice that

the label on some Configure an I/O Device
folders is cut short. Eg;
Communi.. instead of Make sure the Tutorial project is selected and Double click on the Communications
Communications. The
folder.
exact nature varies
from one version of
windows to another
but you can just ignore
it as it is only cosmetic.

Double click on Express I/O Device Setup.

Page 6 of 53
 1 Hour Quickstart Tutorial

Configuring I/O Device Continued…

On the Express Communications Wizard, just press the Next button for these
windows.

When you see the window below Click Disk I/O Device
Click Next

A Disk I/O device emulates an external I/O

Device such as PLC/RTU/DCS etc. A file
on the hard drive is used to store an image
of the variables. The file format is
determined by the protocol being used.
This is a great way to test your projects if
you don’t have an external I/O Device
available. Memory I/O devices are the
same, except they are stored in RAM and
are therefore volatile.

When you see the page below Click on Citect Generic Protocol

The Citect Generic protocol is a simple

protocol that is designed for internal
Citect variables like Disk or Memory I/O
Device variables.

On the following screens you just need to press the Next & Finish buttons.

Page 7 of 53
 1 Hour Quickstart Tutorial

Configuring Tags
Click on Tags (in LEFT pane)
Double Click on Variable Tags (in right window)

The right hand window will display Variable Tags, Trend Tags & SPC Tags as shown above.

This will bring the Project Editor to the foreground and display the Variable Tags
dialog. The Project Editor is mainly for editing database type information.

The Variable Tags Database

has one record for each Tag
you define.

Each Tag has multiple fields.

(Variable Tagname, Data Type,
Address etc)

You can see the record number

indicated in the bottom left of
the dialog box

Page 8 of 53
 1 Hour Quickstart Tutorial

.
IMPORTANT
Do NOT press Enter before filling in all the required fields. Each time you press Enter,
a new record will be added . For learners, it is better to use the Add button instead. If
you add an extra record by mistake, you can use the Delete button to mark it for
deletion. Once marked for deletion the record will be ignored.
If you press delete by mistake you can press it again to undelete. To view records
marked for deletion go to Tools, select Options, check Show Deleted.
To permanently remove the record go to File then select Pack.

Page 9 of 53
 1 Hour Quickstart Tutorial
You can save a lot of Configure Tags Continued…
time configuring tags
by entering similar CAUTION
types of Tags together Where a drop down is provided you should use it. If you
and just changing the
parts that are different
mistype data into fields that require specific settings you
before pressing Add. may cause compile errors.

Use the mouse to

highlight the parts that
you want to change,
then just overtype. Next you will configure three tags as shown below. Remember to fill in the form before
Eg; Pump_1_CMD can pressing Add. Use the Tab key or the mouse to move between fields.
easily be changed to To make corrections after you have pressed add, you can move to the Tag or record
Pump_1_M. Highlight by using the scroll bars on the right hand side, then press Replace when you have
CMD then type M. made the changes.
If you arrange your
The cursors have been added as a guide to show you where you should type and
variables in your PLC
into blocks where all where you should click.
the Digitals are
contiguous and all the
Integers are
contiguous then the
performance will be
significantly improved
as CitectHMI/SCADA
software will be able to
read large blocks of
data in a single
message instead of
multiple messages.

If you are having difficulty reading from the screen grabs here is the information in text
form.

Variable Tag Name Pump_1_CMD Data Type DIGITAL

I/O Device Name IODev Address D1
Raw Zero Scale Raw Full Scale
Eng Zero Scale Eng Full Scale
Eng Units Format
Comment Pump 1 Command – On/Off

Page 10 of 53
 1 Hour Quickstart Tutorial
The format field Configuring Tags Continued…
defines the default
style of displaying this
vavriable.

# defines number of
characters. Eg; ###.##
would have 3 digits to
the left of decimal and
2 digits to the right.

Adding EU to the end

specifies that
Engineering Units will
be appended to the
value at runtime.
Eg; 123.12 RPM.
Variable Tag Name Pump_1_M Data Type DIGITAL
I/O Device Name IODev Address D2
Raw Zero Scale Raw Full Scale
Eng Zero Scale Eng Full Scale
Eng Units Format
Comment Pump 1 Mode Auto/Manual

Variable Tag Name Pump_1_Speed Data Type INT

I/O Device Name IODev Address I1
Raw Zero Scale 0 Raw Full Scale 32767
Eng Zero Scale 0 Eng Full Scale 500.0
Eng Units RPM Format ###.#EU
Comment Pump 1 Speed

Note: The format field on Pump_1_Speed will need to be typed in.

Please use the scroll bar on the right to scroll through each tag (record) and
double check that you have entered the correct information. On the last tag,
check that the number of tags (records) = 3.
Close the Variable Tags window by clicking on the X in the top right corner.

Page 11 of 53
 1 Hour Quickstart Tutorial
Creating Graphic Pages
Switch to the Graphics Builder – click on the Graphics Builder Icon.
The Graphics Builder is an editing utility that you can use to create your graphics
pages and the objects that comprise the graphic pages.
Before you start lets take a look at what you will create.

Page 12 of 53
 1 Hour Quickstart Tutorial

The fastest way to Creating Graphic Pages, Creating a new page

drive any application is
with the keyboard. Click on the New Icon
Most programs have
shortcut keys – you
may be surprised how You can also use
quickly you can learn File, New from the
them.. Menu but clicking
the icon is faster.

Click on the Page button

In the Use Template dialog, make sure Standard is selected in the Style box, then
Double Click the Normal template as shown.

Instead of double
clicking on Normal
we could single click
on Normal and then
click OK

Page 13 of 53
 1 Hour Quickstart Tutorial

You.can move the Creating Graphic Pages, Saving your page

Toolbox by placing the
cursor on the title bar, By using the built-in templates you get a head-start on building your page. There are
hold down the left navigation buttons already configured for you and using templates helps to ensure a
mouse key while
consistent look and feel throughout your project. This is very important if you want to
moving the mouse.
make it easy to use for operators.

Templates are displayed

pretty much as they
appear at runtime.

###.## indicates
dynamic values that will
change at runtime.

+1, +2 etc are

Animation Numbers that
are used as references
for values that will be
placed at these points at
runtime.

F(x) is a script that is

executed with the page.

It is good practice to save your graphics pages regularly, so lets begin the habit right
now.

Click on the Save Icon on the menu bar.

Type MyPage in the Page: Edit Box, then press OK.

Page 14 of 53
 1 Hour Quickstart Tutorial

Creating Graphics pages, Configuring buttons.

Next we will configure some buttons to control the mode of the pump.

On the Toolbox click on the button icon.

You may notice that the cursor changed after

selecting the button tool. This makes it easy to see
which tool you are using.

After you draw a button you will be put back into

edit mode as this is normally the next step. To
draw another button you need to select the button
tool again.

To draw the button, Click and hold the left mouse button while moving the mouse
then release the left mouse button. ie; Drag the mouse.

Page 15 of 53
 1 Hour Quickstart Tutorial

If you don’t see the

expected property Creating Graphics Pages, Configuring Buttons Continued…
sheet as you go
through these Double Click on the word button in the Text: Edit Box. This is a quick way to select a
exercises, then you complete word. Next type Manual.
may need to locate the
correct sheet by
looking at the screens
on the page then click
on the horizontal &
vertical tabs to find the
right sheet.

Horizontal Tabs

Click on the Input Tab

Vertical Tabs

Click on the Insert button.

Click on Insert Tag…

Page 16 of 53
 1 Hour Quickstart Tutorial
Creating Graphics Pages, Configuring Buttons Continued…

In the Insert Tag Dialog Double Click on Pump_1_M

Pump_1_M will be inserted into the Up Command Edit Box. Click your mouse to the
right of the Tag Pump_1_M and type =0.

When the project is run, pressing on the Manual Button will set the Tag Pump_1_M to
0.

We will now configure a second button to set the tag to a 1.

Page 17 of 53
 1 Hour Quickstart Tutorial
There are many Creating Graphics Pages, Configuring Buttons Continued…
ways to copy
objects. It is quicker to make copies of things than to draw them from scratch. Here is a quick
way to make a copy and position an object.
Ctrl + D will
duplicate the Place the cursor over the Manual Button.
currently selected Hold down the Ctrl Key.
object. Hold down the left mouse button.
Move the mouse to position the copy.
Ctrl + C will copy an You don’t need to be precise with position at this time – we will fix that later.
object.
If you move the mouse
Ctrl + V will paste an immediately after holding
object. down left mouse button,
then you will only see the
These last two work outline of the object as it is
in almost all moved.
windows programs
so are well worth If you wait half a second
remembering. before moving the mouse,
you will see the object itself
You can also select being moved. The + sign
Copy, Paste or will appear on the hand
duplicate from the about half a second after
Edit menu or by pressing the left mouse
using the icons on button indicating change of
the menu. mode.

This feature is useful when

handling a large number of
objects at the same time.
Double Click on the new button.
In the Up Command Edit Box, replace the 0 with a 1.

Page 18 of 53
 1 Hour Quickstart Tutorial
You can also use the Creating Graphics Pages, Configuring Buttons Continued…
reserved word TRUE
instead of a 1, and Click on the Appearance Tab
FALSE instead of a 0. Double Click on the word Manual in the Text: Edit Box, overtype with Auto
Click OK
TRUE and FALSE are
not case sensitive, but
this is a common
convention used to
indicate that this is a
reserved word.

Now we have made some buttons that will set the control mode of the pump into Auto
or Manual. Next we need something to turn the pump on and off. Instead of using two
buttons, one for on, and one for off, we’ll use just one button.

Make a copy of the Auto Button. (Hold Ctrl, Click on Auto Button and hold then
move the mouse).

Change the button Text to read “On/Off”, then Click on the Input Tab

Page 19 of 53
 1 Hour Quickstart Tutorial
Creating Graphics Pages, Configuring Buttons Continued…
Under the access tab
In the Up Command Edit Box overtype with Toggle(Pump_1_CMD)
you may notice there
is a section called Click on the Access Tab
security. This is a very
powerful feature in You can also use the
Citect that allows you Insert button to lookup
to precisely define who the Toggle function and
can access what. paste it into the Up
Configuring security is Command.
covered in the Citect
Configuration training
course.

Now we will prevent the On/Off button from working while the pump is in Auto mode
and we’ll add a tool tip on the way.

In the Tool tip: Edit Box type “Must be in Manual to Toggle Off and On”
Then Click the Disable Tab. (on the right side of the dialog).

Page 20 of 53
 1 Hour Quickstart Tutorial
Creating Graphics Pages, Configuring Buttons Continued…

Click on the Insert icon.

Click Insert Tag
Double Click on Pump_1_M
Click OK

When Pump_1_M is true (in Auto) this button will now be disabled. The buttons
appearance will be altered using the Embossed style to indicate that it is disabled. The
tool tip will not be disabled.

Creating Graphics Pages, Configuring Symbol Sets

Next we need some indicators to tell us when the pump is on, off, auto or manual.

On the Toolbox Click on the Symbol Set Tool.

Page 21 of 53
 1 Hour Quickstart Tutorial
Creating Graphics Pages, Configuring Symbol Sets continued…

Place the cursor next to the Manual button, then Click.

In the ON symbol when Edit Box type Pump_1_M=0 then Click OK.

Copy the Symbol Set and place the new one next to the Auto button.
(Hold Ctrl, Hold Left Mouse button on object, move mouse).

In the ON symbol when Edit Box overtype with “Pump_1_M=1” then Click OK.

Page 22 of 53
 1 Hour Quickstart Tutorial
Creating Graphics Pages, Configuring Symbol Sets continued…

Make a copy of the symbol set and position it next to the On/Off button.

In the On Symbol When Edit Box overtype with Pump_1_CMD then Click OK

At Runtime, when Pump_1_CMD = 1 the Red Light will be displayed.

Remember to save regularly. Press the Save button now.

Page 23 of 53
 1 Hour Quickstart Tutorial
Testing Graphics Pages, Computer Setup Wizard
It’s time to take a look and see how your page looks and feels to an operator.

First however, we need to run the Computer Setup Wizard to configure how you want
this computer to run your project.

Switch to Citect Explorer (Alt + Tab).

In the Project List tree view click My Projects.

In the right hand pane, Double Click Computer Setup.

Check Express Setup then Click Next

Check Server and Display Client, then Click Next

Page 24 of 53
 1 Hour Quickstart Tutorial
Testing Graphics Pages, Computer Setup Wizard continued…

Click the Project Name Drop Down and Click Tutorial

For the next two screens just Click Next then Click Finish.

Testing Graphics Pages, Runtime

Press the Run button

If you have not inserted the protection key you will see the following message.
Just Click OK.

If the runtime does

not start, it is likely
that there has been
a compile error.
Switch to the Project
Editor and it will
display a list of
errors. Correct each
one and then press
the Run button
again.

Page 25 of 53
 1 Hour Quickstart Tutorial
Testing Graphics Pages, Runtime continued…

The menu page is built automatically and is the first page you will see when runtime
starts.

Click the MyPage Button

Click on the Auto button and check to see that the light turns red.
Move the mouse over the On/Off button and wait a couple of seconds to see that the
tool tip appears. See what happens if you Click on the On/Off button. Click on
Manual, then try clicking on the On/Off button again.

To switch from runtime back to Graphics Builder, press Alt + Space together
Then Click on Graphics Builder.

If you’ve made to this point, give yourself a gold star and take a moment to stretch
your muscles.

Page 26 of 53
 1 Hour Quickstart Tutorial
Creating Graphics Pages, Precision Drawing
Next we’re going to tidy up the appearance of the page. It is worthwhile to make your
pages look good as it will encourage operators, to take a little more care and have
more confidence in the system.

Making sure everything is drawn precisely, aligned correctly and evenly spaced helps
to make your pages look professional.

First we need to select all the buttons. Place the cursor near one of the corners, hold
down the left mouse button while moving the mouse to opposite corner, then
release the left mouse button. ie; Lasso the buttons with the mouse.

You can also select multiple objects by

holding down the Ctrl Key, then clicking
on each object that you want included in
your selection.

On the menu, Click on Arrange, then Click on Align.

Notice that the Keyboard

shortcuts are shown, next to the
commands on the menu.

Ctrl +A for Align is worthwhile

remembering as this is
frequently used when building
graphics.

In the Vertical section, Click on Even. In the Horizontal section Click on Left, then
Click OK.

Page 27 of 53
 1 Hour Quickstart Tutorial
Creating Graphics Pages, Precision Drawing Continued…
Using Snap to Grid To align the lights you can use the same process, but first align one light with the
can save you a lot of center line of the top button and one light with the center line of the bottom button.
aligning. The nice
thing with grids is Click the the top button and the top light. Then Align – Vertical – Center.
that it forces objects Do the same for the bottom button and light.
to be placed in Now select all the lights.
specific positions –
but this is not always Use Align, Vertical - Even, Horizontal - Left to evenly space the lights.
what you want. You
can turn the Grid on
and off quickly using
the F8 function key.

You can turn the

zoom on and off
quickly using the
F10 key.
You may notice that the lights are not perfectly in line with the center line of the
buttons. This is because the hot spot or anchor point for this symbol is in the top left of
the symbol rather than in the middle. To correct for this we will use the zoom and the
nudge tools.

To make sure your objects are aligned or positioned perfectly you can use the Zoom
tool. From the Menu select View, Show Zoom.

The zoom tool will display an

enlarged view of the region
around your cursor. You can
alter the “magnification” by
clicking in the top left corner
of the zoom window

You can change the size of the

zoom by placing the cursor over
one corner until the resize
cursor is shown, then hold
down the left mouse button and
move the mouse.

You can move the zoom window by placing the cursor on the title bar (the
big blue bar at the top) then hold down the left mouse button and move
the mouse

Page 28 of 53
 1 Hour Quickstart Tutorial
Creating Graphics Pages, Precision Drawing Continued…

Select all the lights so that we can move them all at once. Place cursor above and to
left of top button, hold down left mouse button and move mouse, then release
mouse button.

You can precisely position the lights by placing the cursor over the lights (make sure
the hand cursor appears) then press Enter (or hold down left mouse button), next use
the arrow keys on the keyboard to move the buttons one pixel at a time in the
direction that you want. Press enter again to set the position (or release left mouse
button if you used that method). Close the Zoom window.

Creating Graphics Pages, Analog Indicators & Controls

Next you will create a bar (rectangle) indicator that will change height dynamically with
the variable tag. You will place this inside a lowered 3D rectangle to make it look nice.
You will place a bitmap next to the rectangle and make it operate as a slider control to
adjust the value of the analog variable tag.

Select Rectangle Tool from the Toolbox. Place the cursor to the left of the Top button
and draw a rectangle as shown. (Hold down left mouse button and move mouse).

When the Rectangle Properties dialog appears, Click on Filled.

Click on the 3D Effects Tab on the right hand side of the dialog.

Page 29 of 53
 1 Hour Quickstart Tutorial

Creating Graphics Pages, Analog Indicators & Controls continued…

You can move the
mouse in Click on Lowered.
conjunction with the Click OK.
nudge tool to give
you coarse control
whilst using the
arrow keys for fine
control. Just
remember not to
move the mouse
when you only want
fine control.

Next use the Zoom and nudge to precisely position the Rectangle. You may need to
change the vertical size to match the height of the buttons.

Place the cursor over the top (or bottom) center selection handle, when you see the
cursor change to the vertical selection arrows, press enter to switch to nudge mode,
then press the up or down arrow keys (on the keyboard) until the height is correct.

With the rectangle selected, Click on the Palette button on the tool bar.
Click on the gray as shown below.

Page 30 of 53
 1 Hour Quickstart Tutorial
Creating Graphics Pages, Analog Indicators & Controls continued…

With the Rectangle selected, make a copy of the the rectangle. (Press Ctrl + D).

Double Click on the new Rectangle to open the property dialog.

In the Appearance - 3Deffects sheet, select none.

Click on the Scaling Tab.

Click on the Vertical Tab on the right hand side of the dialog.

Use the Insert button to insert the tag Pump_1_Speed.

In the Axis control box, Click on the bottom of the box as shown to anchor the scaling
point at the bottom. Click OK.

Page 31 of 53
 1 Hour Quickstart Tutorial
Creating Graphics Pages, Analog Indicators & Controls continued…
.
With the new rectangle selected, Click on the Color palette button on the toolbar,
then click on bright red.

Now position the new rectangle over the top of the first one.

The easiest way to do this is to use the Align tool.

Select both rectangles. (Hold down Ctrl and Click on the original)
Press Ctrl + A (for Align).
Click the Vertical Centre radio button.
Click the Horizontal Centre radio button.
Click OK

Next we will create a slider to adjust the pump speed.

You will need to know the how far (in pixels) the slider needs to move. To find this out
(make sure you still have the rectangle selected) take a look at the bottom right corner
of the Graphics Builder.

The status bar will show you the width and height of the selected object. Write down
the height of the rectangle.

If the status bar is not visible, go to View, Show Status Bar and click on it.

Page 32 of 53
 1 Hour Quickstart Tutorial
Creating Graphics Pages, Analog Indicators & Controls continued…

On the Toolbox click on the Paste Symbol tool.

Use the scroll bars to display the thumbs library,

Click on thumbs in the Library list box.

Use the scroll bars to locate pointer2_e_r,

then Double Click on Pointer2_e_r.

Position the pointer at the left bottom side of the red rectangle.
Double Click on the Pointer Symbol to open the Properties sheet.

Click on the Slider Tab, then Click on the Vertical Tab on the right hand side.

Use the Insert button to insert Pump_1_Speed tag.

Make sure Continuous update of tag is checked.
In the At Maximum edit box type the height in pixels that you wrote down earlier.
Click on OK.

Now is a good time for a regular page save. Click the save icon.

Page 33 of 53
 1 Hour Quickstart Tutorial
Creating Graphics Pages, Configuring Text

Now we will place some text above the buttons to label the controls.

Click on the letter A on the Toolbox.

Type Pump 1.
Note: If you do not see any keyboard echo as you type it is most
likely because the currently selected color is the same as the
background.

Place the cursor above the buttons and click to position the text.
Click Bold, Size 22 (point) and make sure the Foreground color is red.
Click OK.

Page 34 of 53
 1 Hour Quickstart Tutorial
Creating Graphics Pages, Configuring Numbers
On the Toolbox, click on the number tool.
Click below the On/Off button to place the number.

Use the Insert Button to enter the tag Pump_1_Speed.

Click OK.

The Number tool is

actually the Text tool.
When you access it via
the number tool icon you
are presented with the
Display Value sheet
instead of the General
Appearance sheet.

Click on the General Tab on the right hand side.

Set the font to Bold, 22 point.

Page 35 of 53
 1 Hour Quickstart Tutorial
Creating Graphics Pages, 3D rectangles
Next we’ll add some cosmetics.

Draw a large rectangle that covers all the things you have drawn so far.

Set the Line color to gray, Check the Filled Check box and set the Filled color to
Gray also.
Click on 3Deffects tab.

Click Raised on the 3D Effects sheet.

Click OK.

Page 36 of 53
 1 Hour Quickstart Tutorial
Creating Graphics Pages, 3D rectangles continued…

Since it will be difficult to see your work with the large rectangle in front of it, we need
to send it to the back.

Click on the Send To back button on the Tool Bar.

Creating Graphics Pages, Pumps & Piping

Next we will add a picture of the pump and some piping.

Click on the Symbol Set tool.

Click to the right and below the new rectangle to place the symbol set.
Click on both Clear buttons.

Click on the Set Button next to the Off Symbol: edit box.

Page 37 of 53
 1 Hour Quickstart Tutorial
Creating Graphics Pages, Pumps & Piping continued…

In the Library box, use the scroll bars then click on pumps.
In the Symbol window, use the scroll bars to locate Pump_6_w_r then Double Click
on it.

Click on the Set Button next to the On Symbol: edit box.

Using the technique above, locate Pump_6_w_g then Double Click on it.

Use the Insert button to insert the tag Pump_1_CMD

Click OK

In this case we will want the pump flipped horizontally.

Make sure the pump is selected.
Click Arrange on the Menu, then Click Mirror.
Click on Horizontal then Click OK.

Page 38 of 53
 1 Hour Quickstart Tutorial
Creating Graphics Pages, Pumps & Piping continued…

Click on the Pipe Tool on the ToolBox.

To draw the top pipe.

Hold down the Ctrl Key. (It will keep your pipes constrained to be either horizontal and vertical).
Place cursor on top of the Pump, hold down left mouse button and move mouse up.
Release mouse key when you have moved up far enough.
Move mouse to the right and Double Click to end the pipe.
Release the Ctrl Key.
Click on OK to close property dialog.

To draw the lower pipe.

Place cursor on pump. Hold down Ctrl Key.
Hold down left mouse button. Move mouse to left then release mouse button.
Move mouse to 45 Degree position. Move the mouse slowly until you see the pipe
click into the 45 degree position then Double Click to end the pipe.

Page 39 of 53
 1 Hour Quickstart Tutorial
Creating Graphics Pages, Pumps & Piping continued…

Select both pipes.

Hold down the Ctrl Key. Click on each pipe. Release the Ctrl Key.

Click the Group button on the tool bar.

Click the Send To Back button on the tool bar.

Double Click on the pipe that you have drawn.

Click on the Fill Tab.
Insert Pump_1_CMD tag into the ON color when edit box.
Make sure the Off Color is gray. Make sure the On Color is Green.
Click OK.

Creating Graphics Pages, Change Background Color

Finally, we will change the color of the background.

Click on File, then Click on Properties.

Page 40 of 53
 1 Hour Quickstart Tutorial
Creating Graphics Pages, Change Background Color continued…

The properties dialog will be displayed. On the General Tab you can set the Window
title and other properties of the page. Click on the Appearance Tab to access
appearance properties.

Click on the Background Color drop down.

Click on the color shown below. (If you choose a different color some items you will
configure later on may not be visible or stand out very well).

Click OK to close the properties dialog and apply the changes.

Now is another good time to save your page.

Page 41 of 53
 1 Hour Quickstart Tutorial
Configuring Alarm

Switch to Citect Project Editor (Click on the icon or use Alt +Tab keys).

On the Project Editor Menu, Click on Alarms then Click on Digital Alarms

Fill in the Digital Alarms form as shown below. Remember it is better to use the drop
downs to ensure data is entered correctly. When the form is complete press Add.

Click on the icon to close the Digital Alarms dialog.

Page 42 of 53
 1 Hour Quickstart Tutorial
Configure an Alarm Display Page
.
Switch to the Citect Graphics Builder using the icon or Alt + Tab keys.

Click on the New icon. When the New form appears click on the Page button.

On the Use Template dialog, use the scroll bar to scroll up to the Alarm Template,
then Double Click on the Alarm Template.

Page 43 of 53
 1 Hour Quickstart Tutorial

. Configure an Alarm Page continued….

When the alarm template appears click on the save icon.

In the alarm Save As dialog, type Alarm in the Page: edit box, then Click OK.

Page 44 of 53
 1 Hour Quickstart Tutorial
Configuring Trends
.
First we need to configure a trend tag to store trend data.
Switch to Citect Project Editor (Click on icon or use Alt +Tab keys).

On the Project Editor Menu, Click on Tags then Click on Trend Tags

Fill in the Trend tag form as below then click Add. Remember to use drop downs
where possible.

There are many more trend features available in Citect. Press F2 with this form
open to see some of the advanced possibilities. Pressing F2 again will return you
to the basic menu’s.

Click on the icon to close the Trend Tags dialog.

Page 45 of 53
 1 Hour Quickstart Tutorial
Configure a Trend Page
Switch to the Citect Graphics Builder using the icon or Alt + Tab keys.

Click on the New icon. When the New form appears click on the Page button.

Double Click on the singletrend template

Double Click anywhere on the Trend Template

Page 46 of 53
 1 Hour Quickstart Tutorial

Configure a Trend Page Continued…

Click on the Pen 1 drop down as shown below and select Pump Speed from the list
then Click OK.

Click on the Save Icon to save the Trend page.

In the Page edit box, Type in SingleTrend, then Click OK

Page 47 of 53
 1 Hour Quickstart Tutorial
. Use the back Runtime
button at runtime to go Now it’s time to run your project and test it to make sure that you have completed the
back through the tutorial correctly.
pages that you have
visited.

Click on the Runtime Icon.

Click on the button called MyPage.

Click on Auto button then Click On Manual.

Click On/Off.
You will see that both pipes change color as the group properties will be applied to
everything in the group.

You will also see an alarm is generated. The Alarm clock will rock back and forward.
Click on the Alarm clock to view the Alarm page.

Page 48 of 53
 1 Hour Quickstart Tutorial
Runtime continued…
.
You can acknowledge individual alarms by clicking on each alarm.

Click the button to go back to MyPage.

Place your cursor on the Pointer. Hold down the left mouse and move the mouse up
and down. The red bar should change it’s height in line with the pointer movement.

Click the button to go to the menu page.

Click on the SingleTrend Button.

You should see the trend of the Pump Speed. Take some time to familiarize yourself
with the buttons on the trend page.

Page 49 of 53
 1 Hour Quickstart Tutorial
Backing Up Your Project
It is important to keep backup copies of your project, so that you can always recover
from a disaster with minimum effort.

Make sure you are in the Citect Explorer. (Click on the icon or use Alt + Tab).

Click on the Backup Icon.

Use the Browse button to locate a directory where you want to save your files.
Alternately you can type the directory and filename into the Backup File: edit box. If
the directory does not exist Citect HMI/SCADA will automatically create it for you when
it saves the file. Click OK and when the Backup Complete message pops up, Click OK
on that also.

Page 50 of 53
 1 Hour Quickstart Tutorial
Restoring Your Project
With any software, it is good practice to check and make sure you can restore from
your backup copies. It is a very rare to experience problems restoring from a backup
but the time taken to check is a tiny fraction compared to the time it would take to
recreate the project from scratch.

Click on the Restore Icon (it is next to the backup icon) or on the menu Click Tools
then Restore.

Click on the Browse button to locate your backup file.

We will restore to a New project, test it, then delete it, as this is a much better test than
restoring over the existing project and less chance of anything going wrong (eg; what if
the power fails half way through restoring over the top of your existing project and your
backup has a fault in it?).

Make sure New Project is checked.

In the Name: Edit box type a name for the new project eg;Test_Tutorial then click
OK.

When the restore is completed (Click OK on the Restore Complete Dialog), Click on
the Test _Tutorial project to switch to that project.

Page 51 of 53
 1 Hour Quickstart Tutorial
Restoring your project continued…

Click on the Citect Runtime icon to make sure the project will compile and run, if
it does then you can have confidence that you have a good backup.

To delete the Test_tutorial project, Click File on the Citect Explorer menu, then click
Delete Project.

Congratulations! By now you should have a basic working knowledge of

CitectHMI/SCADA software. If you are keen to build your level of competency we
recommend that you attend a Citect Training Course. Details of training courses can
be found at www.citect.com or by contacting your local Citect office or distributor.

Page 52 of 53
 1 Hour Quickstart Tutorial
Troubleshooting.
.
If you experience results that are different to what you see in the tutorial…

1. Go back and double check what you have done. Most likely you have done
something different from the instructions.
2. The tutorial largely assumes Citect HMI/SCADA is freshly installed and default
settings haven’t been changed. By taking a closer look at the screens in the
tutorial you may be able to identify any differences.
3. If problem is in Runtime, shutdown runtime and restart it.
4. Read the On Line Help. Most dialog boxes have a help button that provides
context sensitive help with just a mouse click.
5. Read the CitectHMI/SCADA knowledgebase. This is available on the
CitectHMI/SCADA software CD or from our website www.citect.com.
6. Worst case, start again, just create a new project and call it tutorial2. The
upside to this is the extra practice will make you more proficient.

If nothing appears to happen when you press a button, do not press it repeatedly in the
hope that something will happen – chances are your PC is busy trying to do what
you’ve asked it to do.

Page 53 of 53