Anda di halaman 1dari 41

PERANCANGAN SISTEM INFORMASI UJIAN SEKOLAH

BERBASIS WEB

MAKALAH
Diajukan untuk memenuhi tugas Ujian Akhir Semester V mata kuliah
Web Programming I

Kelas : 12.5C.05

1. Ahmad Sauki 12150371


2. Arif Nurhadi 12151553
3. Hilda Chandraningrum 12151140
4. Rizal Fahmi 12153242
5. Saidina Ali 12150469

Jurusan Menejemen Informatika


Akademi Manajemen Informatika dan Komputer Bina Sarana Informatika
Bekasi
2018
KATA PENGANTAR

Segala puji dan syukur kita panjatkan kepada Allah SWT serta shalawat

dan salam kami sampaikan hanya bagi tokoh dan teladan kita Nabi Muhammad

SAW. Diantara sekian banyak nikmat Allah SWT yang membawa kita dari

kegelapan ke dimensi terang yang memberi hikmah dan yang paling bermanfaat

bagi seluruh umat manusia, sehingga oleh karenanya kami dapat menyelesaikan

salah satu tugas makalah mata kuliah Web Programming I yang berjudul

“Perancangan Sistem Informasi Ujian Sekolah Berbasis Web”.

Dalam proses penyusunan makalah ini kami menjumpai hambatan, namun

berkat dukungan material dari berbagai pihak, akhirnya kami dapat menyelesaikan

tugas ini dengan cukup baik, oleh karena itu melalui kesempatan ini kami

menyampaikan terima kasih dan penghargaan setinggi – tingginya kepada semua

pihak terkait yang telah berpartisipasi dan membantu dalam menyelesaikan

penulisan ini. Akhirnya kami menyadari bahwa Makalah ini sangat jauh dari

kesempurnaan. Oleh karena itu segala saran dan kritik yang membangun dari

semua pihak sangat kami harapkan demi perbaikan pada tugas selanjutnya.

Harapan kami semoga makalah ini bermanfaat khususnya bagi kami dan bagi

pembaca lain pada umumnya.

Bekasi, Januari 2018

Penyusun

ii
DAFTAR ISI

Halaman Judul............................................................................................................i
Kata Pengantar ...........................................................................................................ii
Daftar Isi.....................................................................................................................iii

BAB I PENDAHULUAN ..................................................................................1


1.1. Latar Belakang ...............................................................................1
1.2. Maksud dan Tujuan .......................................................................2

BAB II LANDASAN TEORI .............................................................................3


2.1. Konsep Dasar Web ........................................................................3
2.2. Basis Data ......................................................................................10
2.3. Model Pengembangan Sistem........................................................14
2.4. Struktur Navigasi ...........................................................................16
2.5. Black Box Testing .........................................................................18
2.6. Unified Modelling Language .........................................................20

BAB III PEMBAHASAN ....................................................................................22


3.1. Analisa Kebutuhan Software .........................................................22
3.2. Desain Basis Data ..........................................................................26
3.3. Rancangan Struktur Navigasi ........................................................28
3.4. User Interface.................................................................................31

BAB IV PENUTUP ..............................................................................................37


4.1. Kesimpulan ....................................................................................37
4.2. Saran ..............................................................................................37

DAFTAR PUSTAKA ...............................................................................................38

iii
BAB I

PENDAHULUAN

1.1. Latar Belakang

Teknologi informasi merupakan teknologi yang menghubungkan antara

komputasi dan komunikasi untuk melakukan tugas-tugas informasi sehingga arus

informasi dapat berjalan dengan baik. Teknologi informasi berkembang pesat di

berbagai aspek kehidupan mulai dari personal hingga instansi. Dalam instansi

negeri maupun swasta, teknologi informasi sangat dibutuhkan dalam optimalisasi

segala proses yang berkaitan dengan pembangunan dan perbaikan sistem. Salah

satu bentuk pengoptimalan tersebut adalah penerapan sistem informasi. Kriteria

dalam sistem informasi antara lain adalah fleksibel, efektif dan efisien.

Sekolah adalah salah satu instansi di bidang pendidikan yang telah

menggunakan teknologi informasi dalam berbagai aspek kegiatan, termasuk

kegiatan ujian yang dilakukan. Terkait dengan perkembangan teknologi informasi,

ujian tidak lagi dilaksanakan secara manual namun telah mengalami transformasi

dengan memanfaatkan teknologi informasi untuk mengoptimalkan kegiatan ujian.

Sistem ujian yang masih dilakukan secara manual termasuk dengan sistem

koreksi ujiannya, membuat guru biasanya harus menambah jam kerja untuk

membuat dan menilai soal ujian para siswa secara manual. Dalam kemajuan

