## TEKNIK ANIMASI FRAME BY FRAME PADA
KARAKTER IKAN BADUT DALAM “GAME EDUKASI:

## PETUALANGAN IKAN BADUT”
Ngakan Putu Darma Yasa 1 , I Gede Adi Sudi Anggara 2 Prodi Teknik Informatika, STMIK STIKOM Indonesia - Denpasar 1 2 *Correspondence author : Ngakan Putu Darma Yasa, darma.yasa@stiki-indonesia.ac.id, Denpasar, Indonesia
Abstrak. Game edukasi merupakan sebuah permainan digital yang diciptakan untuk membantu proses  pendidikan.  Materi  pendidikan  yang  dikemas  dalam  bentuk game bisa  berupa  materi- materi yang diajarkan di sekolah. Game edukasi saat ini semakin pesat perkembangannya karena dipengaruhi  oleh  banyak  pengembang game yang  bermunculan.  Pengembang game saat  ini didukung oleh teknologi yang maju serta teknik-teknik animasi yang beragam untuk menciptakan game .  Salah  satu  teknik  yang  digunakan  dalam Game Edukasi:  Petualangan  Ikan  Badut  adalah teknik  animasi frame  by  frame . Frame  by  frame merupakan  teknik  dalam  animasi  yang menggunakan beberapa gambar berbeda dalam setiap frame . Tujuan penelitian ini adalah untuk menerapkan teknik animasi frame by frame pada karakter game edukasi yaitu, Ikan Badut. Metode yang  digunakan  adalah  observasi,  dokumentasi  dan  implementasi.  Hasil  yang  diperoleh  yaitu implementasi  teknik  animasi frame  by  frame menggunakan  beberapa  gambar  berbeda  agar memperoleh  gerakan  animasi  Ikan  Badut.  Sketsa  desain  hingga  animasi  Ikan  Badut  langsung dikerjakan pada software pengolah animasi yaitu Adobe Flash CS6.
Kata Kunci : Teknik Animasi, Karakter, Game, Edukasi
Abstract . Educational games are a digital game that was created to help the education process. Educational  materials  packaged  in  the  form  of  games  can  be  materials  taught  in  school. Educational  games  are  currently  increasingly  rapidly  developing  because  they  are  influenced  by many game developers who have sprung up. Today's game developers are powered by advanced technology as well as diverse animation techniques for creating games. One of the techniques used in Educational Games: ClownFish Adventures is the frame by frame animation technique. Frame by frame is a technique in animation that uses several different images in each frame. The purpose of this  research  is  to  apply frame  by  frame animation  techniques  to  educational game  characters, namely, ClownFish. The methods used are observation, documentation and implementation. The result  obtained  is  the  implementation  of  frame  by  frame  animation  technique  using  several different images in order to obtain the animation movements of Clown Fish. Sketch design to clown fish animation directly done on animation processing software that is Adobe Flash CS6.
Keywords : Animation Techniques, Character, Game, Education

