8

BAB II

LANDASAN TEORI

2.1. Konsep Dasar Program

Program adalah konsep kerja sebuah komponen yang terdapat input, proses dan

output, data yang diinput baik itu secara langsung maupun tidak langsung menurut

lamhot (2015:2)

Dalam pembahasan tugas akhir ini penulis menggunakan Adobe Flash CS6

sebagai alat pembantu mendesain. Pada konsep dasar program yang penulis buat ini

berlandaskan referensi dari jurnal dan buku yang telah teruji kebenarannya sesuai

dengan ketentuan yang ada yaitu:

2.1.1. Animasi Interaktif

Animasi interaktif ialah system media penyampaian yang menyajikan materi

video rekaman dengan pengendalian komputer kepada penonton yang tidak hanya

mendengar dan melihat tetapi juga memberikan respon yang aktif. Sedangkan menurut

para ahli animasi interaktif dalah sebagai berikut :

Menurut (faris & Ade Fitria Lestari, 2016) “Animasi interaktif adalah media

untuk mengubah sesuatu, dari sebuah imajinasi, ide, konsep, visual sampai akhirnya

memberi pengaruh kepada dunia tidak hanya pembatas dalam dunia animasi”.

Menurut (faris & Ade fitria Lestari, 2016) ”Media interaktif merupakan system

media penyampaian yang menyajikan materi video rekaman dengan pengendalian

computer kepada penonton yang tidak hanya mendengar dan melihat video dan suara,

9

tetapi juga memberikan respon yang aktif dan respon itu yang menentukan kecepatan

dan skuensi penyajian”

”Animasi interaktif adalah kumpulan gambar garis teks atau unsur

pembentukan objek lain yang memberikan efek gerakan atau suara sehingga pengguna

dapat menerima pesan-pesan yang disampaikan dan dapat melakukan timbal balik

pada animasi.”(yudhistira januar rizki, 2019)

Berdasarkan definisi atau pendapat para ahli maka dapat disimpulkan bahwa

animasi interaktif adalah suatu animasi yang dinamis, yaitu dapat melakukan

komunikasi dengan pengguna animasi tersebut. Animasi interaktif memberikan

tampilan yang lebih menarik, pada animasi interaktif pergerakan objek mengikuti

perintah yang diberikan oleh pengguna melalui perangkat komputer.

2.1.2. Animasi

Menurut (Firmantoro, Anton, & Nainggolan, Rikardo, 2016) “Animasi adalah

sebuah proses merekam dan memainkan kembali serangkaian gambar pergerakan”.

“Animasi itu sendiri memiliki arti gambar dua dimensi yang seolah-olah

bergerak karena kelemahan mata yang selalu menyimpan atau mengingat di otak,

imajinasi yang terlihat sebelumnya”. (yudhistira januar rizki, 2019)

Sedangakan menurut (Rochman & Subiyantoro, 2015) ”Membicarakan

animasi seperti membayangkan masa kecil kita yang penuh dengan impian tentang

dunia fantasi yang semuanya tampak seolah-olah hidup dan ada di sekeliling kita.

Dengan imajinasi, kita bisa merestrukturisasi realitas dengan menggunakan benda-

benda yang ada di sekeliling kita, seperti gambar, mainan, boneka, atau benda lainnya

sehingga mereka seolah-olah hidup di dunia yang kita ciptakan”.

10

Berdasarkan definisi atau pendapat yang dipaparkan oleh para ahli maka dapat

disimpulkan bahwa animasi merupakan kumpulan dari gambar-gambar yang bisa

bergerak yang tersusun secara teratur mengikuti alur pergerakan yang dilakukan pada

setiap pertambahan hitungan waktu yang terjadi.

2.1.3. Huruf Hijaiyyah

Dalam kamus besar Bahasa Indonesia kata hijaiyah berarti "system aksara arab

atau abjad arab". Sedangkan menurut para ahli adalah sebagai berikut:

Menurut Abdul Hidayat, Amsyaruddin, Sopandi dalam (Indriyani, 2018)

dalam jurnalnya mengemukakan: “huruf hijaiyah merupakan huruf yang dipakai di