teknologi informasi yang semakin pesat, ujian manual tidak lagi dapat dijadikan

sebagai kegiatan rutin. Untuk itu dibutuhkan sebuah sistem ujian berbasis web

sebagai solusi untuk mengoptimalkan sistem ujian manual.

1
2

Sistem ujian berbasis web bermanfaat untuk mengurangi tingkat

kecurangan siswa karena soal yang disajikan akan berbeda satu dengan yang lain

serta dapat menghemat waktu yang biasanya digunakan untuk mengoreksi ujian

sesuai dengan kriteria sistem itu sendiri. Sistem ujian berbasis web juga memilki

manfaat finansial yaitu dapat menghemat kertas ujian karena menggunakan piranti

yang tidak sekali pakai. Penerapan sistem ujian berbasis web diharapkan akan

mampu meningkatkan mutu pendidikan dan pengajaran di masa mendatang.

1.2. Maksud dan Tujuan

Maksud dari penulisan makalah ini adalah :

1. Mengimplementasikan ujian online bebasis web di lingkungan sekolah.

2. Merancang aplikasi ujian sekolah bebasis web.

3. Sebagai media untuk memudahkan guru dan siswa.

Sedangkan tujuan dari penulisan makalah ini adalah untuk memenuhi tugas

Web Programing I sebagai persyaratan untuk memperoleh nilai UAS pada jurusan

Manajemen Informatika di Akademi Manajemen Informatika dan Komputerisasi

Bina Sarana Informatika ( AMIK BSI ) Kaliabang Bekasi.


BAB II

LANDASAN TEORI

2.1. Konsep Dasar Web

Dalam pembangunan website yang penulis gunakan sebagai media dalam

penyampaian informasi mengenai elearning, ada beberapa unsur – unsur penunjang

yang mendukung guna membuat website Nampak lebih menarik. Unsur – unsur

atau beberapa konsep dasar tersebut adalah sebagai berikut :

A. Internet

Menurut Nugroho (2008:3) memberikan batasan bahwa “internet adalah

solusi jaringan yang dapat menghubungkan beberapa jaringan local yang ada pada

suatu daerah, kota atau bahkan pada suatu negara”.

Dengan adanya internet kita dapat menghubungkan beberapa jaringan local

yang ada pada setiap tempat. Tidak hanya itu juga dengan adanya fasilitas internet

setiap orang dapat melakukan kegiatan apa saja seperti mengirim email, mencari

data, bermain game, akses bank, atau bahkan melakukan pembelajaran secara

online.

Untuk dapat menghubungkan beberapa computer sehingga menjadi sebuah

kelompok jaringan, kita membutuhkan suatu media penghubung yang bernama

TCP/IP, yaitu sebuah protocol yang mengidentifikasi sebuah computer yang

terhubung di dalam jaringan. TPC/IP memiliki teknik mengidentifikasi dengan

menggunakan penomeran yang dinamakan nomor IP/IP Address (Internet Protokol

3
4

Address). Dengan menggunakan nomor ini sebuah komputer dapat terhubung

dengan computer lain dalam sebuah jaringan atau dengan jaringan global yang di

sebut internet.

Pada saat kita menggunakan internet, ada tiga komponen dasar yang

membuat berfungsi, yaitu :

1. Jaringan fisik computer, berfungsi sebagai media atau saluran yang digunakan

untuk lalu lintas data.

2. Protokol, berfungsi sebagai alat komunikasi dari satu sistem ke sistem lain.

3. Program aplikasi, adalah fasilitas yang digunakan oleh pemakai untuk dapat

berinteraksi di internet.

B. Website

Menurut Simarmata (2009:56), memberikan bahwa “Aplikasi web adalah

sistem informasi yang mendukung interaksi pengguna melalui antarmuka

berbasisweb”. Sedangkan website menurut Simarmata (2009:50) adalah “Sebuah

sistem dengan informasi yang disajikan dalam bentuk teks, gambar, suara dan lain-

lain yang tersimpan dalam sebuah server web internet yang disajikan dalam bentuk

hypertext.

Ada 3 macam jenis – jenis website, antara lain adalah :

1. Website Statis adalah suatu website yang mempunyai halaman yang tidak

berubah. Yang artinya adalah untuk melakukan sebuah perubahan pada suatu

halaman hanya bisa dilakukan secara manual yitu dengan cara mengedit kode-

kode yang menjadi struktur dari website itu sendiri.


5

2. Website Dinamis adalah merupakan suatu website yang secara strukturnya

diperuntukan untuk update sesering mungkin. Biasanya selain dimana utamanya

yang bisa diakses oleh para pengguna (user) pada umumnya, juga telah

disediakan halaman backend yaitu untuk mengedit konten dari website tersebut.

