Aplikasi sumber belajar digital dalam bentuk visualisasi query terbatas untuk matakuliah basis data.

(1)

viii

INTISARI

Matakuliah Basisdata berisi tentang bagaimana cara merancang basisdata secara sederhana sampai pada tingkatan yang rumit, di dalam matakuliah tersebut juga diajarkan bagaimana cara untuk melihat, mencari, menambah, mengubah dan menghapus data dengan bahasa pemrograman khusus yang disebut SQL (Structured Query Language) yaitu bahasa query yang berhubungan dengan basisdata. Pada bahasa pemrograman SQL, terdapat keterbatasan bahwa pengguna tidak dapat melihat terjadinya proses query secara visual di dalam basisdata untuk melihat, mencari, menambah, mengubah, dan menghapus data-data. Dari latar belakang itulah aplikasi sumber belajar digital dalam bentuk visualisasi query terbatas untuk matakuliah basisdata dibuat untuk menangani masalah-masalah tersebut

Implementasi aplikasi ini dikembangkan menggunakan PHP, Macromedia Flash 8, dan database MySQL. Proses visualisasi query yang akan ditampilkan dibagi menjadi dua bagian, yaitu : visualisasi animasi dan visualisasi dinamis

Hasil yang diperoleh adalah aplikasi sumber belajar digital yang mampu menampilkan visualisasi proses query di dalam basisdata sehingga pengguna dapat mengetahui proses yang terjadi pada setiap query.


(2)

ix

ABSTRACT

The study of database contains how to design the limited database up to the complicated one. In this subject, we are taught the way to see, to search, to add, to change and to delete data using the special program called SQL as a query which is related to database. In SQL program, users aren’t able to see how query happens visually in the database to see, to search, to add, to change and to delete data. Therefore, the digital application as the source of study is made to overcome these problems.

The implementation of this application is improved through the usage of PHP, Macromedia Flash 8 and MySQL database. The query process which is going to be shown is divided into two parts : animation visualization and dynamic visualization.

The result of digital application as learning source is showing visualization of query process in the database so that the users are able to know the process happens in every query.


(3)

APLIKASI SUMBER BELAJAR DIGITAL DALAM BENTUK

VISUALISASI QUERY TERBATAS UNTUK MATAKULIAH

BASISDATA

Tugas Akhir

Diajukan Untuk Memenuhi Salah Satu Syarat Memperoleh Gelar Sarjana Teknik

Jurusan Teknik Informatika

Disusun Oleh: Antonius Adiyoso Nugroho

NIM : 045314028

JURUSAN TEKNIK INFORMATIKA FAKULTAS SAINS DAN TEKNOLOGI

UNIVERSITAS SANATA DHARMA YOGYAKARTA


(4)

ii

THE APPLICATION OF DIGITAL LEARNING SOURCE

IN THE FORM OF LIMITED QUERY VISUALIZATION

FOR DATABASE COURSE

A THESIS

Presented as Partial Fulfillment of the Requirements To Obtain The Sarjana Teknik Degree

In Informatics Engineering Department

by :

Antonius Adiyoso Nugroho NIM : 045314028

INFORMATICS ENGINEERING STUDY PROGRAM INFORMATICS ENGINEERING DEPARTMENT

FACULTY OF SCIENCE AND TECHNOLOGY SANATA DHARMA UNIVERSITY

YOGYAKARTA 2009


(5)

(6)

(7)

v

Motto

“Allah mungkin tidak pernah

menjanjikan sukacita tanpa kesedihan,

kedamaian tanpa penderitaan,

namun

Ia menjanjikan rahmat dan kekuatan untuk menmpuh

hari-hari hidup ini.”

Tulisan ini kupersembahkan kepada :

Tuhan Yesus Kristus,

Bunda Maria,

Kedua orang tua ku,

&

Ochi tersayang

Terima kasih untuk semua doa, rasa sayang, perhatian,

dorongan semangat, dan kesabaran yang tak terhinnga yang


(8)

(9)

(10)

viii

INTISARI

Matakuliah Basisdata berisi tentang bagaimana cara merancang basisdata secara sederhana sampai pada tingkatan yang rumit, di dalam matakuliah tersebut juga diajarkan bagaimana cara untuk melihat, mencari, menambah, mengubah dan menghapus data dengan bahasa pemrograman khusus yang disebut SQL (Structured Query Language) yaitu bahasa query yang berhubungan dengan basisdata. Pada bahasa pemrograman SQL, terdapat keterbatasan bahwa pengguna tidak dapat melihat terjadinya proses query secara visual di dalam basisdata untuk melihat, mencari, menambah, mengubah, dan menghapus data-data. Dari latar belakang itulah aplikasi sumber belajar digital dalam bentuk visualisasi query terbatas untuk matakuliah basisdata dibuat untuk menangani masalah-masalah tersebut

Implementasi aplikasi ini dikembangkan menggunakan PHP, Macromedia Flash 8, dan database MySQL. Proses visualisasi query yang akan ditampilkan dibagi menjadi dua bagian, yaitu : visualisasi animasi dan visualisasi dinamis

Hasil yang diperoleh adalah aplikasi sumber belajar digital yang mampu menampilkan visualisasi proses query di dalam basisdata sehingga pengguna dapat mengetahui proses yang terjadi pada setiap query.


(11)

ix

ABSTRACT

The study of database contains how to design the limited database up to the complicated one. In this subject, we are taught the way to see, to search, to add, to change and to delete data using the special program called SQL as a query which is related to database. In SQL program, users aren’t able to see how query happens visually in the database to see, to search, to add, to change and to delete data. Therefore, the digital application as the source of study is made to overcome these problems.

The implementation of this application is improved through the usage of PHP, Macromedia Flash 8 and MySQL database. The query process which is going to be shown is divided into two parts : animation visualization and dynamic visualization.

The result of digital application as learning source is showing visualization of query process in the database so that the users are able to know the process happens in every query.


(12)

x

KATA PENGANTAR

Puji syukur saya ucapkan kehadirat Tuhan Yang Maha Esa atas berkat dan limpahan kasih karunia yang telah diberikan-Nya sehingga saya dapat menyelesaikan skripsi ini dengan judul “APLIKASI SUMBER BELAJAR DIGITAL DALAM BENTUK VISUALISASI QUERY TERBATAS UNTUK MATAKULIAH BASISDATA” .

Dalam penulisan skripsi ini, penulis telah banyak memperoleh bantuan dan bimbingan dari berbagai pihak, oleh karena itu tidak lupa penulis mengucapkan terima kasih kepada ;

1. Tuhan Yesus Kristus, yang telah menganugerahkan kasih karunia dan rahmat-Nya serta selalu memberikan keberuntungan.

2. Bunda Maria yang telah mendengarkan segala doa dan permohonan. 3. Bapak Yosef Agung Cahyanta, S.T., M.T. selaku Dekan Fakultas Sains

dan Teknologi Universitas Sanata Dharma Yogyakarta.

4. Bapak Puspaningtyas Adi Sanjaya, S.T., M.T., selaku Ketua Jurusan Teknik Informatika Fakultas Sains dan Teknologi Universitas Sanata Dharma Yogyakarta.

5. Ibu Agnes Maria Polina, S.Kom., M.Sc., selaku Dosen pembimbing I dan Pembimbing Akademik Angkatan 2004 Jurusan Teknik Informatika Fakultas Sains dan Teknologi Universitas Sanata Dharma Yogyakarta.


(13)

xi

6. Bapak H. Agung Hernawan, S.T. selaku Dosen pembimbing II yang telah memberikan waktu, bantuan dan bimbingan serta ide-ide dalam menyelesaikan tugas akhir ini.

7. Bapak dan Mama yang selalu memberikan doa, dorongan dan semangat baik moral maupun spiritual.

8. Rosiana Bumbungan yang telah banyak memberikan doa, dukungan dan bantuan baik moral maupun spiritual dalam pengerjaan tugas akhir.

9. Bapak Emanuel Bele Bau, S.Pd dan Mas Rusdanang Ali Basuni yang membantu dalam kegitan-kegiatan di kampus.

10. Teman-teman TI angkatan 2004 yang lain telah menjadi teman seperjuangan dalam melalui kuliah selama ini.

Akhirnya tugas akhir ini terselesaikan, disadari bahwa skripsi ini jauh dari sempurna.Untuk itu penulis dengan rendah hati mengharapkan kritik dan saran yang dapat memberikan kesempurnaan pada penulisan skripsi ini. Akhir kata, semoga skripsi ini dapat bermanfaat bagi penulis, juga pihak yang membutuhkan.

Yogyakarta, 20 Mei 2009 Penulis


(14)

xii

DAFTAR ISI

Halaman

Halaman Judul...i

Halaman Judul... ii

Halaman Persetujuan Pembimbing ... iii

Halaman Pengesahan ...iv

Halaman Motto dan Persembahan ...v

Halaman Pernyataan Keaslian Karya...vi

Lembar Pernyataan Persetujuan Publikasi Karya Ilmiah... vii

Intisari ... viii

Abstract ...ix

Kata Pengantar ...x

Daftar Isi ...xi

Daftar Tabel ...xvi

Daftar Gambar... xviii

BAB I PENDAHULUAN...1

1.1 Latar Belakang Masalah...1

1.2 Rumusan Masalah ...1

1.3 Batasan Masalah ...2

1.4 Tujuan Penelitian ...2

1.5 Metodologi Penelitian ...3


(15)

xiii

BAB II LANDASAN TEORI...7