## Pendahuluan
Game edukasi  adalah  suatu  permainan  digital  yang  dirancang  untuk  mengedukasi seseorang tentang sebuah topik tertentu. Game edukasi dapat bermanfaat untuk membantu proses belajar anak-anak usia dini sambil bersantai. Game edukasi mampu digunakan sebagai alternatif  proses  belajar  agar  tidak  jenuh  dan  bisa  dilakukan  dalam  situasi  santai.  Materi pembelajaran yang dikemas ke dalam bentuk game, disesuaikan dengan materi pembelajaran yang diperoleh dari sekolah. Game yang dibuat dengan sistem level dan score, dapat memicu anak-anak  yang  memainkannya  untuk  menyelesaikan  setiap level dengan score tertinggi. Efektivitas game edukasi  dalam  membantu  proses  belajar  sangat  bagus  serta  mampu meningkatkan  ketertarikan  anak-anak  yang  memainkannya.  Hal  itu  disebabkan  karena game merupakan sesuatu yang bergerak, bersuara, dan beranimasi (Darmayasa 2020).
Game edukasi diciptakan melalui banyak tahapan, salah satunya adalah proses animasi. Animasi merupakan daya tarik utama dalam aplikasi multimedia interaktif salah satunya game edukasi. Animasi dapat menjelaskan sebuah konsep atau proses yang  sulit dijelaskan dengan menggunakan  media  lain.  Animasi  juga  mempunyai  daya  tarik  estetika  sehingga  akan memotivasi pengguna untuk terlibat langsung dalam proses pembelajaran (Munir 2012). Proses animasi dapat diimplementasikan pada aset-aset game, terutama pada karakter atau tokoh dari game edukasi yang diciptakan. Teknik animasi yang bisa diimplementasikan pada sebuah game sangat beragam seperti teknik frame by frame, teknik tweening , motion serta masking (I Gede Adi  Sudi  Anggara,  I  Made  Marthana  Yusa  2021).  Dalam  penelitian  ini,  penulis mengimplementasikan  teknik frame  by  frame untuk  menganimasikan  karakter  Ikan  Badut. Karakter Ikan Badut merupakan tokoh utama dalam “ Game Edukasi: Petualangan Ikan Badut”. Frame  by  frame merupakan  teknik  animasi  yang  menggunakan  susunan  beberapa  gambar berbeda dalam setiap frame .  Semakin banyak frame yang digunakan dalam proses pergerakan objek, maka animasi yang dihasilkan semakin halus (Munir 2012).
Menurut  Alberta  dan  Rahmatsyam  dalam  penelitiannya  yang  berjudul “ Perancangan Karakter Game RPG Berdirinya Kerajaan Singosari untuk Aplikasi Permainan dengan Gaya Visual Chibi ” (Lakoro 2016) menjelaskan bahwa membuat desain karakter untuk animasi atau game diperlukan beberapa unsur penting, yaitu: konsep, warna, bentuk, kesederhanaan, perpaduan, pengulangan,  dan  keunikan.  Desain  karakter  harus  mampu  tampil  dalam  bentuk  dan keunikannya  sendiri,  serta  menjaga  kesederhanaan  meski  dalam  bentuk  yang  agak  rumit, mudah diingat, dan berkesan hidup. Dalam game edukasi: Petualangan Ikan Badut, karakter ikan yang  didesain  mengimplementasikan  gaya  desain  kartun  sederhana  serta  menggunakan perpaduan warna merah dan putih mengikuti warna dari Ikan Badut.
Tujuan  penelitian  ini  adalah  untuk  menganimasikan  karakter  Ikan  Badut  menggunakan teknik  animasi frame  by  frame dalam software Adobe  Flash  CS6.  Penelitian  tentang implementasi  teknik  animasi frame  by  frame pernah  dilakukan  oleh  Eddy  Nurraharjo  dan Wiwien Hadikurniawati dengan judul “ Implementasi Frame by Frame Animation Technique pada Aktivitas Game ‘Tebak’ berbasis Android”. Dalam perancangan game tersebut dijelaskan bahwa penyisipan sebuah animasi bisa dilakukan dengan gampang jika menggunakan teknik frame by frame  animation (1 frame 1  gambar),  serta  secara  sederhana  bisa  diamati  seolah-olah  sama seperti buku yang digambari atau flipbook animation (Hadikurniawati 2015).

## Game Edukasi
Game edukasi  adalah  sebuah  permainan  digital  yang  dirancang  untuk  memberikan edukasi  kepada  seseorang  tentang  topik  tertentu.  Menurut  Kebritchi  &  Hirumi  dalam  Andri Setiawan, dkk. (2019) menerangkan bahwa Game Edukasi Digital dapat digunakan sebagai alat yang  efektif  dalam  pembelajaran  karena  menciptakan  motivasi  dan  kepuasan  pribadi,
mengakomodasi  berbagai  macam  gaya  dan  keterampilan  belajar,  memberikan  konteks interaktif  dalam  memecahkan  masalah  dan  mengedepankan  tindakan  nyata  dari  pada  hanya penjelasan.
Anik  Vega  Vitianingsih  (2016)  dalam  penelitiannya  menerangkan  bahwa game edukasi memiliki beberapa keunggulan jika dibandingkan dengan pembelajaran metode konvensional. Beberapa keunggulan tersebut adalah terdapat animasi yang mampu meningkatkan daya ingat sehingga  anak  bisa  menyimpan  materi  pelajaran  dalam  kurun  waktu  yang  lebih  lama dibandingkan  dengan  pengajaran  metode  konvensional.  Selain  itu,  menurut  Batuwael  dalam penelitian yang dilakukan oleh Yenti Juniarti, Setiyo Utoyo, Gilang Ramadan (2021), menjelaskan bahwa  dengan  bermain game edukasi  dapat  mengajak  anak  untuk  melakukan  kebiasaan- kebiasaan yang baik sesuai nilai-nilai yang terkandung dalam game edukasi yang dimainkan. Rachman  (2012)  menjelaskan  bahwa game edukasi  adalah  permainan  yang  khusus dirancang  untuk  mengedukasi  seseorang  tentang  sebuah  topik  tertentu. Game edukasi  juga dapat  membantu  orang  lain  dalam  belajar  suatu  keterampilan  sambil  bermain.  Materi pendidikan  yang  dirancang  dalam  permainan  interaktif  bertujuan  untuk  meningkatkan kecerdasan bagi pemain. Elemen dalam game edukasi berbasis pada konsep pendidikan dasar yang menggabungkan beberapa unsur, yaitu: bermain, kreativitas, keterampilan, petualangan, motivasi, logika, kegemaran, mandiri, dan keputusan. Konsep ini kemudian disesuaikan dengan klasifikasi  usia  pemain  dan  kurikulum  pembelajaran. Game edukasi  adalah  permainan digital yang  diciptakan  untuk  menyampaikan  materi  pembelajaran  dalam  dunia  pendidikan  dengan menggunakan teknologi multimedia interaktif.
Game edukasi adalah sebuah permainan yang dikemas untuk meningkatkan konsentrasi serta merangsang daya  pikir bagi  pemainnya. Game edukasi untuk membantu proses belajar mengajar merupakan salah satu cara yang tepat, karena dalam game tersebut terdapat media visual  berupa  gambar,  animasi,  audio. Game edukasi  bertujuan  untuk  mengatasi  masalah pembelajaran,  khususnya  dalam  meningkatkan  minat  belajar,  kecerdasan,  membantu perkembangan, dan meningkatkan kemampuan anak dalam proses belajar (Rahmat Kurniawan, Abdu Ghafar Razaq 2021).