Contoh dari website dinamis seperti web berita yang didalamnya terdapat

fasilitas berita, dsb.

3. Website Interaktif adalah suatu website yang memang pada saat ini memang

terkenal. Contohnya website interaktif seperti forum dan blog. Di website ini

para pengguna bisa berinteraksi dan juga beradu argumen mengenai apa yang

menjadi pemikiran mereka.

C. PHP

Menurut Madcoms (2009:133) mendefinisikan bahwa “PHP (PHP:

Hypertext Preprocessor) adalah salah satu bahasa pemograman yang berjalan di

dalam server dan mampu membuat web menjadi interaktif dan dinamis. PHP dapat

mengolah data dari komputer client dan dari computer server itu sendiri, sehingga

mudah disajikan dalam browser.

PHP sebenarnya bahasa scripting seperti HTML, artinya source code php

ini tetap disimpan dalam bentuk teks dimana apabila diakses oleh user akan

langsung diparser oleh php-parser di servernya. Dan kode ini tidak di ubah ke

bentuk lain terlebih dahulu. Banyak tersedia platform PHP untuk mempermudah

pemrosesan. Cara penulisan script atau kode program PHP di awali dengan

pembukaan script :

<?php
6

Sementara tag penutupnya adalah

?>

Kode program PHP dapat disisipkan dibagian manapun dalam HTML atau

XHTML. Halaman yang ada script PHP di dalamnya, harus disimpan dengan

ekstensi .php

D. HTML

Menurut madcoms (2009:21) menerangkan bahwa “Salah satu bahasa

pemrograman web adalah HTML, HTML kependekan dari Hyper Text Markup

Language dan dokumen HTML merupakan teks murni yang sering disebut dengan

web page. Dokumen HTML berekstensi .htm atau .html”.

Didalam HTML Tag yang menyatakan awal program adalah ditandai

dengan Tag <HTML>, dan kemudian dapat di akhiri dengan tanda tutup </HTML>.

Dengan menggunakan tanda mulai dan tanda akhir dapat diartikan bahwa semua isi

data yang ada didalam Tag <HTML> </HTML> merupakan halaman isi dari

sebuah web. Berikut adalah struktur data sebuah halaman HTML yang digunakan

dalam membuat sebuah halaman web.

<html>

<head>

<title>judul web</title>

……isi head…….

</head>

<body>

…………isi body / isi web disini……


7

</body>

</html>

Dari script diatas dapat diperhatikan bahwa semua Tag yang digunakan

memiliki pasangan yaitu menggunakan kode pembuka ( < > ) dank ode penutup ( <

/ > ), sebagai contoh HTML yang dimulai dengan tanda <html> dan di akhiri dengan

kode </html>. Dengan menggunakan pengertian contoh diatas dapat di asumsikan

bahwa semua Tag harus memiliki kode pembuka ( star tag ) dan penutup ( end tag

), akan tetapi nantinya akan tetapi mendapatkan beberapa Tag yang tidak

memerlukan kode penutup seperti perintah ganti baris <br>, halaman (<P>), dan

lainnya.

1. <html> </html> : didalam Tag HTML, hal yang harus ada adalah kode

<HTML>, karena kode ini akan menyatakan jenis dokumen yang kita ketik. Tag

<HTML> wajib ada dan kemudian harus ditutup dengan kode </HTML>.

2. <head> </head> : kode <HEAD> jika diartikan berarti kepala, didalam web pun

kode <HEAD> juga diartikan sebagai kepala dalam program. Kode <HEAD>

yang kemudian diakhiri dengan kode </HEAD> adalah merupakan kode yang

diletakkan setelah pembukaan kode <HTML>.

3. <title> </title> : kode ini selalu akan diletakkan didalam kode <HEAD>, kode

ini dimaksudkan untuk mendeklarasi judul yang akan tampil dalam browser web

yang dibuat.

4. <body> </body> : merupakan kode yang berguna untuk meletakan semua isi

web yang akan kita buat. Kode ini diawali tanda <BODHTML, hal yang harus

ada adalah kode <HTML>, karena kode ini akan menyatakan jenis dokumen
8

yang kita ketik. Tag <HTML> wajib ada dan kemudian harus ditutup dengan

kode </HTML>.

5. <head> </head> : kode <HEAD> jika diartikan berarti kepala, didalam web pun

kode <HEAD> juga diartikan sebagai kepala dalam program. Kode <HEAD>

yang kemudian diakhiri dengan kode </HEAD> adalah merupakan kode yang

diletakkan setelah pembukaan kode <HTML>.

6. <title> </title> : kode ini selalu akan diletakkan didalam kode <HEAD>, kode