2.1Konsep Visualisasi ...7

2.2 Pengertian Visualisasi ...8

2.3 CAI (Computer Asisted Instruction)...10

2.4 Rekayasa Perangkat Lunak Paradigma Terstruktur ...10

2.5 Basisdata ...14

2.6 PHP (PHP Hypertext Preprocessor)...15

2.7 SQL (Structured Query Language)...28

2.8 MySQL...31

2.9 Multimedia ...34

2.10 Macromedia Flash 8...36

2.10.1 Timeline ...37

2.10.2 Simbol ...37

2.10.3 Library...37

2.10.4 Action Script ...38

BAB III ANALISIS dan DESAIN SISTEM...41

3.1 Gambaran Umum Sistem ...41

3.2 Analisis Sistem...43

3.2.1 Use Case...44

3.3 Desain Sistem...44

3.3.1Desain Proses ...45

3.3.1.1 Diagram Konteks (Context Diagram)...45


(16)

xiv

3.2.1.3 DFD (Data Flow Diagram) ...46

3.2.1.3.1 DFD Level 0...46

3.2.1.3.2 DFD Level 1 Proses 1 ...47

3.2.1.3.3 DFD Level 1 Proses 2 ...48

3.2.1.3.4 DFD Level 1 Proses 3 ...49

3.3.2 Desain Basisdata ...50

3.3.2.1 ER Diagram...50

3.3.2.2 Relasi Antar Tabel...52

3.3.2.3 Struktur File Basisdata ...53

3.3.3 Desain Antarmuka...55

3.3.3.1 Desain Tampilan Form Utama ...55

3.3.3.2 Desain Menu Materi Pembelajaran...56

3.3.3.2.1 Desain Pengenalan Konsep Database ...56

3.3.3.2.2 Desain Perintah SQL...57

3.3.3.2.3 Desain Visualisasi SQL Animasi ...57

3.3.3.2.4 Desain Visualisasi SQL Dinamis ...58

3.3.3.3 Desain Menu Visualisasi SQL ...58

3.3.3.3.1 Desain Animasi ...58

3.3.3.3.2 Desain Dinamis ...59

3.3.3.4 Desain Menu Bantuan ...59

3.3.3.4.1 Desain Pengantar...59

3.3.3.4.2 Desain Kebutuhan Sistem ...60


(17)

xv

3.3.3.4.4 Desain Memulai Program ...61

BAB IV IMPLEMENTASI DAN PEMBAHASAN...62

4.1 Implementasi Program ...62

4.1.1 Menjalankan Program ...62

4.1.2 Menggunakan Program ...67

4.1.2.1 Menu Utama...67

4.1.2.2 Menu Materi Pembelajaran ...69

4.1.2.2.1 Sub Menu Materi ...69

4.1.2.2.2 Sub Menu Visualisasi SQL Animasi ...78

4.1.2.2.3 Sub Menu Visualisasi SQL Dinamis ...79

4.1.2.3 Menu Visualisasi...80

4.1.2.3.1 Sub Menu Animasi...80

4.1.2.3.2 Sub Menu Dinamis...83

4.1.2.4 Menu Bantuan ...90

4.1.2.4.1 Sub Menu Pengantar ...90

4.1.2.4.2 Sub Menu Kebutuhan Sistem...91

4.1.2.4.3 Sub Menu Instalasi Aplikasi ...92

4.1.2.4.4 Sub Menu Memulai Program ...93

BAB V ANALISIS HASIL...94

5.1 Hasil Pengujian Program ...94

5.1.1 Ujicoba Inputan Query...94

5.2 Kelebihan Aplikasi...98


(18)

xvi

5.4 Uji Coba ke User...99

BAB VI PENUTUP...113

6.1 Kesimpulan ...113

6.2 Saran...113

DAFTAR PUSTAKA...115


(19)

xvii

DAFTAR TABEL

Halaman

Tabel 2.1 Contoh Pengenal ...20

Tabel 2.2 Operator aritmatika ...22

Tabel 2.3 Operator Penugasan ...22

Tabel 2.4 Operator Perbandingan ...24

Tabel 3.1 Deskripsi Konsep Sistem ...42

Tabel 3.2 Jurusan ...53

Tabel 3.3 Mahasiswa...53

Tabel 3.4 Mahasiswa2...54

Tabel 3.5 Matakuliah ...54

Tabel 3.6 Nilai...55

Tabel 5.1 Beta Test...101


(20)

xviii

DAFTAR GAMBAR

Halaman

Gambar 2.1 Model Waterfall...13

Gambar 2.2 Skema PHP...19

Gambar 2.3 Operand, Operator, dan Ungkapan...22

Gambar 3.1 Use Case User...44

Gambar 3.2 Diagram Konteks...45

Gambar 3.3 Diagram Berjenjang ...46

Gambar 3.4 DFD Level 0...46

Gambar 3.5 DFD Level 1 Proses 1 ...47

Gambar 3.6 DFD Level 1 Proses 2 ...48

Gambar 3.7 DFD Level 1 Proses 3 ...49

Gambar 3.8 ER Diagram Visualisasi Animasi...50

Gambar 3.9 ER Diagram Visualisasi Dinamis...51

Gambar 3.10 Database Visualisasi Animasi ...51

Gambar 3.11 Database Visualisasi Dinamis ...52

Gambar 3.12 Form Utama...55

Gambar 3.13 Desain Pengenalan Konsep Database ...56

Gambar 3.14 Desain Perintah SQL...57

Gambar 3.15 Desain Visualisasi SQL Animasi ...57

Gambar 3.16 Desain Visualisasi SQL Dinamis ...58


(21)

xix

Gambar 3.18 Form Query Dinamis...59

Gambar 3.19 Desain Pengantar...59

Gambar 3.20 Desain Kebutuhan Sistem ...60

Gambar 3.21 Desain Instalasi Aplikasi...60

Gambar 3.22 Desain Memulai Program...61

Gambar 4.1 XAMPP Control Panel Application ...63

Gambar 4.2 Menu Utama dengan XAMPP ...64

Gambar 4.3 Koneksi server2go...65

Gambar 4.4 Menu Utama dengan server2go...66

Gambar 4.5 Menu Utama...67

Gambar 4.6 Sub Menu Pengenalan Konsep Basisdata ...69

Gambar 4.7 Modul Flash Pengenalan Konsep Basisdata... ...70

Gambar 4.8 Modul Flash Pengenalan Konsep Basisdata (Tabel Animasi) ...70

Gambar 4.9 Sub Menu Perintah SQL ...71

Gambar 4.10 Modul Flash Perintah SQL...72

Gambar 4.11 Modul Flash Sintak Select...72

Gambar 4.12 Modul Flash Sintak Where...73

Gambar 4.13 Modul Flash Sintak Group By...74

Gambar 4.14 Modul Flash Sintak Order By. ...74

Gambar 4.15 Modul Flash Sintak Insert...75

Gambar 4.16 Modul Flash Sintak Update...75

Gambar 4.17 Modul Flash Sintak Delete...76


(22)

xx

Gambar 4.19 Modul Flash Sintak Fungsi ...77 Gambar 4.20 Sub Menu Visualisasi SQL Animasi...78 Gambar 4.21 Sub Menu Visualisasi SQL Dinamis...79 Gambar 4.22 Sub Menu Animasi...80 Gambar 4.23 Daftar Query Animasi ...81 Gambar 4.24 Animasi.... ...81 Gambar 4.25 Animasi Berjalan...82 Gambar 4.26 Sub Menu Dinamis...83 Gambar 4.27 Perintah SQL Isi ...83 Gambar 4.28 Hasil Visualisasi SQL Dinamis...86 Gambar 4.29 Query yang telah dieksekusi.... ...87 Gambar 4.30 Pesan Kesalahan Pada Tombol Petunjuk ...88 Gambar 4.31 Sub Menu Pengantar ...90 Gambar 4.32 Sub Menu Kebutuhan Sistem...91 Gambar 4.33 Sub Menu Instalasi Aplikasi ...92 Gambar 4.34 Sub Menu Memulai Program.... ...93 Gambar 5.1 Perintah SQL Isi (input salah)...94 Gambar 5.2 Pesan Kesalahan...95 Gambar 5.3 Sintak Pada Tombol Petunjuk.... ...96 Gambar 5.4 Perintah SQL Isi (input salah2)...97 Gambar 5.5 Pesan Kesalahan Spesifik Tombol Petunjuk...98 Gambar 5.6 Hasil Kuesioner Pernyataan no 1 ...103 Gambar 5.7 Hasil Kuesioner Pernyataan no 2 ...104


(23)

xxi

Gambar 5.8 Hasil Kuesioner Pernyataan no 3 ...105 Gambar 5.9 Hasil Kuesioner Pernyataan no 4 ...106 Gambar 5.10 Hasil Kuesioner Pernyataan no 5 ...107 Gambar 5.11 Hasil Kuesioner Pernyataan no 6 ...108 Gambar 5.12 Hasil Kuesioner Pernyataan no 7 ...109 Gambar 5.13 Hasil Kuesioner Pernyataan no 8 ...110 Gambar 5.14 Hasil Kuesioner Pernyataan no 9 ...111


(24)

1

BAB I

PENDAHULUAN

1.1 Latar Belakang Masalah