Timur Tengah atau Arab Saudi dan sekitarnya. Huruf ini dikenal juga sebagai huruf

kitab suci Al-Qur’an, sehingga huruf ini hampir dikenal oleh seluruh dunia”. Kegiatan

belajar mengajar yang hanya mengandalkan alat tulis kadang membuat anak merasa

jenuh, tidak fokus dan sulit mengahafal apa yang diajarkan orang tua dan guru.

Sedangkan menurut (Rezeki, 2016) “Huruf adalah unsur yang merangakai kata

yang tidak dipahami maknanya sebelum terangkai dengan unsur lain”. Dari pengertian

diatas, maka dapat dipahami bahwa huruf adalah sesuatu unsur yang tidak akan

sempurna maknanya kecuali bila sudah berhubungan dengan yang lain.

Berdasarkan definisi atau pendapat para ahli maka dapat disimpulkan bahwa

huruf hijaiyah adalah huruf alfabet arab atau abjad arab yang terdapat dalam al-Qur'an,

yang berjumlah dari 28 huruf tunggal dari alif sampai ya,yang tidak akan sempurna

maknanya jika tidak berhubungan satu sama lain.

11

2.1.4. Multimedia

Multimedia adalah penggunaan komputer yang sering digunakan dalam dunia

informatika. Selain dari dunia informatika, multimedia juga diadopsi oleh dunia game,

dan juga untuk membuat website. Sedangkan menurut para ahli multimedia adalah

sebagai berikut :

Menurut (Ariyanti & Misriani, 2016) multimedia adalah “gabungan video,

audio, grafik, dan teks dalam suatu produksi bertingkat berbasis komputer yang dapat

dialami secara interaktif. Untuk membuat sebuah media pembelajaran maka

dibutuhkan beberapa objek multi media. Objek-objek dalam multimedia diantaranya

teks, image, animasi, audio, video, dan interactive link”.

Sedangkan menurut (Firmantoro et al., 2016) “multimedia adalah media yang

menggabungkan dua unsur atau lebih yang terdiri dari teks, grafis, gambar, foto, audio

dan animasi. Sedangkan pembelajaran adalah proses penciptaan lingkungan terjadinya

proses belajar. Maka dari kedua konsep tersebut, multimedia pembelajaran diartikan

sebagai aplikasi multimedia dalam proses pembelajaran”.

Berdasarkan definisi atau pendapat para ahli diatas maka dapat disimpulkan

bahwa multimedia adalah kumpulan berbagai alat atau unsur lainnya yang berguna

untuk menghasilkan sebuah animasi yang bergerak, sehingga dapat saling ber interaksi

satu sama lain.

2.2. Peralatan Pendukung

2.2.1. Tools Animasi

Tool dapat diartikan sebagai benda atau alat yang digunakan untuk

mengerjakan atau membuat sesuatu. Tool animasi adalah kumpulan dari berbagai alat

12

yang terdapat didalam program aplikasi alat-alat tersebut digunakan dalam proses

pembuatan animasi.

2.2.2. Adobe flash

Menurut (Firmantoro et al., 2016) ”Adobe Flash merupakan aplikasi multiguna

yang dapat dimanfaatkan untuk berbagai macam kebutuhan. Dengan berbagai fitur

canggih yang ada didalamnya sangat membantu membuat beragam animasi”.

Sedangkan menurut wahana computer dalam jurnal (Rosmaidah & Destiana,

2017) Adobe flash adalah program yang memiliki banyak fungsi, seperti pembuatan

animasi objek, membuat persentasi, animasi iklan, game, pendukung animasi halaman

web, hingga dapat digunakan untuk pembuatan film animasi.

Menurut Macdoms dalam jurnal (yudhistira januar rizki, 2019) menyatakan

bahwa, “Adobe Flash adalah salah satu perangkat lunak komputer unggulan Adobe

sistem, digunakan untuk membuat gambar vector maupun animasi gambar”. Di dalam

Flash, kita bisa memasukan rumus fisika, matematika, atau rumus- rumus lainnya

dalam bentuk Action Script.

Menurut Jibril (2014:3) “Adobe Flash adalah suatu program animasi grafis yang

