Volume 1 No. 1 Januari 2020 ISSN: 0000-0000

## Perancangan Animasi Interaktif Pembelajaran Memperbaiki Sistem Rem
Ade Fitriadi 1 , Henry Nugraha 2 , Muhamad Sahrul Abadi 3
1 STMIK Nusa Mandiri e-mail: 1 abde.bt88@gmail.com
2,3 Universitas Bina Sarana Informatika e-mail: 2 Henny.hyg@bsi.ac.id, 3 17190210@bsi.ac.id
Abstrak - Dalam era globalisasi sekarang  ini, teknologi  informasi  melaju dengan cepatnya. Adapun komputer yang  merupakan  peralatan  yang  diciptakan  untuk  mempermudah  pekerjaan  manusia  saat  mencapai  kemajuan baik.Seperti  halnya  masyarakat  yang  tidak  terlepas  dari  teknologi  sebagai  sarana  pembelajaran,  salah  satunya adalah animasi interaktif, namun sebagian banyak animasi sekarang yang dikenal masyarakat kurang mengandung edukasi. Oleh karena itu penulis membuat animasi ini, agar masyarakat bisa termotivasi untuk mengunakan dan merancang atau pun membuat animasi  interaktif lain yang lebih kreatif dan menarik, yang berguna bagi negara Indonesia  ini.  Pada  program  ini  menggunakan Adobe  Flash  CS5 sebagai  media  mendesain,  dimana listing program yang cukup sederhana dan mudah dimengerti, toolbox yang beragam, panel properties ,dan juga library yang  dapat  memberikan  kemudahan.  Perancangan  program  merupakan  solusi  terbaik  untuk  memecahkan permasalahan-permasalahan yang ada pada era globalisasi ini, dengan perancangan program dapat tercapai suatu kegiatan yang efektif dan efisien dalam proses belajar-mengajar pada siswa.
Kata Kunci: Pembelajaran, perbaikan sistem rem animasi interaktif, perancangan animasi.
Abstract - In this era of globalization, information technology is advancing rapidly. Computers are equipment that is created to facilitate human work while achieving good progress. Just as society is inseparable from technology as a means of learning, one of which is interactive animation, but most animations now known to the public lack education. Therefore, the authors make this animation, so that people can be motivated to use and design or create other interactive animations that are more creative and interesting, which are useful for this country of Indonesia. In programs that use Adobe Flash CS5 as a design medium, where program listings are quite simple and easy, a variety of toolboxes, panel properties, and also libraries that can provide benefits. The program design is the best solution for solving problems that exist in this era of globalization, by designing the program to achieve an effective and efficient activity in the teaching and learning process of students.
Keywords: Learning, Interactive Animation System Improvement, Animation Design.

## PENDAHULUAN
Perkembangan  ilmu  pengetahuan  dan teknologi  sangat  pesat  terutama  dibidang teknologi yaitu salah satunya adalah komputer. Perkembangan komputer dituntut untuk mempermudah pekerjaan manusia secara cepat dan  tepat.  Komputer  juga  sebagai  sarana penyampaian  informasi  yang  dapat  digunakan dalam  berbagai  bidang,  salah  satunya  adalah multimedia bentuk informasi yang dapat berupa pendidikan misalnya pendidikan teknik otomotif pada .
Pengenalan    pendidikan  teknik  otomotif pada kenyataannya, guru tidak mempunyai cara yang  efektif  untuk  menyampaikan  materi pengenalan teknik otomotif secara tepat kepada siswa  tersebut.  Berdasarkan  kondisi  tersebut
menyebabkan  mereka  malas  untuk  belajar dikarenakan  media  penyampaian  informasi yang minim pada pendidikan teknik otomotif. Pada  Penulisan  Ilmiah  ini  memfokuskan untuk  membahas  tentang  tata  cara  penjelasan melakukan perawatan atau tune up pada motor bensin. Hal tersebut bertujuan untuk membantu siswa  dalam  belajar  sambil  bermain  dengan tujuan  agar  selain  mereka  belajar  tentang pengajaran teknik otomotif lebih
menyenangkan  dan  tidak  membosankan  yang disertai  pemahaman  materi  serta  latihan  soal yang berguna untuk melatih daya ingat siswa.
Berdasarkan hal tersebut, penulis mempunyai  gagasan  yang  dijelaskan  ke  dalam aplikasi sederhana yaitu “Perancangan Animasi Interaktif  Pembelajaran  Memperbaiki  Sistem
Rem”. Aplikasi sederhana ini diharapkan dapat membantu para pengguna komputer khususnya siswa  dengan  membekali  ilmu  pengetahuan tentang teknik otomotif, yang dapat didampingi oleh guru.