Penyampaian informasi dalam bentuk ilmu pengetahuan khususnya dalam matakuliah pengantar Basisdata, dapat disampaikan dalam berbagai bentuk, misalnya disampaikan melalui proses belajar-mengajar (interaksi dosen dengan mahasiswa), atau menyampaikan materi dalam bentuk tulisan atau teks. Masalahnya adalah bagaimana cara mengemas materi yang akan disampaikan menjadi lebih menarik dan dapat dijadikan program visual untuk dapat dipahami oleh mahasiswa dengan atau tanpa harus berinteraksi langsung dengan pengajar. Salah satu contohnya adalah menyediakan media alternatif pembelajaran dalam bentuk visualisasi.

Dari latar belakang tersebut, penulis tertarik untuk mengembangkan aplikasi sumber belajar digital dalam bentuk visualisasi query terbatas untuk mendukung pemahaman tentang basisdata. Aplikasi ini berisi materi pembelajaran dalam bentuk visualisasi query, animasi gambar, teks, dan interaksi antara user dengan perangkat lunak ini.

1.2 Rumusan masalah

Bagaimana cara mengemas materi sumber belajar digital dalam bentuk visualisasi query terbatas yang interaktif untuk mendukung matakuliah Basisdata dengan menggunakan Macromedia Flash 8, PHP dan MySQL ?


(25)

Sejauh mana mahasiswa merasa terbantu dalam memahami matakuliah pengantar Basisdata dengan menggunakan aplikasi sumber belajar digital dalam bentuk query terbatas untuk matakuliah basisdata ?

1.3 Batasan Masalah

Dalam pembuatan program visualisasi ini dilakukan batasan sebagai berikut:

Aplikasi ini terdiri dari dua bagian, yaitu visualisasi animasi dan visualisasi dinamis. Pada visualisasi animasi disediakan sepuluh perintah SQL yang tergolong perintah DML (Data Manipulation Language), agar user dapat memahami visualisasi proses query, dan pada visualisasi dinamis materi pembelajaran terkoneksi dengan MySQL.

1.4 Tujuan dan Manfaat

Tujuan dari penulisan ini adalah sebagai berikut :

Membangun suatu aplikasi sumber belajar digital dalam bentuk visualisasi query terbatas untuk mendukung matakuliah Basisdata.

Manfaat dari penulisan ini adalah sebagai berikut :

1. Membantu dosen atau staf pengajar dalam menyampaikan matakuliah Basisdata.

2. Aplikasi ini dapat dijadikan program bantu belajar baik bagi mahasiswa atau orang awam yang ingin belajar query untuk perintah-perintah DML (Data Manipulation Language).


(26)

1.5 Metodologi Penelitian

a) Metode yang digunakan untuk menyelesaikan masalah pada aplikasi ini yaitu dengan paradigma terstruktur (model waterfall).

Langkah-langkah yang dilakukan adalah sebagai berikut: 1. Analisis

Tahap analisis dilakukan dengan mengumpulkan kebutuhan yang diperlukan untuk memahami sifat aplikasi yang akan dibangun.

Pada tahap ini membuat DFD (Data Flow Diagram), ER-Diagram, narasi proses dan kamus data.

2. Desain

Tahap desain dilakukan dengan memunculkan kode yang membahas struktur data, arsitektur perangkat lunak, representasi interface, dan algoritma prosedural.

3. Pengkodean

Tahap pengkodean dilakukan untuk menerjemahkan hasil desain ke dalam bahasa pemrograman.

4. Pengujian

Tahap pengujian program dilakukan untuk mengetahui apakah terdapat kesalahan pada program dan memastikan bahwa input yang dibatasi akan memberikan hasil aktual yang sesuai dengan hasil yang dibutuhkan.


(27)

5. Pemeliharaan

Tahap pemeliharaan tetap dilakukan karena tidak bisa dihindari, adanya perubahan ketika perangkat lunak berada di pelanggan.

b) Uji coba ke user

Menguji coba aplikasi ini kepada sepuluh orang user (dengan mengambil sampel mahasiswa jurusan Teknik Informatika) untuk menggunakan aplikasi dan mengisi kuesioner sehingga diperoleh kesimpulan umum mengenai apakah aplikasi ini secara garis besar sudah dapat membantu pengguna dalam memahami konsep basisdata dan proses query dalam basisdata.


(28)

1.6 Sistematika Penulisan

Sistematika penulisan tugas akhir ini adalah sebagai berikut: 1. Bab I Pendahuluan

Dalam bab pembuka ini secara umum dijelaskan beberapa hal, diantaranya latar belakang masalah, rumusan masalah, batasan masalah, tujuan penulisan, metode penelitian, serta sistematika penulisan.

2. Bab II Landasan Teori

Bab ini menjelaskan landasan teori dari metodologi yang digunakan dan mengemukakan teori-teori yang mendukung mengenai teknologi yang mendasari pembuatan program visualisasi ini, yaitu pemrograman dengan menggunakan Macromedia Flash 8 dan PHP.

3. Bab III Analisis dan Perancangan Sistem

Bab ini membahas analisis dan perancangan sistem, mencakup rancangan basisdata dan rancangan antar muka yang akan digunakan.

4. Bab IV Implementasi

Bab ini berisi tentang implementasi yang dilakukan terhadap analisis yang telah dilakukan sebelumnya pada bab III.

5. Bab V Analisis Hasil

Bab ini menjelaskan secara rinci tentang analisis hasil yang menyangkut kelebihan dan kekurangan sistem yang telah berhasil dibuat.


(29)

6. Bab VI Penutup

Bab ini berisi berisi tentang kesimpulan yang dapat diambil untuk menjawab permasalahan yang sudah diajukan dalam bab I dan saran yang diberikan untuk pengembangan sistem dimasa yang yang akan datang.


(30)

7

BAB II

LANDASAN TEORI

2.1 Konsep Visualisasi

Sistem pendidikan dewasa ini telah mengalami kemajuan yang sangat pesat. Berbagai cara telah dikenalkan serta digunakan dalam proses belajar mengajar (PBM) dengan harapan pengajaran oleh pendidik akan lebih berkesan dan pembelajaran bagi siswa akan lebih bermakna. Sejak beberapa tahun belakangan ini teknologi informasi dan komunikasi telah banyak digunakan dalam proses belajar mengajar, dengan satu tujuan mutu pendidikan akan selangkah lebih maju seiring dengan kemajuan teknologi. Perkembangan teknologi multimedia telah menjanjikan potensi besar dalam merubah cara seseorang untuk belajar, untuk memperoleh informasi, menyesuaikan informasi dan sebagainnya.

Multimedia juga menyediakan peluang bagi pendidik untuk mengembangkan teknik pembelajaran sehingga menghasilkan hasil yang maksimal. Demikian juga bagi pelajar, dengan multimedia diharapkan mereka akan lebih mudah untuk menentukan dengan apa dan bagaiamana siswa untuk dapat menyerap informasi secara cepat dan efisien. Sumber informasi tidak lagi terfokus pada teks dari buku semata-mata tetapi lebih luas dari itu. Kemampuan teknologi multimedia yang telah terhubung internet akan semakin menambah kemudahan dalam mendapatkan informasi yang diharapkan.

Dengan diharapkan dapat menambahkan metode belajar dan mendukung materi pengajaran tradisional seperti diskusi dalam kelas, buku,


(31)

CD-ROM dan pelatihan komputer non internet. Hal-hal lain yang dapat bermanfaat bagi siswa adalah membekali siswa pengetahuan, keterampilan dan sikap profesional dengan cara melaksanakan KBM yang efektif di sekolah dan industri, kemudian dapat mengembangkan materi pembelajaran sesuai kebutuhan industri serta perkembangan ilmu pengetahuan dan teknologi.

Penyelenggaraan sangat ditentukan antara lain oleh:

a. Sikap positif peserta didik (motivasi yang tinggi untuk belajar mandiri). b. Sikap positif tenaga kependidikan terhadap teknologi komputer dan

internet.

c. Ketersediaan fasilitas komputer dan akses ke internet. d. Adanya dukungan layanan belajar.

e. Biaya akses internet yang terjangkau untuk kepentingan pembelajaran/pendidikan.

2.2 Pengertian Visualisasi

Pengertian visualisasi adalah rekayasa dalam pembuatan gambar, diagram atau animasi untuk penampilan suatu informasi (www.wikipedia.org). Visualisasi dapat dijaidkan salah satu alternatif kegiatan pembelajaran dilaksanakan melalui pemanfaatan teknologi komputer dan dapat juga dengan menggunakan media internet. Seseorang yang tidak dapat mengikuti pendidikan konvensional karena berbagai faktor penyebab, misalnya harus bekerja, kondisi geografis, jarak yang jauh, kondisi fisik yang tidak memungkinkan, daya tampung sekolah konvensional yang tidak memungkinkan, phobia terhadap sekolah, putus sekolah,


(32)

atau karena memang dididik melalui pendidikan keluarga di rumah (home schoolers) dimungkinkan.

Berbagai elemen yang terdapat dalam sistem program visualisasi adalah: a. Komunitas: para pelajar dapat mengembangkan komunitas online untuk

memperoleh dukungan dan berbagi informasi yang saling menguntungkan. b. Multimedia: penggunaan teknologi audio, video dan animasi dalam

penyampaian materi sehingga menarik minat dalam belajar.

Perkembangan di berbagai negara memperlihatkan bahwa jumlah pengguna internet teus meningkat. Fungsi program visualisasi dapat sebagai pelengkap atau tambahan, dan pada kondisi tertentu bahkan dapat menjadi alternatif lain dari pembelajaran konvensional. Peserta didik maupun dosen/guru/instruktur dapat memperoleh manfaat dari penyelenggaraan program visualisasi.

