V levém panelu dvojklikem otevřete vytvořenou HMI šablonu. Nyní ve spodní části tohoto panelu přepněte na záložku HMI objekty, vaše obrazovka by poté měla vypadat takto:
V okně HMI objekty naleznete širokou škálu grafických elementů, které lze do šablony přidat. V případě našeho tutoriálu začneme s prvkem Value Indicator, který slouží k zobrazování číselných hodnot - ideální pro zobrazení aktuální teploty v kanceláři. V levém panelu na tento prvek klikněte a přetáhněte jej na hlavní panel.
Na panelu přibude nový prvek, který automaticky zůstane vybrán. V panelu Vlastnosti nyní můžete vidět všechny nastavitelné atributy prvku. Pro nás nejdůležitější je vlastnost Proměnná umístěná v sekci HMI. Pomocí tohoto nastavení prvku sdělíme, co má použít jako zdroj zobrazovaných dat. Klikněte na Proměnná levým tlačítkem a poté klikněte na tlačítko 
.
Objeví se již důvěrně známý dialog Vyberte proměnnou, ve kterém můžete vyhledat svou proměnnou. Pro účely návodu hledáme předem vytvořenou proměnnou kancelar_teplota. Vyhledejte a vyberte ze seznamu, volbu potvrďte kliknutím na OK.
Zpět do panelu Vlastnosti. Nyní změníme vlastnost Jednotka určující jednotku zobrazované hodnoty. Tato jednotka bude v HMI automaticky přidána za zobrazenou hodnotu, a jelikož se jedná o teplotu ve stupních Celsia, nastavíme atribut Jednotka na °C.
Nyní by bylo vhodné hodnotu pojmenovat. Z nabídky HMI objekty vyberte element Text a umístěte jej do šablony. V panelu Vlastnosti pak změňte Text na Aktuální teplota.
Nový název je výrazně delší než původní, pro lepší viditelnost proto můžete textové pole zvětšit přetáhnutím jednoho ze žlutých čtverců okolo prvku.
Textový prvek rovněž není zcela čitelný a jeho současný vzhled evokuje spíše tlačítko než jmenovku. Změníme proto barvu textu na tmavě modrou pomocí vlastnosti Popředí v sekci vlastností Text.
Nyní změňte vlastnost Pozadí na bílou a Vodorovné zarovnání textu na Vpravo
Jako další hledáme prvek pro zobrazení a nastavení hodnoty analogové proměnné. Teoreticky bychom mohli opět použít Value indicator, tento prvek ale umožňuje pouze zobrazení hodnoty, nikoliv její změny. Lepší volbou zde bude Analog Setter. Vyberte jej a umístěte jej na pracovní plochu. V sekci vlastností HMI pak proveďte následující nastavení.
- Proměnná, zde vyberte vhodnou proměnou reprezentující teplotu, v případě tohoto návodu zvolím proměnnou hranicni_teplota
- Jednotka bude nastavena na °C, neboť proměnná je vyjádřena ve stupni Celsia
- Min. hodnota bude 18, což uživateli zabrání nastavit teplotu menší než 18 °C
- Max. hodnota bude 30, což uživateli zabrání nastavit teplotu vyšší než 30 °C
- Krok, neboli stupeň po kterém bude moci být teplota upravována, nastavte na 0.5
Rovněž vytvoříme textové označení prvku, stejně jako jsme učinili u Aktuální teploty. Zde můžete textové pole jednoduše zkopírovat a následně upravit text.
Poslední prvek, který budeme potřebovat, je indikátor stavu topení, tj. zda je topení zapnuto (ON) či vypnuto (OFF). I zde bychom mohli použít prvek Value indicator, ten by ale zobrazoval pouze hodnoty 0 a 1. Lepší volbou proto bude digitální prvek Digital Indicator. Vyberte jej a umistěte jej na pracovní plochu. Zde je třeba provést jen výběr správné proměnné např. DI_1.02.
Doporučujeme vždy pojmenovávat vstupy/výstupy smysluplnými názvy jako např. svetlo_kuchyn, dverni_zvonek apod. Existují dva hlavní důvody
- Takové názvy učiní projekt výrazně čitelnějším a přehlednějším
- Pokud se rozhodnete pro fyzické přepojení senzoru do jiného vstupu, stačí jen přejmenovat vstupní proměnnou - zbytek programu pak bude nadále užívat stejný název
Nyní už nás čeká jen pár posledních úprav. Vytvořte pro indikaci stavu topení jméno a poté vytvořte další, větší textové pole označující název celého HMI projektu. Výsledek může vypadat například takto:
