Perancangan Aplikasi Pembelajaran Tumbuhan Monokotil dan Dikotil Berbasis Multimedia Untuk Anak SMA Kelas XI

(1)

SURAT KETERANGAN Hasil Uji Program Tugas Akhir

Yang bertanda tangan dibawah ini, menerangkan bahwa Tugas Akhir Mahasiswa Program Diploma 3 Teknik Informatika :

Nama : RIRIS LUMBANTOBING

NIM : 132406114

Program Studi : D3 Teknik Informatika

Judul TA : Perancangan Aplikasi Pembelajaran Tumbuhan Monokotil dan Dikotil Berbasis Multimedia Untuk Anak SMA Kelas XI

Telah melaksanakan test program Tugas Akhir Mahasiswa tersebut diatas tanggal...Juni 2016

Dengan Hasil : Sukses / Gagal

Demikian diterangkan untuk digunakan melengkapi syarat pendaftaran Ujian Meja Hijau Tugas Akhir Mahasiswa bersangkutan di Departemen Matematika FMIPA USU Medan.

Medan, Juni 2016 Dosen Pembimbing

Dr. Syahriol Sitorus, S.Si. M.IT NIP. 197103101997031004

(2)

KARTU BIMBINGAN TUGAS AKHIR MAHASISWA

Nama Mahasiswa : RIRIS LUMBANTOBING

Nomor Stambuk : 132406114

Judul Tugas Akhir : PERANCANGAN APLIKASI PEMBELAJARAN TUMBUHAN MONOKOTIL DAN DIKOTIL BERBASIS MULTIMEDIA UNTUK ANAK SMA KELAS XI

Dosen Pembimbing : Dr. Syahriol Sitorus, S.Si. M.IT Tanggal Mulai Bimbingan :

Tanggal Selesai Bimbingan :

No. Tanggal Asisten Bimbingan

Pembahasan pada Asistensi Mengenai,

pada Bab :

Paraf Dosen

Pembimbing Keterangan 1

2 3 4 5 6 7

Diketahui,

Ketua Prodi D3 Teknik Informatika Disetujui,

FMIPA USU Pembimbing Utama

Dr. Elly Rosmaini, M.Si. Dr. Syahriol Sitorus, S.Si.M.IT NIP. 196005201985032002 NIP. 197103101997031004

(3)

LISTING PROGRAM

1. Index.php

<!DOCTYPE html> <html lang="en"> <head>

<title>PlaNart</title>

<link

href='https://fonts.googleapis.com/css?family=Open+Sans :400,300,600,600italic,400italic,800,700'

rel='stylesheet' type='text/css'> <link

href='https://fonts.googleapis.com/css?family=Oswald:40 0,700,300' rel='stylesheet' type='text/css'>

</head> <body>

<div class="DesignHolder">  <div class="LayoutFrame">

<header>

<div class="site-logo"> <h1><a

href="#">Pl<span>aNa</span>rt</a></h1> </div>

<nav class="Navigation">

(4)

<ul> <li class="active"> <a href="#home">Beranda</a> <span class="menu-item-bg"></span> </li> <li> <a href="#about">Tentang</a> <span class="menu-item-bg"></span> </li> <li> <a href="#contact">Kontak</a> <span class="menu-item-bg"></span> </li> </ul> </nav>

</div>

</div>

</header>

<div class="Banner_sec" id="home">  <div class="bannerside">

<div class="leftside"> <h3>Mari<span>Belajar</span></h3> <br></br> <a href="index.html">MATERI</a> <a href="video.html">simulasi</a> <br> <a

href="soalmudah.php">Latihan Soal Mudah</a> <a

href="soalsedang.php">Latihan Soal Sedang</a> <a

href="soalsulit.php">Latihan Soal Sulit</a> </br>

(5)

<div class="rightside"> <ul id="slider"> <li> <div class="Slider"> <figure><img src="img/biar-kuncupnya-mekar-jadi-bunga.jpg"></figure> <div class="text"> <div class="Lorem"> <p>Belajar Biologi <span>Menyenangkan</span></p> </div> </div> </div> </li> <li> <div class="Slider"> <figure><img src="img/Lotus.jpg"></figure> <div class="text"> <div class="Icon"> </div> <div class="Lorem"> <p>Belajar Biologi<span>Menyenangkan</span></p> </div> </div> </div> </li> </ul> <figure><img

src="img/resize.jpg" alt="image"

class="Shadow"></figure> </div>

</div>

</div>

<div class="clear"></div>

</div>

<div class="bgcolor"></div>

<div id="Container">

(6)

<div class="About_sec" id="about">

<div class="Center"> <h2>Tentang</h2> <p>Multimedia adalah penggunaan komputer untuk menyajikan dan menggabungkan teks, suara, gambar, animasi, audio dan video dengan alat bantu (tool) dan koneksi (link) sehingga pengguna dapat

melakukan navigasi, berinteraksi, berkarya dan

berkomunikasi. Multimedia sering digunakan dalam dunia informatika. Selain dari dunia informatika, multimedia juga diadopsi oleh dunia game, dan juga untuk membuat website.

<br>Pembelajaran yang berkualitas sangat tergantung dari motivasi pelajar dan kreatifitas pengajar. Maka untuk memberikan alternative pembelajaran mengenai tumbuhan monokotil dan dikotil ini, dibutuhkan suatu sarana pembelajaran yang bersifat interaktif dan efektif.</p>

<ul>

<li><a href="javascript:;" class="tabLink activeLink" id="cont-1">Tujuan</a></li> <li><a href="javascript:;" class="tabLink" id="cont-2">Sasaran</a></li>

<li><a href="javascript:;" class="tabLink" id="cont-3">Tambahan</a></li>

</ul>

<div class="TabImage"> <div class="img1"> <figure><img

src="img/Green Leaf Wallpapers 1.jpg"

alt="image"></figure> </div> <div class="img2"> <figure><img src="img/gambar-bunga-sepatu-2.jpg" alt="image"></figure> </div> </div>

<div class="Description"> <h3>Tujuan<span>Pembelajaran Tumbuhan Monokotil dan

(7)

<p>Aplikasi ini diharapkan dapat memudahkan dan meningkatkan proses belajar mengajar.</p>

<p>sehingga dapat memberikan kemudahan dalam proses pembelajaran tentang tumbuhan monokotil dan dikotil.</p>

</div> </div>

<div class="tabcontent hide" id="cont-2-1"> <div class="TabImage"> <div class="img1"> <figure><img src="img/about-img2.jpg" alt="image"></figure> </div> <div class="img2"> <figure><img src="img/about-img1.jpg" alt="image"></figure> </div> </div> <div class="Description"> <h3>Rancangan

Aplikasi<span>Pembelajaran Tumbuhan Monokotil dan Dikotil</span></h3>

<p>Perancangan aplikasi ini menggunakan Adobe Flash CS3 Profesional. Aplikasi pembelajaran ini hanya membahas tentang pelajaran biologi khususnya tumbuhan monokotil dan dikotil.</p> <p>Class aptent taciti sociosqu ad litora torquent per conubia nostraper inceptos himenaeos. Mauris in erat justo. Nullam ac urna eu felis dapibus.</p>

</div> </div>

(8)

<h3>Harapan dari aplikasi <span>Pembelajaran Tumbuhan Monokotil dan Dikotil</span></h3>

<p>Dengan adanya aplikasi ini semoga memberikan manfaat seperti yang saya harapkan, yaitu</p>