## Game Edukasi: Petualangan Ikan Badut
Game Edukasi: Petualangan Ikan Badut merupakan sebuah game edukasi berbentuk dua dimensi yang bermuatan pendidikan untuk anak usia dini yaitu kelas 3 sekolah dasar. Materi pendidikan  dalam game edukasi  yaitu  tentang  penggolongan  hewan  berdasarkan  cara berkembangbiaknya. Game Edukasi: Petualangan Ikan Badut dirancang berbasis desktop, yaitu hanya bisa dimainkan dalam komputer atau laptop. Game ini menceritakan tentang seekor Ikan Badut  yang  berpetualang  di  dasar  laut.  Sambil  berpetualang,  Ikan  Badut  memakan  ikan  kecil untuk mengumpulkan nilai dan menghindari sampah yang ada di dalam lautan. Kemudian pada akhir level , Ikan Badut menemukan bintang laut dan ketika disentuh memunculkan pertanyaan tentang penggolongan hewan. Game ini terdiri dari tiga level dengan tingkat kesulitan rintangan yang berbeda serta pertanyaan yang lebih banyak setiap level -nya.
Gambar 1 Tampilan awal Game Edukasi: Petualangan Ikan Badut
Pada gambar 1 di atas merupakan tampilan awal Game Edukasi: Petualangan Ikan Badut. Terdapat animasi judul, animasi karakter Ikan Badut dan animasi ikan-ikan kecil, serta animasi tombol-tombol untuk mengatur permainan. Tombol- tombol itu terdiri dari tombol “Mainkan”, tombol “Pengaturan”, tombol “Info Pencipta”, tombol “Belajar”, tombol “Petunjuk Permainan” dan  tombol  “Keluar”.  Jika  diklik  tombol  “Mainkan”,  maka  diarahkan  la ngsung  ke  tampilan permainan  yaitu  petualangan  Ikan  Badut.  Tombol  “Pengaturan”  berfungsi  untuk  mengatur tampilan game dan mengatur suara musik latar. Tombol “Info Pecipta” menampilkan informasi pencipta game. Pada  tombol  “Belajar”  diarahkan  untuk  belajar  t erlebih  dahulu  sebelum memainkan game. Tampilan  “Petunjuk  Permainan”  digunakan  untuk  mengetahui  cara memainkan game. Pada tombol “Keluar” digunakan untuk keluar dari permainan.

## Karakter Game
Karakter/tokoh  dalam  sebuah game ,  memiliki  peranan  yang  sangat  penting.  Sebuah karakter  mampu  menjadi  daya  tarik  utama  dalam  sebuah game ,  bisa  menjadi  teman  bagi pemainnya,  serta  dapat  berperan  sebagai avatar (representasi  pemain  dalam  sebuah game ). Selain hal itu, desain karakter saat ini telah menjadi ikon atau identitas dari sebuah game yang diciptakan sekaligus menjadi bagian yang mampu memperkuat nilai jual game tersebut. Desain karakter game bersifat  artistik  dan  bisa  digunakan  sebagai  visualisasi sticker,  merchandise maupun stationary yang mampu meningkatkan daya jual game (Donny Trihanondo 2010). Karakter/tokoh  dalam game bisa  dalam  berbagai  bentuk,  seperti  manusia,  hewan, monster, atau tumbuhan. Pada game yang menjadi objek penelitian ini, karakter yang dibahas adalah Ikan Badut.
Teknik Animasi Frame by frame Frame merupakan  satuan  terkecil  dalam  sebuah  animasi  pada software Adobe  Flash. Frame berfungsi  sebagai  tempat  sebuah  gambar  yang  akan  dijadikan  animasi. Frame dapat diumpamakan seperti kertas yang sudah digambar, apabila ingin membuat animasi  dengan 5 frame artinya diperlukan 5 kertas yang sudah digambar. Animasi frame yang paling sederhana dapat dicontohkan berupa animasi flip book .
Frame by frame merupakan teknik animasi yang menggunakan susunan beberapa gambar berbeda  dalam  setiap frame .    Animasi frame adalah  bentuk  animasi  yang  sangat  sederhana. Animasi frame menampilkan  susunan  gambar  yang  diatur  secara  berurutan  atau  bergantian serta ditunjukan secara cepat. Pergantian gambar dalam animasi frame diatur dalam satuan fps ( frame  per  second ).  Dalam  sebuah  animasi,  serangkaian frame dapat  bergerak  dengan kecepatan  sekitar  24 frame per  detik.  Kecepatan  24 frame per  detik  ini  digunakan  karena merupakan ambang batas, kalau kurang dari 24 frame maka gambar yang bergerak terlihat tidak halus. Pada animasi frame by frame, setiap perubahan gerak atau bentuk sebuah objek diletakan pada frame secara berurutan. Semakin banyak frame yang digunakan dalam proses pergerakan objek, maka animasi yang dihasilkan semakin halus (Munir 2012).