ini dimaksudkan untuk mendeklarasi judul yang akan tampil dalam browser web

yang dibuat.

7. <body> </body> : merupakan kode yang berguna untuk meletakan semua isi

web yang akan kita buat. Kode ini diawali tanda <BODY> dan diakhiri dengan

</BODY>.

Didalam penulisannya HTML tidak membedakan antara penggunaan huruf

besar dan kecil, misalnya pada saat mengetik <HTML> maka akan sama bila

menggunakan kode <Html> atau <html>. Jadi pada HTML idak mengenal istilah

case sensitive seperti yang ada pada sistem operasi LINUX maupun UNIX.

E. MySQL

Menurut Sugiri ( 2008:1 ) memberikan batasan bahwa “MySQL termasuk

dalam katagori database managemen sistem, yaitu data base yang terstruktur dalam

pengolahan dan penampilan datanya”.

MySQL merupakan database yang bersifat client server, dimana data

diletakkan deserver yang bisa diakses melalui komputer client. Pengaksesan dapat

dilakukan apabila komputer telah terhubung dengan server.


9

Menurut Segiri ( 2008 : 2 ) mendefinisikan bahwa “MySQL dapat juga dikatakan

sebagai relational database managemen sistem (RDBMS), yaitu hubungan antara

tabel yang berisi data – data pada suatu database”.

Dengan demikian dapat mempercepat pencarian suatu data. Tabel – tabel

tersebut di-link oleh suatu relasi yang memungkinkan kombinasi data dari beberapa

tabel ketika user menginginkan tampilan informasi dari database.

MySQL merupakan database yang dikembangkan dari bahasa SQL (

Struktured Query Language ). SQL merupakan bahasa terstruktur yang digunakan

untuk interaksi antara script program dengan database server dalam hal pengolahan

data. Dengan SQL, maka dapat dibuat tabel yang akan diisi data, memanipulasi data

seperti menambah, menghapus, dan meng-update data, serta membuat suatu

perhitungan berdasarkan data yang ditemukan.

F. Dreamweaver

Menurut Sadeli (2011:2) mendefinisikan bahwa “Dreamweaver merupakan

suatu perangkat lunak web editor yang digunakan untuk membangun dan

mendesign suatu website dengan fitur – fitur yang menarik dan kemudahan dalam

penggunaannya”.

Selain mudah digunakan dalam membuat dan mendesign web,

dreamweaver juga menambah flexibilitasnya dengan bahasa pemrograman web

lainnya dan dapat berintegrasi pada beberapa perangkat lunak lainnya, dan tidak

salah jika perangkat lunak ini menjadi pilihan para web-designer amatir maupun

expert.
10

G. Xampp

Menurut Madcoms (2009:1) Xampp adalah salah satu paket software web

server yang terdiri dari Apache, MySQL, PHP, dan phpMyAdmin. Proses instalasi

Xampp sangat mudah, karena tidak perlu melakukan konfigurasi Apache, PHP, dan

MySQL secara manual, Xampp melakukan instalasi dan konfigurasi secara

otomatis.

Fungsi Xampp adalah sebagai server yang berdiri sendiri (localhost), yang

terdiri atas program Apache HTTP, Server, MySQL database, dan penerjemah

bahasa yang ditulis dengan bahasa pemrograman PHP dan Perl. Nama Xampp

merupakan singkatan dari X (empat sistem operasi apapun), Apache, MySQL, PHP,

dan Perl. Program ini tersedia dalam GNU General Public Lisensi dan bebas,

merupakan web server yang mudah digunakan yang dapat melayani tampilan

halaman web yang dinamis.

2.2. Basis Data

Menurut Rosa dan Shalahudin (2011:44) mendefinisakan bahwa “Sistem

basis data adalah sistem terkomputerisasi yang tujuan utamanya adalah memelihara

data yang sudah diolah atau informasi dan membuat informasi tersedia saat

dibutuhkan”.

Pada intinya basis data adalah media untuk menyimpan data agar dapat di

akses dengan mudah dan cepat.

Kebutuhan basis data dalam sistem informasi meliputi ;

1. Memasukkan, menyimpan, dan mengambil data.

2. Membuat laporan berdasarkan data yang telah disimpan.


11

A. ERD ( Entity Relationship Diagram)

Menurut Yasin Verdi (2012:276) memberikan batasan bahwa “Entity

Relationship Diagram (ERD) adalah suatu rancangan atau bentuk hubungan suatu

kegiatan didalam sistem yang berkaitan langsung dan mempunyai fungsi didalam

proses tersebut”. ERD merupakan suatu pemodelan dari basis data relasional yang

didasarkan atas presepsi didalam dunia nyata, dunia ini senantiasa terdiri dari