<p>Membantu siswa dalam memahami materi tentang tumbuhan monoktil dan dikotil serta Meningkatkan pemanfaatan komputer sebagai media pembelajaran berbasis multimedia.</p>

</div> </div>

</div>

</div>

<div class="Contact_sec" id="contact"> <div class="Contactside"> <div class="Center"> <h2>Kontak</h2> <div class="Line"></div> </div> </div>

<div class="Get_sec">

<h3 style="color: black;">Untuk Informasi</h3>

Jl. Berdikari No.7, Pasar 1, Padang Bulan,<br>Medan, Sumatera Utara.

</address>

(08) 2274 434 600 </address>

(9)

href="mailto:riris8536@gmail.com" style="color: brown;">riris8536@gmail.com</a>

</address> <div

class="clear"></div>

</div>

</div>

<footer>

</div> </footer>

</div>

</div>

</div>

</div>

</div>

<div id="loader-wrapper">

src="js/jquery.sudoSlider.min.js"></script>

src="js/global.js"></script>

src="js/modernizr.js"></script> </body>

(10)

2. Koneksi.php

<?php

$db_host = "localhost"; $db_user = "root";

$db_pass = "";

$db_data = "dbflash";

// Perintah koneksi Server MySQL $koneksi

= mysql_connect($db_host, $db_user, $db_pass) or die ("Koneksi gagal".mysql_error()); mysql_select_db($db_data, $koneksi)

or die ("Baca DB gagal".mysql_error()); ?>

3.Index.html

4. Video.html

</body> </html>

5. Admin.php

<?php

include "koneksi.php";

$namapengguna = $_POST['namapengguna']; $password = $_POST['password'];

$query = "INSERT INTO tb_admin VALUES

('$namapengguna', '$password')"; $result = mysql_query($query); if ($query) {

echo("<script>alert('Data Berhasil Disimpan'); window.location = 'index.php'</script>");

(11)

} else{ mysql_error(); }?> 6. Soalmudah.php <!DOCTYPE html> <html lang="en"> <head>

<title>PlaNart</title>

</head> <body>

<div class="DesignHolder">  <div class="LayoutFrame">

<header> <div class="Center"> <div class="site-logo"> <h1><a href="#">Pl<span>aNa</span>rt</a></h1> </div> <div id="mobile_sec">

(12)

<nav class="Navigation"> <ul> <li class="active"> <a href="index.php">Beranda</a> <span class="menu-item-bg"></span> </li> </ul> </nav>

</div>

</div>

</header>

<div style="margin-left:150px;

height:30px; font-family:'Trebuchet MS';

font-size:15px;" >

<?php

include "koneksi.php";

$soal = mysql_query("SELECT * FROM tb_soalmudah order by rand() limit 10");

$no = 1;

while($s = mysql_fetch_array($soal)){ echo "$no. ".$s['soal']."<br>\n";

echo "<input type=radio

name=soal[".$s['id']."] value='a'>A.

".$s['pilihan_a']."<br>\n";

echo "<input type=radio

name=soal[".$s['id']."] value='b'>B.

".$s['pilihan_b']."<br>\n";

echo "<input type=radio

name=soal[".$s['id']."] value='c'>C.

".$s['pilihan_c']."<br>\n";

echo "<input type=radio

name=soal[".$s['id']."] value='d'>D.

".$s['pilihan_d']."<br><br><br>\n"; $no++;

(13)

}

$soal = $no - 1;

echo "<input type='hidden'

name='jawabansoal' value= $soal>"; ?>

<input style="width:200px;

margin-left:180px; height:30px; border:1px;

font-family:'Trebuchet MS'; font-size:15px;" type="submit" value="DONE"/><br><br> </div> </form> </div> <div class="clear"></div> </div>

<div id="Container">

<footer>

</div> </footer>

</div>

</div>

</div>

</div>

</div>

<div id="loader-wrapper">

(14)

src="js/modernizr.js"></script> </body>

</html>

7. Soalsedang.php

<!DOCTYPE html> <html lang="en"> <head>

<title>PlaNart</title>

<link

href='https://fonts.googleapis.com/css?family=Open+Sans :400,300,600,600italic,400italic,800,700'

rel='stylesheet' type='text/css'> <link

href='https://fonts.googleapis.com/css?family=Oswald:40 0,700,300' rel='stylesheet' type='text/css'>

</head> <body>

<div class="DesignHolder">  <div class="LayoutFrame">

<header>

(15)

<div class="site-logo"> <h1><a

href="#">Pl<span>aNa</span>rt</a></h1> </div>

<nav class="Navigation"> <ul> <li class="active"> <a href="index.php">Beranda</a> <span class="menu-item-bg"></span> </li> </ul> </nav>

</div>

</div>

</header>

<div style="margin-left:150px;

height:30px; font-family:'Trebuchet MS';

font-size:15px;" >

<?php

include "koneksi.php";

$soal = mysql_query("SELECT * FROM tb_soalmedium order by rand() limit 10");

$no = 1;

while($s = mysql_fetch_array($soal)){ echo "$no. ".$s['soal']."<br>\n";

echo "<input type=radio

name=soal[".$s['id']."] value='a'>A.

(16)

echo "<input type=radio

name=soal[".$s['id']."] value='b'>B.

".$s['pilihan_b']."<br>\n";

echo "<input type=radio

name=soal[".$s['id']."] value='c'>C.

".$s['pilihan_c']."<br>\n";

echo "<input type=radio

name=soal[".$s['id']."] value='d'>D.

".$s['pilihan_d']."<br><br><br>\n"; $no++;

}

$soal = $no - 1;

echo "<input type='hidden'

name='jawabansoal' value= $soal>"; ?>

<input style="width:200px;

margin-left:180px; height:30px; border:1px;

font-family:'Trebuchet MS'; font-size:15px;" type="submit" value="DONE"/><br><br> </div> </form> </div> <div class="clear"></div> </div>

<div id="Container">

<footer>

</div> </footer>

</div>

</div>

</div>

</div>

</div>

<div id="loader-wrapper">

(17)

src="js/jquery.sudoSlider.min.js"></script>

src="js/global.js"></script>

src="js/modernizr.js"></script> </body>

</html>

8. Soalsulit.php

<!DOCTYPE html> <html lang="en"> <head>

<title>PlaNart</title>

<link

href='https://fonts.googleapis.com/css?family=Open+Sans :400,300,600,600italic,400italic,800,700'

rel='stylesheet' type='text/css'> <link

href='https://fonts.googleapis.com/css?family=Oswald:40 0,700,300' rel='stylesheet' type='text/css'>

</head> <body>

(18)

<div class="DesignHolder">  <div class="LayoutFrame">

<header> <div class="Center"> <div class="site-logo"> <h1><a href="#">Pl<span>aNa</span>rt</a></h1> </div> <div id="mobile_sec">

<nav class="Navigation"> <ul> <li class="active"> <a href="index.php">Beranda</a> <span class="menu-item-bg"></span> </li> </ul> </nav>

</div>

</div>

</header>

<div style="margin-left:150px;

height:30px; font-family:'Trebuchet MS';

font-size:15px;" >

<?php

include "koneksi.php";

$soal = mysql_query("SELECT * FROM tb_soalsulit order by rand() limit 10");

$no = 1;

(19)

echo "$no. ".$s['soal']."<br>\n";

echo "<input type=radio

name=soal[".$s['id']."] value='a'>A.

".$s['pilihan_a']."<br>\n";

echo "<input type=radio