## METODE PENELITIAN
Teknik Pengumpulan Data
Untuk menyusun penelitian ini diperlukan data  yang  baik  dan  benar,  dan  untuk mengumpulkan data
tersebut penulis mengumpulkan  meneliti  banyak  data  tentang cara  pembelajaran  memperbaiki  sistem  rem. Adapun  metode  yang  digunakan  oleh  penulis adalah  sebagai berikut :
1. Obsevasi Penulis  melakukan  pencarian  data  atau
informasi  dengan  melakukan  pengamatan langsung  pada  Sekolah  Menengah  Kejuruan Mekanika  Bogor  terutama  kepada  jurusan teknik kendaraan ringan.
2. Wawancara Memperoleh  data  dengan  melakukan tanya  jawab  secara  langsung  kepada  guru otomotif  mengenai  memperbaiki  sistem  rem kendaraan roda empat.
3. Studi Pustaka
Penulis mencari, menemukan dan
mempelajari  buku  dari  studi  literatur  atau jurnal-jurnal  yang  berhubungan  dengan  tema penulisan  penelitian  ini  khususnya  masalah animasi  dan  buku-buku  yang  terkait  tentang panduan perbaikan sistem rem.
Untuk membatasi permasalahan yang ada, maka  pennulis  membatasi  permasalahan  yaitu: Animasi interatif ini berbasis aplikasi mengenai cara  memperbaiki  sistem  rem  pada  unit kendaraan  roda  empat.  Terdiri  dari scane keselamatan kerja, scane pendongkrakan, scane perawatan sistem rem, menu , dan scane latihan.

## HASIL DAN PEMBAHASAN

## 1.   Perancangan Story board
Storyboard  adalah  sketsa  gambar  yang disusun  berurutan  sesuai  dengan  naskah, melalui  storyboard  kita  dapat  menyampaikan ide  cerita  kita  kepada  orang  lain  dengan  lebih mudah , karena kita dapat menggiring khayalan seseorang  mengikuti  gambar  gambar  yang tersaji,  sehingga  menghasilkan  persepsi  yang sama pada ide cerita kita.
Berikut  ini  adalah  gambaran stroryboard animasi  interaktif  pembelajaran  memperbaiki sistem rem pada SMK Mekanika:
A. Storyboard Scane Menu Utama
Tabel 1. Storyboard Scene Loading VISUAL SKETSA AUDIO Saat program pertama  kali  dijalan akan muncul tampilan animasi pembuka sebelum masuk ke menu utama  pembelajaran sistem rem. Di menu utama  sistem  rem terdapat beberapa klik button yang antara lainnya: button keselamatan, button pendongkraan, button sistem  rem, button perawatan sistem  rem, button button latihan , button keluar menu, Tombol Pendongkrakan Tombol keluar Judul Menu Utama Memperbaiki Sistem rem Tombol Keselamatan Tombol Ke Menu Tombol Sistem Rem Tombol Perbaikan Tombol Latihan Buz .wav
Sumber : Peneliti

## 3.2  User Interface
Berikut  ini  adalah  tampilan  tatap  muka pengguna  ( user interface)  dari  aplikasi  media pembelajaran  multimedia  untuk  perawaran sistem rem :
Gambar 1. Tampilan Scane Menu Opening
Sumber : Peneliti
Gambar 2. Tampilan Menu keselamatan
Sumber : Peneliti
Gambar 3. Tampilan Menu Utama
Sumber : Peneliti Gambar 4. Tampilan Menu Pendongkraan Sumber : Peneliti Gambar 5. Tampilan Menu Sistem Rem
Sumber : Peneliti
Gambar  6.  Tampilan  Perawatan  Sistem
Rem
Sumber : Peneliti
Gambar 7. Tampilan Menu Latihan

