PERANCANGAN MEDIA INTERAKTIF UNTUK
MENINGKATKAN MINAT SISWA TERHADAP
TERMOKIMIA
Laporan Tugas Akhir
Ditulis sebagai syarat untuk memperoleh gelar Sarjana Desain (S.Ds.)
Nama : Glenn Tama Winardi
NIM : 00000020032
Program Studi : Desain Komunikasi Visual
Fakultas : Seni dan Desain
UNIVERSITAS MULTIMEDIA NUSANTARA
TANGERANG
2021
ii
LEMBAR PERNYATAAN TIDAK MELAKUKAN PLAGIAT
Saya yang bertanda tangan di bawah ini:
Nama : Glenn Tama Winardi
NIM : 00000020032
Program Studi : Desain Komunikasi Visual
Fakultas : Seni dan Desain
Universitas Multimedia Nusantara
Judul Tugas Akhir :
PERANCANGAN MEDIA INTERAKTIF UNTUK MENINGKATKAN
MINAT SISWA TERHADAP TERMOKIMIA
dengan ini menyatakan bahwa, laporan dan karya tugas akhir ini adalah asli dan
belum pernah diajukan untuk mendapatkan gelar sarjana, baik di Universitas
Multimedia Nusantara maupun di perguruan tinggi lainnya.
Karya tulis ini bukan saduran/terjemahan, murni gagasan, rumusan dan
pelaksanan penelitian/implementasi saya sendiri, tanpa bantuan pihak lain, kecuali
arahan pembimbing akademik dan narasumber.
Demikian surat Pernyataan Originalitas ini saya buat dengan sebenarnya,
apabila di kemudian hari terdapat penyimpangan serta ketidakbenaran dalam
pernyataan ini, maka saya bersedia menerima sanksi akademik berupa pencabutan
gelar (S.Ds.) yang telah diperoleh, serta sanksi lainnya sesuai dengan norma yang
berlaku di Universitas Multimedia Nusantara.
Tangerang, 11 Juni 2021
Glenn Tama Winardi
HALAMAN PENGESAHAN TUGAS AKHIR
PERANCANGAN MEDIA INTERAKTIF UNTUK
MENINGKATKAN MINAT SISWA TERHADAP
TERMOKIMIA
Oleh
Nama : Glenn Tama Winardi
NIM : 00000020032
Program Studi : Desain Komunikasi Visual
Fakultas : Seni dan Desain
Tangerang, 28 Juni 2021
. Pembimbing I
Agatha Maisie Tjandra, S.Sn., M.Ds.
Ketua Program Studi
Mohammad Rizaldi, S.T., M.Ds.
Penguji
Ken Natasha Violeta, S.Sn., M.Ds.
Ketua Sidang
Rani Aryani Widjono, S.Sn., M.Ds.
iv
KATA PENGANTAR
Puji syukur kepada Tuhan yang Maha Esa atas kesempatan yang diberikanNya
kepada penulis sehingga dapat menyelesaikan laporan tugas akhir ini sebagai syarat
kelulusan gelar (S.Ds.) di Universitas Multimedia Nusantara. Laporan ini berjudul
Perancangan Media Interaktif untuk Meningkatkan Ketertarikan Siswa terhadap
Termokimia.
Laporan ini dibuat dikarenakan masih banyak siswa SMA di Indonesia
mengalami sulitnya belajar pelajaran kimia di sekolah terutama pada topik
Termokimia yang padahal pengaplikasian topik tersebut dapat bermanfaat di
kehidupan sehari-hari. Oleh sebab itu, laporan ini ditujukan kepada target sasaran
penulis yaitu siswa SMA Indonesia yang sedange mempelajari pelajaran kimia di
sekolahnya.
Tujuan dari laporan ini juga untuk menambah kemungkinan jumlah peneliti
muda yang dapat membantu perkembangan Indonesia terutama dalam
perkembangan pengetahuan sains dan teknologi. Penulis mengucapkan rerima
kasih kepada beberapa orang yang telah memberi dukungan dan bantuan kepada
penulis dalam menyelesaikan laporan ini:
1. Mohammad Rizaldi, S.T., M.Ds. selaku Ketua Program Studi Desain
Komunikasi Visual.
2. Agatha Maisie Tjandra, S.Sn., M.Ds., sebagai dosen pembimbing yang
selalu memberi bimbingan baik selama proses perancangan.
v
3. Fitriani, S.Pd. dan Bernadus Suharjo, S.Si., Gr. selaku narasumber
dalam bidang pendidikan (guru) mengenai kimia termasuk topik
Termokimia.
4. Ken Natasha Violeta, S.Sn, M.Ds. & Rani Aryani Widjono, S.Sn.,
M.Ds. selaku Penguji dan Ketua Sidang.
Tangerang, 15 Juni 2021
Glenn Tama Winardi
vi
ABSTRAKSI
Kimia merupakan salah satu cabang pelajaran ilmu pengetahuan alam yang
memerlukan kemampuan berpikir kritis untik dipelajari dan menjadi pelajaran yang
penting dipelajari bagi siswa tingkatan SMA. Namun, banyak siswa SMA
Indonesia se-Jabodetabek merasa kesulitan mempelajarinya, khususnya materi
Termokimia. Kesulitan ini membuat para siswa kurang tertarik mempelajari mata
pelajaran tersebut yang padahal materi tersebut penting dipelajari agar memahami
materi kimia lainnya. Berdasarkan hasil wawancara dengan guru kimia bernama
Suharjo, kesulitan siswa belajar termokimia dikarenakan kurikulum materinya yang
terbagi menjadi fisika dan kimia. Hal itu menyebabkan materi kimia sulit dipahami
karena tidak dapat diajarkan secara menyuluruh. Berdasarkan masalah tersebut,
pada penelitian ini penulis merancang media interakif untuk meningkatkan minat
siswa SMA se-Jabodetabek terhadap Termokimia. Media interaktif yang dirancang
oleh penulis berbentuk game edukasi berdasarkan hasil Focus Group Discussion
yang dilakukan terhadap 4 narasumber siswa SMA. Dengan demikian, siswa
diharapkan dapat lebih tertarik belajar Termokimia dan pengaplikasiannya pada
kehidupan sehari-hari.
Kata kunci: Media Interaktif, Termokimia, Edukasi, Game Edukasi
vii
ABSTRACT
Chemistry is one of the branches of natural science that requires critical thinking
skills to be studied and is an important lesson for high school students. However,
many Indonesian high school students throughout Jabodetabek find it difficult to
learn, especially Thermochemistry. This difficulty makes students less interested in
studying these subjects, even though the material is important to learn in order to
understand other chemistry materials. Based on the results of an interview with a
chemistry teacher named Suharjo, the difficulty of students learning
thermochemistry is because the curriculum material is divided into physics and
chemistry. This makes chemistry difficult to understand because it cannot be taught
in its entirety. Based on these problems, in this study the authors designed
interactive media to increase the interest of high school students throughout
Jabodetabek towards Thermochemistry. The interactive media designed by the
author is in the form of a game based on the results of the Focus Group Discussion
conducted on 4 high school student resource persons. Thus, students are expected
to be more interested in learning Thermochemistry and its application in everyday
life.
Keywords: Interactive Media, Thermochemistry, Education, Educational Game
viii
DAFTAR ISI
LEMBAR PERNYATAAN TIDAK MELAKUKAN PLAGIAT .................... II
HALAMAN PENGESAHAN TUGAS AKHIR ............................................... III
KATA PENGANTAR ......................................................................................... IV
ABSTRAKSI ........................................................................................................ VI
ABSTRACT ........................................................................................................ VII
DAFTAR ISI ..................................................................................................... VIII
DAFTAR GAMBAR ........................................................................................... XI
DAFTAR TABEL ............................................................................................ XVI
DAFTAR LAMPIRAN ................................................................................... XVII
BAB I PENDAHULUAN ...................................................................................... 1
1.1. Latar Belakang .......................................................................................... 1
1.2. Rumusan Masalah ..................................................................................... 2
1.3. Batasan Masalah........................................................................................ 3
1.4. Tujuan Tugas Akhir .................................................................................. 3
1.5. Manfaat Tugas Akhir ................................................................................ 4
BAB II TINJAUAN PUSTAKA ........................................................................... 5
2.1. Desain ........................................................................................................ 5
2.1.1. Elemen Desain ............................................................................... 5
2.1.2. Prinsip Desain ................................................................................ 9
ix
2.2. Media Interaktif ....................................................................................... 13
2.2.1. Memahami Media Interaktif ........................................................ 13
2.2.2. Elemen Media Interaktif...............................................................15
2.3. Game sebagai Media Pembelajaran (Game Edukasi) ............................. 19
2.3.1. Manfaat Game Edukasi ................................................................ 19
2.4. Game Design ........................................................................................... 22
2.4.1. Basic Game Design Tools ............................................................ 22
2.4.2. Game Mechanic ........................................................................... 33
2.4.3. Camera ......................................................................................... 38
2.4.4. Character ..................................................................................... 39
2.4.5. Control ......................................................................................... 41
2.4.6. Environment Design ..................................................................... 42
2.4.7. Game Graphic Style ..................................................................... 44
2.5. Termokimia ............................................................................................. 48
2.5.1. Perubahan Kalor Reaksi Kimia .................................................... 48
BAB III METODOLOGI ................................................................................... 52
3.1. Metodologi Pengumpulan Data .............................................................. 52
3.1.1. Kuesioner ..................................................................................... 52
3.1.2. Wawancara ................................................................................... 53
3.1.3. Focus Group Discussion (FGD) .................................................. 57
3.1.4. Studi Referensi ............................................................................. 59
3.2. Metodologi Perancangan ......................................................................... 70
3.2.1. Brainstorming ............................................................................. 71
x
3.2.2. Planning ....................................................................................... 73
3.2.3. Design .......................................................................................... 77
3.2.4. Testing ........................................................................................ 107
3.2.5. Evaluation .................................................................................. 108
BAB IV ANALISIS ........................................................................................... 109
4.1. Analisis Alpha Test ............................................................................... 109
4.1.1. Analisis Desain Alpha ................................................................ 110
4.1.2. Revisi Pasca Alpha Test ............................................................. 112
4.2. Analisis Beta Test .................................................................................. 117
BAB V PENUTUP ............................................................................................. 120
5.1. Kesimpulan ........................................................................................... 120
5.2. Saran ...................................................................................................... 122
DAFTAR PUSTAKA .................................................................................... XVIII
xi
DAFTAR GAMBAR
Gambar 2.1. Contoh Garis yang Dibuat dengan Media dan Peralatan yang
Berbeda-Beda .................................................................................................. 6
Gambar 2.2. Bentuk-Bentuk Dasar dan Bangunnya Masing-Masing ..................... 7
Gambar 2.3. Sistem Warna-Warna Aditif Utama ................................................... 8
Gambar 2.4. Contoh Ciri-Ciri Keseimbangan Visual ........................................... 10
Gambar 2.5. Contoh Visual dengan Keseimbangan yang Berbeda-Beda ............. 11
Gambar 2.6. Beberapa Contoh Bentuk Hirarki secara Visual .............................. 12
Gambar 2.7. Contoh Book Cover yang Mengacu pada Unity ............................... 12
Gambar 2.8. Contoh Media Non-Interaktif ........................................................... 14
Gambar 2.9. Contoh Teks pada Tombol Menu ..................................................... 15
Gambar 2.10. Contoh Gambar pada Kartu Bermain ............................................. 16
Gambar 2.11. Contoh Potongan-Potongan Gambar untuk Animasi ..................... 18
Gambar 2.12. Screenshot Game Flywreck dimana Pemain Perlu Menghindari
Batasan dan Rintangan untuk Menyelesaikan Level ..................................... 23
Gambar 2.13. Permainan Pinball .......................................................................... 25
Gambar 2.14. Chart Flowstate Challenge & Skill ................................................ 27
Gambar 2.15. Permainan Darts ............................................................................. 28
Gambar 2.16. Contoh Permainan yang Sangat Mengandalkan Decision Making
adalah Catur .................................................................................................. 30
Gambar 2.17. Pong adalah Abstraksi Permainan Tenis ........................................ 31
Gambar 2.18. Permainan Tiny Gamers adalah Contoh Permainan dengan Konteks
yang Spesifik (Memilih Lokasi Sesuai Keberadaan Pemain) ....................... 33
xii
Gambar 2.19. Game Angry Birds yang Mengandalkan Physics ........................... 34
Gambar 2.20. Game The Legend of Zelda yang Menggunakan Internal Economy
....................................................................................................................... 35
Gambar 2.21. Game Command & Conquer: Red Alert yang Mengandalkan
Tactical Maneuvering ................................................................................... 37
Gambar 2.22. Tampilan Informasi Visual yang Dibatasi Tampilan Camera ....... 39
Gambar 2.23. Contoh Karakter dengan Pendekatan Bentuk Visual Sederhana ... 40
Gambar 2.24. Contoh Tampilan Control Map pada Mobile Game ...................... 41
Gambar 2.25. Contoh Environment Design secara Bertahap ................................ 44
Gambar 2.26. Game Pong (1972) dengan Abstract Graphic Style ....................... 45
Gambar 2.27. Game Legend of Zelda (1986), Super Mario Bros 3, dan Mega Man
2 dengan Stylized Graphic Style .................................................................... 46
Gambar 2.28. Game Battlefield 1, Gran Turismo Sport, The Last of Us dengan
Realistic Graphic Style .................................................................................. 47
Gambar 2.29. Formula Perubahan Entalpi (△H) .................................................. 49
Gambar 2.30. Reaksi Eksoterm ............................................................................. 50
Gambar 2.31. Reaksi Endoterm ............................................................................ 51
Gambar 3.1. Screenshot Narasumber Fitriani dengan Penulis melalui Video Call
....................................................................................................................... 54
Gambar 3.2. Screenshot Narasumber Bernadus Suharjo dengan Penulis melalui
Video Call ..................................................................................................... 56
Gambar 3.3. Screenshot Narasumber FGD dengan Penulis melalui Video Call .. 58
Gambar 3.4. Cave Story ........................................................................................ 59
xiii
Gambar 3.5. Cave Story Gameplay Scene ............................................................ 60
Gambar 3.6. Celeste .............................................................................................. 63
Gambar 3.7. Celeste Gameplay Scene .................................................................. 64
Gambar 3.8. Puzzle Adventure – Underground Temple ....................................... 66
Gambar 3.9. Puzzle Adventure – Underground Temple Gameplay Scene ........... 67
Gambar 3.10. Metodologi Perancangan Game Edukasi Iteration Cycles ............ 71
Gambar 3.11. Mind-Map ...................................................................................... 72
Gambar 3.12. Bagan Peta Materi Termokimia Dasar ........................................... 74
Gambar 3.13. Game Flow Summary Game Edukasi Khemezia ........................... 77
Gambar 3.14. Palet Warna Utama Perancangan Game Khemezia ....................... 79
Gambar 3.15. Moodboard ..................................................................................... 80
Gambar 3.16. Play Flow Perancangan Game Khemezia ...................................... 85
Gambar 3.17. Sketsa Skema Environment Level Pertama .................................... 86
Gambar 3.18. Sketsa Skema Environment Level Kedua ....................................... 87
Gambar 3.19. Sketsa Skema Environment Level Ketiga ...................................... 87
Gambar 3.20. Desain Tile Environment ................................................................ 88
Gambar 3.21. Desain Tilemap Environment ......................................................... 89
Gambar 3.22. Tampilan Secara Menyeluruh Desain Environment Level Pertama 90
Gambar 3.23. Gameplay Cave Story Menggunakan Flying Platform .................. 90
Gambar 3.24. Flying Platform yang Digunakan pada Game Khemezia .............. 90
Gambar 3.25. Referensi Karakter Cave Story ....................................................... 92
Gambar 3.26. Referensi Tiny Tower .................................................................... 92
Gambar 3.27. Proses Desain Karakter Protagonis Khemezia ............................... 93
xiv
Gambar 3.28. Proses Desain Atribut Pakaian Karakter Protagonis Khemezia ..... 94
Gambar 3.29. Proses Desain Atribut Pelindung Mata Karakter Protagonis
Khemezia....................................................................................................... 94
Gambar 3.30. Animasi Jalan Karakter Protagonis Khemezia ............................... 94
Gambar 3.31. Palet Warna Desain Karakter Roh Kalor ....................................... 95
Gambar 3.32. Referensi dan Desain Aset Roh Kalor............................................ 96
Gambar 3.33. Referensi dan Desain Aset Peri ...................................................... 97
Gambar 3.34. Referensi dan Game Object Lempengan Batu Penanda ................ 99
Gambar 3.35. Palet Warna Game Object Lempengan Batu Penanda ................... 89
Gambar 3.36. Referensi dan Game Object Visual Penanda Objek Interaksi ...... 100
Gambar 3.37. Referensi dan Game Object Teka-Teki Pohon Buatan ................ 100
Gambar 3.38. Referensi Tampilan Visual Hitpoint pada Game Pixus ............... 101
Gambar 3.39. Tampilan Visual Hitpoint pada Game Khemezia ........................ 102
Gambar 3.40. Tampilan Visual Energy Bar pada Game .................................... 103
Gambar 3.41. Tampilan Visual HUD Game dengan Grid .................................. 103
Gambar 3.42. Tampilan GUI Hint Lempengan Batu Penanda ........................... 104
Gambar 3.43. Font Upheaval TT -BRK- ............................................................ 105
Gambar 3.44. Tampilan GUI Teka-Teki Pohon Buatan ..................................... 106
Gambar 4.1. Perancangan Environment Level 2 ................................................. 111
Gambar 4.2. Perancangan Environment Level 3 ................................................. 112
Gambar 4.3. Tile Background ............................................................................. 112
Gambar 4.4. Tilemap Background ...................................................................... 113
Gambar 4.5. Contoh Penandaan Panduan Navigasi “Space to Jump” ................ 114
xv
Gambar 4.6. Contoh Penandaan Panduan Navigasi “Press C to Shoot Fireball”
..................................................................................................................... 114
Gambar 4.7. Intro Logo Menu Utama Khemezia ............................................... 115
Gambar 4.8. Tombol Start & Exit Menu Utama Khemezia ................................ 115
xvi
DAFTAR TABEL
Tabel 3.1. Tabel Analisis Game Cave Story ......................................................... 61
Tabel 3.2. Tabel Analisis Game Celeste ............................................................... 65
Tabel 3.3. Tabel Analisis Game Puzzle Adventure – Underground Temple ........ 68
Tabel 4.1. Tabel Hasil Kuesioner Alpha Test Mengenai Visual, Konten, dan
Interaktivitas ................................................................................................ 109
Tabel 4.2. Tabel Hasil Kuesioner Beta Test Mengenai Visual, Konten, dan
Interaktivitas ................................................................................................ 116
xvii
DAFTAR LAMPIRAN
LAMPIRAN A: LEMBAR BIMBINGAN ...................................................... xxii
LAMPIRAN B: HASIL KUESIONER (KUANTITATIF) .......................... xxiv
LAMPIRAN C: TRANSKRIP WAWANCARA PERTAMA ..................... xxvi
LAMPIRAN D: TRANSKRIP WAWANCARA KEDUA .......................... xxxi
LAMPIRAN E: TRANSKRIP FGD ............................................................ xxxix
LAMPIRAN F: SURVEY HASIL ALPHA TEST .......................................... xli
LAMPIRAN G: SURVEY HASIL BETA TEST ........................................... xlvi