name=soal[".$s['id']."] value='b'>B.

".$s['pilihan_b']."<br>\n";

echo "<input type=radio

name=soal[".$s['id']."] value='c'>C.

".$s['pilihan_c']."<br>\n";

echo "<input type=radio

name=soal[".$s['id']."] value='d'>D.

".$s['pilihan_d']."<br><br><br>\n"; $no++;

}

$soal = $no - 1;

echo "<input type='hidden'

name='jawabansoal' value= $soal>"; ?>

<input style="width:200px;

margin-left:180px; height:30px; border:1px;

font-family:'Trebuchet MS'; font-size:15px;" type="submit" value="DONE"/><br><br> </div> </form> </div> <div class="clear"></div> </div>

<div id="Container">

<footer>

</div> </footer>

</div>

</div>

</div>

</div>

</div>

(20)

src="js/jquery.sudoSlider.min.js"></script>

src="js/global.js"></script>

src="js/modernizr.js"></script> </body> </html> 9. Hasil.php <!DOCTYPE html> <html lang="en"> <head>

<title>PlaNart</title>

</head> <body>

<div class="DesignHolder">

(21)

<header> <div class="Center"> <div class="site-logo"> <h1><a href="#">Pl<span>aNa</span>rt</a></h1> </div> <div id="mobile_sec">

<nav class="Navigation"> <ul> <li class="active"> <a href="index.php">Beranda</a> <span class="menu-item-bg"></span> </li> </ul> </nav>

</div>

</div>

</header>

<div style="margin-left:150px;

height:30px; font-family:'Trebuchet MS';

font-size:15px;" >

<?php

session_start();

include "koneksi.php"; $id = $_SESSION['id'];

$soal = mysql_query("SELECT * FROM nilaisoalmudah WHERE id='$id'");

while($s = mysql_fetch_array($soal)){ echo "<h3>Skor Anda, <br> ".$s['nilai']."";

echo "<h3>Jawaban Benar: <br> ".$s['skor']."<br><br>";

(22)

echo "<a href=\"soalmudah.php\">Coba Lagi</a>";

?> <h3>

<a href="soalsedang.php">Level Berikutnya</a> </h3> </div> </div> <div class="clear"></div> </div>

<div id="Container">

<footer>

</div> </footer>

</div>

</div>

</div>

</div>

</div>

<div id="loader-wrapper">

src="js/jquery.sudoSlider.min.js"></script>

src="js/global.js"></script>

src="js/modernizr.js"></script> </body>

(23)

10. Hasilsedang.php

<!DOCTYPE html> <html lang="en"> <head>

<title>PlaNart</title>

</head> <body>

<div class="DesignHolder">  <div class="LayoutFrame">

<header> <div class="Center"> <div class="site-logo"> <h1><a href="#">Pl<span>aNa</span>rt</a></h1> </div> <div id="mobile_sec">

<nav class="Navigation">

<ul>

(24)

<a href="index.php">Beranda</a> <span class="menu-item-bg"></span> </li> </ul> </nav>

</div>

</div>

</header>

<div style="margin-left:150px;

height:30px; font-family:'Trebuchet MS';

font-size:15px;" >

<?php

session_start();

include "koneksi.php"; $id = $_SESSION['id'];

$soal = mysql_query("SELECT * FROM nilaisoalmedium WHERE id='$id'");

while($s = mysql_fetch_array($soal)){ echo "<h3>Skor Anda, <br> ".$s['nilai']."";

echo "<h3>Jawaban Benar: <br> ".$s['skor']."<br><br>";

}

echo "<a href=\"soalmudah.php\">Coba Lagi</a>";

?> <h3>

<a href="soalsulit.php">Level Berikutnya</a> </h3> </div> </div> <div class="clear"></div> </div>

(25)

<footer>

</div> </footer>

</div>

</div>

</div>

</div>

</div>

<div id="loader-wrapper">

src="js/jquery.sudoSlider.min.js"></script>

src="js/global.js"></script>

src="js/modernizr.js"></script> </body>

</html>

11. Hasilsulit.php

<!DOCTYPE html> <html lang="en"> <head>

<title>PlaNart</title>

(26)

</head> <body>

<div class="DesignHolder">  <div class="LayoutFrame">

<header> <div class="Center"> <div class="site-logo"> <h1><a href="#">Pl<span>aNa</span>rt</a></h1> </div> <div id="mobile_sec">

<nav class="Navigation"> <ul> <li class="active"> <a href="index.php">Beranda</a> <span class="menu-item-bg"></span> </li> </ul> </nav>

</div>

</div>

(27)

</header>

<div style="margin-left:150px;

height:30px; font-family:'Trebuchet MS';

font-size:15px;" >

<?php

session_start();

include "koneksi.php"; $id = $_SESSION['id'];

$soal = mysql_query("SELECT * FROM nilaisoalsulit WHERE id='$id'");

while($s = mysql_fetch_array($soal)){ echo "<h3>Skor Anda, <br> ".$s['nilai']."";

echo "<h3>Jawaban Benar: <br> ".$s['skor']."<br><br>";

}

echo "<a href=\"soalsulit.php\">Coba Lagi</a>"; ?> </div> </div> <div class="clear"></div> </div>

<div id="Container">

<footer>

</div> </footer>

</div>

</div>

</div>

</div>

</div>

(28)

src="js/jquery.sudoSlider.min.js"></script>

src="js/global.js"></script>

src="js/modernizr.js"></script> </body> </html> 12. Hasilsoalmudah.php <?php session_start(); include "koneksi.php"; $benar = 0;

$salah = 0;

if (isset($_POST["soal"])){ foreach($_POST['soal'] as $key => $value){

$cek = mysql_query("SELECT * FROM tb_soalmudah WHERE id=$key");

while($c = mysql_fetch_array($cek)){ $jawaban = $c['jawaban'];

} if($value==$jawaban){ $benar++; }else{ $salah++; } }

$jumlah = $_POST['jawabansoal']; if ($benar==10) {

$nilai=100;

}elseif ($benar==9) { $nilai=90;

}elseif ($benar==8) { $nilai=80;

}elseif ($benar==7) { $nilai=70;

(29)

}elseif ($benar==6) { $nilai=60;

}elseif ($benar==5) { $nilai=50;

}elseif ($benar==4) { $nilai=40;

}elseif ($benar==3) { $nilai=30;

}elseif ($benar==2) { $nilai=20;

}elseif ($benar==1) { $nilai=10;

}else { $nilai=0; }

$simpan = "INSERT INTO

nilaisoalmudah(skor, nilai) VALUES ('$benar',

'$nilai')";

if(mysql_query($simpan)){ $id = mysql_insert_id(); $_SESSION['id']= $id; header("location:hasil.php"); }else { echo mysql_error(); } } ?> 13. Hasilsoalsedang.php <?php session_start(); include "koneksi.php"; $benar = 0;

$salah = 0;

if (isset($_POST["soal"])){ foreach($_POST['soal'] as $key => $value){

$cek = mysql_query("SELECT * FROM tb_soalmedium WHERE id=$key");

while($c = mysql_fetch_array($cek)){ $jawaban = $c['jawaban'];

}

if($value==$jawaban){ $benar++;

(30)

$salah++; } }

$jumlah = $_POST['jawabansoal']; if ($benar==10) {

$nilai=100;

}elseif ($benar==9) { $nilai=90;

}elseif ($benar==8) { $nilai=80;

}elseif ($benar==7) { $nilai=70;

}elseif ($benar==6) { $nilai=60;

}elseif ($benar==5) { $nilai=50;

}elseif ($benar==4) { $nilai=40;

}elseif ($benar==3) { $nilai=30;

}elseif ($benar==2) { $nilai=20;

}elseif ($benar==1) { $nilai=10;

}else { $nilai=0; }

$simpan = "INSERT INTO

nilaisoalmedium(skor, nilai) VALUES ('$benar',

'$nilai')";

if(mysql_query($simpan)){ $id = mysql_insert_id(); $_SESSION['id']= $id; header("location:hasilsedang.php"); }else { echo mysql_error(); } } ?> 14. Hasilsoalsulit.php <?php session_start(); include "koneksi.php"; $benar = 0;

(31)

if (isset($_POST["soal"])){ foreach($_POST['soal'] as $key => $value){

$cek = mysql_query("SELECT * FROM tb_soalsulit WHERE id=$key");

while($c = mysql_fetch_array($cek)){ $jawaban = $c['jawaban'];

} if($value==$jawaban){ $benar++; }else{ $salah++; } }

$jumlah = $_POST['jawabansoal']; if ($benar==10) {

$nilai=100;

}elseif ($benar==9) { $nilai=90;

}elseif ($benar==8) { $nilai=80;

}elseif ($benar==7) { $nilai=70;

}elseif ($benar==6) { $nilai=60;

}elseif ($benar==5) { $nilai=50;

}elseif ($benar==4) { $nilai=40;

}elseif ($benar==3) { $nilai=30;

}elseif ($benar==2) { $nilai=20;

}elseif ($benar==1) { $nilai=10;

}else { $nilai=0; }

$simpan = "INSERT INTO

nilaisoalsulit(skor, nilai) VALUES ('$benar',

'$nilai')";

if(mysql_query($simpan)){ $id = mysql_insert_id(); $_SESSION['id']= $id;

header("location:hasilsulit.php"); }else {

echo mysql_error(); }

(32)

} ?> 15. style.css body{ margin: 0px; padding: 0px; width: 100%; height: 100%; } #banner{ width: 100%; height: 60px; background: #c2e8f4;

border-bottom: 1px solid #f2f2f5; margin-left: 200px; } a.logo { font-size: 20px; color: #ffffff; float: left; margin-top: -30px; text-transform: uppercase; outline:none; text-decoration: none; font-family: Trebuchet ms; }

a.logo b {

font-weight: 900; } a.logo:hover { text-decoration: none; outline: none; color: #7b7789; } #sidebar{ float: left; width: 210px; height: 100%; background: #f2f2f2; position: fixed; margin-top: -100px; padding-top: 100px; } #footer{ width: 100%;

(33)

height: 40px;

background: #c2e8f4;

border-bottom: 2px solid #f2f2f5; position: absolute; } .centered { text-align: center; padding-right: 50px; } #edit{ width: 500px; height: 70px; }

#sidebar h5 { color: #f2f2f2; font-weight: 150;

font-family: Trebuchet ms; } #main-content { margin-left: 210px; position: relative; } #main-content span{

font-family: Trebuchet ms; font-size: 22px; margin-left: 15px; color: #777; } .mt { padding-left: 10px; } .active{

padding: 5px 30px 5px 22px; font-size: 13px; color: red; float: left; margin-top: 15px; outline:none; text-decoration: none; font-family: Trebuchet ms; } a.active:hover, a.active:focus{ color: black; background-color: #ffd777; float: left; } .wrapper { margin-top: 20px; margin-left: 15px;

(34)

margin-right: 15px; padding-bottom: 15px; padding-top: 0px; background-color: #f2f2f2; position: relative; float: center; } .row { margin-left: 10px; } .text1{ padding-top: 5px;

font-family: Trebuchet ms; font-size: 16px; color: #666666; padding-bottom: 30px; } table { background-color: transparent; } th { text-align: left; } .table { width: 1088px; margin-bottom: 20px; background: white; table-layout: fixed;

font-family: trebuchet ms; font-size: 14px;

}