## Sumber : Peneliti
3.3 State Transition Diagram Berikut state  transition diagram  dari semua scene yang terdapat pada aplikasi media
pembelajaran  multimedia animasi  interaktif pengenalan software dan hardware : Opening Kelselamatan Kerja Menu Utama
Keluar Sumber : Peneliti
Gambar 8. Halaman Opening Menu Opening Keselamatan
Ouput Menu
Utama Sumber : Peneliti Gambar 9. Halaman Menu Keselamatan
Menu Utama
Keselamatan
Pendongkrakan Sistem rem Perawatan Sistem Rem Latihan Keluar Ouput Output Ouput Output Output Sumber : Peneliti
Gambar 10. Halaman Menu Utama
Pada  scene  di  menu  utama  ini  terdapat  7 tombol  digambarkan  mengenai  isi  dari  menu materi  yang  isinya  mengenai  tombol  yaitu: pendongkrakan,  sistem  rem,  perawatan  sistem rem,wiring diagram dan latihan. Dan terdapat 1 tombol  kembali  ke  menu  keselamatan  dan  1 tombol keluar dari aplikasi.
Menu Opening Keselamatan Menu Utama Pendongkrakan Output Scane pendongkrakan Cara Pendongkrakan Keselamatan Keluar
Sumber : Peneliti Gambar 11. Halaman Menu pendongkrakan
Pada menu pendongkran terdapat 3 tombol dengan  tombol  isi  materi  yaitu:  persiapan pendongkrakan,  cara  pendongkrakan  dan  1 tombol  kembali  ke  scene  keselamatan  dan  1 tombol keluar dari aplikasi.
Opening Keselamatan Menu Utama Sistem rem Cara Kerja Sitem Rem Output Scane Cara Kerja Keselamatan Keluar
Sumber : Peneliti Gambar 12. Halaman Menu Sistem Rem
Scane di atas adalah menu dari sistem rem yang memiliki 6 tombol diantaranya yaitu: cara kerja sistem  rem,  dan  1  tombol  kembali  ke  menu kesebelumnya yaitu: keselamatan dan 1 tombol untuk keluar dari aplikasi.
Menu Opening Keselamatan Menu Utama Perawatan  Sistem Rem Pembongkaran
Pemeriksaan
Output Scane Materi Pembokaran Output Scane Pemeriksaan Keselamatan Keluar Sumber : Peneliti
Gambar 13.  Halaman Menu Perawatan Sistem Rem Menu Utama Latihan Output Sumber : Peneliti Gambar 14. Halaman Menu Latihan 3.4. Testing Testing merupakan  bagian  penting dalam  membangun  sebuah  aplikasi,  dalam  hal ini  penulis  melakukan  dua  tahap  pengujian ( testing )  yaitu  pengujian white  box dan pengujian black box .
a.
White Box Pengujian white  box dilakukan  yaitu salah  satunya  bertujuan  untuk  memberikan
jaminan  yaitu  bahwa  semua  jalur  independen pada suatu model telah digunakan paling tidak satu  kali.  Pada  tahap  pengujian  ini,  penulis menguji  perintah  prosedural  dari  keseluruhan program  secara  utuh  untuk  menjamin  operasi- operasi  internal  pada  aplikasi  berjalan  sesuai dengan sistem yang telah di rancang.
Gambar 15. Halaman Menu Latihan
Start Nama Nam a Soal = 10 Betul +10 Salah  + 0 Soal 1 Jawab Jawab Benar Score +10 Soal = 10 Nilai = Soal + Benar Nilai Ulan g End Nilai = 0 Tid ak Tid ak Ya Ya Tid ak Sumber : Peneliti Kompleksitas sisklomatis ( cyclomatic complexity )  adalah  metrik software yang menyediakan ukuran kuantitatif dari kekompleksan logikal program. Jalur independen  adalah  jalur  yang  melintasi  atau melalui  program  dimana  sekurang-kurangnya terdapat proses perintah yang baru atau kondisi yang  baru. Cyclomatic  complexity digunakan untuk  mencari  jumlah path dalam  satu flowgraph . Dapat diperoleh dengan perhitungan: V (G) = E – N + 2
Dimana :
E  =  Jumlah edge grafik  alir  yang  ditandakan dengan gambar panah
N =  Jumlah simpul grafik alir yang ditandakan dengan gambar lingkaran
Sehingga kompleksitas siklomatisnya
V(G) = 26 – 18 + 2 = 10
Basis  set  yang  dihasilkan  dari  jalur independent  secara  linier  adalah  jalur  sebagai berikut:
1. 1 – 2 – 3 – 4 – 5 – 6 – 7 – 8 – 15 – 10
2. 1 – 2 – 3 – 4 – 5 – 6 – 7 – 8 – 9 – 10
3. 1 – 2 – 3 – 4 – 5 – 6 – 7 – 8 – 9 – 10 – 11
– 12 – 13
4. 1 – 2 – 3 – 4 – 5 – 6 – 7 – 8 – 9 – 10 – 11 – 12 – 13 – 14 b. Black Box Metode pengujian Black Box
memfokuskan  pada  keperluan  fungsional  dari perangkat  lunak.  Selain  itu  metode  pengujian black  box juga  digunakan  untuk  memastikan bahwa  suatu event atau  masukan  akan menjalankan proses yang tepat dan menghasilkan output sesuai dengan rancangan yang di buat.
Sebelum animasi ini di implementasikan dalam  bentuk  program,  maka  perlu  di  rancang terlebih  dahulu.  Tahap  perancangan  bertujuan untuk  memenuhi  kebutuhan  pengguna  dan memberikan  gambaran  yang  jelas  mengenai program yang akan dibuat.
Tabel 2. Pengujian Black Box Scene Menu Utama
Sumber : Peneliti