sekumpulan objek yang saling berhubungan antara satu dengan yang lainnya. Suatu

objek disebut entity dan hubungan yang dimiliki disebut relationship. Suatu entity

bersifat unik dan memiliki atribut sebagai pembeda dengan entity lainnya.

ERD merupakan suatu model untuk menjelaskan hubungan antara data

dalam basis data berdasarkan objek – objek dasar data yang mempunyai hubungan

antara relasi. ERD untuk memodelkan struktur data dan hubungan antar data, untuk

menggambarkannya digunakan beberapa notasi dan simbol. Pada dasarnya ada tiga

simbol yang digunakan, yaitu :

1. Entity

Entity merupakan objek yang mewakili sesuatu yang nyata dan dapat dibedakan.

Simbol dari entity ini biasanya digambarkan dengan persegi panjang.

2. Atribut

Setiap entitas pasti mempunyai elemen yang disebut atribut yang berfungsi

untuk mendeskripsikan karekteristik dari entitas tersebut. Isi dari atribut

mempunyai sesuatu yang dapat mengidentifikasikan isi elemen satu dengan

yang lain.
12

3. Hubungan / Relasi

Relasi didefinisikan sebagai hubungan yang terjadi antara entity. Representasi

diagram relasi adalah sebuah garis lurus yang menghubungkan dua buah entity.

Kunci relasi harus mengidentifikasi sebuah baris yang unik didalam sebuah

relasi.

Menurut Kusrini (2007:22) ada beberapa istilah yang harus dipahami

sebelum merancang basis data dengan menggunakan model entity relationship

diagram, diantaranya yaitu :

1. Superkey

Satu atau lebih atribut yang dapat membedakan setiap baris data dalam tabel

secara uni.

2. Kandidat Key

Merupakan kumpulan atribut minimal yang membedakan setiap baris data dalam

tabel secara unik.

3. Kunci Relasi (Relation Key) atau kunci utama (Primary Key)

Nilai dari kunci relasi harus mengidentifikasi sebuah baris yang unik didalam

sebuah relasi. Kunci relasi terdiri dari satu atau lebih atribut – atribut relasi. Agar

bisa menjadi sebuah primary key, sebuah atribut haruslah memenuhi persyaratan

sebagai kandidat key.

4. Kunci Alternatif (Alternate Key)

Kunci yang tidak ada didunia nyata, tetapi diadakan dan dijadikan primary key.

Kunci alternative dibuat ketika tidak ada satu pun atribut dalam sebuah relasi

yang bisa mewakili relasi tersebut, atau ada yang bisa menjadi kandidat key

tetapi tidak cukup efektif untuk digunakan sebagai primary key.


13

5. Komposit Key

Primary key yang terdiri dari lebih dari satu atribut.

6. Foreign Key

Sebuah foreign key adalah sekumpulan atribut dalam suatu relasi (missal A)

sedemikian sehingga kompul atribut ini bukan kunci relasi A tetapi merupakan

kunci dari relasi lain.

7. Kardinalitas Pemetaan

Kardinalitas pemetaan menunjukan jumlah entity yang dihubungkan ke satu

entity lain dengan suatu relationship sets. Kardinalitas pemetaan meliputi, antara

lain :

a. Hubungan satu ke satu (one to one)

b. Hubungan satu ke banyak (one to many)

c. Hubungan banyak ke satu (many to one)

d. Hubungan banyak ke banyak (many to many)

B. LRS (Logical Record Structure)

Menurut Riyanto (2005:22) Mendefinisikan bahwa “LRS (logical record

strukture) adalah representasi dari struktur record-record pada tabel-tabel yang

terbentuk dari hasil antar himpunan entitas”. Logical record strukture dibentuk

dengan nomor dari tipe record. Logical record strukture terdiri dari link-link

diantara tipe record. Link ini menunjukan arah dari satu tipe record lainnya. Banyak

link dari LRS yang diberi tanda field-field yang kelihatan pada kedua link tipe

record.
14

2.3. Model Pengembangan Sistem

Menurut Rosa dan Shalahuddin (2013:26) memberikan batasan bahwa

“SDLC atau System Development Life Cycle adalah proses mengembangkan atau

mengubah suatu sistem perangkat lunak dengan menggunakan model – model dan

metodologi yang digunakan orang untuk mengembangkan sistem – sistem

perangkat lunak sebelumnya berdasarkan best practice atau cara – cara yang sudah

teruji baik.

SDLC memiliki beberapa model dalam penerapan tahapan prosesnya.

Beberapa model dasar akan dibahas pada subbab – subbab berikutnya. Selain model

– model dasar yang akan dibahas, masih banyak model – model yang muncul

dengan memodifikasi model – model SDLC dasar.