Beberapa di antara manfaat program visualisasi adalah fleksibilitas kegiatan pembelajaran, baik dalam arti interaksi peserta didik dengan materi/bahan pembelajaran, maupun interaksi peserta didik dengan dosen/guru/insruktur, serta interaksi antara sesama peserta didik untuk mendiskusikan materi pembelajaran.

Lembaga pendidikan konvensional (universitas, sekolah, lembaga-lembaga pelatihan, atau kursus-kursus yang bersifat kejuruan dan lanjutan) secara ekstensif telah menyelenggarakan perluasan kesempatan belajar bagi ’target audience’ mereka melalui pemanfaatan teknologi komputer dan internet (Collier, 2002). Seiring dengan hal ini, peserta didik usia sekolah yang mengikuti kegiatan pembelajaran elektronik juga terus meningkat jumlahnya (Gibbon, 2002).


(33)

2.3 CAI (Computer Assisted Instruction)

Pemanfaatan komputer sekarang sudah menjangkau dunia pendidikan. Aplikasi pengajaran yang menggunakan komputer salah satunya meliputi CAI (Computer Assited Instruction). CAI atau pengajaran berbantuan komputer adalah sistem komputer dimana dalam prosentase tertentu mengganti peran seorang guru/pengajar dalam penyampaian materi pembelajaran (Surjono, 1996).

Ada beberapa media pengajaran yang dapat diimplementasikan untuk menyampaikan materi pengajaran bagi para siswa, antara lain :

a. Media cetak, termasuk diantaranya adalah textbooks dan modul.

b. Media audio visual, termasuk diantaranya sound slides, video dan televisi. c. Komputer, yaitu CAI.

d. Media audio, termasuk diantaranya radio, dan program audio cassette.

2.4 Rekayasa Perangkat Lunak Paradigma Terstruktur

Rekayasa perangkat lunak merupakan tahapan-tahapan kegiatan yang bertujuan untuk mencapai :

a. Pengoptimalan sumber daya (biaya, personil maupun peralatan). b. Pembangunan perangkat lunak yang sesuai dengan jadwal (cepat). c. Pemeliharaan perangkat lunak yang lebih mudah.


(34)

Terdapat empat tahapan dalam rekayasa perangkat lunak, yaitu : a) Pengumpulan Kebutuhan

Tahapan ini merupakan tahapan dasar yang digunakan oleh pengembang untuk mengumpulkan seluruh informasi yang akan dikelola suatu perangkat lunak. Informasi-informasi yang dikumpulkan untuk pengembang adalah informasi yang dinilai bermanfaat atau dibutuhkan oleh pengguna.

Ada beberapa kegiatan yang dilakukan dalam mengumpulan informasi, antara lain :

1) Mengumpulkan informasi pennyebab masalah.

2) Mengumpulkan informasi yang menjadi dasar dalam proses pengambilan keputusan.

3) Mengumpulkan informasi untuk mengidentifikasi personil-personil kunci yang akan menggunakan sistem.

b) Analisis Sistem

Tahapan ini merupakan tahapan pemodelan sistem dalam bentuk diagram berupa Data Flow Diagram dan ER-Diagram.

c) Desain

Desain perangkat lunak meliputi beberapa kegiatan, yaitu : 1) Desain Data

Kegiatan ini berupa desain tabel-tabel basisdata yang akan berpengaruh bagi perangkat lunak. Desain ini sudah mulai mendefinisikan tabel-tabel basisdata secara terperinci. Field-field apa saja yang akan


(35)

digunakan dalam perangkat lunak, tipe-tipe dari field yang digunakan, dan sebagainya.

2) Desain Arsitektural (fungsi-fungsi serta proses-proses pada perangkat lunak)

Desain arsitektur meliputi :

• Pembuatan Data Flow Diagram yang rinci. • Pendefinisian dari algoritma modul.

• Pembuatan struktur modul. 3) Desain Antar Muka

Antar muka pemakai merupakan jembatan penghubung antara entitas-entitas dan sistem. Desain antar muka yang baik sangat dibutuhkan agar pengguna mampu mengoperasikan perangkat lunak dengan mudah. Selain itu, antar muka juga memiliki peranan membentuk “image” pengguna terhadap citra, misi, dan visi perangkat lunak yang dibangun. Desain antar muka pengguna meliputi beberapa hal, yaitu :

• Desain Struktur Menu

Mendesain menu-menu yang akan ditampilkan dalam suatu sistem.

• Desain jendela-jendela yang ditampilkan.


(36)

d) Implementasi (pengkodean)

Tahap ini merupakan tahapan pengkodean dari hasil perancangan. Pada tahapan ini pengembang mulai membuat sistem aplikasi dengan menggunakan bahasa pemrograman, misalnya PHP (Personal Home Pages) dan action script. Pengkodean ini disesuaikan dengan diagram-diagram yang telah dibuat, tabel-tabel basisdata yang telah didesain ataupun algoritma dan struktur dari modul.

Gambar di bawah ini merupakan gambar pemodelan secara terstruktur (waterfall) :


(37)

2.5 Basisdata

Basisdata merupakan sekumpulan data yang saling berhubungan yang berisi informasi untuk pemakainya (F. Korth, 1986).

Konsep basisdata dibuat operasional oleh suatu sistem perangkat lunak yang mengerjakan fungsi penciptaan dan peremajaan file, mencari data dan menghasilkan laporan. Semua data dalam rangkaian file dapat terjangkau oleh program apapun yang bisa menggunakan basisdata.

Basisdata dirancang atas dasar pendekatan aplikatif maupun pendekatan sistem. Pendekatan aplikatif merupakan cara yang tradisional, dimana basisdata dirancang hanya untuk memenuhi satu aplikasi tertentu, sehingga terdapat kemungkinan satu data disiapkan dalam beberapa file berbeda untuk memenuhi aplikasi-aplikasi yang berbeda. Sedangkan basisdata dirancang dengan pendekatan sistem, memberikan suatu basisdata yang dapat dipergunakan untuk lebih dari satu aplikasi, dengan mengurangi terjadinya duplikasi data.

Basisdata dapat berperan sebagai landasan bagi sistem informasi untuk tujuan manajemen dan dapat mempengaruhi proses manajemen di dalam organisasi, dengan cara menurunkan kendala-kendala penggunaan waktu yang lama dan ketersediaan informasi.


(38)

2.6 PHP (PHP Hypertext Presprocessor)

PHP singkatan dari PHP Hypertext Preprocessor atau Personal Home Page Tools adalah sebuah bahasa server side scripting yang bisa digunakan dengan bahasa HTML atau dokumennya secara bersamaan untuk membangun sebuah aplikasi di web yang sangat banyak kegunaannya. Maksud dari server side scripting adalah sintaks dan perintah-perintah yang diberikan akan sepenuhnya dijalankan di server tetapi disertakan pada dokumen HTML.

PHP merupakan teknologi yang diperkenalkan pada tahun 1994 oleh Rasmus Lerdorf. Berupa sekumpulan script PERL digunakan pada situs pribadinya untuk mencatat siapa saja yang mengakses daftar riwayat hidup onlinenya. Rasmus menulis ulang script- script PERL tersebut dengan menggunakan bahasa C, kemudian menambahkan fasilitas untuk form HTML, koneksi MySQL dan pada tahun 1996 Rasmus meluncurkan PHP versi kedua yang diberi nama PHP/FI (PHP Interpreter). PHP ketiga dirilis pada pertengahan 1997. PHP versi ketiga ini dikembangkan oleh Rasmus beserta Zeew Suraski, Andi Gutman, Stig Bakken, Shane Caravero dan Jim Winstead. Versi keempat PHP dirilis pada bulan Oktober 2000. Perubahan mendasar pada PHP 4.0 adalah integrasi Zend Engine. Zend dibuat oleh Zeef Suraski dan Andi Gutmans yang merupakan penyempurnaan dari PHP 3.0, pada PHP 4.0 tidak lagi menggunakan library tambahan pada 3.0.

PHP merupakan bahasa scripting yang menyatu dengan HTML dan berada di sisi server (server side HTML – embedded scripting ). PHP didisain untuk terintegrasi dengan apache web server dan variannya akan tetapi PHP juga dapat


(39)

bekerja pada web server lain seperti Microsoft Internet Information Server. Platform sistem operasi yang didukung oleh PHP pada awalnya hanya sistem operasi Unix dan variannya. Namun sekarang ini PHP 4.0 telah mendukung banyak platform sistem operasi Windows 9x, Windows NT, Mac, dan lain-lain. Seluruh aplikasi berbasis web dapat dibuat dengan PHP, namun keunggulan PHP yang paling utama adalah untuk konektivitas basisdata dengan web. PHP membuat aplikasi web yang terkoneksi ke basisdata menjadi lebig murah. Sistem basisdata yang telah didukung oleh PHP saat ini adalah Oracle, Sybase, MySQL, Solid, Postgresql, Dbase, Unix Dbm, dan semua basisdata dengan interface ODBC.

Script PHP dijalankan di sisi server kemudian hasilnya ditransfer ke client. Keuntungan yang dapat diperoleh dengan proses yang dijalankan di server yaitu :

a. Keamanan data atau prosedur, dengan meletakkan aplikasi dan data di server maka dapat lebih terkontrol. Tidak ada client yang dapat melihat program dan mengubah data secara mudah.

b. Keamanan komunikasi, dengan terintegrasinya SSL atau HTTPS, PHP dapat membuat data lebih aman dari pembajakan. Ini penting digunakan terutama jika data tersebut dilewatkan pada jaringan public seperti internet.