banyak digunakan oleh designer untuk menghasilkan karya-karya profesional, terlebih

pada bidang animasi”.

Adobe Flash merupakan sebuah program yang didesain khusus oleh Adobe dan

program aplikasi standar authoring tool professional yang digunakan untuk membuat

animasi dan bitmap yang sangat menarik untuk keperluan pembangunan situs web

yang interaktif dan dinamis. Flash didesain dengan kemampuan untuk membuat

animasi 2 dimensi yang handal dan ringan sehingga flash banyak digunakan untuk

13

membangun. dan memberikan efek animasi pada website, CD Interaktif dan yang

lainnya. Selain itu aplikasi ini juga dapat digunakan untuk membuat animasi logo,

movie, game, pembuatan navigasi pada situs web, tombol animasi, banner, menu

interaktif-interaktif form isian, e-card, screen saver dan pembuatan aplikasi-aplikasi

web lainnya. Dalam Flash, terdapat teknik-teknik membuat animasi, fasilitas action

script, filter, custom easing dan dapat memasukkan video lengkap dengan fasilitas

playback FLV. Keunggulan yang dimiliki oleh Flash ini adalah ia mampu diberikan

sedikit code pemograman baik yang berjalan sendiri untuk mengatur animasi yang ada

didalamnya atau digunakan untuk berkomunikasi dengan program lain seperti HTML,

PHP, dan Database dengan pendekatan XML, dapat dikolaborasikan dengan web,

karena mempunyai keunggulan antara lain kecil dalam ukuran file outputnya.

Flash tidak hanya digunakan untuk aplikasi web, tetapi juga dapat dikembangkan

untuk membangun aplikasi desktop karena aplikasi Flash selain dikompilasi menjadi

format swf, Flash juga dapat dikompilasi menjadi format exe, Flash juga berisi bahasa

skrip yang diberi nama “ActionScript” berikut adalah penjelasan dari beberapa

tampilan gambaran yang terdapat pada aplikasi Adobe Flas CS6 yaitu:

Gambar II.1

Tampilan jendela kerja Adobe Flash CS6

14

Tampilan area kerja flash dapat di ubah disesuaikan dengan penggunaan melalui

pilihan menu workspace. Tool yang terdapat didalam flash memiliki fungsi yang

berbeda. Berikut penjelasanya:

1. ActionScript

Berfungsi menampilkan tabulasi atau lembar kerja dari penulisan kode.

Gambar II.2

Tampilan jendela ActionScript Adobe Flash CS6.

2. Tabulasi Dokumen

Berfungsi menampilkan tabulasi dari lembar kerja atau stage yang sedang

dikerjakan. Sering juga disebut Documet Tab.

Gambar II.3

Tampilan jendela Tabulasi Dokumen Adobe Flash CS6

15

3. Batang Menu

Batang ini berisi deretan menu perintah, yang di dalamnya berisi sub-sub

perintah sesuai dengan kegunaan masing-masing.

Gambar II.4

Tampilan jendela Batang Menu Adobe Flash CS6

4. Scale View

Berfungsi mengatur presentase besarnya tampilan stage atau lembar kerja.

Gambar II.5

Tampilan jendela Scale View Adobe Flash CS6

5. Motion Presets

Berfungsi menampilkan kumpulan dan pergerakan animasi yang telah

disediakan secara default dan dapat diaplikasikan secara langsung pada image yang

berada di dalam layer.

Gambar II.6

Tampilan jendela Motion Presets Adobe Flash CS6

16

6. Info

Berfungsi menampilkan informasi tentang panjang, lebar, posisi dan kode

warna dari sebuah objek gambar yang dibuat di dalam layer.

Gambar II.7

Tampilan jendela Info Adobe Flash CS6

7. Swathes

Berfungsi menampilkan kumpulan warna yamg digunakan untuk mewarnai

pembuatan gambar animasi.

Gambar II.8

Tampilan jendela Swatches Adobe Flash CS6

17

8. Color

Berfungsi menampilkan jenis warna yang berasal dari kumpulan warna dasar

dan atribute pengkodean dari sebuah warna.

\