Menurut Rosa dan Shalahuddin (2013:28) menerapkan bahwa “Model

SDLC air terjun (waterfall) sering juga disebut model sekuensial linier (sequential

linear) atau alur hidup klasik (classic life cycle).”

Model air terjun menyediakan pendekatan alur hidup perangkat lunak secara

sekuensial atau urut dimulai dari analisis, desain, pengkodean, pengujian dan tahap

support . Berikut adalah gambaran model air terjun :

1. Analisis kebutuhan perangkat lunak

Proses pengumpulan kebutuhan dilakukan secara intensif untuk

mespesifikasikan kebutuhan perangkat lunak agar dapat dipahami perangkat

lunak seperti apa yang dibutuhkan oleh user. Spesifikasi kebutuhan perangkat

lunak pada tahap ini perlu untuk didokumentasikan.


15

2. Desain

Desain perangkat lunak adalah proses multi langkah yang focus pada desain

pembuatan program perangkat lunak termasuk struktur data, arsitektur perangkat

lunak, representasi antar muka, prosedur pengkodean. Tahap ini mentranslasi

kebutuhan perangkat lunak dari tahap analisis kebutuhan ke representasi desain

agar dapat diimplementasikan menjadi program pada tahap selanjutnya.

3. Pembuatan kode program

Desain harus ditranslasikan ke dalam program perangkat lunak. Hasil dari tahap

ini adalah program komputer sesuai dengan desain yang telah dibuat pada tahap

desain.

4. Pengujian

Pengujian fokus pada perangkat lunak secara segi lojik dan fungsional dan

memastikan bahwa semua bagian sudah diuji. Hal ini dilakukan untuk

meminimalisir kesalahan (error) dan memastikan keluaran yang dihasilkan

sesuai dengan yang diinginkan.

5. Pendukung (support) atau pemeliharaan (maintenance)

Tidak menutup kemungkinan sebuah perangkat lunak mengalami perubahan

ketika sudah dikirimkan ke user. Perubahan bisa terjadi karena adanya kesalahan

yang muncul dan tidak terdeteksi saat pengujian atau perangkat lunak harus

beradaptasi dengan lingkungan baru. Tahap pendukung atau pemeliharaan dapat

mengulangi proses pengembangan mulai dari tahap analisis spesifikasi untuk

perubahan perangkat lunak baru.


16

2.4. Struktur Navigasi

Menurut Sutopo (2007:2) “Struktur Navigasi adalah struktur bagaimana

halaman web dihubungkan dengan halman lain”. Struktur navigasi dapat

digolongkan menurut kebutuhan akan objek, kemudahan pemakaian,

keinteraktifitasannya dan kemudahan membuatnya yang berpengaruh terhadap

waktu pembuatan suatu situs web.

Menurut Sutopo (2007:6) dalam pengembangan web, terdapat beberapa

model navigasi dasar, yang harus dikenal dengan baik oleh desainer, karena setiap

model navigasi dapat memberikan solusi untuk kebutuhan yang berbeda. Macam-

macam struktur navigasi antara lain :

1. Linear navigation model

Digunakan oleh sebagian besar website. Informasi diberikan secara sekuensial

dimulai dari satu halaman. Beberapa desainer web menggunakan satu halaman

untuk masuk atau keluar dari website.

Sumber : Sutopo (2007:6)

Gambar II.1

Stuktur Navigasi Linier Navigation Model

2. Hierarchical model

Diadaptasi dari top-down design. Konsep navigasi ini dimulai dari satu node

yang menjadi homepage. Dari homepage dapat dibuat beberapa cabang ke

halaman-halaman utama. Apabila diperlukan, dari tiap halaman utama dapat


17

dikembangkan menjadi beberapa cabang lagi. Hal ini seperti struktur organisasi

dalam perusahaan.

Sumber : Sutopo (2007:7)

Gambar II.2

Stuktur Navigasi Hierarchical Model

3. Spoke-and-hub model

Hanya menggunakan satu node untuk berhubungan dengan node lain. Pada

model ini hanya terdapat dua macam link, yaitu dari homepage ke halaman

tertentu, dan dari halaman tersebut kembali ke homepage.

Sumber : Sutopo (2007:7)

Gambar II.3

Stuktur Navigasi Spoke-and-hub model


18

4. Full web model

Memberikan kemampuan hyperlink yang banyak. Full web model banyak

digunakan karena user dapat mengakses semua topik dengan subtopik dengan

cepat. Namun kelemahan dari model ini, yaitu dapat berakibat user kehilangan

cara untuk kembali ke topik sebelumnya.

Sumber : Sutopo (2007:8)

Gambar II.4

Stuktur Navigasi Full web model

2.5. Black Box Testing (Pengujian Kotak Hitam)