c. Terkontrol, server side application secara umum lebih mudah untuk dimonitor, dibandingkan dengan pengawasan terhadap aplikasi yang tersebar pada banyak komputer client.


(40)

Kode program PHP menyatu dengan tag-tag HTML dalam suatu file. Kode PHP diawali dengan tag <? Atau <?PHP dan ditutup dengan tag ?>. File yang berisi tag HTML dan kode PHP ini diberi ekstensi .php atau ekstensi lainnya yang ditetapkan pada apache / web server. Berdasarkan ekstensi ini, pada saat file diakses, server akan tahu bahwa file ini mengandung kode PHP. Server akan menerjemahkan kode ini dan menghasilkan output dalam bentuk tag HTML yang akan dikirim ke browser client yang mengakses file tersebut.

Untuk lebih jelasnya dapat dilihat dalam format di bawah ini .Kode berikut ini adalah contoh kode PHP yang berada di dalam kode HTML :

<HTML> <HEAD>

<TITLE>Latihan Pertama</TITLE> </HEAD>

<BODY> <?PHP

echo ”Selamat mencoba PHP”; ?>

</BODY> </HTML>


(41)

Perhatikan baris-baris berikut : <?PHP

echo ”Selamat mencoba PHP”; ?>

Kode inilah yang merupakan kode PHP. Kode PHP diawali dengan <?PHP dan diakhiri dengan ?>. Pasangan kedua kode inilah yang berfungsi sebagai tag kode PHP. Berdasarkan tag inilah, pihak server dapat memahami kode PHP dan kemudian memprosesnya. Hasilnya dikirim ke browser.


(42)

Pada skema di atas dapat dijelaskan cara kerja PHP pada web sebagai berikut : a. Pemakai mengakses suatu situs web, dengan mengetikkan alamat yang

dituju pada web browser.

b. Web browser akan memberikan permintaan HTTP yaitu file-file PHP ke web server.

c. Web server akan menerjemahkan file PHP tersebut melalui mesin PHP. d. Kemudian hasilnya akan ditampilkan pada web browser beserta hasil

terjemahan HTML oleh web browser.

Sekilas mengenai script-script PHP a. Variabel

Variabel berfungsi untuk menyimpan suatu nilai dan nilai yang ada dapat diubah sewaktu-waktu.

Contoh :

$nama = ”data”; $nama adalah variabel. b. Pengenal

Pengenal (identifier) banyak digunakan dalam program untuk memberi nama variabel, fungsi atau kelas.

Aturan yang berlaku untuk pengenal :

1) Karakter yang dapat digunakan adalah huruf, angka, atau garis bawah (_ ).


(43)

3) Panjang pengenal bisa berapa saja. 4) Huruf kecil dan huruf kapital dibedakan.

Tabel 2.1 Contoh Pengenal Contoh Pengenal

Benar Salah

Nama 3bulan

Nama_pemakai Nama pemakai

_nama Nama-pemakai |

kuartal3 NamaBarang

c. Tipe data

Tipe data dasar PHP ada tiga macam, yaitu ; 1) integer

2) double 3) string d. Konstanta

Konstanta menyatukan nilai yang tetap di dalam program Contoh :


(44)

e. Operator

Operator adalah simbol yang digunakan dalam program untuk melakukan suatu operasi, misalnya penjumlahan datau perkalian, perbandingan kesamaan dua buah nilai, atau bahkan memberikan nilai ke variabel. Nilai yang diperlukan oleh operator (disebut operand atau argument) bersama-sama operator membentuk ungkapan (ekspresi).


(45)

1) Operator Aritmatika

Operator aritmatika adalah operator yang digunakan dalam operasi matematika.

Tabel 2.2 Operator aritmatika

Operator Kegunaan Prioritas

+ Penjumlahan Ketiga

- Pengurangan Ketiga

* Perkalian Kedua

/ Pembagian Kedua

% Sisa pembagian Kedua

++ Penaikan Pertama

-- penurunan Pertama

2) Operator Penugasan

Tabel 2.3 Operator Penugasan

Operator Kegunaan Prioritas

+=

Menambahkan variabel di sisi kiri dengan nilai di sisi kanan.

X += 2; Berarti X = X+2;

-=

Mengurangi isi variabel di sisi kiri dengan nilai di sisi kanan.

X -= 2; Berarti X = X-2; /= Membagi variabel di sisi kiri dengan X /= 2;


(46)

nilai di sisi kanan. Berarti X = X%2;

%=

Memperoleh sisa pembagian antara variabel di sisi kiri dengan nilai variabel di sisi kanan.

X %= 2; Berarti X = X%2;

&=

Melakukan operasi ”dan” / ”and” terhadap variabel di sisi kiri dengan nilai di sisi kanan.

X &= 2; Berarti X = X&2;

!=

Melakukan operasi ”atau” / ”or” terhadap variabel di sisi kiri dengan nilai di sisi kanan.

X != 2; Berarti X = X!2;

^=

Melakukan operasi ”XOR” terhadap variabel di sisi kiri dengan nilai di sisi kanan.

X ^= 2; Berarti X = ^!2;

.=

Melakukan operasi konkatenasi terhadap variabel di sisi kiri dengan nilai di sisi kanan.

X .= ’A’; Berarti X = X.’A’;


(47)

3) Operator Perbandingan

Operator perbandingan atau dikenal juga dengan operator relasional adalah operator yang digunakan untuk melakukan perbandingan dua buah operand dan menghasilkan nilai benar atau salah.

Tabel 2.4 Operator Perbandingan

operator Makna

== Sama dengan

< Kurang dari

> Lebih dari

<= Kurang dari atau sama dengan >= Lebih dari atau sama dengan

!= Tidak sama dengan

<> Tidak sama dengan

4) Operator logika

Operator logika bisa digunakan untuk menggabungkan kondisi berganda dan menghasilkan sebuah ekspresi yang bernilai benar (nilai 1) atau salah (nilai 0).

Jenis operator logika : a) AND atau && b) OR atau || c) XOR d) !


(48)

f. Pernyataan kontrol a) Pernyataan IF

Contoh :

if (ekspresi) pernyataan

b) Pernyataan Switch Contoh :

switch (ekspresi) {

case ekspresi_case1;

pernyataan_1; break;

case ekspresi_case2;

pernyataan_2; break;

case ekspresi_case2;

... default;

pernyataan_n; }


(49)

c) pernyataan while Contoh :

while (ekspresi) {

pernyataan

}

d) pernyataan do-while Contoh :

do {

pernyataan

}

while (ekspresi);

g. Array

Array adalah suatu wadah yang dapat menampung sejumlah nilai. Contoh :


(50)

h. Fungsi-fungsi MySQL yang umum digunakan untuk mengakses basisdata MySQL antara lain :

1) Fungsi mysql_connect

digunakan untuk membuat hubungan ke basisdata MySQL yang terdapat pada suatu host.

Contoh :

mysql_connect("$host","$username", "$passwd")

2) Fungsi mysql_select_db

Digunakan untuk memilih basisdata Contoh :

mysql_select_db($basisdata, $pengenal_hubungan)

3) Fungsi mysql_query

Digunakan untuk mengeksekusi permintaan terhadap sebuah tabel atau sejumlah tabel.

Contoh :

mysql_query ($permintaan, $pengenal_hubungan)

4) Fungsi mysql_num_rows

Digunakan untuk memperoleh jumlah baris dari suatu hasil permintaan (query) yang menggunakan SELECT.


(51)

5) Fungsi mysql_fetch_row

digunakan untuk menghasilkan suatu array yang berisi seluruh kolom dari sebuah baris pada suatu himpunan hasil.

contoh :

mysql_fetch_row($pengenal_hasil)

6) Fungsi mysql_fetch_array

Fungsi ini mempunyai kegunaan serupa dengan mysql_fetch_row. Hanya saja setiap kolom akan disimpan dua kali pada array hasil. Yang pertama memiliki indeks angka (dimulai dari nol) dan yang kedua berindekskan nama kolom.

Contoh ;

mysql_fetch_array($pengenal_hasil)

2.7 SQL

SQL (Structured Query Language) adalah bahasa yang digunakan untuk berkomunikasi atau bekerja dengan menggunakan sebuah basisdata. Melalui perintah query kita dapat bekerja atau memanipulasi objek basisdata seperti melihat status tabel, mengubah data-data yang ada di dalam tabel dan lain-lain. Pengetahuan akan SQL sangat berguna karena bahasa ini yang umum digunakan oleh produk RDBMS sebagai standar bahasa query bagi kebanyakan RDBMS. Beberapa hal yang menjadikan SQL sangat populer diantaranya karena penggunaan bahasa ini relatif mudah dimengerti sehingga memudahkan seorang pengguna awam untuk bekerja dengan bahasa SQL.


(52)

Pada dasarnya bahasa query SQL secara garis besar dapat dibagi menjadi tiga bagian yaitu:

a. DDL (Data Definition Language)

DDL adalah bahasa-bahasa SQL yang digunakan untuk membuat, memanipulasi atau menghapus skema yang ada di dalam basisdata. Bahasa yang terdapat di dalam DDL hanya berhubungan dengan skema basisdata, tidak berhubungan dengan data di dalamnya. Skema adalah struktur yang dimiliki oleh sebuah basisdata.

Perintah-perintah SQL yang termasuk DDL antara lain: 1) CREATE - digunakan untuk membuat tabel.