## Metode
Metode yang digunakan penulis pada penelitian ini adalah observasi pada Game Edukasi: Petualangan Ikan Badut, eksperimen animasi dengan teknik frame by frame dan kepustakaan yaitu dengan mengumpulkan teori-teori yang berkaitan dengan game edukasi, karakter game serta teknik animasi frame by frame . Observasi dilakukan pada gerakan animasi karakter Ikan Badut  dan  memperhatikan  bagian-bagian  tubuh  yang  ikut  bergerak.  Setelah  melakukan observasi pada karakter Ikan Badut, selanjutnya membuat desain Ikan Badut. Ikan Badut yang sudah didesain itu kemudian dianimasikan menggunakan teknik frame by frame menggunakan software Adobe Flash CS 6. Adobe Flash CS 6 merupakan salah satu software yang diciptakan untuk  membuat  desain  dan  animasi  vektor  dalam  bentuk  2  dimensi.  Implementasi  teknik animasi frame by frame disesuaikan dengan gerakan ikan pada game .

## Hasil dan Pembahasan

## Konsep Desain Karakter Ikan Badut
Konsep  dasar  merupakan  langkah  awal  dalam  proses  mendesain  karakter  Ikan  Badut. Konsep yang digunakan adalah ilustrasi kartun vektor dengan gambar yang dihasilkan terlihat lebih  jelas  dan  kartun  memiliki  kesan  lucu,  sederhana  serta  menarik  sehingga  mudah  untuk dikenali  oleh  anak-anak.  Warna  yang  digunakan  untuk  desain  Ikan  Badut  adalah  warna  yang menyesuaikan dengan ikan aslinya yaitu merah, hitam dengan baris putih.

## Desain Karakter Ikan Badut
Ikan Badut menjadi semakin dikenal ketika pertama kali muncul pada tahun 2003 sebagai tokoh  utama  dalam  sebuah  film  animasi  ciptaan  sutradara  Andrew  Stanton  yang berjudul Finding Nemo . Film animasi ini berkisah tentang seekor anak ikan badut yang bernama Nemo  hilang  tertangkap  jaring  nelayan  di Great  Barrier  Reef ,  Queensland  ketika  sedang bermain. Ikan badut atau clownfish berasal dari keluarga P omacentridae yang terdiri dari dua jenis  yaitu Premnas dan Amphiprion .  Khusus  jenis  Premnas  hanya  ditemukan  satu  jenis yaitu Premnas biaculeatus biasa dikenal dengan sebutan ikan badut merah maroon. Ikan badut hidup bersimbiosis dengan anemon laut. Anemon laut memberi tempat tinggal untuk ikan badut dan  ikan  badut  ikut  membantu  mengusir  ikan  kupu-kupu  ( butterfly  fish )  yang  mencoba memakan tentakel anemon. Berdasarkan penelitian terbaru memperlihatkan bahwa ikan badut mengeluarkan sisa pencernaan yang dapat digunakan oleh anemon laut sebagai nutrisi penting dan  sebagai  gantinya,  ikan  badut  bisa  bersarang  diantara  tentakel  anemon  yang  menyengat sebagai perlindungan (SORONG and LAUT 2018).
Menurut William dalam penelitian yang dilakukan oleh Ika Yulianti berjudul “ Perancangan Desain  Karakter  Jole  Berbasis  Lokal  Flores,  Indonesia ”  menjelaskan  bahwa  dalam  proses membuat animasi dilakukan beberapa tahapan sederhana namun sesuai urutan (Yulianti 2021). Sketsa dasar karakter digunakan pada tahapan awal dari hasil analisa yang sudah dilakukan. Kata dasar  sketsa  dalam  kamus  Bahasa  Indonesia  berarti  lukisan  cepat  atau  rancangan.  Sketsa menjadi proses awal dalam menganalisa data dan imajnasi dari creator.
Sketsa  sangat  penting  dalam  proses  pembuatan  desain  karakter.  Ketika  mendesain sebuah karakter diperlukan proses penelitian terlebih dahulu pada subjek yang akan dijadikan referensi. Selain untuk memahami secara mendalam karakter yang dibuat, juga bertujuan untuk memberikan ‘jiwa’ pada karakter yang dianimasikan. Dalam membuat sketsa karakter , biasanya dituangkan dalam bentuk model sheet . Model Sheet merupakan sebuah lembaran yang berisi berbagai  macam  rencana  pergerakan,  posisi,  serta  tampilan  karakter  dari  berbagai  sudut pandang. Dalam proses pembuatan sebuah desain karakter harus memiliki data-data yang valid dan dapat dipertanggungjawabkan untuk bisa diaplikasikan ke dalam karakter animasi . Target audience dan value  proportition juga  perlu  diperhatikan,  karena  dalam  suatu  karya,  karya tersebut harus bisa memberikan manfaat dan memiliki arti yang baik bagi dunia animasi dan masyarakat.  Perancangan  sebuah  desain  karakter  juga  perlu  menggunakan  elemen-elemen visual  seperti  struktur  garis,  tekstur,  bentuk  dan  warna  (I  Gede  Adi  Sudi  Anggara,  I  Made Marthana Yusa 2021).
Karakter  Ikan  Badut  merupakan  karakter  hewan  yang  diimplementasikan  ke  dalam sebuah game . Desain Ikan Badut dengan gaya kartun dibuat menggunakan Adobe Flash CS6. Adobe  Flash  CS6  merupakan  salah  satu  produk  perangkat  lunak  dari  perusahaan  Adobe  di Amerika  Serikat  yaitu  Adobe  System  Incorporated.    Adobe  Flash  CS6  merupakan  aplikasi pengembangan dari software pendahulunya yaitu Adobe Flash CS 3, 4, dan 5. Adobe Flash CS6 biasa  digunakan  oleh  animator  untuk  membuat  animasi  vektor  sekaligus  menggambar (Komputer 2010). Proses desain karakter dipisahkan setiap bagian dari ikan yang digerakkan. Proses pemisahan ini dilakukan agar proses menganimasikan menjadi lebih mudah.
Gambar 2 Proses desain karakter Ikan Badut
Pada  gambar  2  di  atas  merupakan  hasil  sketsa  dari  Ikan  Badut.  Proses  sketsa  hingga mewarnai  menggunakan software Adobe  Flash  CS6.  Setiap  bagian  yang  dianimasikan  dibuat terpisah tetapi tetap dalam satu layer. Bagian yang dianimasikan dijadikan satu symbol movie clip, kemudian di dalam movie clip tersebut dianimasikan setiap bagiannya. Setiap bagian yang beranimasi dibuatkan berbeda layer di dalam symbol movie clip Ikan Badut.