.link{

text-decoration: none; font-family: trebuchet ms; font-size: 18px;

padding-bottom: 30px; }

.table > tbody > tr > th, .table > thead > tr > th, .table > thead > tr > td, .table > tbody > tr > td { padding: 8px;

line-height: 1.42857143; vertical-align: top;

border-top: 1px solid #ddd; border-left: 1px solid #ddd; word-wrap: break-word;

} .col{

(35)

display: inline; float: left; margin-left: 10px; margin-right: 10px; width: 180px; padding-left: 10px; padding-bottom: 30px; } .box {

border: 3px solid #f2f2f5; padding: 23px 35px 24px; border-top-width: 4px; border-bottom-width: 4px; background-color: white; } .bg{ background-color: #f2f2f2; } .text2 { color: #779998; text-decoration: none; font-size: 20px; text-align: center; } .tambah{ width: 500px; height: 300px;

padding: 0px 20px 30px 20px; font-family: trebuchet ms; font-size: 14px; word-wrap: break-word; } .ini { width:500px; height:30px; border:1px; font-family:'Trebuchet MS'; font-size:14px; } .i { width:50px; height:30px; border:1px; font-family:'Trebuchet MS'; font-size:14px; } .btns { position:relative;

(36)

text-align: center; }

.btns input {

display: inline-block; font-size: 14px;

line-height: 15px;

background-color: #ffd777; min-width: 107px;

padding: 5px 5px 5px; color: black;

cursor: pointer; }

.btns input:hover {

background-color: #c2e8f4; color: #39596e;

}

/*LOGIN CONFIGURATION PAGE*/ #login{ background: url(../images/login-bg.jpg); background-size: 100%; padding-top: 200px; margin-top: -190px; padding-bottom: 200px; } .log { width:200px; height:30px; border:1px; font-family:'Trebuchet MS'; font-size:14px; } .form-login { max-width: 330px; margin: 100px auto 0; background: #fff; border-radius: 5px;

-webkit-border-radius: 5px; }

.form-login h2.form-login-heading { margin: 0;

padding: 25px 20px; text-align: center; background: #666666;

border-radius: 5px 5px 0 0; color: #fff;

font-size: 20px;

(37)

font-weight: 300; }

.form-login-heading { margin: 0;

padding: 10px 10px; text-align: center; background: #68dff0;

border-radius: 5px 5px 0 0; color: #fff;

font-size: 16px;

text-transform: uppercase; margin-left: 100px;

margin-top: 50px; }

.login-wrap { padding: 20px; }

.login-wrap .registration { text-align: center;

}

16. video.html <html> <body>

</body> </html>

17. Admin/index.php

<?php

session_start() ?>

<!DOCTYPE html> <html>

<head>

<title>Login</title>

<h2 class="form-login-heading">Login Admin</h2>

(38)

</div> </form>

</body> </html>

18. Admin/koneksi.php

<?php

$db_host = "localhost"; $db_user = "root";

$db_pass = "";

$db_data = "dbflash";

// Perintah koneksi Server MySQL $koneksi

= mysql_connect($db_host, $db_user, $db_pass) or die ("Koneksi gagal".mysql_error()); mysql_select_db($db_data, $koneksi)

or die ("Baca DB gagal".mysql_error()); ?>

19. Admin/proseslogin.php

<?php

session_start();

require_once("koneksi.php");

$namapengguna = $_POST['namapengguna']; $password = $_POST['password'];

$cekuser = mysql_query("SELECT * FROM tb_admin WHERE namapengguna = '$namapengguna' and password = '$password'");