2) ALTER – digunakan untuk mengubah (modify) tabel yang telah dibuat, seperti menambah kolom baru, mengubah ukuran kolom, mengubah aturan-aturan yang berlaku untuk satu kolom.

3) DROP – digunakan untuk menghapus sebuah tabel. b. DML (Data Manipulation Language)

DML adalah bahasa-bahasa SQL yang digunakan untuk memanipulasi data yang terdapat di dalam basisdata seperti membuat data, menghapus data, dan lain-lain. Bahasa DML relatif lebih banyak digunakan sehari-hari dibandingkan perintah DDL.

Perintah-perintah SQL yang termasuk dalam DML adalah:

1) Perintah select digunakan untuk membaca (query) isi tabel. Contoh Contoh :


(53)

FROM nama tabel [INTO tabel tujuan] WHERE [kondisi]

Tanda (*) menunjukkan semua field yang ada akan dipilih.

2) Perintah insert digunakan untuk memasukkan data ke dalam tabel. Contoh :

INSERT INTO nama_tabel [(nama_field,…)] VALUES expresi

3)Perintah delete digunakan untuk menghapus sebuah record atau seluruh record dalam tabel.

Contoh :

DELETE FROM nama_tabel WHERE kondisi

4) Perintah update digunakan untuk memperbarui nilai suatu data. Contoh :

UPDATE namatabel SET criteria WHERE kondisi c. DCL (Data Control Language)

DCL adalah bahasa-bahasa SQL yang digunakan untuk mengatur user MySQL.


(54)

2.8 MySQL

MySQL adalah sebuah sistem manajemen basisdata. Untuk menambah, mengakses, dan memproses data yang tersimpan dalam basisdata komputer diperlukan suatu manajemen basisdata seperti MySQL. Sejak komputer dapat menangani data yang sangat besar dengan baik, manajemen basisdata memainkan peran inti dalam dunia komputer, baik sebagai perlengkapan yang berdiri sendiri, maupun sebagai bagian dari aplikasi lain.

MySQL merupakan sistem manajemen basisdata relasional. Relasional basisdata biasanya menempatkan data dalam tabel-tabel yang terpisah daripada menempatkan semuanya ke dalam suatu ruang penyimpanan besar. Hal tersebut bertujuan untuk meningkatkan kecepatan dan fleksibilitas.

MySQL merupakan software yang open source. Open source di sini berarti setiap orang diperbolehkan untuk menggunakan dan mengubahnya atau memodifikasinya. Semua orang dapat mendownload MySQL dari internet dan menggunakannya tanpa membayar.

Perintah-perintah dasar dalam MySQL a. Untuk membuat basisdata.

Contoh :

CREATE BASISDATA MYSQL;

b. Untuk menghapus basisdata. Contoh :


(55)

c. Untuk melihat atau menampilkan semua basis data yang ada pada server. Contoh :

SHOW BASISDATA;

d. Untuk masuk atau menggunakan basisdata yang dikehendaki. Contoh :

USE MYSQL;

e. Untuk membuat tabel. Contoh :

CREATE TABLE mahasiswa (nim varchar(10) NOT NULL default '', nama varchar(50) NOT NULL default '', PRIMARY KEY (nim) );

Perintah create table adalah perintah SQL untuk menciptakan tabel. Kolom nim dan nama masing-masing bertipe varchar dan dengan panjang masing-masing 10 dan 50 karakter. Artinya kolom ini dapat menampung karakter maksimal sebanyak jumlah tersebut.

f. Untuk melihat tabel-tabel yang ada di dalam basisdata. Contoh :

SHOW TABLES;

g. Untuk menghapus tabel yang ada di dalam basisdata Contoh :


(56)

h. Untuk menampilkan secara lengkap atas detail suatu tabel ataupun field-field dan tipe data.

Contoh :

DESC MAHASISWA;

i. Untuk menampilkan data-data dari basisdata sesuai dengan yang diinginkan.

Contoh :

SELECT * FROM MAHASISWA;

SELECT NIM, NAMA FROM MAHASISWA;

SELECT * FROM MAHASISWA WHERE NAMA LIKE ”ANTON”

j. Untuk memasukkan data ke dalam basisdata. Contoh :

INSERT INTO MAHASISWA VALUES ('045314010', 'YUDI PRIHARTANTO');

k. Untuk mengupdate ataupun mengubah data yang ada pada basisdata. Contoh :

UPDATE MAHASISWA SET NIM = '045314001' WHERE NAMA = 'YUDI PRIHARTANTO';

l. Untuk menghapus data-data yang ada pada basisdata. Contoh :


(57)

2.9 Multimedia

Dalam dunia komputer, multimedia adalah program perangkat lunak yang menggunakan lebih dari satu cara untuk mengkombinasikan informasi pada user (Tway, 1992). Multimedia juga pada dasarnya dapat didefinisikan sebagai teknologi yang mengkombinasikan teks, gambar, animasi, audio, video dan link interaktif. Suatu multimedia yang dapat menangani interaktif user disebut juga interactive multimedia (multimedia interaktif), dimana user dapat memilih apa yang dikerjakan selanjutnya dan tindakan tersebut akan mempengaruhi komputer untuk mengerjakan fungsi berikutnya (Hadi Sutopo, 2003). Sebagaimana telah disebutkan sebelumnya, beberapa objek yang terdapat dalam multimedia antara lain adalah:

a. Teks: merupakan dasar dari pengolahan kata yang terdiri dari kumpulan huruf atau karakter untuk menampilkan informasi. Dapat tersaji sebagai bagian dari grafik bitmap maupun vektor. Format standar untuk file teks antara lain: text (.txt), RichText(.rtf), atau Hypertext Markup Languange (HTML) untuk pembuatan halaman web.

b. Image: biasa disebut grafik yang merupakan gambar diam (still image) seperti foto atau lukisan. Pada dasarnya format grafik bitmap adalah gambar yang terbentuk dari garis dan kurva. Format standar filenya antara lain: bitmap (.bmp). Join Photography Expert (JPEG) dan sebagainya. Sedangkan grafik vektor adalah sebuah grafik yang terbentuk dari titik-titik yang diwarnai dan tersusun dalam sebuah grid yang dinamakan pixel. Format standar filenya antara lain adalah flash (.fla), dan sebagainya.


(58)

c. Animasi: menunjukkan sebuah seri dari gambar grafik yang menirukan gerakan dan memiliki sifat dinamis juga berisi penyamaan suara, serta dapat menerangkan sesuatu yang sulit diterangkan melalui teks. Animasi dalam multimedia bertipe frame-based yaitu sebuah layer atau frame yang ditunjukkan berurutan dengan kecepatan tertentu. Format umum file animasi antara lain: Gif Animator (.Gif), Shockwave Flash (.swf), Quick Time Movie (.mov), dan sebagainya.

d. Audio: suara atau bunyi yang digunakan untuk memperjelas pengertian suatu informasi atau karakteristik suatu gambar. Penyajian suatu sistem akan lebih menarik bila disertai efek, musik latar atau voice. Beberapa format standar media suara antara lain: Wave Form Audio (.wav), Mpeg Layer-3 Audio (.mp3), Musical Instrumen Digital Interface (MIDI), dan sebagainya.

e. Video: untuk full-motion berupa clip, sedangkan live video terdiri dari bagian dari gambar-gambar yang diproyeksikan ke layer dan merupakan hasil pemrosesan yang diperoleh dari kamera. Berupa format standar media video antara lain: Audio Visual Interface (AVI), Mpeg Video (MPG), dan sebagainya.

f. Link: digunakan untuk menunjuk pada statu objek atau tombol agar dapat mengakses program tertentu sehingga menjadi informasi yang terpadu. Karena kemampuannya dalam penyampaian informasi yang menarik dan interaktif, multimedia telah banyak dimanfaatkan untuk berbagai macam


(59)

keperluan diantaranya: presentasi, iklan, game, web, dan keperluan lainnya.

2.10 Macromedia Flash 8

Macromedia flash 8 adalah salah satu program animasi grafis yang banyak digunakan para designer untuk menghasilkan karya-karya profesional, khususnya dalam bidang animasi. Perangkat ini cukup fleksibel untuk keperluan pembuatan animasi.

Macromedia flash 8 sering digunakan untuk pembuatan animasi interaktif maupun non interaktif, seperti animasi pada halaman web, animasi kartun, presentasi, portofolio sebuah perusahaan, game, dan beberpa media animasi lainnya.

Keunggulan Macromedia Flash 8 dibanding program lain yang sejenis, antara lain:

a. Membuat tombol interaktif dengan sebuah movie atau objek yang lain. b. Membuat perubahan transparansi warna dalam movie.

c. Membuat perubahan animasi dari satu bentuk ke bentuk yang lain. d. Membuat gerakan animasi dengan mengikuti alur yang telah ditetapkan. e. Dikonvesi dan dipublikasi ke dalam beberapa tipe di antaranya adalah:


(60)

2.10.1 Timeline

Timeline merupakan panel utama yang berfungsi untuk mengatur cepat atau lambatnya animasi yang kita buat dan sebagai wadah untuk menyatukan objek-objek dari setiap layer.

2.10.2 Simbol

Dengan merubah suatu objek menjadi simbol, itu artinya objek tersebut sudah menjadi bentuk yang pasti dan kita tidak bisa memanipulasinya lagi di dalam stage misalnya berubah warna atau memberikan coretan di atasnya.

Jenis simbol (behavior) antara lain :

