Tutorial quiz klik and drag (Smart Apps Creator 3)
1. Buka Software Smart Apps Creator 3
2. Pilih Android Phone 》 Horizontal 》 Submit (Sesuai kebutuhan)
3. Beri nama pada section untuk Quiz Click & Drag4. Insert Text untuk tampilan start page, beri nama atau judul quiz letakkan pada posisi center
5. Insert Image untuk objek pertama (atas). Lakukan copy pada objek
pertama lalu paste, maka akan muncul objek kedua (bawah)
Contoh: Atas (Angka 1 & 2) bawah (Angka 1 & 2)
6. Pada objek atas, set posisi di depan Blok objek atas 》 Bring to front
7. Non-aktifkan navigasi, sehingga halaman terkunci Menu page 》 Aktifkan objek angka 1 (atas) menjadi dragging 》 Pilih juga Push Back After Dragging. Lakukan pada objek berikutnya.
8. Rename nama objek pada layer agar memudahkan objek mama yang akan di drag
9. Insert Hotspot untuk objek yang bawah. Hotspot shape 》 Oval menyesuaikan dengan objek.
10. Letakkan hotspot di atas angka 1 (bawah) copy hotspot untuk objek angka 2 (bawah)
11. Rename hotspot sesuai object
Note: Hotspot harus lebih besar ukurannya di banding objek
12. Selanjutnya, Pilih Object 》 Interaction 》 Enter Hotspot (Pilih hotspot yang dituju) 》 objek (1 atas) 》 Hide 》 Add
6. Pada objek atas, set posisi di depan Blok objek atas 》 Bring to front
7. Non-aktifkan navigasi, sehingga halaman terkunci Menu page 》 Aktifkan objek angka 1 (atas) menjadi dragging 》 Pilih juga Push Back After Dragging. Lakukan pada objek berikutnya.
8. Rename nama objek pada layer agar memudahkan objek mama yang akan di drag
9. Insert Hotspot untuk objek yang bawah. Hotspot shape 》 Oval menyesuaikan dengan objek.
10. Letakkan hotspot di atas angka 1 (bawah) copy hotspot untuk objek angka 2 (bawah)
11. Rename hotspot sesuai object
Note: Hotspot harus lebih besar ukurannya di banding objek
12. Selanjutnya, Pilih Object 》 Interaction 》 Enter Hotspot (Pilih hotspot yang dituju) 》 objek (1 atas) 》 Hide 》 Add
Lakukan hal yang sama pada objek angka 2 atas
13. Kemudian, Insert Image untuk tampilan BENAR Insert 》Image >》Tanda benar.png
13. Kemudian, Insert Image untuk tampilan BENAR Insert 》Image >》Tanda benar.png
(Yang sudah anda download)
14. Lalu kita setting Hide tampilan klik image (Centang) 》 Property 》Setting 》 Hide Object 》 When browsing 》 checklist
15. Next, kita atur agar saat menjawab benar, muncul tampilan centang. Klik angka 1 (atas) 》 Interaction 》 Enter Hotspot (Pilih Hotspot yang dituju) 》 Object (Tanda benar. Png) 》 Appear 》 add
16. Selanjutnya, insert animasi pada object centang Klik image 》Animation 》 Zoom (biru) 》 add tambahkan lagi Klik image 》Animation 》 Zoom (Orange)
17. Klik pada animasi kedua (bawah). Isi Delay dengan ukuran 1.50 kemudian save
14. Lalu kita setting Hide tampilan klik image (Centang) 》 Property 》Setting 》 Hide Object 》 When browsing 》 checklist
15. Next, kita atur agar saat menjawab benar, muncul tampilan centang. Klik angka 1 (atas) 》 Interaction 》 Enter Hotspot (Pilih Hotspot yang dituju) 》 Object (Tanda benar. Png) 》 Appear 》 add
16. Selanjutnya, insert animasi pada object centang Klik image 》Animation 》 Zoom (biru) 》 add tambahkan lagi Klik image 》Animation 》 Zoom (Orange)
17. Klik pada animasi kedua (bawah). Isi Delay dengan ukuran 1.50 kemudian save
18. Hapus interaction yang tadi sudah dibuat, lalu Klik angka 1 (Atas) 》 Interaction 》 Enter Hotspot (pilih hotspot yang dituju) 》 object》 Play Animation > Add
Lakukan Hal yang sama pada object angka 2 atas.
•
•
•
•
•
SELAMAT MENCOBA DAN SEMOGA BERMANFAAT♡
Komentar
Posting Komentar