## Elemen Desain Grafis pada Karakter Ikan Badut
Elemen  desain  merupakan  hal  terpenting  dalam  desain  grafis  yang  akan  mewujudkan prinsip  desain.  Menurut  Ricky  (2020)  dalam  bukunya  menyebutkan  bahwa  ada  lima  elemen desain, yaitu: garis, bentuk, warna, tekstur, dan format. 1. Garis
Garis adalah  tanda yang  dibuat oleh sebuah alat  menggambar seperti pensil.  Garis juga  dapat  disebut  sebagai  titik-titik  yang  bergerak  dan  dapat  menyimpulkan  ungkapan emosi  manusia  yang  dialaminya.  Penerapan  garis  pada  desain  karakter  ikan  badut, dimplementasikan ketika membuat sketsa desain.
2. Bentuk
Bentuk  merupakan  gambaran  sesuatu  yang  diwujudkan  oleh  garis.  Garis  dapat digunakan untuk menggambarkan bentuk yang datar, seperti: lingkaran, silinder atau kubus. Bentuk dapat diisi dengan warna atau tekstur. Bentuk dapat dimplementasikan pada setiap bagian dari karakter ikan badut seperti lingkaran untuk membuat bagian mata, mulut hingga badan ikan.
3. Warna
Warna  merupakan  elemen  grafis  yang  kuat  dan  provokatif.  Ketika  multimedia dirancang sesuai dengan warna yang disukai dari target atau pasar maka akan memberikan keunggulan bersaing dalam promosi. Warna merah, dilengkapi dengan garis hitam dan putih diterapkan pada karakter ikan badut sesuai dengan warna aslinya.
4. Tekstur
Tekstur  merupakan  kualitas  permukaan  suatu  bentuk  atau  benda.  Tekstur  dapat dikategorikan  menjadi  dua,  yaitu  tekstur tactile dan  tekstur  visual.  Tekstur tactile adalah nyata  dapat  dirasakan  kualitas  permukaan  benda,  sedangkan  tekstur  visual  adalah  ilusi, tekstur tersebut memberikan impresi yang sederhana dari tekstur yang nyata.
5. Format
Format terdiri ukuran dan ilustrasi. Promosi dengan ukuran yang besar dapat menarik lebih  banyak  perhatian  dibandingkan  dengan  promosi  yang  kecil.  Format  ilustrasi  dari karakter  ikan  badut  yang  diciptakan  adalah  vektor .fla serta  diwujudkan  dalam  bentuk animasi . swf .