a. Movie clip : objek digunakan untuk beranimasi. b. Button : objek dibuat sebagai tombol.

c. Grafik : objek dibuat sebagai gambar yang statis atau tidak beranimasi.

2.10.3 Library

Library di dalam flash fungsinya sesuai dengan namanya adalah sebuah tempat penyimpanan simbol yang sudah kita buat. Jika kita membuat sebuah simbol maka secara otomatis simbol tersebut akan masuk ke dalam library. Jadi selama kita bekerja semua simbol yang sudah pernah kita buat, walaupun sudah kita hapus, simbol tersebut masih tersimpan dalam library.


(61)

2.10.4 Action Script

Action Script adalah bahasa yang menjembatani antara bahasa yang kita kenal dengan dengan bahasa yang dikenal oleh flash. Action Script mengijinkan kita membuat instruksi berorientasi action dan instruksi logic (analisa masalah sebelum melakukan perintah). Sama dengan bahasa pemrograman yang lain, action script berisi banyak elemen yang berbeda serta strukturnya sendiri. Sebuah action biasanya berada pada beberapa baris yang menginstruksi pada flash untuk berbuat, membuat, mengubah, me-load atau menghapus.

Dalam action script terdapat beberapa perintah yang sering digunakan untuk membuat animasi, antara lain :

Action Script – goto a. gotoAndPlay

Digunakan untuk menuju ke frame tertentu dan memainkan animasi yang ada di frame tersebut.

Contoh :

on (release)

{ gotoAndPlay(”Scene 1”, 25); }

sintak di atas adalah menuju ke scene 1 frame 25 dan langsung memainkan animasi mulai dari frame 25.


(62)

b. gotoAndStop

Digunakan untuk menuju ke frame tertentu dan berhenti di frame tersebut. Contoh :

on (release)

{gotoAndStop(”Scene 1”, 25); }

Sintak di atas adalah menuju ke scene 1 frame 25 dan langsung berhenti pada frame 25.

Action Script – on

Sintak on digunakan untuk mendukung sintaks yang lain. Contoh :

on () {}

Action Script – play

Sintak play digunakan untuk menjalankan movie. Contoh :


(63)

Action Script – loadMovie

Sintak loadMovie digunakan untuk memanggil dan menjalankan animasi flash yang telah disimpan.

Contoh :

on (release)


(64)

41

BAB III

ANALISIS DAN DESAIN SISTEM

3.1 Gambaran Umum Sistem

Sistem ini digunakan sebagai progam bantu untuk pembelajaran basisdata. dalam sistem ini secara khusus hanya dibahas materi select, insert, update, dan delete. Sistem ini dikemas dalam bentuk visualisasi yang interaktif. Berdasarkan perihal di atas terdapat beberapa pertimbangan yang berkaitan dengan kebutuhan sistem, antara lain :

a. Penyesuaian aplikasi dengan kemampuan pengguna dalam memahami aplikasi yang dibuat.

b. Pengguna sistem adalah mahasiswa atau dapat pula orang awam yang ingin belajar tentang basisdata.

Dari kedua hal tersebut, spesifikasi fasilitas sistem yang diperlukan adalah : a. Komponen atau elemen yang menjadi daya tarik, antara lain :

1) gambar 2) animasi

b. Materi pembelajaran antara lain meliputi pembelajaran basisdata, yang memuat materi antara lain :

1) Pengenalan konsep basisdata.


(65)

Gambaran umum sistem dapat dilihat pada tabel beriikut ini : Tabel 3.1 Deskripsi Konsep Sistem

Judul

Aplikasi Sumber Belajar Digital Dalam Bentuk Visualisasi Query Terbatas Untuk Matakuliah

Basisdata

User Mahasiswa

Durasi Sesuai dengan kebutuhan user

Image Menggunakan IMG, GIF, dan PNG

Video Tidak menggunakan

Animasi Menggunakan animasi teks dan grafis Interaktif Select, Insert, Update, dan Delete


(66)

3.2 Analisis Sistem

Analisis sistem dapat didefinisikan sebagai pengurai dari suatu sistem informasi yang utuh ke dalam bagian-bagian komponennya dengan maksud mengidentifikasikan dan mengealuasi permasalahan-permasalahan dan hambatan-hambatan yang terjadi, serta kebutuhan yang diharapkan sehingga dapat diusulkan perbaikannya.

Metode yang digunakan untuk pembuatan aplikasi ini adalah metode terstruktur yang digambarkan dengan DFD (Data Flow Diagram).

a. Indentifikasi kesatuan luar (external entity) yang terlibat dalam sistem adalah pengguna (user).

b. Identifikasi input dan output yang terlibat dengan kesatuan luar (external entity)

• Pengguna (user)

1) Input : pilih menu, perintah SQL. 2) Ouptut : materi, animasi


(67)

3.2.1 Use Case

Use Case diagram dari sistem yang akan dibuat dapat dilihat pada gambar di bawah ini :

user Materi pembelajaran Visualisasi SQL Bantuan

Gambar 3.1 Use Case User

3.3 Desain Sistem

Desain sistem didefinisikan sebagai penggambaran, perencanaan, dan pembuatan sketsa atau pengaturan dari beberapa elemen yang terpisah dalam satu kesatuan yang utuh dan berfungsi (John Burch & Gary Grudnitski).

Tahap desain sistem memiiki dua tujuan utama, yaitu : a. Untuk memenuhi kebutuhan kepada pemakai sistem.

b. Untuk memberikan gambaran yang jelas dan rancang bangun yang lengkap kepada pemrogram komputer dan ahli-ahli teknik lainnya yang terlibat.

Desain sistem Aplikasi Sumber Belajar Digital Dalam Bentuk Visualisasi Query Terbatas Untuk Matakuliah Basisdata dimulai dari desain proses, desain basisdata, dan desain antar muka


(68)

3.3.1 Desain Proses

Sistem ini dirancang dengan menggunakan pendeketan SDLC. SDLC merupakan urutan terstrukturdari suatu tugas pengembangan sistem informasi. SDLC terstruktur sangat bermanfaat dan diperlukan untuk menyusun, mengembangkan, dan membuat sistem informasi baru. Untuk dapat melakukan langkah-langkah sesuai dengan yang diberikan oleh pendekatan SDLC, maka dibutuhkan DFD (Data Flow Diagram).

3.3.1.1 Diagram Konteks (Context Diagram)

Diagram konteks merupakan sebuah diagram sederhana yang menggambarkan hubungan antara entitas luar, masukkan dan keluaran dati sistem.

Berikut adalah gambar diagram konteks dari aplikasi sumber belajar digital dalam bentuk visualisasi query terbatas untuk matakuliah Basisdata :

Gambar 3.2 Diagram Konteks


(69)

3.3.1.2Diagram Berjenjang

Gambar 3.3 Diagram Berjenjang

3.2.1.3 DFD (Data Flow Diagram) 3.2.1.3.1 DFD Level 0


(70)

3.2.1.3.2 DFD Level 1 Proses 1


(71)

3.2.1.3.3 DFD Level 1 Proses 2


(72)

3.2.1.3.4 DFD Level 1 Proses 3


(73)

3.3.2 Desain Basisdata

Basisdata adalah suatu wadah untuk menyimpan dan menyediakan data-data atau informasi yang akan dipakai oleh sistem informasi, oleh karena itu basisdata merupakan komponen yang penting dalam pembuatan sistem.

Basisdata merupakan salah satu komponen yang sangat penting di sistem informasi, karena berfungsi sebagai penyedia informasi bagi para penggunanya. Penerapan basisdata dalam sistem informasi disebut dengan sistem basisdata (database system). Sistem basisdata ini adalah salah satu sistem informasi yang mengintegrasikan kumpulan data yang saling berhubungan satu dengan yang lainnya dan membuat tersedia untuk beberapa aplikasi yang bermacam-macam dalam suatu organisasi.

3.3.2.1ER Diagram

Maksud dibuatnya ER diagram adalah untuk menjelaskan entitas-entitas dari basisdata beserta atribut-atributnya dan menggambarkan hubungan entitas-entitas yang dibangun.

ER diagram untuk sistem yang akan dibangun dapat dilihat pada gambar di bawah ini :


(74)

Pada ER diagram tersebut terlihat adanya relasi antara entitas jurusan dengan entitas mahasiswa yang merupakan relasi one-to-many, relasi tersebut bernama terdaftar. Pada relasi ini mahasiswa dapat terdaftar pada satu jurusan, dan untuk setiap jurusan dapat diambil oleh lebih dari satu mahasiswa.

Gambar 3.9 ER Diagram Visualisasi Dinamis

Pada ER diagram tersebut terlihat adanya relasi antara entitas matakuliah dengan entitas mahasiswa2 yang merupakan relasi many-to-many, relasi tersebut bernama mengambil. Pada relasi ini mahasiswa2 dapat mengambil lebih dari satu matakuliah, demikian juga sebaliknya setiap matakuliah dapat diambil oleh lebih dari satu mahasiswa2.


(75)

3.3.2.2Relasi Antar Tabel

Gambar 3.10 Basisdata Visualisasi Animasi

Desain basisdata ini dibuat menggunakan diagram relasi entitas atau ER diagram yang didasarkan atas entitas dan terdapat hubungan.

a. entitas jurusan, dengan atribut : kode_jurusan, jurusan, kajur. b. entitas mahasiswa, dengan atribut : nim, nama, kode_jurusan


(76)

Desain basisdata ini dibuat menggunakan diagram relasi entitas atau ER diagram yang didasarkan atas entitas dan terdapat hubungan.