Gambar II.9

Tampilan jendela Clor Adobe Flash CS6

9. Workspace

Berisi deretan menu perintah yang digunakan untuk merubah tampilan area

kerja pada program adobe flash.

Gambar II.10

Tampilan jendela Workpaces Adobe Flash CS6

18

10. Propertis

Berisi tentang pengaturan-pengaturan yang digunakan untuk pengenalan

dengan memberikan sebuah penamaan dari setiap objek gambar. Penamaan dari

objek dari setiap gambar harus bersifat unik (tidak sama) untuk mencegah terjadinya

error pada animasi yang akan dibuat.

Gambar II.11

Tampilan jendela Propertis Adobe Flash CS6

11. Timeline

Berfungsi menampilkan bagian yang digunakan untuk mengatur dan

mengontrol dokumen dalam layer dan frame.

Gambar II.12

Tampilan jendela Timeline Adobe Flsh CS6

19

12. Compiler Erorrs

Berfungsi menampilkan pesan kesalahan dari penulisan ActionScript

Gambar II.13

Tampilan jendela Compiler Errors Adobe Flash CS6

13. Monitor Editor

Berfungsi menampilkan bagian yang gunakan untuk mengatur dan mengontrol

pergerakan image yang berada didalam frame.

Gambar II.14

Tampilan jendela Motion Editor Adobe Flash CS6

20

14. Code Snipets

Berisi kumpulan ActionScript yang telah disediakan secara default untuk

memudahkan penulisan kode didalam pembuatan animasi.

Gambar II.15

Tampilan jendela Code Snippets Adobe Flash CS6

15. Transform

Berisi kumpulan alat yang di gunakan untuk merubah ukuran dan rotasi sebuah

objek gambar yang dibuat di dalam layer.

Gambar II.16

Tampilan jendelaTransform Adobe Flash CS6

21

16. Components

Berisi kumpulan objek-objek otomatis yang telah disediakan secara default

oleh flash dan dapat digunakan secara langsung untuk pembuatan animasi.

Gambar II.17

Tampilan jendela Components Adobe Flash CS6

17. Align

Berfungsi menampilkan deretan menu perintah secara otomatis yang

digunakan untuk memindahkan dan mengatur letak dari posisi objek gambar yang

terdapat di dalam layer.

Gambar II.18

Tampilan jendela Align Adobe Flash CS6

22

18. Library

Adalah suatu tempat untuk menampung semua symbol, baik graphic, button,

mocie clip ataupun objek hasil impor, seperti gambar, sound dan objek yang berasal

dari aplikasi lain yang pernah dibuat di dalam stage.

Gambar II.19

Tampilan jendela Library Adobe Flash CS6

19. Panel Tools

Merupakan sebuah panel yang terdiri dari kumpulan peranti-peranti kerja yang

sering digunakan untuk membuat animasi, membuat objek, dan manipulasi objek.

Gambar II.20

Tampilan jendela Panel Tols Adobe Flash CS6

2.2.3 Adobe Photoshop CS5

Menurut (Firmantoro et al., 2016) dalam setiawan Adobe Photoshop

“merupakan software yang paling sering digunakan untuk mengedit/memanipulasi

image/foto. Alasan software ini banyak digunakan oleh orang karena software ini

menyediakan fasilitas yang sangat lengkap, yaitu mencakup tools-tools yang

23

digunakan untuk mengedit image, fasilitas filter yang digunakan untuk memberikan

berbagai efek pada image, fasilitas untuk memanipulasi warna, dan lain-lain”.

Sedangkan menurut (yudhistira januar rizki, 2019) Adobe Photoshop adalah

“program aplikasi desain yang berguna untuk mendesain gambar, mengedit image

grafis, dan mengolah foto digital. Perangkat lunak komputer ini memiliki kelebihan

pada kelengkapan fitur desain grafis dan olah fotonya”.

Jadi Adobe Photoshop ialah Program aplikasi edit gambar yang sebenarnya

hampir sama dengan program lain milik Adobe yang memiliki fitur menu utama,

demikian pula Adobe Photoshop. Menu utama Photoshop diantaranya adalah File,