Menurut Rosa dan Shalahuddin (2013:275) “Black-box testing yaitu

pengujian perangkat lunak dari segi spesifikasi fungsional tanpa menguji desain dan

kode program. Pengujian dimaksudkan untuk mengetahui apakah fungsi-fungsi

masukan dan keluaran dari perangkat lunak sesuai dengan spesifikasi yang

dibutuhkan.
19

Pengujian dimaksudkan untuk mengetahui apakah fungsi-fungsi, masukan,

dan keluaran dari perangkat lunak sesuai dengan spesifikasi yang dibutuhkan.

Langkah-langkah dalam black –box :

1. Analisa kebutuhan dan spesifikasi

2. Pemilihan Input.

3. Pemilihan Output.

4. Seleksi Input.

5. Pengujian.

6. Review Hasil.

7. Evaluasi.

Pengujian kotak hitam dilakukan dengan membuat kasus uji yang bersifat

mencoba semua fungsi dengan memakai perangkat lunak apakah sesuai dengan

spesifikasi yang dibutuhkan. Kasus uji yang dibuat untuk melakukan pengujian

kotak hitam harus dibuat dengan kasus benar dan kasus salah.

Kategori error yang akan diketahui dengan pengujian black-box testing :

1. Fungsi yang hilang atau tidak benar.

2. Error dari antar-muka.

3. Error dari struktur data atau akses eksternal database.

4. Error dari kinerja atau tingkah laku.

5. Error dari inisilisasi dan terminasi.


20

2.6. Unified Modeling Language (UML)

Menurut Nugroho (2010:6) “UML (Unified Modeling Language) adalah

bahasa pemodelan untuk sistem atau perangkat lunak yang berparadigma

berorientasi objek”.

Pemodelan (modeling) sesungguhnya digunakan untuk penyederhanaan

permasalahan-permasalahan yang kompleks sedemikian rupa sehingga lebih

mudah dipelajari dan dipahami.

Jenis – Jenis UML yaitu sebagai berikut :

1. Use case diagram

Use case diagram yaitu salah satu jenis diagram pada UML yang

menggambarkan interaksi antara sistem dan aktor, use case diagram juga dapat

men-deskripsikan tipe interaksi antara si pemakai sistem dengan sistemnya.

2. Activity Diagram

Activity diagram atau diagram aktivitas yaitu salah satu jenis diagram pada UML

yang dapat memodelkan proses-proses apa saja yang terjadi pada sistem.

3. Sequence diagram

Sequence diagram yaitu salah satu jenis diagram pada UML yang menjelaskan

interaksi objek yang berdasarkan urutan waktu, sequence diagram juga dapat

menggambarkan urutan atau tahapan yang harus dilakukan untuk dapat

menghasilkan sesuatu seperti pada use case diagram.

4. Class diagram

Class diagram yaitu salah satu jenis diagram pada UML yang digunakan untuk

menampilkan kelas-kelas maupun paket-paket yang ada pada suatu sistem yang
21

nantinya akan digunakan. Jadi diagram ini dapat memberikan sebuah gambaran

mengenai sistem maupun relasi-relasi yang terdapat pada sistem tersebut.

5. Statemachine diagrag

Statemachine diagram yaitu salah satu jenis diagram pada UML yang

menggambarkan transisi maupun perubahan keadaan suatu objek pada sistem.

6. Communication diagram

Communication diagram yaitu salah satu jenis diagram pada UML yang dapat

menggamabarkan tahapan terjadinya suatu aktivitas dan diagram ini juga

menggambarkan interaksi antara objek yang ada pada sistem. Hampir sama

seperti sequence diagram akan tetapi communication diagram lebih menekankan

kepada peranan masing-masing objek pada sistem.

7. Deployment diagram

Deployment diagram yaitu salah satu diagram pada UML yang menunjukan tata

letak suatu sistem secara fisik, dapat juga dikatakan untuk menampilkan bagian-

bagian softwere yang terdapat pada hardwere dan digunakan untuk menerapkan

suatu sistem dan hubungan antara komponen hardwere. Jadi Deployment

diagram intinya untuk menunjukan letak softwere pada hardwere yang

digunakan sistem.
BAB III

PEMBAHASAN

3.1. Analisa Kebutuhan Software

A. Use Case Diagram

Gambar III.1

Use Case Diagram

22
23

B. Activity Diagram

1. Activity Diagram Halaman Guru

Gambar III.2

Activity Diagram Halaman Guru


24

2. Activity Diagram Halaman Siswa

Gambar III.3

Activity Diagram Halaman Siswa


25

3. Activity Diagram Halaman Admin

Gambar III.4

Activity Diagram Halaman Admin


26

3.2. Desain Basis Data