$jumlah = mysql_num_rows($cekuser); $hasil = mysql_fetch_array($cekuser); if($jumlah == 0) {

echo "<script>alert('User belum terdaftar!'); window.location = 'index.php'</script>";

(39)

} else {

if($password > $hasil['password']) {

echo "<script>alert('Email dan Password Salah!'); window.location = 'index.php'</script>";

} else {

session_start();

$_SESSION['namapengguna'] =

$_POST['namapengguna'];

$_SESSION['password'] = $_POST['password']; header('location:mudah.php');

} }

20. Admin/logout.php

<?php

session_start(); session_destroy();

header("location: index.php"); ?>

21. Admin/mudah.php

<?php

session_start();

require_once("koneksi.php");

if ($_SESSION['namapengguna']=='') { header("location: home.php"); }else{

mysql_error(); }

?> <html> <head>

<title>Welcome, Admin</title> </head>

<body>

<a class="active" href="mudah.php">Mudah</a> </div>

(40)

<a class="active" href="medium.php">Medium</a> </div>

<a class="active" href="sulit.php">Sulit</a> </div>

</div>

<div class="row" style="margin-bottom:200px;"> <div class"link"><a href="tambah_soalmudah.php">Tambah Soal</a></div> <table class="table"> <thead> <tr> <th style="width:20px">ID</th> <th>Pertanyaan</th> <th>Pilihan A</th> <th>Pilihan B</th> <th>Pilihan C</th> <th>Pilihan D</th> <th>Jawaban</th> <th>Ubah/Hapus</th> </tr> </thead> <tbody> <?php include "koneksi.php"; $no = 1;

$query = mysql_query("SELECT * FROM tb_soalmudah");

if ($query) { while ($row = mysql_fetch_array($query)) { echo " <tr> <td>".$row['id']."</td> <td>".$row['soal']."</td> <td>".$row['pilihan_a']."</td> <td>".$row['pilihan_b']."</td> <td>".$row['pilihan_c']."</td> <td>".$row['pilihan_d']."</td> <td>".$row['jawaban']."</td> <td> <a href='ubah_soalmudah.php?id=".$row['id']."'>Ubah </a>| <a href='hapus_soalmudah.php?id=".$row['id']."'>Hapus</a> </tr> "; $no++; } } ?> </tbody> </table>

(41)

</div> </div>

</div><br><br><br> <div id="footer">

<div style="padding-top:7px; padding-left:550px; color: brown;">@RirisLumbantobing</div>

</div> </div> </body> </html>

22.Admin/proses_tambahsoalmudah.php

<?php

include "koneksi.php"; $id = $_POST['id']; $soal = $_POST['soal'];

$pilihan_a = $_POST['pilihan_a']; $pilihan_b = $_POST['pilihan_b']; $pilihan_c = $_POST['pilihan_c']; $pilihan_d = $_POST['pilihan_d']; $jawaban = $_POST['jawaban'];

$query = "INSERT INTO tb_soalmudah VALUES (

'$id', '$soal', '$pilihan_a', '$pilihan_b',

'$pilihan_c', '$pilihan_d', '$jawaban')"; $result = mysql_query($query);

if ($query) {

echo("<script>alert('Data Berhasil Disimpan'); window.location = 'index.php'</script>");

} else{

mysql_error(); }

23. Admin/tambah_soalmudah.php

<title>Welcome, Admin</title> </head>

<body>

(42)

<a class="active"

href="mudah.php">Mudah</a> </div>

<a class="active"

href="medium.php">Medium</a> </div>

<a class="active"

href="sulit.php">Sulit</a> </div>

</div> </div>

<div class"link"><a href="index.php">Kembali</a></div>

<form method="POST"

action="proses_tambahsoalmudah.php">

</tr> <tr>

<td><br>Pertanyaan</td>

</tr>

<td><br>Pilihan (a)</td>

</tr> <tr>

<td><br>Pilihan (b)</td>

</tr> <tr>

(43)

</tr> <tr>

<td><br>Pilihan (d)</td>

</tr> <tr>

<td><br>Jawaban</td>

</td></tr>

<tr><td><br><div

class="btns"><input type="submit" value="Simpan Soal"></td></div></tr> </table> </form> </div> </div> </div><br><br><br> <div id="footer">

<div style="padding-top:7px; padding-left:550px; color:#666666;">@RirisLumbantobing</div> </div> </div> </body> </html> 24. Admin/ubah_soalmudah.php <html> <head> <title>Welcome, Admin</title> </head> <body>

<a class="active"

href="mudah.php">Mudah</a> </div>

(44)

<a class="active" href="medium.php">Medium</a>

</div>

<a class="active"

href="sulit.php">Sulit</a> </div>

</div> </div>

<div class"link"><a href="index.php">Kembali</a></div>

<form method="POST"

action="proses_ubahsoalmudah.php"> <table class="table"> <?php include "koneksi.php"; $id=$_GET['id']; ?> <?php $query=mysql_query("select * from tb_soalmudah where id='$id'");

if ($query) {

while ($row =

mysql_fetch_array($query)) { echo " <tr> <td style=\"width:120px\">Id</td> <td><input

class=\"edit\"type=\"text\" name=\"id\" value=\"".$row['id']."\" style=\"width:50px; height:30px;\">

</td></tr>

<tr><td>Pertanyaan</td> <td><input

type=\"text\" name=\"soal\" value=\"".$row['soal']."\" style=\"width:100px; height:60px;\"></td></tr>

<tr><td>A</td> <td><input

(45)

value=\"".$row['pilihan_a']."\" style=\"width:500px; height:60px;\"></td></tr>

<tr><td>B</td> <td><input

type=\"text\" name=\"pilihan_b\"

value=\"".$row['pilihan_b']."\" style=\"width:500px; height:60px;\"></td></tr>

<tr><td>C</td> <td><input

type=\"text\" name=\"pilihan_c\"

value=\"".$row['pilihan_c']."\" style=\"width:500px; height:60px;\"></td></tr>

<tr><td>D</td> <td><input

type=\"text\" name=\"pilihan_d\"

value=\"".$row['pilihan_d']."\" style=\"width:500px; height:60px;\"></td></tr>

<tr><td>Jawaban</td> <td><input

type=\"text\" name=\"jawaban\"

value=\"".$row['jawaban']."\" style=\"width:500px; height:60px;\"></td></tr>

<tr><td><br><div

class=\"btns\"><input type=\"submit\" value=\"Ubah\"> </div></td></tr> "; } } ?> </table> </form> </div> </div> </div><br><br><br> <div id="footer">

<div style="padding-top:7px; padding-left:550px; color:#666666;">@RirisLumbantobing</div> </div> </div> </body> </html> 25. Admin/hapus_soalmudah.php <?php include "koneksi.php"; $id = $_GET['id'];

(46)

DAFTAR PUSTAKA

Kadir, Abdul. 2001. Dasar Pemrograman Web Dinamis Menggunakan PHP. Yogyakarta: Andi.

Madiun, Madcoms. 2008. Adobe Flash CS3 Professional. Yogyakarta: Andi Nara, hartini & siregar eveline.2010. Teori belajar dan pembelajaran. Bogor. Ghalia

Indonesia.

Perangin-angin, Kasiman. 2006. Aplikasi Web dengan PHP dan MySQL. Yogyakarta: Andi.

Pramono, Budi. 2013. Dikotil dan Monokotil, http://www.kampus-info.com/2012/11/pengertian-dikotil-dan-monokotil.html. Diakses 25 Mei 2016. 11.35 Wib