## Prinsip Dasar Desain Grafis pada Karakter Ikan Badut
Prinsip  dasar  desain  grafis  berfungsi  untuk  menghasilkan  desain  yang  baik.  Menurut (2020) dalam bukunya mengatakan bahwa bagian dari prinsip desain itu adalah keseimbangan, ritme dan kesatuan.
1. Prinsip Keseimbangan
Kesimbangan  adalah  kesamaan  distribusi  dalam  bobot  yang  merupakan  daya  tarik dari desain. Mendesain dalam keseimbangan cenderung merasakan keterkaitan, kelihatan bersatu dan perasaan harmonis. Prinsip keseimbangan diterapkan pada karakter ikan badut yaitu terlihat pada komposisi di bagian badan karakter ikan itu sendiri seperti dari kedua sirip ikan yang memiliki ukuran sama.
2. Prinsip Ritme
Dalam desain grafis ritme merupakan pola yang diciptakan dengan mengulang atau membuat variasi elemen yang lebih banyak dengan pertimbangan terhadap ruang yang ada. Kesuksesan menampilkan ritme dalam desain grafis adalah memahami perbedaan antara pengulangan  dan  variasi.  Pengulangan  yaitu  mengulang  elemen  visual  yang  sama  secara konsisten,  sedangkan  variasi  melakukan  perubahan  pada  sejumlah  elemen  visual.  Ritme yang diterapkan pada karakter kan badut yaitu terletak pada pemberian corak ikan atau sisik ikan yang diulang sesuai dengan ruang yang tersedia.
3. Prinsip Kesatuan
Prinsip kesatuan dalam desain grafis adalah prinsip mengorganisasi seluruh elemen dalam  suatu  tampilan  grafis.  Untuk  dapat  menyatukan  seluruh  elemen  tersebut,  terlebih dahulu  harus  dipahami  tentang  garis,  bentuk,  warna,  tekstur  dan  keseimbangan.  Prinsip kesatuan diterapkan pada ikan badut mulai dari pembuatan sketsa desain, penggabungan garis  sehingga  membentuk  desain  ikan  kemudian  diberikan  pewarnaan  sesuai  dengan konsep.

## Implementasi Teknik Animasi Frame by Frame
Pada tahapan ini penulis melakukan observasi terlebih dahulu pada karakter Ikan Badut dalam game edukasi:  Petualangan  Ikan  Badut  untuk  memperoleh  bagian-bagian  yang bergerak/beranimasi. Dari proses tersebut didapatkan bagian-bagian yang bergerak/beranimasi yaitu; mata, mulut, sirip dada, sirip punggung, serta ekornya. Dari observasi karakter didapatkan rencana animasi seperti tabel 1 di bawah.

## Tabel 1 Rencana animasi pada karakter Ikan Badut
Bagian yang dianimasikan  Bagian yang bergerak Hasil gerakan Bagian badan Sirip dada Naik turun Sirip punggung Bergerak ke kanan dan ke kiri Ekor Bergerak ke kanan dan ke kiri Bagian wajah Mata Berkedip Mulut Mengecil dan membesar
Gambar 3 Bagian ikan yang dianimasikan
Pada gambar 3 di atas, dapat didesain bagian-bagian dari Ikan Badut yang diuji animasikan menggunakan Adobe Flash CS6. Ada lima bagian yang dianimasikan, yaitu: bagian mata, mulut, sirip punggung, ekor dan sirip dada. Semua bagian tersebut dianimasikan menggunakan teknik animasi frame by frame.

## Gerakan Sirip Dada
Setelah  selesai  menentukan  rencana  bagian-bagian  yang  dianimasikan,  selanjutnya dilakukan proses animasi. Dimulai dari pergerakan sirip dada pada Ikan Badut. Kedua sirip Ikan Badut yaitu bagian kanan dan kiri dianimasikan menggunakan teknik frame by frame dengan komposisi 24 fps ( frame per second ) . Sebelum menganimasikan sirip, ditentukan terlebih dahulu posisi bagian titik koordinat pada objek seperti gambar 4 di bawah.
Gambar 4 Menentukan titik koordinat pada bagian Sirip Dada
Pada gambar 4 posisi titik koordinat ditunjukkan dengan tanda panah dan sudah diatur agar  tepat  berada  pada  bagian  ujung  atas  sirip  yang  dekat  dengan  badan  ikan.  Fungsi  dari pengaturan titik koordinat tersebut adalah untuk menentukan arah animasi sirip ikan. Setelah selesai pengaturan titik koordinat, dilanjutkan dengan proses pergerakan serta menambahkan keyframe yang diperlukan.
Gambar 5 Proses animasi Frame by Frame bagian Sirip Dada
Pada  gambar  5  di  atas,  bagian  sirip  dada  Ikan  Badut  memerlukan  dua  belas  gambar dengan gerakan atau posisi yang berbeda sehingga memperoleh animasi sirip naik dan turun. Dari dua belas gambar tersebut dapat ditambahkan dua belas keyframe untuk menempatkan setiap  gambarnya.  Proses  menambahkan keyframe dalam  animasi  sirip  dada,  diberikan  satu frame kosong agar animasinya bisa menyesuaikan dengan pergerakan ikan. Animasi sirip dada yang dihasilkan tidak terlalu cepat atau tidak terlalu lambat. Penambahan satu keyframe kosong bisa dilihat pada gambar 6 di bawah.
Gambar 6 Proses menambahkan satu frame kosong