Edit, Image, Layer, Select. Filter, View, Window dan Help.

Gambar II.21

Tampilan Menu Utama Adobe photoshop CS5

24

1. Menu File biasa digunakan untuk langkah-langkah awal dan langkah akhir dalam

melakukan pengeditan foto, karena disana kita bisa memiliki membuka lembar

kerja baru, mengimpor foto, Browse, Open As, Close, Save, Save As, proses

print dan lain-lain. Mungkin menu File Photoshop hampir sama dengan Office

Button pada Microsoft Word.

2. Menu Edit biasa digunakan untuk langkah-langkah pembantu pengeditan, ada

banyak piliha menu disini diantaranya Cut, Copy, Undo, Stroke, Paste, Free

Transform, Fill, Clear dan masih banyak lagi yang lain. Menu Edit hampir sama

dengan fitur dasar pada aplikasi Paint.

3. Menu Image, yaitu menu yang dapat digunakan untuk mengolah foto sedemikian

yang dinginkan. Opsi lain dalam pada menu Image adalah Adjustment dimana bisa

mengatur tingkat warna, kecerahan, exposure, kontras, maupun mengubah seluruh

komposisi berbagai warna dengan beberapa opsi seperti Equalize, Posterize dan

lain-lain. Selain itu pengaturan rotasi dan pengubahan ukuran foto juga terdapat

pada menu Image, dengan opsi Image Sizes dan Rotate Canvas.

4. Menu Layer, digunakan untuk mengolah gambar baik itu dari warna, tingkat

kecerahan, exposure, kontras dan lain-lain. Namun pengaturan pada Layer tersebut

bukan untuk foto utama melainkan untuk lembar Layer. Pengertian Layer secara

singkat adalah bagian dari lembar kerja.

5. Menu Select, biasa digunakan untuk pengolahan select (memilih), baik itu dengan

opsi Select All, Deselect (membatalkan Select), Reselect, Inverse untuk mengganti

bagian yang tidak terselect untuk terselect dengan metode yang hampir sama seperti

Invert color, dan lainnya. Tiga Opsi diatas adalah yang paling sering digunakan.

6. Menu Filter, biasa digunakan untuk mengolah foto yang dapat dirubah komposisi

karena terdapat fitur Extract dimana opsi tersebut bisa digunakan untuk

25

memisahkan warna-warna yang berbeda. Selain itu fungsi pada menu Filter

terdapat opsi untuk memberi efek-efek pada foto lewat Artistic, membuat foto

kabur dengan Blur, memper halus foto dengan Noise (Reduce Noise), serta efek-

efek lain. Menu Filter juga sering digunakan untuk menaruh plugin yang masih

berhubungan dengan efek-efek, banyak bukan fungsinya .

7. Menu View, biasa digunakan untuk fitur tampilan, dengan yang utama adalah fitur

Zoom in, Zoom out, Fit on Screen, mengatur Screen mode, Actual Pixel dan lain-

lain. Fungsi menu ini jarang dipakai karena opsi tersebut bisa diakses menggunakan

tombol shortcut pada keyboard yakni menekan CTRL(+) / CTRL( -).

8. Menu Windows, digunakan untuk mengatur apa saja kotak yang ingin tampil.

rekomendasikan kotak Layer, History dan Tools adalah yang sering digunakan

pada umumnya.

9. Menu Help, fungsi menu ini berisi konten informasi tentang bantuan dalam

Photoshop yang berguna untuk memahami tentang photoshop.

2.2.4. Storyboard

Menurut Pressman (2010:582-584), dalam jurnal (Rosmaidah & Destiana,

2017) “Storyboard adalah penggambaran alur cerita dalam sebuah animasi dan berisi

tentang pengambilan sudut gambar, pengisian suara, serta efek-efek khusus yang ada

pada animasi tersebut. Fungsi Storyboard adalah menerjemahkan isi skenario secara

visual atau penggambaran secara singkat”.

Menurut (Hardyana & Herlawati, 2016) Perancangan storyboard berisi

pembahasan alur cerita dari aplikasi yang penulis buat yang akan disampaikan

dengan menggunakan tulisan dan gambar.