Sutopo, Hadi. 2007. Flash dengan PHP & MYSQL. Yogyakarta: Graha Ilmu Syahreza, Jordan. Pengertian PHP dan MYSQL.[www.duniailkom.net] Diakses

pada 20 Maret 2016 Pukul 21:43 Wib.

Vaughan, Tay.2004. Multimedia: Making It Work edisi 6. Yogyakarta: Andi. Yudhiantoro, Dhani. 2006.Membuat Animasi Web dengan Macromedia Flash Profesional 8. Yogyakarta: Andi

(47)

BAB 3

PERANCANGAN SISTEM

3.1Pengertian Perancangan Sistem

Perancangan sistem merupakan tahap yang sangat penting dalam pembuatan sistem aplikasi, dimulai dari perencanaan yang matang akan memberikan hasil akhir yang bagus. Dalam membuat sebuah aplikasi, tentukan terlebih dahulu tujuan dari aplikasi yang akan dibuat karena bentuk desain dan isi sebuah aplikasi sangat tergantung pada tujuan dibuatnya aplikasi itu.

Sebelum melakukan perancangan aplikasi, maka harus dilakukan analisis terlebih dahulu untuk memperoleh gambaran yang jelas mengenai kelebihan dan kekurangan aplikasi. Aplikasi Pembelajaran Tumbuhan Monokotil dan Dikotil dibuat secara online untuk menunjang dan memudahkan siswa/siswi dalam memahami dan mempelajari tumbuhan monokotil dan dikotil yang ditampilkan dalam bentuk animasi.

3.2 Penentuan Aplikasi yang akan Dibuat

Penentuan aplikasi Pembelajaran Tumbuhan Monokotil dan Dikotil Berbasis Multimedia bertujuan untuk membantu penulis dalam menemukan suatu solusi dari permasalahan yang dihadapi siswa Sekolah Menengah Atas. Materi

(48)

pembelajaran tumbuhan monokotil dan dikotil yang dimasukkan kedalam aplikasi pembelajaran ini berupa materi sesuai dengan kurikulum yang dipelajari, dan latihan soal-soal yang berkaitan dengan pembelajaran.

3.3 Perancangan Materi

Pembuatan aplikasi pembelajaran tumbuhan monokotil dan dikotil ini menggunakan teknik yang sederhana. Teknik yang sederhana ini tentunya juga didukung oleh peranan Actionscript yang sangat membantu dalam penyederhanaan hasil publikasi flash semaksimal mungkin sehingga didapatkan objek yang dinamis, interaktif, dan tidak terjadi pemakaian ruang publikasi secara berlebihan. Animasi ini menggunakan Actionscript yang ada didalam Adobe Flash CS3 untuk proses berjalannnya. Actionscript akan dilampirkan pada bagian lampiran Listing Program. Animasi ini juga akan dimasukkan kedalam web yang sudah dibuat penulis.

3.3.1 Desain Halaman awal

Halaman awal adalah tampilan animasi yang pertama kali muncul jika aplikasi dibuka untuk pertama kalinya. Halaman ini diberi judul “Aplikasi Pembelajaran Tumbuhan Monokotil dan Dikotil” yang dianimasikan serta serta terdapat link

menuju menu yang nantinya menjadi tampilan utama setelah aplikasi dijalankan. Penulis membuat animasi ini dengan metode scene by scene.

(49)

3.3.1.1Desain Awal

Halaman ini berisikan tentang awal desain pembuatan secara spesifik. Langkah-langkah mendesainnya:

a. Buka halaman baru beri judul aplikasi pembelajaran.fla. ubah ukuran stage

menjadi 1360 x 680 pixel. Buat 3 layer, yaitu layer latar (untuk background), teks, dan musik.

b. Pada layer latar, penulis menggunakan contoh background dari koleksi penulis sendiri, sehingga penulis hanya perlu meng-set ukurannya sesuai dengan ukuran stage yang sudah dibuat.

c. Pada layer teks, pilih Teks Tool (T) pada Toolbox untuk penulisan judul “Pembelajaran Tumbuhan Monokotil dan Dikotil”. Buat font penulisan comic sans ms dan font size 30. Kemudian ada 4 button yang sudah di link-kan untuk masuk ke menu berikutnya yaitu tumbuhan monokotil, tumbuhan dikotil, dan petunjuk dari menggunakan aplikasi tersebut. Setiap button penulis membuatnya dengan menggunakan menubar insert yang terdapat di Microsoft Powerpoint 2007. Pada setiap button (Tumbuhan monokotil, Tumbuhan dikotil, dan petunjuk) Tekan Ctrl+F8, pilih Button dan beri nama materi untuk materi, latihan untuk latihan, profil untuk profil, serta petunjuk untuk petunjuk. Double klik pada button “tumbuhan monokotil”. Letakkan kursor pada kolom Over yang terdapat pada layer 1, klik kanan, kemudian pilih Insert keyframe. Untuk memasukkan sound atau suara kedalam button, letakkan kursor pada kolom Down yang letaknya tepat disebelah kanan Over, klik kanan insert keyframe. Pilih

(50)

sound dari library, kemudian seret ke dalam button materi. Begitu seterusnya untuk membuat button pada tumbuhan dikotil dan petunjuk. d. Pada layer musik, letakkan kursor di frame 1, kemudian klik kanan insert

keyframe. Masukkan musik yang diinginkan dari panel library degan cara klik kanan di frame, pilih Action atau tekan F9. Masukkan nama file musik . kemudian pada akhir program letakkan code stop();

3.3.2 Desain Halaman Menu

Halaman ini berisikan tentang halaman menu pada tumbuhan monokotil dan dikotil secara spesifik. Langkah-langkah mendesainnya:

a. Klik insert yang terdapat di menubar, pilih Scene. Ubah ukuran stage menjadi 13680 x 680 pixels sesuai dengan ukuran stage awal yang sudah dibuat. Buat 2 layer, yaitu teks dan latar

b. Pada layer teks, tekan Ctrl+F8 pada kata “Tumbuhan Monokotil” pilih button. Klik Ok. Double klik pada button “Tumbuhan Monokotil”. Letakkan kursor pada kolom Over yang terdapat pada layer 1, klik kanan, kemudian pilih Insert keyframe. Untuk memasukkan sound atau suara kedalam button, letakkan kursor pada kolom Down yang letaknya tepat disebelah kanan Over, klik kanan insert keyframe. Pilih sound dari library, kemudian seret ke dalam button tumbuhan monokotil.

c. Lakukan hal yang sama untuk tumbuhan dikotil, tekan Ctrl+F8 pada kata “Tumbuhan Dikotil” pilih button. Klik Ok. Double klik pada button “Tumbuhan Dikotil”. Letakkan kursor pada kolom Over yang terdapat

(51)

pada layer 1, klik kanan, kemudian pilih Insert keyframe. Untuk memasukkan sound atau suara kedalam button, letakkan kursor pada kolom Down yang letaknya tepat disebelah kanan Over, klik kanan insert keyframe. Pilih sound dari library, kemudian seret ke dalam button tumbuhan dikotil.

3.3.3 Desain Halaman Defenisi Tumbuhan

Halaman ini berisikan tentang defenisi pada tumbuhan monokotil dan dikotil secara spesifik. Langkah-langkah mendesainnya:

a. Buat scene baru beri nama defenisi. Ubah ukuran stage menjadi 1360 x 680 pixels. Buat 2 layer, yaitu teks dan latar