a. Entitas mahasiswa2, dengan atribut : nim, dan nama b. Entitas matakuliah, dengan atribut : kode_mk, nama_mk. c. Entitas nilai, dengan atribut : nim, kode_mk, dan nilai.

3.3.2.3Struktur File Basisdata

Berikut adalah rancangan tabel-tabel yang akan dibuat : Tabel 3.2 Jurusan

Nama Field Tipe Panjang Keterangan

PK kode_jurusan Varchar 4 not null

jurusan Varchar 25 not null

kajur Varchar 100 not null

kode_jurusan digunakan sebagai primary_key. Tabel jurusan ini memiliki relasi one-to-many dengan tabel mahasiswa.

Tabel 3.3 Mahasiswa

Nama Field Tipe panjang Keterangan

PK nim Varchar 10 not null

nama Varchar 50 not null


(77)

nim digunakan sebagai primary key. Tabel mahasiswa ini memiliki relasi many-to-one antara tabel mahasiswa2 dengan matakuliah.

Tabel 3.4 Mahasiswa2

Nama Field tipe Panjang Keterangan

PK nim varchar 10 not null

nama varchar 50 not null

nim digunakan sebagai primary key. Tabel mahasiswa2 ini memiliki relasi one-to-many dengan nilai.

Tabel 3.5 Matakuliah

Nama Field tipe panjang Keterangan

PK kode_mk varchar 10 not null

nama_mk varchar 50 not null

kode_mk digunakan sebagai primary key. Tabel matakuliah ini memiliki relasi one-to-many dengan nilai.


(78)

Tabel 3.6 Nilai

Nama Field Tipe panjang Keterangan

PK Nim Varchar 10 not null

PK kode_mk Varchar 10 not null

Nilai Char 1 not null

nim dan kode_mk digunakan sebagai primary key. Tabel nilai ini merupakan hasil relasi many-to-many antara tabel mahasiswa2 dengan matakuliah.

3.3.3 Desain Antarmuka

Sistem ini mempunyai beberapa antarmuka yang memungkinkan user berinteraksi dengan sistem, yaitu :

3.3.3.1Desain Tampilan Form Utama


(79)

Menu utama :

a. Materi Pembelajaran : fasilitas untuk mempelajari materi-materi yang diberikan.

b. Visualisasi SQL : fasilitas untuk mencoba melihat proses query dan menerapkan materi-materi yang didapat untuk dilihat hasilnya.

c. Bantuan : fasilitas untuk membantu pengguna jika mengalami kesulitan dalam memakai program.

3.3.3.2Desain Menu Materi Pembelajaran 3.3.3.2.1 Desain Pengenalan Konsep Database


(80)

3.3.3.2.2 Desain Perintah SQL

Gambar 3.14 Desain Perintah SQL

3.3.3.2.3 Desain Visualisasi SQL Animasi


(81)

3.3.3.2.4 Desain Visualisasi SQL Dinamis

Gambar 3.16 Desain Visualisasi SQL Dinamis

3.3.3.3Desain Menu Visualisasi SQL 3.3.3.3.1 Desain Animasi


(82)

3.3.3.3.2 Desain Dinamis

Gambar 3.18 Form Query Dinamis 3.3.3.4Desain Menu Bantuan

3.3.3.4.1 Desain Pengantar


(83)

3.3.3.4.2 Desain Kebutuhan Sistem

Gambar 3.20 Desain Kebutuhan Sistem 3.3.3.4.3 Desain Instalasi Aplikasi


(84)

3.3.3.4.4 Desain Memulai Program


(85)

62

BAB IV

IMPLEMENTASI DAN PEMBAHASAN

4.1 Implementasi Program

Implementasi merupakan tahap pengembangan dari hasil perancangan. Pada bab ini akan dijelaskan hasil implementasi (pengembangan) dan jalannya program. Aplikasi ini dapat digunakan oleh siapapun yang ingin mempelajari proses berjalannya query, dan juga dasar-dasar sintak query tersebut, dalam hal ini query yang dimaksud adalah query DML (Data Manipulation Language).

Susunan dari program ini terdiri dari sekumpulan file-file PHP, modul flash movie dan basisdata yang terintegrasi antara satu dengan yang lainnya, sehingga membentuk sebuah aplikasi pembelajaran yang utuh.

4.1.1 Menjalankan Program

Program ini dapat dijalankan dengan cara menginstall program xampp atau server2go.

Cara menginstall program pada xampp : a. Install xampp-win32-1.5.5-installer.exe

b. Instalasi pada drive C, klik next sampai instalasi selesai.

c. Copy database ta di dalam folder ta ke c:\Program files\xampp\mysql\data\ d. Copy folder visualisasisql pada c:\Program files\xampp\htdocs\


(86)

e. Buka XAMPP Control Panel Application jalankan MySQL dengan menekan tombol start, setelah tombol start ditekan maka akan muncul pesan seperti di bawah ini.


(87)

f. Jika program sudah terinstal dengan benar dapat dicek dengan cara pada alamat browser ketikan http://localhost/visualisasisql, maka akan muncul gambar di bawah ini :


(88)

Cara menginstall program pada server2go :

a. Copy folder server2go_a2 ke salah satu drive dalam hardisk anda. b. Copy database dengan nama ta ke dalam drive C:\MyS2GApp\Data c. Copy folder visualisasisql pada folder server2go yang telah dicopy pada

drive(langkah no 1) misalkan dicopy di drive D. Contoh sebagai berikut D:\server2go\htdocs\

d. Jalankan Server2Go.exe di dalam folder yang anda copy pada no 1. Sehingga sampai muncul gambar di bawah ini


(89)

e. Pada address tertulis alamat http://127.0.0.1:4001, silahkan anda tambahkan visualisasisql di belakang http://127.0.0.1:4001

Contoh sebagai berikut http://127.0.0.1:4001/visualisasisql


(90)

4.1.2 Menggunakan Program 4.1.2.1 Menu Utama

Setelah koneksi terhubung maka akan muncul gambar di bawah ini :

Gambar 4.5 Menu Utama

Gambar di atas merupakan tampilan menu utama program. Dapat dilihat pada tulisan sebelah kiri adalah menu-menu yang disediakan, menu-menu tersebut terdiri dari tiga bagian yaitu :

a. Materi Pembelajaran

Pada menu ini terdapat tiga sub materi yaitu : 1) Pengenalan Konsep Database.

2) Perintah SQL.

3) Visualisasi SQL animasi. 4) Visualisasi SQL dinamis.


(91)

b. Visualisasi SQL

Pada menu ini terdapat dua sub menu yaitu : 1) Animasi

2) Dinamis c. Bantuan

Pada menu ini terdapat empat sub menu yaitu : 1) Pengantar.

2) Kebutuhan sistem. 3) Instalasi aplikasi 4) Memulai program


(92)

4.1.2.2 Menu Materi Pembelajaran 4.1.2.2.1 Sub Menu Materi

Pada sub menu ini berisi materi singkat tentang pengenalan konsep basisdata, di dalamnya juga dijelaskan tujuan pembuatan, dan cara mengoperasian aplikasi, dan modul flash seperti gambar di bawah ini ;


(93)

Di bawah ini terdapat gambar modul flash tentang pengenalan konsep basisdata

Gambar 4.7 Modul Flash Pengenalan Konsep Basisdata

Pada halaman ini berisi pengantar basisdata, dan teori singkat tentang basisdata. Setelah tekan tombol masuk, pada gambar di bawah ini berupa contoh diambil dari halaman ke empat :


(94)

Pada sub menu ini berisi materi singkat tentang perintah sql, di dalamnya juga dijelaskan tujuan pembuatan, dan cara mengoperasian aplikasi, dan modul flash seperti gambar di bawah ini ;


(95)

Di bawah ini terdapat gambar modul flash tentang Perintah SQL

Gambar 4.10 Modul Flash Perintah SQL.

Pada halaman ini berisi standar kompetensi, kompetensi dasar, dan pokok bahasan Tekan tombol next maka akan masuk ke halaman dua, seperti gambar di bawah ini :


(96)

Pada halaman dua ini berisi teori singkat tentang perintah select beserta contoh sintaknya.

Script pada tombol next : on (release)

{ nextFrame(); }

Script pada tombol back : on (release)

{ prevFrame(); }

Tekan tombol next maka akan masuk ke halaman tiga, seperti gambar di bawah ini :


(97)

Tekan tombol next maka akan masuk ke halaman empat, seperti gambar di bawah ini :

Gambar 4.13 Modul Flash Sintak Group By

Pada halaman ini berisi teori singkat tentang sintaks group by beserta contoh sintaknya.

Tekan tombol next maka akan masuk ke halaman lima, seperti gambar di bawah ini :


(98)

Tekan tombol next maka akan masuk ke halaman enam, seperti gambar di bawah ini :

Gambar 4.15 Modul Flash Sintak Insert

Pada halaman ini berisi teori singkat tentang operator beserta contoh sintaknya. Tekan tombol next maka akan masuk ke halaman tujuh, seperti gambar di bawah ini :


(99)

Tekan tombol next maka akan masuk ke halaman delapan, seperti gambar di bawah ini :

Gambar 4.17 Modul Flash Sintak Delete

Tekan tombol next maka akan masuk ke halaman sembilan, seperti gambar di bawah ini :


(100)

Tekan tombol next maka akan masuk ke halaman sepuluh, seperti gambar di bawah ini :


(1)

(2)

(3)

(4)

(5)

(6)