Topic 3 Animation
-
Upload
regina-tamara -
Category
Documents
-
view
249 -
download
0
Transcript of Topic 3 Animation
-
7/24/2019 Topic 3 Animation
1/33
I
ANIMASI
Laporan ini disusun untuk memenuhi salah satu syarat kelulusan mata
kuliah HMI Scada pada semester V di Program Studi D3 Teknik
Elektronika Jurusan Teknik Elektro
Oleh:
Regina Tamara
NIM : 131311024
POLITEKNIK NEGERI BANDUNG
2015
-
7/24/2019 Topic 3 Animation
2/33
1
DAFTAR ISI
DAFTAR ISI ........................................................................................................... 1
DAFTAR GAMBAR .............................................................................................. 2
TUJUAN ................................................................................................................. 4
ALAT DAN BAHAN ............................................................................................. 4
DASAR TEORI ...................................................................................................... 4
HASIL PRAKTIKUM ............................................................................................ 8
1. Animasi Diskrit ............................................................................................ 8
2. Animasi Analog ......................................................................................... 28
KESIMPULAN ..................................................................................................... 22
-
7/24/2019 Topic 3 Animation
3/33
2
DAFTAR GAMBAR
Gambar 1.1 Animasi objek dari wizard .................................................................. 5
Gambar 1.2 Animasi objek yang dibuat sendiri ...................................................... 5
Gambar 1.3 Jenis-jenis animasi .............................................................................. 6
Gambar 1.4 Tampilan Application Manager .......................................................... 8
Gambar 1.5 Tampilan New Window pada InTouch MovieMaker ......................... 9
Gambar 1.6 Animasi Diskrit ................................................................................... 9
Gambar 1.7 Tampilan Symbol Factory by Reichard Software ............................. 10
Gambar 1.8 Animation Link pada Symbol Factory by Reichard Software .......... 10
Gambar 1.9 Mengisi Expression pada Fill Color .................................................. 11
Gambar 1.10 Objek Round Rectangle .................................................................. 11
Gambar 1.11 Animasi pada objek Round Rectangle ............................................ 11
Gambar 1.12 Mengisi Expression pada Line Color .............................................. 12
Gambar 1.13 Objek Text ....................................................................................... 12
Gambar 1.14 Animasi pada objek Text................................................................. 13
Gambar 1.15 Mengisi Expression pada Text Color .............................................. 13
Gambar 1.16 Objek Rectangle .............................................................................. 14
Gambar 1.17 Animasi pada objek Rectangle ........................................................ 14
Gambar 1.18 Mengisi Expression pada Rectangle ............................................... 14
Gambar 1.19 Objek Ellipse ................................................................................... 15
Gambar 1.20 Mengisi Expression pada Ellipse .................................................... 15
Gambar 1.21 Mengisi Expression pada Blink....................................................... 16
Gambar 1.22 Objek Light ..................................................................................... 16Gambar 1.23 Mengisi Expression pada objek Light ............................................. 17
Gambar 1.24 Objek Round Rectagle .................................................................... 17
Gambar 1.25 Mengisi Expression pada objek Round Rectangle .......................... 17
Gambar 1.26 Mengisi Action pada objek Round Rectangle ................................. 18
Gambar 1.27 Objek Light ..................................................................................... 18
Gambar 1.28 Mengisi Expression pada objek Light ............................................. 19
Gambar 1.29 Objek Discrete Switch ..................................................................... 19
-
7/24/2019 Topic 3 Animation
4/33
3
Gambar 1.30 Mengisi Tagname pada objek Discrete Switch ............................... 20
Gambar 1.31 Objek User Input ............................................................................. 20
Gambar 1.32 Animasi pada objek Text................................................................. 21
Gambar 1.33 Mengisi Tagname pada objek User Input ....................................... 21
Gambar 1.34 Objek Text Value Display ............................................................... 22
Gambar 1.35 Animasi pada objek Text................................................................. 22
Gambar 1.36 Mengisi Expression pada objek Text Value Display ...................... 23
Gambar 1.37 Tampilan Window menuju Window Script .................................... 23
Gambar 1.38 Window Script ................................................................................ 24
Gambar 1.39 Keadaan saat Animasi Diskrit di Runtime ...................................... 25
Gambar 1.40 Keadaan saat Animasi Diskrit ON .................................................. 25
Gambar 1.41 Keadaan saat Animasi Diskrit OFF ................................................. 26
Gambar 1.42 Keadaan saat Animasi Diskrit OFF ................................................. 26
Gambar 1.43 Pada saat Saklar 1 ditekan ............................................................... 27
Gambar 1.44 Pilihan Saklar 1 pada saat OFF dan ON .......................................... 27
Gambar 1.45 Keadaan saat Animasi Diskrit ON .................................................. 27
Gambar 1.46 Animasi Analog............................................................................... 28
Gambar 1.47 Tampilan Window menuju Window Script .................................... 28
Gambar 1.48 Window Script Animasi Analog ..................................................... 29
Gambar 1.49 Keadaan saat Animasi Analog di Runtime ..................................... 29
Gambar 1.50 Keadaan saat Animasi Analog Switch ON ..................................... 30
Gambar 1.51 Keadaan saat Animasi Analog Switch OFF .................................... 30
Gambar 1.52 User Input untuk mengatur Slider ................................................... 31
Gambar 1.53 Key Untuk mengatur Slider ............................................................ 31
Gambar 1.54 Tampilan User Input........................................................................ 31
-
7/24/2019 Topic 3 Animation
5/33
4
TUJUAN
Tujuan dari praktikum pada percobaan Animasiyaitu :
1. Membuat animasi diskrit dari objek wizard.
2.
Membuat animasi diskrit dari objek yang dibuat sendiri.
3. Dapat membuat animasifill color, line color, text color, visibility, blink, value
display, dan user inputdiskrit.
4. Membuat animasi analogdari objek wizard.
5. Membuat animasi analogdari objek yang dibuat sendiri.
6. Dapat membuat animasi percentage fill move horizontal/vertikal, value
display, dan user input analog.
ALAT DAN BAHAN
1.
Laptop.
2. Wonderware Intouch Application.
DASAR TEORI
Animasi adalah proses memberi nyawa dari objek-objek yang telah digambar
dan diberi tagname. Proses membuat animasi pada Wonderware InTouch terbagi
menjadi dua, yaitu jika objek dari wizarddan jika objek dibuat sendiri.
Animasi objek dari wizard adalah sebuah proses dimana kita membuat suatu
animasi dari template yang sudah disediakan oleh Wonderware InTouch dengan
berbagai pilihan gambar yang akan dianimasikan dengan berbagai perintah yang
sudah tersedia.
-
7/24/2019 Topic 3 Animation
6/33
5
Gambar 1.1 Animasi objek dari wizard
Ref : PRAKTIKUM SKTTUnit 3. Animasi.mp4
Sementara apabila kita membuat animasi dengan objek yang dibuat sendiri
kita dapat mengklik dua kali pada objek yang kita buat lalu kita pilih animasi apa
yang kita inginkan.
Gambar 1.2 Animasi objek yang dibuat sendiriRef : PRAKTIKUM SKTTUnit 3.Animasi.mp4
-
7/24/2019 Topic 3 Animation
7/33
6
Jenis-jenis animasi
Gambar 1.3 Jenis-jenis animasi
Ref : PRAKTIKUM SKTTUnit 3.Animasi.mp4
Pada touch link operator atau pengguna dapat menyentuh atau memberi
instruksi pada animasi tersebut. Sementara pada display link animasi hanya
ditampilkan saja. Pada display link pilihan-pilihan yang ada adalah line coloruntuk
mengubah garis luar objek, fill coloruntuk mengubah warna isi objek, text color
untuk mengubah warna huruf, object sizeuntuk mengubah ukuran objek, location
untuk mengubah lokasi objek,percent filluntuk mengubah presentase isian objek,
visibilityuntuk mengubah visibilitas, blinkuntuk mengatur kedipan, disable untuk
mengatur disabilitas.
-
7/24/2019 Topic 3 Animation
8/33
7
Jenis animasi yang digunakan
Animasi diskrit
Hanya ada dua kondisi dari objek yang dimanipulasi yaitu 0, atau 1. Objek yang
dimanipulasi tentunya merupakan peralatan diskrit. Misalnya : tombol, status
ON-OFF motor dan limit switch.
Animasi analog
Merupakan animasi yang dilakukan dalam suatu range nilai tertentu. Objek yang
ditampilkan kondisinya maupun diubah statusnya adalah peralatan analog
seperti : potensiometer, sensor suhu analog.
Animasi value display
Pada window makeranimasi value displaymenggunakan tanda # . Saat dilihat
di window viewertanda # akan diganti dengan nilai yang kita inginkan.
Animasi user input
User dapat memasukkan input pada program untuk melakukan suatu aksi
tertentu padaplant.
-
7/24/2019 Topic 3 Animation
9/33
8
HASIL PRAKTIKUM
1. Animasi Diskrit
Membuat animasi diskrit dengan animasi objek yang dibuat sendiri dan objek
Wizard dengan cara:
1. Buka aplikasi Wonderware InTouch dan membuat Application Manager
yang baru
Start > InTouch > InTouch Application Manager > New >(InTouch
Application Manager) > Create Application Manager > Next > (nama
Application) > Next > Finish.
2.
MembukaApplication Manageryang telah dibuat dan klik 2 kali.
Gambar 1.4 TampilanApplication Manager
3. Munculah tampilanInTouchWindowMaker. Kemudian membuat halaman
baru dengan mengklik icon atau File > New Window (Ctrl +N).
Setelah memilih Window Type,Kemudian memilih tombol OK.
-
7/24/2019 Topic 3 Animation
10/33
9
Gambar 1.5 TampilanNew WindowpadaInTouch MovieMaker
4. Kemudian memasukkan objek yang terdapat pada kanan Window dan juga
dapat memasukkan objek pada wizarddan menggunakan gambar
ISA.Buat objek seperti yang terlihat pada gambar 1.6.
Gambar 1.6 Animasi Diskrit
5. Pada gambar 1.6 untuk membuat AnimasiFill Color, mendouble klik objek
ISA dan muncul tampilan Symbol Factory by Reichard Software.
Kemudian klik tombol Animation> Fill Color Discrete> isi Expression
seperti pada gambar dan klik tombol OK.
-
7/24/2019 Topic 3 Animation
11/33
10
Gambar 1.7 Tampilan Symbol Factory by Reichard Software
Gambar 1.8Animation Linkpada Symbol Factory by Reichard Software
-
7/24/2019 Topic 3 Animation
12/33
11
Gambar 1.9 MengisiExpressionpadaFill Color
6. Pada gambar 1.6, untuk membuat AnimasiLine Colormendouble klik objek
Round Rectangle dan muncul tampilan Animasi, kemudian pada Line
Colorklik tombolDiscrete > isiExpressionseperti pada gambar 1000 dan
klik tombol OK.
Gambar 1.10 Objek Round Rectangle
Gambar 1.11 Animasi pada objekRound Rectangle
-
7/24/2019 Topic 3 Animation
13/33
12
Gambar 1.12 MengisiExpressionpadaLine Color
7.
Pada gambar 1.6, untuk membuat Text Colormendouble klik objek Text
dan muncul tampilan Animasi, kemudian pada Text Color klik tombol
Discrete > isiExpressionseperti pada gambar 1000 dan klik tombol OK.
Gambar 1.13 Objek Text
-
7/24/2019 Topic 3 Animation
14/33
13
Gambar 1.14 Animasi pada objek Text
Gambar 1.15 MengisiExpressionpada Text Color
8. Pada gambar 1.6, untuk membuat Visibility mendouble klik objek
Rectangle dan muncul tampilan Animasi,kemudian padaMiscellaneous
klik tombol Visibility > isiExpressionseperti pada gambar 1000 dan klik
tombol OK.
-
7/24/2019 Topic 3 Animation
15/33
14
Gambar 1.16 Objek Rectangle
Gambar 1.17 Animasi pada objekRectangle
Gambar 1.18 MengisiExpressionpadaRectangle
-
7/24/2019 Topic 3 Animation
16/33
15
9.
Pada gambar 1.6, untuk membuat Animasi Blink mendouble klik objek
Ellipse dan muncul tampilan Animasi,kemudian padaMiscellaneousklik
tombol Blink > isi Expression dan men-klik Enable Visible seperti pada
gambar 1.21 dan klik tombol OK.
Gambar 1.19 ObjekEllipse
Gambar 1.20 MengisiExpressionpadaEllipse
-
7/24/2019 Topic 3 Animation
17/33
16
Gambar 1.21 MengisiExpressionpadaBlink
Selanjutnya untuk membuat Animasi Blinkmenggunakan Light, mendouble
klik objek Light kemudianisiExpressiondan men-klikEnable Blink seperti
pada gambar 1.23 dan klik tombol OK.
Gambar 1.22 ObjekLight
-
7/24/2019 Topic 3 Animation
18/33
17
Gambar 1.23 MengisiExpressionpada objekLight
10.Pada gambar 1.6, untuk membuat AnimasiDisable, mendouble klik objek
Round Rectangle dan muncul tampilan Animasi, kemudian pada
Miscellaneousklik tombol Disable > isi Expression seperti pada gambar
1000 dan klik tombol OK.
Gambar 1.24 ObjekRound Rectagle
Gambar 1.25 MengisiExpressionpada objekRound Rectangle
-
7/24/2019 Topic 3 Animation
19/33
18
Kemudian pada Touch Pushbuttonsklik tombolAction > isi Condition seperti
pada gambar 1000 dan klik tombol OK.
Gambar 1.26 MengisiActionpada objekRound Rectangle
Selanjutnya untuk membuat Animasi Blinkmenggunakan Light, mendouble
klik objek Light kemudianisiExpressionseperti pada gambar 1.28 dan klik
tombol OK.
Gambar 1.27 ObjekLight
-
7/24/2019 Topic 3 Animation
20/33
19
Gambar 1.28 MengisiExpressionpada objekLight
11.Selanjutnya untuk membuat Switch, mendouble klik objek Discrete
Switch kemudianisi Tagnameseperti pada gambar 1.30 dan klik tombol
OK.
Gambar 1.29 ObjekDiscrete Switch
-
7/24/2019 Topic 3 Animation
21/33
20
Gambar 1.30 Mengisi Tagnamepada objekDiscrete Switch
12.
Pada gambar 1.6, untuk membuat User Inputmendouble klik objek Text
dan muncul tampilan Animasi, kemudian pada User Inputs klik tombol
Discrete > isi Tagnamedan mengisiMessage yang akan ditampilkan seperti
pada gambar 1.33 dan klik tombol OK.
Gambar 1.31 Objek User Input
-
7/24/2019 Topic 3 Animation
22/33
21
Gambar 1.32 Animasi pada objek Text
Gambar 1.33 Mengisi Tagnamepada objek User Input
-
7/24/2019 Topic 3 Animation
23/33
22
13.
Pada gambar 1.6, untuk membuat User Inputmendouble klik objek Text
dan muncul tampilan Animasi, kemudian pada User Inputs klik tombol
Discrete > isi Tagnamedan mengisiMessage yang akan ditampilkan seperti
pada gambar 1.36 dan klik tombol OK.
Gambar 1.34 Objek Text Value Display
Gambar 1.35 Animasi pada objek Text
-
7/24/2019 Topic 3 Animation
24/33
23
Gambar 1.36 MengisiExpressionpada objek Text Value Display
14.
Pada Window, klik kanan dan memilih menu WindowScript.
Gambar 1.37 Tampilan Windowmenuju Window Script
15.
Kemudian muncul tampilan WindowScriptdan mengisikanscriptdengan
kondisi seperti gambar 1.38.
-
7/24/2019 Topic 3 Animation
25/33
24
Gambar 1.38 Window Script
16.
Jalankan animasi yang telah dibuat dengan menekanRuntimeyang berada
pada bagian ujung halaman. Kemudian muncul tampilan WindowViewer.
-
7/24/2019 Topic 3 Animation
26/33
25
Gambar 1.39 Keadaan saat Animasi Diskrit di Runtime
Gambar 1.40 Keadaan saat Animasi Diskrit ON
Pada saat animasi tersebut pada kondisi ON, line coloruntuk mengubah garis luar
objek,fill colormengubah warna rectangle, text coloruntuk mengubah warna
huruf text color , visibilityuntuk mengubah objek berlabel visibilitymenjadi
hilang, blinkuntuk mengatur kedipan berlabel blink, disable untuk mengatur
objek berlabel disableyang mengontrol lampu yang diletakkan disebelah objek
tersebut, apabila cursor ditempatkan pada objek tersebut maka lampu akan
menyala dan apabila kita meng-klik kiri maka lampu akan mati, kondisi
tersebut hanya dapat dioperasikan saat tombol pada keadaan ON. Keadaan
mati dan hidup merupakan aplikasi animasi value displayyang menandakan
logic1 untuk hidup dan logic0 untuk mati. Animasi user input, user dapat
-
7/24/2019 Topic 3 Animation
27/33
26
memasukkan input pada program untuk melakukan suatu aksi tertentu pada
plant.
Gambar 1.41 Keadaan saat Animasi Diskrit OFF
Pada saat animasi tersebut pada saat Saklar 1 kondisi ON. Keadaan Animasi sama
seperti awal namun pada keadaan disable tidak bisa digunakan untuk mengatur
objek berlabel disable.
Gambar 1.42 Keadaan saat Animasi Diskrit OFF
-
7/24/2019 Topic 3 Animation
28/33
27
Gambar 1.43 Pada saat Saklar 1 ditekan
Gambar 1.44 Pilihan Saklar 1 pada saat OFF dan ON
Gambar 1.45 Keadaan saat Animasi Diskrit ON
-
7/24/2019 Topic 3 Animation
29/33
28
2. Animasi Analog
Gambar 1.46 AnimasiAnalog
1. Pada Window, klik kanan dan memilih menu WindowScript.
Gambar 1.47 Tampilan Windowmenuju Window Script
2. Kemudian muncul tampilan WindowScriptdan mengisikanscriptdengan
kondisi seperti gambar 1.48.
-
7/24/2019 Topic 3 Animation
30/33
29
Gambar 1.48 Window Script AnimasiAnalog
3. Jalankan animasi yang telah dibuat dengan menekan Runtimeyang berada
pada bagian ujung halaman. Kemudian muncul tampilan WindowViewer.
Gambar 1.49 Keadaan saat AnimasiAnalogdiRuntime
-
7/24/2019 Topic 3 Animation
31/33
30
Gambar 1.50 Keadaan saat AnimasiAnalogSwitch ON
Gambar 1.51 Keadaan saat AnimasiAnalogSwitch OFF
-
7/24/2019 Topic 3 Animation
32/33
1
Gambar 1.52 User Inputuntuk
mengatur SliderGambar 1.53 Tampilan User Input
Gambar 1.54Key Untuk mengatur Slider
3
-
7/24/2019 Topic 3 Animation
33/33
KESIMPULAN
Kesimpulan dari praktikum ini didapat:
1.
Pembuatan animasi merupakan salah satu komponen penting yang dapat
menampilkan sebuah gambar yang memiliki kesamaan dengan plant yang
sedang diamati pengukuran atau prosesnya secara realtime.
2. Line colorberfungsi untuk mengubah garis luar objek.
3. Fill colormengubah warna isi pada objek yang dipilih.
4. Text coloruntuk mengubah warna huruf .
5.
Visibilityuntuk mengubah objek berlabel visibilitymenjadi hilang,
6. Blinkuntuk mengatur kedipan berlabel blink.
7. Disable untuk mengatur objek berlabel disableyang mengontrol lampu yang
diletakkan disebelah objek tersebut, apabila cursor ditempatkan pada objek
tersebut maka lampu akan menyala dan apabila kita meng-klik kiri maka lampu
akan mati, kondisi tersebut hanya dapat dioperasikan saat tombol pada keadaan
ON. Keadaan mati dan hidup merupakan aplikasi animasi
8. Value display yang menandakan logic 1 untuk hidup dan logic 0 untuk
mati.