b. Pada layer latar, hanya sebagai background saja agar tampilan tidak terlihat kosong.

c. Pada layer teks, terdiri dari defenisi, button ciri-ciri, button klasifikasi, button contoh, dan button back untuk kembali ke halaman sebelumnya. d. Untuk defenisi, blok teks, tekan Ctrl+F8, pilih movie clip, beri nama

sesuai dengan layer. Pada timeline yang terdapat di frame klik kanan lalu insert keyframe berselang-selang 5. Pada setiap akhir timeline yang sudah di insert keframe kan beri action stop(); agar teks tidak berjalan secara terus-menerus.

(52)

3.3.3.1Desain Halaman Ciri-ciri Tumbuhan

Halaman ini berisikan tentang ciri-ciri pada tumbuhan monokotil dan dikotil secara spesifik. Langkah-langkah mendesainnya:

a. Buat scene baru beri nama dari masing masing scene yang diinginkan. Ubah ukuran stage menjadi 1360 x 680 pixels. Buat 2 layer, yaitu teks dan latar

b. Pada layer latar, hanya sebagai background saja agar tampilan tidak terlihat kosong.

c. Pada layer teks terdiri dari button akar, batang, daun, bunga yang masing-masingnya akan dapat di lihat di setiap scene berikutnya.

e. Setiap scene akar, batang, daun dan bunga terdiri dari contoh gambar akar dari masing-masing tumbuhan serta penjelasannya.

3.3.3.2Desain Halaman Klasifikasi Tumbuhan

Halaman ini berisikan tentang ciri-ciri pada tumbuhan monokotil dan dikotil secara spesifik. Langkah-langkah mendesainnya:

a. Buat scene baru beri nama klasifikasi. Ubah ukuran stage menjadi 1360 x 680 pixels. Buat 2 layer, yaitu teks dan latar

b. Pada layer latar, hanya sebagai background saja agar tampilan tidak terlihat kosong.

c. Pada layer teks, terdiri dari keterangan klasifikasi tumbuhan dan button next untuk lanjut ke halaman berikutnya.

(53)

3.3.3.3Desain Halaman Contoh Tumbuhan

Halaman ini berisikan tentang contoh-contoh pada tumbuhan monokotil dan dikotil secara spesifik. Langkah-langkah mendesainnya:

a. Buat scene baru beri nama klasifikasi. Ubah ukuran stage menjadi 1360 x 680 pixels. Buat 2 layer, yaitu teks dan background

b. Pada layer latar, hanya sebagai background saja agar tampilan tidak terlihat kosong.

c. Pada layer teks, terdiri dari keterangan klasifikasi tumbuhan dan button back untuk kembali ke halaman sebelumnya.

3.4 Algoritma Perancangan Aplikasi

Algoritma merupakan sekumpulan perintah untuk menyelesaikan suatu masalah. Perintah-perintah ini dapat diterjemahkan bertahap dari awal hingga akhir. Algoritma yang digunakan pada perancangan ini adalah algoritma diagram alur.

(54)

3.5 Flowchart

Flowchart adalah sekumpulan simbol-simbol yang menunjukkan atau menggambarkan rangkaian kegiatan-kegiatan program dari awal hingga akhir. Penjelasan arti dari lambang-lambang flowchart dapat didefenisikan seperti pada tabel 3.1 berikut ini:

Tabel 3.1 Simbol-Simbol Flowchart

NO Simbol Fungsi

1 Terminator, untuk memulai dan mengakhiri suatu program

2 Process, untuk menunjukkan setiap pengolahan yang dilakukan oleh komputer

3 Data, untuk memasukkan data maupun

menunjukkan hasil dari suatu proses

4 Decission, suatu kondisi yang akan menghasilkan beberapa kemungkinan jawaban atau pilihan

5 Connector, simbol untuk masukdan keluarnya suatu prosedur pada lembar kertas yang sama

6 Aarus atau flow, prosedur yang dapat dilakukan dari atas kebawah, bawah ke atas, dari kiri ke kana, atau dari kanan ke kiri

7 Off-Page Conenector, merupakan simbol untuk masuk dan keluarnya prosedur pada lembar kerja yang lain

8 Document, merupakan simnol untuk data yang berbentuk informasi.

(55)

9 Predefined process, untuk menyatakan sekumpulan langkah proses yang ditulis

10 Preparation, suatu simbol untuk menyediakan tempat-tempat pengolahan data dalam storage 11 Magnetic disk, berguna dalam penyimpanan data 12 Display, untuk output yang ditujukan suatu device,

seperti pada monitor

3.6 Perancangan Diagram Alir (Flowchart) Website

Diagram alir (flowchart) ini menjelaskan secara rinci langkah-langkah dari proses program. Flowchart dibuat dengan menggunakan simbol-simbol tertentu yang menyatakan setiap langkah program. Berikut ini adalah flowchart dari Aplikasi pembelajaran Planart.

3.6.1 Flowchart Menu utama

Seorang pengunjung website dapat mengakses menggunakan jaringan internet dan dapat berpindah dari halaman yang satu ke halaman lainnya. Masing- masing halaman utama memiiki link-link yang dapat dipilih. Flowchart menu utama dapat dilihat pada gambar 3.2 berikut

(1)

ABSTRAK

Kajian ini bertujuan untuk membangun sistem sebuah aplikasi pembelajaran Tumbuhan Monokotil dan Dikotil untuk anak SMA Kelas XI dengan bahan ajar berbasis multimedia. Materi pada aplika ini terbatas pada tumbuhan monokotil dan dikotil. Materi pada aplikasi ini menggunakan bahasa pemrograman Actionscript 2.0 pada Adobe Flash CS3 Professional. Sistem ini dirancang menggunakan perangkat lunak text editor Sublime Text 3 dengan bahasa pemrograman web yang digunakan yaitu HTML dan PHP serta MySQL sebagai bahasa query database. Simulasi soal juga disajikan dalam sistem ini untuk menambah semangat pengguna dalam memahami ciri-ciri, klasifikasi, contoh-contoh tumbuhan monokotil dan dikotil serta nama latinnya dan menguji kemampuannya dalam menguasai soal-soal materi tumbuhan monokotil dan dikotil tingkat Sekolah Menengah Atas.

(2)

DAFTAR ISI

Halaman

Persetujuan ii

Pernyataan iii

Penghargaan iv

Abstrak vi

Daftar Isi vii

Daftar Tabel x

Daftar Gambar xi

BAB 1 Pendahuluan 1.1 Latar Belakang 1

1.2 Identifikasi Masalah 3

1.3 Batasan Masalah 3

1.4 Tujuan 3

1.5 Manfaat 4

1.6 Tinjauan Pustaka 4

1.7 Metode Penelitian 5

1.8 Sistematika Penulisan 6

BAB 2 Landasan Teori 2.1 Multimedia 8

2.1.1 Komponen Multimedia 9

2.1.2 Multimedia Berbasis Komputer 11

2.1.3 Multimedia Sebagai Pembelajaran 11

2.1.4 Metode Pendekatan Konstruktivisme 12

2.2 Flash 13

2.2.1 Sekilas Tentang Flash 13

2.2.2 Kemampuan Flash 14

2.2.3 Ekstensi File 15

2.2.4 Adobe Flash CS3 Professional 15

2.3 Dasar-dasar Penggunaan Adobe Flash CS3 16

2.3.1 Halaman Awal 16

2.3.2 Jendela Utama 17