## Gerakan Sirip Punggung
Gerakan sirip punggung dianimasikan ke kanan dan kiri atau maju mundur mengikuti arah berenang  ikan  itu  sendiri.  Pada  bagian  sirip  punggung  Ikan  Badut,  diperlukan  tujuh  gambar dengan gerakan berbeda serta diperlukan tujuh keyframe untuk menempatkan setiap gambar. Untuk proses animasi sirip punggung bisa dilihat pada gambar 7 di bawah. Pada animasi sirip punggung juga diberikan satu frame kosong untuk pemisah seperti gambar 8 di bawah.
Gambar 7 Proses animasi Frame by Frame bagian Sirip Punggung
Gambar 8 Proses menambahkan keyframe bagian Sirip Punggung

## Gerakan Ekor
Ekor pada ikan mampu memberikan gaya dorong serta menambah kecepatan ketika ikan berenang.  Gerakan  ekor  pada  Ikan  Badut  dianimasikan  ke  kanan  dan  kiri.  Pada  bagian  ekor, diperlukan  tujuh  gambar  dengan  gerakan  berbeda.  Untuk  menganimasikan  bagian  ekor, diperlukan  tujuh keyframe dengan  diberikan  satu frame kosong . Pada  gambar  9  di  bawah merupakan proses penerapan animasi bagian ekor Ikan Badut.
Gambar 9 Proses animasi Frame by Frame bagian Ekor
Gambar 10 Proses menambahkan keyframe bagian Ekor

## Gerakan Mata
Gerakan mata berkedip dianimasikan dengan menggunakan dua keyframe yaitu keyframe untuk  gambar  mata  terbuka  dan keyframe untuk  mata  tertutup.  Pada  gambar  11  di  bawah merupakan hasil dari penerapan animasi mata berkedip menggunakan dua keyframe. Gambar mata terbuka diposisikan pada keyframe 1 kemudian ditambahkan keyframe pada frame ke 20 untuk menempatkan gambar mata tertutup.
Gerakan mata berkedip pada Ikan Badut diberikan spasi antar frame dari frame 1 ke frame 20 agar kedipan mata ikan tidak terlalu cepat. Gerakan kedipan hanya dianimasikan pada bola mata bagian dalam.

## Gerakan Mulut
Gerakan  mulut  pada  ikan  yang  selalu  membuka  dan  menutup  memiliki  tujuan  untuk bernafas.  Ketika  air  masuk  ke  dalam  mulut  ikan,  maka  pembuluh  darah  dalam  insang  akan mengambil oksigen yang ada dalam air dan diteruskan ke seluruh tubuh ikan. (Dewi Syahidah, Indah Mastuti, Cindy Christine Mudeng 2019).
Gambar 12 Contoh uji animasi mulut Ikan Badut dengan Frame by Frame
Pada  gambar  12  di  atas  merupakan  proses  menganimasikan  mulut  Ikan  badut.  Pada gerakan  mulut  Ikan  Badut,  dianimasikan  mengecil  dan  membesar  menggunakan  sepuluh keyframe . Terdapat sepuluh gambar dengan ukuran mulut yang berbeda setiap frame.

## Hasil Uji Animasi dengan Teknik Frame by Frame
Dari proses uji animasi di atas yang diterapkan penulis pada karakter Ikan badut, diperoleh hasil  bahwa  gerakan  setiap  bagian  badan  ikan  sudah  berhasil  dianimasikan  dengan  baik menggunakan  teknik  animasi frame  by  frame. Setiap  bagian  badan  yang  dianimasikan memerlukan  jumlah keyframe yang  berbeda.  Perbedaan  jumlah keframe tersebut  diperlukan untuk  mengatur  pergerakan  setiap  anggota  badan  yang  digerakkan.  Sehingga  menghasilkan pergerakan yang tidak terlalu cepat atau tidak terlalu lambat. Untuk gambaran keyframe yang digunakan penulis rangkum dalam tabel 2 di bawah.
Tabel 2 Hasil uji animasi karakter Ikan Badut dengan Teknik Frame by Frame Hasil gerakan Bagian yang bergerak Status Frame yang diperlukan Naik turun Sirip dada Beranimasi dengan baik Dua belas keyframe dengan satu frame kosong sebagai pemisah Bergerak ke kanan dan ke kiri Sirip punggung Beranimasi dengan baik tujuh keyframe dengan satu frame kosong sebagai pemisah Bergerak ke kanan dan ke kiri Ekor Beranimasi dengan baik tujuh keyframe dengan satu frame kosong sebagai pemisah Bagian wajah Mata Beranimasi dengan baik dua keyframe dengan jarak frame yang disesuaikan agar kedipan mata tidak terlalu cepat Mulut Beranimasi dengan baik sepuluh keyframe