A. ERD (Entity Relationship Diagram)

Gambar III.5

ERD (Entity Relationship Diagram)


27

B. LRS (Logical Record Strukture)

Gambar III.6

LRS (Logical Record Strukture)


28

3.3. Rancangan Struktur Navigasi

Struktur navigasi pada sistem ujian sekolah berbasis web ini berfungsi untuk

memperlihatkan keseluruhan dari isi website beserta hubungan antar isi. Struktur

navigasinya dapat digambarkan sebagai berikut :

A. Struktur Navigasi Halaman Siswa

Gambar III.7

Struktur Navigasi Halaman Siswa


29

B. Struktur Navigasi Halaman Guru

Gambar III.8

Struktur Navigasi Halaman Guru


30

C. Struktur Navigasi Halaman Admin

Gambar III.9

Struktur Navigasi Halaman Admin


31

3.4. User Interface

A. Halaman Login Siswa

Gambar III.10

Halaman Login Siswa

B. Halaman Login Guru dan Admin

Gambar III.11

Halaman Login Admin dan Guru


32

C. Halaman Dashboard Admin

Gambar III.12

Halaman Dashboard Admin

D. Halaman Admin Mengelola Data Sekolah

Gambar III.13

Halaman Admin Mengelola Data Sekolah


33

E. Halaman Admin Mengelola Daftar Peserta

Gambar III.14

Halaman Admin Mengelola Data Peserta

F. Halaman Dashboard Guru

Gambar III.15

Halaman Dashboard Guru


34

G. Halaman Guru mengelola Data Guru

Gambar III.16

Halaman Guru Mengelola Data Guru

H. Halaman Guru Mengelola Data Soal Ujian

Gambar III.17

Halaman Guru Mengelola Data Soal Ujian


35

I. Halaman Ujian Siswa

Gambar III.18

Halaman Ujian Siswa

J. Halaman Hasil Ujian Siswa

Gamabr III.19

Halaman Hasil Ujian Siswa


36

K. Halaman Laporan Hasil Ujian Siswa

Gambar III.20

Halaman Laporan Hasil Ujian Siswa


BAB IV

PENUTUP

4.1. Kesimpulan

Dari uraian tentang perancangan sistem informasi ujian sekolah berbasis

web yang telah dibahas pada bab sebelumnya, penulis dapat memberikan

kesimpulan sebagai berikut :

1. Dengan menggunakan fasilitas internet diharapkan ujian sekolah berbasis web

ini lebih mempermudah dan mempercepat teknis ujian.

2. Sistem ujian berbasis web memberikan manfaat yaitu tidak perlu melakukan

pengadaan kertas ujian dan menghemat waktu untuk koreksi ujian sehingga

efisiensi dan efektitas yang menjadi tujuan pembuatan sistem ujian berbasis web

dapat tercapai.

4.2. Saran

Saran – saran yang penulis kemukakan dengan kesimpulan adalah sebagai

berikut :

1. Guru diharapkan mendapat pelatihan terlebih dahulu agar mampu

beradaptasi dengan program yang ada di dalam website.

2. Perlu adanya simulasi ujian berbasis web terhadap siswa.

3. Perlu adanya maintenans web secara berkala agar sistem bisa berjalan

dengan baik.

37
DAFTAR PUSTAKA

Madcoms. 2009. Menguasai XHTML, CSS, PHP, dan MySQL melalui

DREAMWEVER. Yogyakarta : Andi.

Sugiri, dan Haris Saputro. 2008. Pengelolaan Database MySQL dengan PHP

MyAdmin. Yogyakarta : Graha Ilmu.

Sadeli, Muhammad. 2011. Dreamweaver CS5 untuk Orang Awam. Palembang :

Maxikom.

Rosa, A.S. dan M. Shalahuddin. 2013. Rekayasa Perangkat Lunak Terstruktur dan

Berorientasi Objek. Bandung : Informatika.

Kusrini. 2007. Strategi Perancangan dan Pengelolaan Basis Data. Yogyakarta :

Andi.

Verdi, Yasin. 2012. Rekayasa Perangkat Lunak Berorientasi Objek (Pemodelan,

Arsitektur dan Perancangan Modeling, Architecture and Design). Jakarta :

Mitra Wacana Media.

Riyanto. 2005. Migrasi Micosoft SQL server dengan Postgre SQL. Jakarta: Elex

Media Komputindo.

Sutopo, Aries Hadi. 2007. Pemrograman Flash dengan PHP dan MySQL.

Yogyakarta : Graha Ilmu.

Nugroho, Adi. 2010. Rekayasa Perangkat Lunak Berbasis Objek dengan Metode

USDP. Yogyakarta : Andi.

38

Anda mungkin juga menyukai