2.3.3 Toolbox 19

2.3.4 Library 21

2.3.5 Actionscript 22

2.4 Pengertian Tumbuhan Monokotil dan Dikotil 22

2.5 Bahasa Pemrograman 23

(3)

2.5.2 MySQL 23

2.5.3 HTML 24

2.5.4 Sublime Teks Editor 24

BAB 3 Perancangan Sistem 3.1 Pengertian Perancangan Sistem 26

3.2 Penentuan Aplikasi Yang akan dibuat 26

3.3 Perancangan Aplikasi 27

3.3.1 Desain Halaman Awal 27

3.3.1.1 Desain Awal 28

3.3.2 Desain Halaman Menu 29

3.3.3 Desain Halaman Defenisi Tumbuhan 30

3.3.3.1 Desain Halaman Ciri-ciri Tumbuhan 31

3.3.3.2 Desain Halaman Klasifikasi Tumbuhan 31

3.3.3.3 Desain Halaman Contoh Tumbuhan 32

3.4 Algoritma Perancangan Aplikasi 32

3.5 Flowchart 33

3.6 Perancangan Diagram alir Website 34

3.6.1 Flowchart Menu Utama 34

3.6.2 Flowchart Admin 35

3.7 Perancangan DFD Aplikasi 36

3.7.1 Diagram Konteks 37

3.7.2 DFD Level 1 38

3.8 Rancangan Database 39

3.9 Pengujian Sistem 41

BAB 4 Implementasi Sistem 4.1 Pengertian Implementasi Sistem 42

4.2 Persiapan Teknis 42

4.3 Tampilan Aplikasi 43

4.3.1 Halaman Utama 43

4.3.2 Halaman Tumbuhan Monokotil 44

4.3.2.1 Halaman Ciri-ciri Tumbuhan Monokotil 45 4.3.2.2 Halaman Klasifikasi T. Monokotil 45

4.3.2.3 Halaman Contoh T. Monokotil 46

4.3.3 Halaman Tumbuhan Dikotil 47

4.3.3.1 Halaman Ciri-ciri Tumbuhan Dikotil 47

4.3.3.2 Halaman Klasifikasi Tumbuhan Dikotil 48 4.3.3.3 Halaman Contoh Tumbuhan Dikotil 49

4.3.4 Halaman Petunjuk 49

4.4 Tampilan Latihan Soal-soal 50

BAB 5 Kesimpulan dan Saran 5.1 Kesimpulan 52

(4)

DAFTAR PUSTAKA LAMPIRAN

(5)

DAFTAR TABEL

Nomor Judul Halaman

Tabel

3.1 Simbol-simbol Flowchart 33

3.2 Tabel admin 39

3.3 Tabel soalmudah 40

3.4 Tabel soalmedium 40

3.5 Tabel soalsulit 40

3.6 Tabel nilai soal mudah 40

3.7 Tabel nilaisoalmedium 41

(6)

DAFTAR GAMBAR

Nomor Judul Halaman

Gambar

2.1 Tampilan Start Page Adobe Flash CS3 6

2.2 Jendela Utama 18

2.3 Panel Library 21

3.1 Algoritma Diagram Alur 32

3.2 Flowchart Halaman Menu Utama 35

3.3 Flowchart Admin 36

3.4 Diagram Konteks 37

3.5 DFD Level 1 39

4.1 Halaman Utama 42

4.2 Halaman Defenisi Tumbuhan Monokotil 42

4.3 Halaman Ciri-ciri Tumbuhan Monokotil 43

4.4 Halaman klasifikasi Tumbuhan Monokotil 44

4.5 Halaman Contoh Tumbuhan Monokotil 44

4.6 Halaman Defenisi Tumbuhan Dikotil 45

4.7 Halaman Ciri-ciri Tumbuhan Dikotil 46

4.8 Halaman klasifikasi Tumbuhan Dikotil 46

4.9 Halaman Contoh Tumbuhan Dikotil 47

4.10 Halaman Petunjuk 47

4.11 Tampilan Kategori Soal 48

4.12 Tampilan Latihan Soal 49

Perancangan Aplikasi Pembelajaran Tumbuhan Monokotil dan Dikotil Berbasis Multimedia Untuk Anak SMA Kelas XI

KARTU BIMBINGAN TUGAS AKHIR MAHASISWA

Parts

Dokumen yang terkait

Perbandingan Pertumbuhan Akar Tumbuhan Monokotil dan Tumbuhan Dikotil

Perbandingan Pertumbuhan Akar Tumbuhan Monokotil dan Tumbuhan Dikotil

Perbandingan Pertumbuhan Akar Tumbuhan Monokotil dan Tumbuhan Dikotil

Perancangan Aplikasi Pembelajaran Tumbuhan Monokotil dan Dikotil Berbasis Multimedia Untuk Anak SMA Kelas XI

Perancangan Aplikasi Pembelajaran Tumbuhan Monokotil dan Dikotil Berbasis Multimedia Untuk Anak SMA Kelas XI

Perancangan Aplikasi Pembelajaran Tumbuhan Monokotil dan Dikotil Berbasis Multimedia Untuk Anak SMA Kelas XI

Perancangan Aplikasi Pembelajaran Tumbuhan Monokotil dan Dikotil Berbasis Multimedia Untuk Anak SMA Kelas XI

Perancangan Aplikasi Pembelajaran Tumbuhan Monokotil dan Dikotil Berbasis Multimedia Untuk Anak SMA Kelas XI

Perancangan Aplikasi Pembelajaran Tumbuhan Monokotil dan Dikotil Berbasis Multimedia Untuk Anak SMA Kelas XI

MORFOLOGI PERAKARAN TUMBUHAN MONOKOTIL DAN TUMBUHAN DIKOTIL

Dukungan

Links

Perancangan Aplikasi Pembelajaran Tumbuhan Monokotil dan Dikotil Berbasis Multimedia Untuk Anak SMA Kelas XI

KARTU BIMBINGAN TUGAS AKHIR MAHASISWA

Parts

Dokumen yang terkait

Perbandingan Pertumbuhan Akar Tumbuhan Monokotil dan Tumbuhan Dikotil

Perbandingan Pertumbuhan Akar Tumbuhan Monokotil dan Tumbuhan Dikotil

Perbandingan Pertumbuhan Akar Tumbuhan Monokotil dan Tumbuhan Dikotil

Perancangan Aplikasi Pembelajaran Tumbuhan Monokotil dan Dikotil Berbasis Multimedia Untuk Anak SMA Kelas XI

Perancangan Aplikasi Pembelajaran Tumbuhan Monokotil dan Dikotil Berbasis Multimedia Untuk Anak SMA Kelas XI

Perancangan Aplikasi Pembelajaran Tumbuhan Monokotil dan Dikotil Berbasis Multimedia Untuk Anak SMA Kelas XI

Perancangan Aplikasi Pembelajaran Tumbuhan Monokotil dan Dikotil Berbasis Multimedia Untuk Anak SMA Kelas XI

Perancangan Aplikasi Pembelajaran Tumbuhan Monokotil dan Dikotil Berbasis Multimedia Untuk Anak SMA Kelas XI

Perancangan Aplikasi Pembelajaran Tumbuhan Monokotil dan Dikotil Berbasis Multimedia Untuk Anak SMA Kelas XI

MORFOLOGI PERAKARAN TUMBUHAN MONOKOTIL DAN TUMBUHAN DIKOTIL

Dokumen yang Anda mencari sudah siap untuk unduhkan