## Simpulan
Berdasarkan penelitian teknik animasi frame by frame pada karakter Ikan Badut, penulis dapat simpulkan beberapa hal, yaitu: 1) setiap gerakan bagian badan ikan memerlukan banyak frame agar  dapat  beranimasi.  2)  semakin  banyak frame yang  digunakan,  maka  animasi  akan semakin halus. 3) memerlukan banyak gambar yang berbeda dalam membuat animasi frame by frame .  4)  setelah  dilakukan  penambahan frame dan  gambar  berbeda,  didapatkan  bahwa animasi setiap bagian badan ikan bergerak dengan baik sesuai keperluan dalam game edukasi. Pada bagian proses pembuatan desain karakter, diterapkan elemen-elemen desain grafis serta prinsip dasar desain agar mendapatkan hasil yang sesuai dengan konsep awal perancangan.

## Daftar Pustaka
Andri  Setiawan,  Henry  Praherdhiono,  Sulthoni.  2019.  “Penggunaan  Game  Edukasi  Digital Sebagai Sarana Pembelajaran Anak Usia Dini.” Jurnal Inovasi Teknologi Pembelajaran Vol 6: 41.
Anik Vega Vitian ingsih. 2016. “Game Edukasi Sebagai Media Pembelajaran Pendidikan Anak Usia Dini.” Jurnal INFORM Vol. 1: 25.
Darmayasa, Ngakan Putu. 2020. “Game Edukasi Dua Dimensi Pengenalan Hewan Berdasarkan Cara Berkembangbiaknya.” Tanra 8.
Dewi  Syahidah ,  Indah  Mastuti,  Cindy  Christine  Mudeng,  Ketut  Mahardika.  2019.  “Respon Tingkah  Laku  Ikan  Cantang  (Ephinephelus  Fuscoguttatus-Lanceolatus)  Terhadap Anesthesia.” Prosiding Seminar Nasional MIPA UNIBA .
Donny Trihanondo, Irfansyah. 2010. “ Karakter Game Berbasis Tokoh Raut Golek Sunda .” Jurnal Komunikasi Visual & Multimedia 2.
Hadikurniawati, Eddy Nurraharjo dan Wiwien. 2015. “Implementasi Frame by Frame Animation Technique  Pada  Aktivitas  Game  ‘Tebak’  Berbasis  Android.” Jurnal  Teknologi  Informasi DINAMIK 20: 6.
I Gede Adi Sudi Anggara, I Made Marthana Yusa, I Nyoman Jayanegara. 2021. “ Implementasi Rigging pada Karakter ‘I Angsa’ dalam Film Animasi 2D ‘I Empas Teken I Angsa.’” Jurnal Desain, 8 (3): 249-261. http://dx.doi.org/10.30998/jd.v8i3.9366
Komputer, Wahana. 2010. Tutorial 5 Hari Menguasai Adobe Flash CS4 . Semarang: Andi Offset.
Lakoro,  Alberta  Berlian  Pusposari  dan  Rahmatsyam.  2016.  “Perancangan  Karakter  Game  RPG
Berdirinya  Kerajaan  Singosari  Untuk  Aplikasi  Permainan  Dengan  Gaya  Visual  Chibi.” JURNAL SAINS DAN SENI ITS 5: 6.
Loka Pengelolaan SD Pesisir & Laut Sorong, and Direktorat Jenderal Pengelolaan Ruang Laut.
2018.  “Tentang  Ikan  Badut  (Amphiprioninae)  Yang  Menggemaskan.”  2018. https://kkp.go.id/djprl/lpsplsorong/artikel/5457-tentang-ikan-badut-amphiprioninae- yang-menggemaskan.
Munir. 2012. Multimedia Konsep & Aplikasi dalam Pendidikan . Bandung: Alfabeta.
Rachman,  Sielvia.  2012.  “Perancangan  Mobile  Game  Edukatif  ‘Mewarnai  Gambar’  Dengan Adobe Flash Cs5.” Repository.Amikom.Ac.Id .
Rahmat  Kurniawan,  Abdu  Gh afar  Razaq,  Evy  Poerbaningtyas.  2021.  “PERANCANGAN  BOARD GAME  SEBAGAI  MEDIA  PENUNJANG  UNTUK  MENINGKATKAN  MINAT  KEGIATAN EKSTRAKURIKULER  PRAMUKA  PENGGALANG  SISWA  SEKOLAH  DASAR.” Jurnal  Desain, UNindra PGRI 8.
Ricky, Putra W. 2020. Pengantar Desain Komunikasi Visual Dalam Penerapan . Yogyakarta: Andi Offset.
Yenti  Juniarti,  Setiyo  Utoyo,  Gilang  Ramadan.  2021.  “Pengembangan  Aplikasi  Game  Edukasi Dalam Membentuk Karakter Anak.” Jurnal Widya Wacana 16.
Yulianti, Ika. 2021. “ Perancangan Desain Karakter Jole Berbasis Lokal Flores, Indonesia .” Journal of Animation & Games Studies 7.