## KESIMPULAN
Penerapan sistem informasi
multimedia  interaktif  pembelajaran  sejarah
penemuan  teknologi  ini  bertujuan  untuk mengatasi  kendala-kendala  yang  ada  pada Sekolah  Dasar  Sullamul  Istiqomah  Bekasi, sehingga dapat memaksimalkan proses kegiatan belajar  mengajarnya.  Beberapa  kesimpulan yang dapat penulis ambil, antara lain:
1. Dengan  adanya  animasi  interaktif  ini  dapat membantu dalam proses belajar.
2. Dari  kuis  ini  dapat  membantu  siswa/siswi dalam  mengasa  daya  ingat  motorik  dan materinya  juga  mudah  dimengerti  dan dipahami.
3. Siswa/siswi  mendapatkan  keuntungan  dan pengalaman belajar yang efektif, efisien, dan menyenangkan.

## REFERENSI
Adi  Kusrianto.  (2007).  Pengantar  Desain Komunikasi  Visual.  Yogyakarta:  Andi Offset
Ari  Prabawati,  Theresia.  2008.  Seri  Panduan Lengkap :  Adobe Flash Cs3 Professional. Yogyakarta: Andi. Binanto,  I.  2010.  Multimedia  Digital  Dasar Teori  +  Pengembangannya.  Yogyakarta: Penerbit Andi. Dhani,  Yudhiantoro.  2006.  Membuat  Animasi Web dengan Macromedia Flash Professional 8. Yogyakarta: Penerbit Andi Herlambang,  Ferry.  2007.  Membuat  Efek
Khusus  Dengan  Action  Script  2.0.
Surabaya : Pt. Elex Media Komputindo. Hidayatullah,  2008.  Buku  Tentang  Definisi Animasi. Jakarta: Cs Pemula. Ramadianto, 2008. Buku Pintar Cara Membuat Animasi. Jakarta: Cs Pemula. Susilana,  Riyana.  2008.  Media  Pemnbelajaran.
Bandung: CV Wacana Prima
Suhendi,  Edi.  2009.  Kreatif  Dengan  Adobe Flash  Professional.  Bandung:  Cv.  Yrama Widya.
Yudhi,  Munadi.  (2008).  Buku  Pintar  Cara Membuat Animasi. Jakarta: Cs Pemula
.