Aplikasi Bimbel Online LBB Best

(1)

KERJA PRAKTEK

Diajukan Untuk Memenuhi Tugas Mata Kuliah Kerja Praktek Program Studi Teknik Informatika

Fakultas Teknik dan Ilmu Komputer

MUHAMAD ALI NUR ZAMAN 10110059

WAWAN DIDIT M 10110062

RYANJAS ARGO FAMYTRA 10110089

PROGRAM STUDI TEKNIK INFORMATIKA

FAKULTAS TEKNIK DAN ILMU KOMPUTER

UNIVERSITAS KOMPUTER INDONESIA

2014


(2)

E-1

LAMPIRAN E LEMBAR PENGESAHAN


(3)

(4)

F-1

LAMPIRAN F


(5)

(6)

(7)

(8)

G-1

LAMPIRAN G


(9)

G-2

Nama Lengkap : Muhamad Ali Nur Zaman

NIM : 10110059

Tempat/Tanggal Lahir : Kediri / 07-05-1993

Jenis Kelamin : Laki – Laki

Agama : Islam

Alamat Lengkap : Perum. Candra Kirana blok P – 5 Kediri

Nomor Telepon : 085220432719

PENDIDIKAN

1998-2004 : SDN Mojoroto III Kediri

2004-2007 : SMP Negeri 1 Kediri

2007-2010 : SMA Negeri 7 Kediri

2010 s/d sekarang : Program Strata 1 (S1) Program Studi Teknik Informatika Fakultas Teknik dan Ilmu Komputer


(10)

G-3

Nama Lengkap : Wawan Didit M

NIM : 10110062

Tempat/Tanggal Lahir : Palembang / 27-09-1991

Jenis Kelamin : Laki – Laki

Agama : Islam

Alamat Lengkap : KP 07 Bumi Mulya, Palembang

Nomor Telepon : 085769638480

PENDIDIKAN

1997-2003 : SD Negeri 1 Belitang

2003-2006 : MTs Belitang

2006-2009 : SMK Muhammadiyah, Belitang

2010 s/d sekarang : Program Strata 1 (S1) Program Studi Teknik Informatika Fakultas Teknik dan Ilmu Komputer


(11)

G-4

Nama Lengkap : Ryanjas Argo Famytra

NIM : 10110089

Tempat/Tanggal Lahir : Gunung Melayu II / 12-06-1992

Jenis Kelamin : Laki – Laki

Agama : Islam

Alamat Lengkap : Jl. Stadion No.16 , Kelurahan Perdagangan I, Kec. Bandar I, Simalungun, Sumatera Utara

Nomor Telepon : 087823048297

PENDIDIKAN

1998-2004 : SD Bina Dharma

2004-2007 : SMP Negeri 1 Air Batu, Sumatera Utara

2007-2010 : SMA Negeri 1 Kisaran, Sumatera Utara

2010 s/d sekarang : Program Strata 1 (S1) Program Studi Teknik Informatika Fakultas Teknik dan Ilmu Komputer


(12)

ii LEMBAR JUDUL

LEMBAR PENGESAHAN

KATA PENGANTAR ... i

DAFTAR ISI ... ii

DAFTAR TABEL ... iv

DAFTAR GAMBAR ... v

DAFTAR LAMPIRAN ... ix

BAB 1 PENDAHULUAN ... 1

1.1. Latar Belakang Masalah ... 1

1.2. Rumusan Masalah ... 2

1.3. Maksud dan Tujuan ... 2

1.3.1. Maksud ... 2

1.3.2. Tujuan ... 2

1.4. Batasan Masalah ... 2

1.5. Metodologi Penelitian ... 3

1.6. Sistematika Penulisan ... 5

BAB 2 TINJAUAN PUSTAKA ... 6

2.1. Profil Tempat Kerja ... 6

2.1.1. Sejarah Instansi ... 6

2.1.2. Logo Instansi ... 7

2.1.3. Badan Hukum ... 7

2.1.4. Struktur Organisasi dan Job Description ... 7

2.2. Landasan Teori ... 9

2.2.1. Pengertian Bimbingan Belajar ... 9

2.2.2. Pengertian Internet ... 9

2.2.3. Pengertian Basis Data (Database) ... 10

2.3. Alat Bantu Analisis ... 10

2.3.1. Entity Relationship Diagram (ERD) ... 10


(13)

iii

2.4. Perangkat Lunak Pendukung ... 11

2.4.1. Microsoft Visio Professional 2010... 11

2.4.2. Adobe Dreamweaver CS6 ... 11

2.4.3. Wampserver ... 12

BAB 3 PEMBAHASAN ... 14

3.1. Jadwal Kerja Praktek ... 14

3.2. Teknik Kerja Praktek ... 14

3.3. Analisis Sistem ... 14

3.4. Analisis Masalah ... 15

3.4.1. Analisis Sistem yang Sedang Berjalan ... 15

3.4.2. Analisis Kebutuhan Non Fungsional ... 19

3.4.3. Analisis Basis Data ... 24

3.4.4. Analisis Kebutuhan Fungsional ... 25

3.5. Perancangan ... 44

3.5.1. Perancangan Data ... 44

3.5.2. Perancangan Arsitektur ... 49

3.5.3. Perancangan Prosedural ... 83

3.6. Implementasi ... 92

3.6.1. Implementasi Data ... 92

3.6.2. Implementasi Antarmuka ... 95

BAB 4 KESIMPULAN DAN SARAN ... 109

4.1. Kesimpulan ... 109

4.2. Saran ... 109


(14)

i

Puji syukur kami panjatkan kepada Tuhan Yang Maha Esa atas rahmat dan karunia-Nya kami dapat menyelesaikan Laporan Hasil Kerja Praktek yang merupakan syarat memenuhi Mata Kuliah Kerja Praktek Program Strata I Program Studi Teknik Informatika, pada Universitas Komputer Indonesia, dengan judul topik “Aplikasi Bimbel Online LBB BEST”.

Dalam menyelesaikan tugas ini, tidak terlepas dari bantuan dan kerja sama dari berbagai pihak terutama atas bimbingan Ibu Dian Dharmayanti, S.T., M.Kom. selaku pembimbing jurusan, Bapak Woko Priyanto, S.E. selaku pembimbing lapangan, kedua orang tua yang kami cintai, teman-teman seperjuangan dan kepada semua pihak, baik secara langsung maupun tidak langsung telah memberikan bantuan dan sumber referensi sehingga laporan Kerja Praktek ini dapat diselesaikan.

Kami menyadari bahwa apa yang kami buat ini masih jauh dari sempurna, oleh sebab itu saran dan kritik yang bersifat membangun akan sangat membantu kami. Harapan kami adalah semoga apa yang telah kami tuangkan dalam laporan ini dapat bermanfaat bagi kita semua.

Bandung, 3 Februari 2014


(15)

DAFTAR PUSTAKA

[1] D. K. Sukardi, Bimbingan dan Konseling di Sekolah, Jakarta: Rineka Cipta, 2008.

[2] Marzuki, “Pengaruh Bimbingan Belajar terhadap Nilai Mahasiswa dengan Uji Permutasi,” Statistika, vol. 11, no. 1, pp. 39-50, 2011.

[3] Syuhada, Bimbingan dan Konseling dalam Masyarakat dan Pendidikan Luar Sekolah, Jakarta: Depdikbud, 1988.

[4] J. Strauss, A. I. El-Ansary and F. Raymond, E-Marketing, 3rd ed., New Jersey: Prentice Hall, 2003.

[5] I. Novianto, “Perilaku Penggunaan Internet di Kalangan Mahasiswa,” Libri-Net, vol. 2, no. 1, 2012.

[6] T. Connolly and C. Begg, Database Systems: A Practical Approach to Design, Implementation, and Management, 5th ed., New Jersey: Pearson Education, 2010.

[7] H. Jogiyanto, Analisis dan Desain Sistem Informasi : Pendekatan Terstruktur Teori dan Praktik Aplikasi Bisnis, Yogyakarta: Andi, 2005.

[8] I. Fathansyah, Basis Data, 4th penyunt., Bandung: Informatika, 2002.

[9] A. Kristanto, Perancangan Sistem Informasi Dan Aplikasinya, Yogyakarta: Gaya Media, 2008.

[10] Microsoft, “Microsoft Visio,” Microssoft Corporation, [Online]. Available: http://office.microsoft.com/en-us/visio/. [Diakses 10 Desember 2013].

[11] Adobe, “Adobe Dreamweaver,” Adobe, [Online]. Available:

http://www.adobe.com/products/dreamweaver.html. [Diakses 10 Desember 2013].

[12] Wampserver, “Wampserver,” Wampserver, [Online]. Available: http://www.wampserver.com/en/. [Diakses 10 Desember 2013].

[13] I. Sommerville, Software Engineering, 8th ed., Boston: Addison-Wesley Publications, 2007.


(16)

BAB 1

PENDAHULUAN

1.1. Latar Belakang Masalah

Lembaga Bimbingan Belajar adalah sebuah lembaga yang dibuat untuk membantu siswa dalam menempuh pendidikan, salah satunya yaitu LBB BEST. LBB BEST merupakan sebuah lembaga bimbingan belajar untuk tingkat SD sampai SMA. Lembaga bimbingan belajar ini telah beroperasi selama lebih dari 20 tahun. Sebagai lembaga bimbingan belajar yang telah berpengalaman, LBB BEST memiliki ratusan siswa dan memiliki banyak kelompok belajar.

Dalam operasinya, lembaga ini selalu memberikan uji coba terhadap siswa yang terdaftar pada tiap kelompok belajar. Uji coba ini dimaksudkan untuk mengetahui perkembangan siswa selama mengikuti proses belajar di lembaga ini. Penyelenggaraan uji coba tersebut dilakukan selama periode tertentu.

Berdasarkan studi dokumentasi yang telah dilakukan oleh penulis terhadap

dokumen peserta aktif program ‘Fokus STAN’ di Kota Kediri tahun 2011 dan 2012 serta dokumen hasil try out akbar ‘Fokus STAN’ di Kota Kediri tahun 2011 dan 2012, didapat hasil rata – rata peserta aktif yang lulus dari tiga uji coba (try out) pada 2011 adalah 26,77%, sedangkan dari hasil rata – rata peserta aktif yang lulus dari tiga try out pada 2012 adalah 39,85%. Kedua angka kelulusan tersebut masih di bawah dari yang diharapkan oleh LBB BEST, yaitu 50%.

Menurut LBB BEST, perlu adanya tambahan belajar bagi peserta bimbingan di luar jam bimbingan di kelas agar angka kelulusan uji coba peserta bimbingan dapat meningkat. Oleh karena itu, dibutuhkan aplikasi bimbel online LBB BEST yang dapat membantu peserta bimbingan mendapat tambahan materi belajar di luar jam belajar di kelas.


(17)

1.2. Rumusan Masalah

Berdasarkan uraian latar belakang didapat rumusan masalah yaitu bagaimana membangun aplikasi bimbel online LBB BEST.

1.3. Maksud dan Tujuan 1.3.1. Maksud

Berdasarkan permasalahan yang diteliti, maka maksud dari kerja praktek ini adalah untuk membangun aplikasi bimbel online LBB BEST.

1.3.2. Tujuan

Berdasarkan permasalahan yang diteliti, maka tujuan yang akan dicapai dalam kerja praktek ini adalah:

a. Peserta bimbingan mendapat tambahan materi belajar di luar jam belajar di kelas.

b. Angka kelulusan uji coba peserta bimbingan dapat meningkat.

1.4. Batasan Masalah

Adapun batasan masalah dalam pembuatan perangkat lunak ini adalah sebagai berikut :

1. Aplikasi ini dapat diakses oleh peserta bimbel yang telah terdaftar di LBB BEST.

2. Fungsional yang tersedia di dalam aplikasi ini yaitu: a. Pengolahan data bimbel:

- Data siswa. - Data cabang. - Data program. - Data kota. - Data pegawai. - Data sekolah.

b. Upload dan Download materi per kelas. c. Pemberian try out online.


(18)

3. Informasi yang dihasilkan aplikasi yaitu : a. Informasi mengenai materi tambahan. b. Informasi mengenai data bimbel.

4. Aplikasi ini menggunakan metode analisis dan perancangan terstruktur.

1.5. Metodologi Penelitian

Metode penelitian yang digunakan adalah metode deskriptif. Metode deskriptif adalah suatu metode dalam penelitian untuk membuat gambaran mengenai situasi atau kejadian berdasarkan pencarian fakta dengan interpretasi yang tepat. Metode penelitian ini memiliki dua tahapan, yaitu sebagai berikut:

1. Metode Pengumpulan Data

Metode yang digunakan untuk mengumpulkan data adalah sebagai berikut:

a. Studi Dokumentasi

Pengumpulan data dengan mengumpulkan literatur yang telah ada dan berkaitan dengan judul penelitian.

b. Wawancara

Pengumpulan data dengan wawancara dengan manajer oprasional di LBB BEST.

2. Metode Pembuatan Perangkat Lunak

Metode analisis data dalam membangun perangkat lunak menggunakan paradigma waterfall, yang terdapat berbagai proses sebagai berikut:

a. Requirement Analysis and Definition

Layanan sistem, batasan, dan tujuan diperoleh melalui observasi terhadap sistem yang telah berjalan. Kemudian, didefinisikan secara rinci dan berfungsi sebagai spesifikasi sistem.


(19)

b. System and Software Design

Memproses persyaratan sistem baik untuk perangkat keras maupun lunak. Hal ini bertujuan untuk menetapkan arsitektur secara keseluruhan. Dalam desain perangkat lunak melibatkan proses identifikasi dan penggambaran abstraksi sistem perangkat lunak beserta hubungannya.

c. Implementation and Unit Testing

Selama tahap ini, desain perangkat lunak direalisasikan sebagai serangkaian program atau unit program. Unit pengujian melibatkan verifikasi bahwa setiap unit memenuhi spesifikasinya.

d. Integration and System Testing

Program yang telah terintegrasi diuji sebagai sistem yang lengkap untuk memastikan bahwa persyaratan perangkat lunak telah dipenuhi. Setelah pengujian, sistem perangkat lunak disampaikan kepada pelanggan.

e. Operation and Maintenance

Pada tahap ini sistem telah terinstal dan digunakan dalam praktiknya. Dalam pemeliharaannya melibatkan koreksi kesalahan yang tidak ditemukan pada tahap-tahap awal dari siklus pembangunan perangkat lunak, meningkatkan implementasi unit sistem dan meningkatkan layanan sistem tersebut sebagai persyaratan sistem yang baru.


(20)

1.6. Sistematika Penulisan

Sistematika penulisan laporan kerja praktek ini disusun untuk memberikan gambaran umum tentang kerja praktek yang dijalankan. Sistematika penulisan laporan kerja praktek ini adalah sebagai berikut :

BAB I PENDAHULUAN

Pada bab ini akan dibahas mengenai latar belakang masalah, rumusan masalah, maksud dan tujuan, batasan masalah, metodologi penelitian, dan sistematika penulisan laporan.

BAB II TINJAUAN PUSTAKA

Pada bab ini akan dibahas mengenai sejarah, visi - misi, personal dan lingkup layanan, struktur organisasi dan deskripsi pekerjaan, serta landasan teori yang menyangkut kasus yang akan dibahas di laporan kerja praktek ini.

BAB III PEMBAHASAN

Pada bab ini akan dibahas mengenai hasil analisis dan perancangan pembangunan aplikasi bimbel online LBB BEST.

BAB IV KESIMPULAN DAN SARAN

Pada bab ini akan dibahas mengenai kesimpulan dari keseluruhan masalah yang telah dibahas pada bab sebelumnya dan dilengkapi dengan saran-saran yang dapat dijadikan masukan bagi pihak instansi.


(21)

BAB 2

TINJAUAN PUSTAKA

2.1. Profil Tempat Kerja

LBB BEST adalah sebuah lembaga yang bergerak di bidang pendidikan dengan spesifikasi pada jasa bimbingan belajar untuk tingkat SD sampai SMA.

2.1.1. Sejarah Instansi

Berdiri pada tanggal 1 Oktober 1991 dengan nama LBB BES (Bina Eksakta Sosial), setelah berjalan 8 tahun tepatnya tanggal 15 Juli 1999 berganti nama menjadi LBB BEST (Bina Evaluasi Siswa Terpadu) sampai dengan sekarang.

Dengan dukungan tenaga profesional yang dimiliki di bidangnya masing-masing, LBB BEST telah berjalan selama 22 tahun. Sebagai lembaga bimbingan belajar yang telah berpengalaman, LBB BEST memiliki ratusan siswa dan memiliki banyak kelompok belajar. Selama itu, LBB BEST telah menghasilkan beberapa siswa yang berprestasi di tingkat kota maupun provinsi.

Visi LBB BEST adalah menjadi lembaga bimbingan belajar yang dapat berperan aktif dalam kemajuan pendidikan di Indonesia. Sedangkan, misi dari LBB BEST, yaitu:

a. Mencerdaskan kehidupan bangsa.

b. Meningkatkan mutu pendidikan di Indonesia. c. Mencetak siswa berprestasi.

d. Melakukan terobosan dalam sistem pembelajaran yang efisien dan efektif.

Seiring dengan pertumbuhan usaha, LBB BEST berusaha untuk memberikan pelayanan yang lebih optimal terhadap peserta bimbel LBB BEST dengan sistem pembelajaran yang lebih efisien dan efektif agar peserta bimbel dapat lebih berprestasi di sekolah.


(22)

2.1.2. Logo Instansi

Logo merupakan sebuah lambang yang dimiliki oleh setiap perusahaan atau instansi. Pembuatan logo dimaksudkan untuk merepresentasikan sebuah identitas suatu perusahaan yang mencerminkan jiwa, visi dan misi suatu perusahaan/instansi. Adapun logo LBB BEST adalah sebagai berikut:

Gambar 2.1. Logo LBB BEST

Dalam pembuatan logo, LBB BEST mempunyai berbagai makna yang merupakan kepribadian dari LBB BEST. Adapun arti dan makna logo LBB BEST adalah sebagai berikut:

a. Tulisan best berwarna kuning melambangkan LBB BEST sebagai wadah atau tempat yang mempunyai semangat untuk menciptakan siswa yang lebih berprestasi.

b. Garis oval berwarna biru dan merah melambangkan bahwa LBB BEST memberi pelayanan secara optimal untuk menaungi siswa dalam menggapai cita-cita dan mendapatkan ilmu pengetahuan.

2.1.3. Badan Hukum

LBB BEST telah memiliki surat izin untuk menyelenggarakan bimbingan belajar yang dikeluarkan oleh Dinas Pendidikan dengan nomor : 503 / 1086 / 419.42 / 2009.

2.1.4. Struktur Organisasi dan Job Description

Struktur organisasi perusahaan merupakan bangunan fungsi bagian-bagian manajemen yang tersusun dari suatu kesatuan hubungan yang menunjukan


(23)

tingkatan fungsi, tugas, wewenang dan tanggung jawab dalam manajemen perusahaan.

Penerapan struktur organisasi di lingkungan LBB BEST berbentuk garis dan staf, dimana wewenang dari pimpinan dilimpahkan kepada satuan-satuan organisasi dibawahnya untuk semua bidang pekerjaan bantuan. Struktur organisasi LBB BEST adalah sebagai berikut :

Bagan 2.1. Struktur Organisasi LBB BEST

Berikut job description untuk masing – masing posisi :

a. Direktur Utama

- Memimpin lembaga dan menentukan kebijakan yang akan diambil oleh lembaga.

- Bertanggung jawab terhadap kelangsungan lembaga.

b. Direktur Program

- Mengatur kurikulum pendidikan.

- Membuat modul pengajaran untuk tiap kelas.

c. Direktur Keuangan

- Melakukan penelitian dan analisa keuangan.

- Melakukan pemeriksaan semua bukti kas, penerimaan dan pengeluaran.

d. Direktur Marketing


(24)

- Merencanakan kegiatan promosi.

e. Manager Operasional

- Melakukan pengelolaan data lembaga.

- Mengawasi kualitas pegawai yang terdaftar di lembaga.

2.2. Landasan Teori

2.2.1. Pengertian Bimbingan Belajar

Belajar adalah suatu proses “stamping in” (diingat), forming, hubungan antara stimulus dan respons. Pembentukan hubungan atau koneksi antara stimulus dan respons, dan penyelesaian masalah (problem solving) yang dapat dilakukan dengan cara trial and error (coba-coba).

Bimbingan belajar adalah bimbingan dalam hal menemukan cara belajar yang tepat, dalam memilih program studi sesuai,dan dalam mengatasi kesukaran kesukaran yang timbul berkaitan dengan tuntunan-tuntunan belajar disuatu institusi pendidikan. [1]

Bimbingan belajar merupakan suatu program yang disusun untuk menolong perkembangan seseorang agar dapat menyesuaikan diri dengan sebaik-baiknya pada masa yang akan datang. Bimbingan belajar sebagai suatu proses pemberian bantuan kepada individu yang dilakukan secara berkesinambungan supaya individu tersebut memahami dirinya sendiri sehingga sanggup mengarahkan dirinya secara wajar sesuai dengan tuntutan dan keadaan lingkungan sekolah, keluarga, masyarakat dan kehidupan pada umumnya. [2]

Bimbingan terbagi dalam dua hal yaitu bimbingan intensif dan bimbingan regular. Bimbingan intensif adalah bimbingan belajar yang membutuhkan jangka waktu kurang lebih satu bulan sedangkan bimbingan regular adalah bimbingan belajar yang membutuhkan jangka waktu lebih lama. [3]

2.2.2. Pengertian Internet

Internet adalah seluruh jaringan yang saling terhubung satu sama lain. Beberapa komputer- komputer dalam jaringan ini menyimpan file, seperti halaman web, yang dapat diakses oleh seluruh jaringan komputer. [4]


(25)

Di era informasi seperti saat ini internet memegang peranan penting dalam segala aspek kehidupan manusia. Internet menjadi media yang banyak di gunakan oleh berbagai kalangan. [5]

2.2.3. Pengertian Basis Data (Database)

Basis Data adalah kumpulan relasi-relasi logis dari data (dan deskripsi data) yang dapat digunakan bersama dan dibuat untuk memperoleh informasi yang di butuhkan oleh perusahaan.

Database adalah relasi data logis yang terdiri dari entity-entity, attribute-attribute, dan relationship dari informasi organisasi/perusahaan. Kegunaan dari

database adalah :

1. Menghilangkan redundancy data. 2. Keterbatasan akses data.

3. Meningkatkan keamanan.

4. Multiple User.

5. Independensi data (kebebasan data). [6]

2.3. Alat Bantu Analisis

2.3.1. Entity Relationship Diagram (ERD)

Penggunaan Entity Relationship Diagram (ERD) dimungkinkan untuk memberikan kemudahan di dalam melakukan pemodelan data. Entity Relationship Diagram (ERD) digunakan untuk menggambarkan hubungan antara satu entitas dengan entitas yang lain. [6]

2.3.2. Flowmap

Flowmap merupakan bagan yang menunjukkan arus pekerjaan secara keseluruhan dari sistem. Bagian ini menjelas urutan-urutan dari prosedur-prosedur yang ada di dalam sistem. Bagan alir sistem menunjukkan apa yang dikerjalan di sistem. [7]

2.3.3. Diagram Konteks

Diagram konteks adalah level teratas dari diagram arus data, yaitu diagram yang tidak detail dari sebuah sistem informasi yang menggunakan aliran-aliran data kedalam dan keluar entitas eksternal. Diagram konteks memberikan batasan yang jelas mengenai besaran-besaran entitas yang berada di luar sebuah sistem yang


(26)

sedang dibuat, artinya diagram ini menggambarkan secara jelas batasan-batasan dari sebuah sistem yang sedang dibuat. [8]

Diagram konteks adalah sebuah diagram sederhana yang menggambarkan hubungan antara entity luar, masukan dan keluaran sistem. Diagram konteks ini direpresentasikan dengan lingkaran tunggal yang mewakili seluruh sistem. [9]

2.3.4. Data Flow Diagram (DFD)

Diagram Arus Data adalah suatu model logika data atau proses yang dibuat untuk menggambarkan dari mana asal data dan kemana tujuan data yang keluar dari sistem, dari mana data disimpan, proses apa yang menghasilkan data tersebut dan interaksi antara data yang tersimpan dan proses yang dikenakan pada data tersebut.[9]

2.4. Perangkat Lunak Pendukung 2.4.1. Microsoft Visio Professional 2010

Microsoft Visio (atau sering disebut Visio) adalah sebuah program aplikasi komputer yang sering digunakan untuk membuat diagram, diagram alur (flowchart), brainstorm, dan skema jaringan yang dirilis oleh Microsoft Corporation. Aplikasi ini menggunakan grafik vektor untuk membuat diagram-diagramnya.

Pada seri Professional, Microsoft menawarkan lebih banyak pilihan template untuk pembuatan diagram yang lebih lanjut dan juga penataan letak (layout). Selain itu, edisi Professional juga memudahkan pengguna untuk mengoneksikan diagram-diagram buatan mereka terhadap beberapa sumber data dan juga menampilkan informasi secara visual dengan menggunakan grafik. [10]

2.4.2. Adobe Dreamweaver CS6

Adobe Dreamweaver adalah aplikasi desain dan pengembangan web yang menyediakan editor WYSIWYG visual (bahasa sehari-hari yang disebut sebagai Design view) dan kode editor dengan fitur standar seperti syntax highlighting, code completion, dan code collapsing serta fitur lebih canggih seperti real-time syntax checking dan code introspection untuk menghasilkan petunjuk kode untuk


(27)

membantu pengguna dalam menulis kode. Tata letak tampilan Design memfasilitasi desain cepat dan pembuatan kode seperti memungkinkan pengguna dengan cepat membuat tata letak dan manipulasi elemen HTML.

Dreamweaver memiliki fitur browser yang terintegrasi untuk melihat halaman web yang dikembangkan di jendela pratinjau program sendiri agar konten memungkinkan untuk terbuka di web browser yang telah terinstall. Aplikasi ini menyediakan transfer dan fitur sinkronisasi, kemampuan untuk mencari dan mengganti baris teks atau kode untuk mencari kata atau kalimat biasa di seluruh situs, dan templating feature yang memungkinkan untuk berbagi satu sumber kode atau memperbarui tata letak di seluruh situs tanpa server side includes atau scripting. Behavior Panel juga memungkinkan penggunaan JavaScript dasar tanpa pengetahuan coding, dan integrasi dengan Adobe Spry Ajax framework menawarkan akses mudah ke konten yang dibuat secara dinamis dan interface.

Dreamweaver dapat menggunakan ekstensi dari pihak ketiga untuk memperpanjang fungsionalitas inti dari aplikasi, yang setiap pengembang web bisa menulis (sebagian besar dalam HTML dan JavaScript). Dreamweaver didukung oleh komunitas besar pengembang ekstensi yang membuat ekstensi yang tersedia (baik komersial maupun yang gratis) untuk pengembangan web dari efek rollover sederhana sampai full-featured shopping cart.

Dreamweaver, seperti editor HTML lainnya, edit file secara lokal kemudian diupload ke web server remote menggunakan FTP, SFTP, atau WebDAV. Dreamweaver CS6 sekarang mendukung sistem kontrol versi Subversion(SVN). [11]

2.4.3. Wampserver

WAMP merupakan akronim dari Windows, Apache, MySQL, dan PHP. WAMP digunakan untuk membangun sebuah host lokal untuk membuat simulasi sebuah website yang memiliki server side script sebelum dipublikasikan pada server yang sebenarnya. Penjelasan dari komponen dalam WAMP adalah sebagai berikut:

a. Apache

Server HTTP Apache atau Server Web/WWW Apache adalah server web yang dapat dijalankan di banyak sistem operasi (Unix, BSD, Linux,


(28)

Microsoft Windows dan Novell Netware serta platform lainnya) yang berguna untuk melayani dan memfungsikan situs web. Protokol yang digunakan untuk melayani fasilitas web/www ini menggunakan HTTP.

b. PHP (Personal Home Page)

PHP merupakan bahasa scripting yang bersifat Server Side, artinya kode – kode PHP akan dieksekusi oleh web server kemudian hasil dari eksekusi akan dikirimkan ke browser client berupa kode HTML. Cara kerja yang seperti ini mengakibatkan client tidak dapat melihat kode PHP dan hanya bisa melihat kode HTML yang telah diciptakan oleh mesin PHP yang berada pada web server. Dengan kata lain PHP memungkinkan untuk membuat halaman web dinamis yang aman.

PHP dapat berjalan dengan baik di banyak Sistem Operasi seperti Windows, Linux, MacOS, dll. PHP juga kompatibel untuk berbagai jenis database misalnya MySQL, PostgreSQL, Oracle, Microsoft access, Interbase, dll. c. Mysql

MySQL adalah sebuah aplikasi Relational Database Management Server

(RDBMS) yang sangat cepat dan kokoh. Dengan menggunakan MySQL Server maka data dapat diakses oleh banyak pemakai secara bersamaan sekaligus dapat membatasi akses para pemakai berdasarkan privilege (hak akses) yang diberikan.

MySQL menggunakan bahasa SQL (Structured Query Language) yaitu bahasa standar yang digunakan untuk pemrograman database. MySQL dipublikasikan sejak 1996, tetapi sebenarnya dikembangkan sejak 1979.

MySQL telah memenangkan penghargaan Linux Journal Reader’s Choice

Award selama tiga tahun. MySQL sekarang tersedia dibawah izin open source, tetapi juga ada izin

untuk penggunaan secara komersial. Keunggulan dari MySQL adalah: 1) Bersifat Open Source

2) Sistem yang digunakan oleh perangkat lunak ini tidak memberatkan kerja dari server, karena dapat bekerja di background.


(29)

BAB 3

PEMBAHASAN

3.1. Jadwal Kerja Praktek

Kegiatan kerja praktek dilakukan selama 3 minggu di Lembaga Bimbingan Belajar BEST Kediri mulai dari tanggal 15 Juli 2013 sampai dengan 2 Agutus 2013. Setiap hari senin sampai sabtu pukul 09.00 – 15.00 WIB.

3.2. Teknik Kerja Praktek

Penulis melaksanakan kerja praktek di Lembaga Bimbingan Belajar BEST Kediri selama 3 minggu. Adapun teknis pelaksanaan Kuliah Kerja Praktek adalah sebagai berikut:

1. Menganalisa sistem yang sedang berjalan di LBB BEST. 2. Merancang aplikasi bimbel online LBB BEST.

3.3. Analisis Sistem

Analisis sistem dapat didefinisikan sebagai penguraian dari suatu sistem informasi yang utuh kedalam bagian-bagian komponennya dengan maksud untuk mengidentifikasi dan mengevaluasi permasalahan-permasalahan, kesempatan-kesempatan, hambatan-hambatan yang terjadi dan kebutuhan-kebutuhan yang diharapkan sehingga dapat diusulkan perbaikan-perbaikannya.

Sebagai analisis pada sistem yang sedang berjalan, akan dibahas bagaimana prosedur dan aliran dokumen yang sedang berjalan yang digambarkan dalam bentuk flow map dan analisis sistem non fungsional yang meliputi perangkat keras dan perangkat lunak yang digunakan, serta analisis user yang terlibat.


(30)

3.4. Analisis Masalah

Berdasarkan analisis masalah yang telah dilakukan, terdapat dua masalah yang terjadi pada LBB BEST yaitu:

a. Angka kelulusan try out masih di bawah standar yang telah ditentukan oleh LBB BEST.

b. Perlu adanya tambahan materi belajar bagi peserta bimbingan di luar jam bimbingan di kelas.

3.4.1. Analisis Sistem yang Sedang Berjalan

Analisis sistem merupakan prosedur penjelasan tentang sistem yang sedang berjalan sekarang yaitu prosedur yang berjalan di LBB BEST. Prosedur dan flowmap yang diteliti di LBB BEST dalam pendaftaran siswa, pelaksanaan try out

dan penghitungan hasil try out adalah sebagai berikut :

3.4.1.1.Prosedur dan Flowmap Pendaftaran Siswa

Berikut adalah prosedur pendaftaran siswa:

a. Customer service menyerahkan formulir pendaftaran kepada siswa

b. Siswa mengisi formulir pendaftaran yang berisi informasi data pribadi dan pilihan kelas serta jam belajar.

c. Setelah mengisi formulir pendaftaran tersebut, customer service memeriksa formulir siswa yang diterimanya.

d. Jika formulir yang diterima terdapat kesalahan atau kurang lengkap maka customer service mengembalikan lagi formulir pendaftaran tersebut kepada siswa untuk dilengkapi.

e. Jika formulir yang diterima tidak mengandung unsur kesalahan atau ketidaklengkapan maka customer service menjelaskan biaya program pendidikan kepada siswa berdasarkan jenjang kelas.

f. Siswa membayar biaya program pendidikan yang ditentukan, kemudian customer service memberikan kuitansi dan modul belajar sesuai dengan jenjang kelas kepada siswa.

g. Setelah mendapatkan kuitansi, siswa bisa mengikuti bimbingan belajar sesuai dengan jadwal yang ditentukan.


(31)

Berikut flowmap berdasarkan prosedur pendaftaran siswa:

Gambar 3.1. Flowmap Pendaftaran Siswa

3.4.1.2.Prosedur dan Flowmap Pelaksanaan Try Out

Berikut adalah prosedur pelaksanaan try out:

a. Siswa memberikan kartu try out kepada pengajar untuk diperiksa, setelah diperiksa pengajar mengembalikan kartu try out tersebut kepada siswa

b. Pengajar memberikan lembar jawaban try out kepada siswa. c. Siswa mengisi lembar jawaban try out tersebut.


(32)

d. Setelah siswa telah mengisi lembar jawaban atau waktu pelaksanaan try out telah habis, siswa memberikan lembar jawaban tersebut kepada pengajar.

e. Kemudian, pengajar mengumpulkan lembar jawaban tersebut.

Berikut flowmap berdasarkan prosedur pelaksanaan try out:


(33)

3.4.1.3.Prosedur dan Flowmap Penghitungan Hasil Try Out

Berikut adalah prosedur penghitungan hasil try out:

a. Pengajar memberikan lembar jawaban try out yang telah dikumpulkan ke customer service.

b. Customer service menghitung hasil try out siswa.

c. Kemudian, hasil try out tersebut dihitung untuk mengetahui angka kelulusannya. Berikut flowmap berdasarkan prosedur penghitungan hasil try out:


(34)

3.4.2. Analisis Kebutuhan Non Fungsional

Analisis kebutuhan non fungsional menggambarkan keadaan sistem yang ada pada LBB BEST, diantaranya perangkat keras, perangkat lunak, serta pengguna sebagai bahan analisis kebutuhan yang harus dipenuhi dalam perancangan sistem yang akan diterapkan.

3.4.2.1.Analisis Pengguna Sistem

Sistem yang akan dibangun ini akan digunakan oleh tiga jenis pengguna utama yaitu customer service, pengajar, dan siswa. Customer Service dapat melakukan pengelolaan terhadap data master. Pengajar hanya dapat mengunggah materi. Siswa dapat mengunduh materi dan mengikuti try outonline.

Tabel 3-1. Karakteristik Pengguna

Pengguna Tanggung Jawab Hak Akses Tingkat Pendidikan

Tingkat Keterampilan Customer

Service

Melakukan kegiatan olah data master.

Berinteraksi dengan antarmuka aplikasi back-end.

S1/D3 Dapat

mengelola data aplikasi.

Pengajar Mengunggah materi pembelajaran.

Berinteraksi dengan antarmuka aplikasi untuk mengunggah materi.

S1/D3 Dapat

mengikuti petunjuk.

Siswa Mengunduh materi dan mengikuti try out online.

Berinteraksi dengan antarmuka aplikasi untuk mengunduh

materi dan

mengikuti try out online.

SD Dapat

mengikuti petunjuk.


(35)

3.4.2.2.Analisis Perangkat Keras

Adapun spesifikasi perangkat keras komputer yang ada dan yang dibutuhkan untuk mengakses aplikasi bimbel online LBB BEST adalah sebagai berikut :

3.4.2.2.1.Spesifikasi Perangkat Keras untuk Server

Berikut fakta, kebutuhan minimum, dan juga evaluasi mengenai perangkat keras untuk server:

1. Fakta di Lingkungan Sistem

Berdasarkan fakta perangkat keras yang ada di lingkungan sistem saat ini, LBB BEST belum memiliki perangkat keras untuk server.

2. Kebutuhan Minimum

Adapun spesifikasi perangkat keras minimum untuk server, yaitu:

a. Processor dengan kecepatan 2,3 GHz. b. Kapasitas RAM 2 GB.

c. Kapasitas Harddisk 80 GB. d. Network Interface Card (NIC). e. Monitor dengan resolusi 1024 x 768. f. Keyboard.

g. Mouse.

3. Evaluasi

Kesimpulan yang didapat adalah dibutuhkan pengadaan semua perangkat keras untuk server berdasarkan kebutuhan minimum yang telah dijelaskan.


(36)

3.4.2.2.2.Spesifikasi Perangkat Keras untuk Client

Customer Service, Pengajar, dan Siswa bertindak sebagai client. Berikut fakta, kebutuhan minimum, dan juga evaluasi mengenai perangkat keras untuk

client:

1. Fakta di Lingkungan Sistem

Berdasarkan fakta perangkat keras yang ada di lingkungan sistem saat ini, perangkat keras yang dimiliki oleh client adalah sebagai berikut:

a. Processor dengan kecepatan 2,0 GHz. b. Kapasitas RAM 512 MB.

c. VGA Card 512 MB.

d. Monitor dengan resolusi 1388 x 768. e. Keyboard.

f. Mouse. g. Modem.

2. Kebutuhan Minimum

Adapun spesifikasi perangkat keras minimum untuk client, yaitu:

a. Processor dengan kecepatan 1,8 GHz. b. Kapasitas RAM 256 MB.

c. VGA Card 256 MB.

d. Monitor dengan resolusi 1024 x 768. e. Keyboard.

f. Mouse. g. Modem.

3. Evaluasi

Kesimpulan yang didapat adalah perangkat keras yang dimiliki oleh client saat ini telah memenuhi spesifikasi minimum yang dibutuhkan.


(37)

3.4.2.3.Analisis Perangkat Lunak

Adapun perangkat lunak yang ada di lingkungan sistem saat ini dan yang dibutuhkan untuk dapat mengakses aplikasi bimbel online LBB BEST yaitu sebagai berikut :

3.4.2.3.1.Perangkat Lunak untuk Server

Berikut fakta, kebutuhan minimum, dan juga evaluasi mengenai perangkat lunak untuk server:

1. Fakta di Lingkungan Sistem

Berdasarkan fakta perangkat lunak yang ada di lingkungan sistem saat ini, LBB BEST belum memiliki perangkat lunak untuk server.

2. Kebutuhan Minimum

Berdasarkan fakta perangkat lunak yang ada di lingkungan sistem saat ini, LBB BEST belum memiliki perangkat lunak untuk server. Adapun spesifikasi perangkat lunak minimum untuk server, yaitu:

Tabel 3-2. Spesifikasi Minimum Perangkat Lunak untuk Server

No. Perangkat Lunak Keterangan

1 Sistem Operasi Windows Server 2008

2 DBMS MySQL 5.5.24

3 Web Browser Internet Explorer 9

4 Web Server Apache HTTP Server 2.4.2

3. Evaluasi

Kesimpulan yang didapat adalah dibutuhkan pengadaan semua perangkat lunak untuk server berdasarkan kebutuhan minimum yang telah dijelaskan.


(38)

3.4.2.3.2.Perangkat Lunak untuk Client

Customer Service, Pengajar, dan Siswa bertindak sebagai client. Berikut fakta, kebutuhan minimum, dan juga evaluasi mengenai perangkat lunak untuk

client:

1. Fakta di Lingkungan Sistem

Berdasarkan fakta perangkat lunak yang ada di lingkungan sistem saat ini, perangkat lunak yang dimiliki oleh client adalah sebagai berikut:

Tabel 3-3. Spesifikasi Perangkat Lunak untuk Client saat ini

No. Perangkat Lunak Keterangan

1 Sistem Operasi Windows 7

2 Web Browser Internet Explorer 9

2. Kebutuhan Minimum

Adapun spesifikasi perangkat lunak minimum untuk client, yaitu:

Tabel 3-4. Spesifikasi Perangkat Lunak Minimum untuk Client

No. Perangkat Lunak Keterangan

1 Sistem Operasi Windows 7

2 Web Browser Internet Explorer 9

3. Evaluasi

Kesimpulan yang didapat adalah perangkat lunak yang dimiliki oleh client


(39)

3.4.3. Analisis Basis Data

3.4.3.1.Entity Relationship Diagram (ERD)

ERD digunakan untuk menggambarkan secara sistematis berbagai entitas dan komponen data yang dimiliki sistem dan hubungan antar masing-masing entitas tersebut. Untuk melihat keterhubungan antar entitas yang ada maka akan digambarkan sebagai berikut :


(40)

3.4.4. Analisis Kebutuhan Fungsional

Kebutuhan fungsional merupakan tahap aliran informasi yang meliputi diagram konteks dan aliran informasi yang di representasikan dengan menggunakan data flow diagram (DFD).

3.4.4.1.Diagram Konteks

Diagram konteks ini menggambarkan sistem secara garis besar atau secara keseluruhan dan hubungannya dengan entitas luar. Adapun diagram konteks yang diusulkan adalah sebagai berikut :


(41)

3.4.4.2.Data Flow Diagram (DFD)

Data Flow Diagram merupakan suatu media yang digunakan untuk menggambarkan aliran data yang mengalir pada suatu sistem informasi. Dalam Data Flow Diagram (DFD) terdiri dari entitas luar, aliran data, proses, dan penyimpanan data. Adapun Data Flow Diagram dari Pembangunan Aplikasi Bimbel Online LBB BEST sebagai berikut:

3.4.4.2.1.DFD Level 1


(42)

3.4.4.2.2.DFD Level 2 Proses Pengolahan Data Login


(43)

3.4.4.2.3.DFD Level 2 Proses Pengolahan Data Master


(44)

3.4.4.2.4.DFD Level 2 Proses Pengolahan Data Materi

Gambar 3.9. DFD Level 2 Proses Pengolahan Data Materi

3.4.4.2.5.DFD Level 2 Proses Mengetahui Perkembangan Hasil Try Out


(45)

3.4.4.2.6.DFD Level 3 Proses Pengolahan Data Cabang

Gambar 3.11. DFD Level 2 Proses Pengolahan Data Cabang

3.4.4.2.7.DFD Level 3 Proses Pengolahan Data Customer Service

Gambar 3.12. DFD Level 3 Proses Pengolahan Data Customer Service

3.4.4.2.8.DFD Level 3 Proses Pengolahan Data Program


(46)

3.4.4.2.9.DFD Level 3 Proses Pengolahan Data Pengajar

Gambar 3.14. DFD Level 3 Proses Pengolahan Data Pengajar

3.4.4.2.10. DFD Level 3 Proses Pengolahan Data Siswa


(47)

3.4.4.3.Spesifikasi Proses

Spesifikasi proses digunakan untuk menggambarkan proses model aliran yang terdapat pada DFD. Spesifikasi proses dari gambaran DFD diatas akan dijelaskan pada tabel berikut:

Tabel 3-5. Spesifikasi Proses

No. Urut Proses Keterangan

1

No. Proses 1.1

Nama Proses Daftar

Sumber Pengajar, Siswa

Masukan Data Login

Keluaran Info Data Login

Tujuan Pengajar, Siswa

Logika Proses

1. Input NIS/NIP, username, password, dan email.

2. Jika data telah valid maka pendaftaran diproses. Jika data belum valid maka input kembali data login.

3. Jika pendaftaran berhasil maka tampilkan pesan pendaftaran berhasil. Jika gagal maka tampilkan pesan pendaftaran gagal.

2

No. Proses 1.2

Nama Proses Login

Sumber Customer Service, Pengajar, Siswa

Masukan Data Login

Keluaran Info Data Login, Login Valid, Login Tidak Valid

Tujuan Customer Service, Pengajar, Siswa

Logika Proses

1. Input username dan password.

2. Jika username dan password telah sesuai maka tampilkan halaman beranda pengguna. Jika belum sesuai maka input kembali username dan password.


(48)

3

No. Proses 2.1.1

Nama Proses Tambah Data Cabang

Sumber Customer Service

Masukan Data Cabang yang akan ditambah

Keluaran Info Data Cabang yang telah ditambah

Tujuan Customer Service

Logika Proses

1. Input data cabang.

2. Jika data cabang sudah valid maka penambahan data cabang berhasil. Jika data cabang belum valid maka input kembali data cabang.

3. Tampilkan daftar data cabang.

4

No. Proses 2.1.2

Nama Proses Ubah Data Cabang

Sumber Customer Service

Masukan Data Cabang yang akan diubah

Keluaran Info Data Cabang yang telah diubah

Tujuan Customer Service

Logika Proses

1. Pilih data cabang yang akan diubah. 2. Ubah data cabang

3. Jika data cabang sudah valid maka

pengubahan data cabang berhasil. Jika data cabang belum valid maka ubah kembali data cabang.

4. Tampilkan daftar data cabang.

5

No. Proses 2.2.1

Nama Proses Tambah Data CS

Sumber Customer Service

Masukan Data CS yang akan ditambah

Keluaran Info Data CS yang telah ditambah


(49)

Logika Proses

1. Input data CS.

2. Jika data CS sudah valid maka penambahan data CS berhasil. Jika data CS belum valid maka input kembali data CS.

3. Tampilkan daftar data CS.

6

No. Proses 2.2.2

Nama Proses Ubah Data CS

Sumber Customer Service

Masukan Data CS yang akan diubah

Keluaran Info Data Cabang yang telah diubah

Tujuan Customer Service

Logika Proses

1. Pilih data CS yang akan diubah. 2. Ubah data CS.

3. Jika data CS sudah valid maka pengubahan data CS berhasil. Jika data CS belum valid maka ubah kembali data CS.

4. Tampilkan daftar data CS.

7

No. Proses 2.3.1

Nama Proses Tambah Data Program

Sumber Customer Service

Masukan Data Program yang akan ditambah

Keluaran Info Data Program yang telah ditambah

Tujuan Customer Service

Logika Proses

1. Input data Program.

2. Jika data Program sudah valid maka penambahan data Program berhasil. Jika data Program belum valid maka input kembali data Program.

3. Tampilkan daftar data Program.

8 No. Proses 2.3.2


(50)

Sumber Customer Service

Masukan Data Program yang akan diubah

Keluaran Info Data Program yang telah diubah

Tujuan Customer Service

Logika Proses

1. Pilih data Program yang akan diubah. 2. Ubah data Program.

3. Jika data Program sudah valid maka pengubahan data Program berhasil. Jika data Program belum valid maka ubah kembali data Program.

4. Tampilkan daftar data Program.

9

No. Proses 2.4.1

Nama Proses Tambah Data Pengajar

Sumber Customer Service

Masukan Data Pengajar yang akan ditambah

Keluaran Info Data Pengajar yang telah ditambah

Tujuan Customer Service

Logika Proses

1. Input data Pengajar.

2. Jika data Pengajar sudah valid maka penambahan data Pengajar berhasil. Jika data Pengajar belum valid maka input kembali data Pengajar.

3. Tampilkan daftar data Pengajar.

10

No. Proses 2.4.2

Nama Proses Ubah Data Pengajar

Sumber Customer Service

Masukan Data Pengajar yang akan diubah

Keluaran Info Data Pengajar yang telah diubah

Tujuan Customer Service

Logika Proses 1. Pilih data Pengajar yang akan diubah. 2. Ubah data Pengajar.


(51)

3. Jika data Pengajar sudah valid maka pengubahan data Pengajar berhasil. Jika data Pengajar belum valid maka ubah kembali data Pengajar.

4. Tampilkan daftar data Pengajar.

11

No. Proses 2.5.1

Nama Proses Tambah Data Siswa

Sumber Customer Service

Masukan Data Siswa yang akan ditambah

Keluaran Info Data Siswa yang telah ditambah

Tujuan Customer Service

Logika Proses

1. Input data Siswa.

2. Jika data Siswa sudah valid maka penambahan data Siswa berhasil. Jika data Siswa belum valid maka input kembali data Siswa.

3. Tampilkan daftar data Siswa.

12

No. Proses 2.5.2

Nama Proses Ubah Data Siswa

Sumber Customer Service

Masukan Data Siswa yang akan diubah

Keluaran Info Data Siswa yang telah diubah

Tujuan Customer Service

Logika Proses

1. Pilih data Siswa yang akan diubah. 2. Ubah data Siswa.

3. Jika data Siswa sudah valid maka pengubahan data Siswa berhasil. Jika data Siswa belum valid maka ubah kembali data Siswa.

4. Tampilkan daftar data Siswa.

13

No. Proses 3.1

Nama Proses Upload Materi


(52)

Masukan Data Materi yang akan diupload Keluaran Info Data Materi yang telah diupload

Tujuan Pengajar

Logika Proses

1. Input data Materi.

2. Jika data Materi sudah valid maka penambahan data Materi berhasil. Jika data Materi belum valid maka input kembali data Materi.

3. Tampilkan daftar data Materi.

14

No. Proses 3.2

Nama Proses Hapus Materi

Sumber Pengajar

Masukan Data Materi yang akan dihapus

Keluaran Info Data Materi setelah dihapus

Tujuan Pengajar

Logika Proses

1. Pilih data Materi yang akan dihapus. 2. Muncul message dialog.

3. Jika klik “Yes” maka hapus data Materi. Jika

klik “No” maka data Materi batal dihapus. 4. Tampilkan daftar data Materi.

15

No. Proses 3.3

Nama Proses Download Materi

Sumber Siswa

Masukan Data Materi yang akan didwonload

Keluaran Info Data Materi yang telah didwonload

Tujuan Siswa

Logika Proses

1. Pilih Materi yang akan diunduh. 2. Proses mengunduh Materi.

3. Tampilkan Materi yang berhasil diunduh.

16 No. Proses 4.1


(53)

Sumber Siswa

Masukan Data Try Out

Keluaran Data Try Out

Tujuan Proses Penghitungan Hasil Try Out

Logika Proses

1. Pilih Try Out yang akan dikerjakan. 2. Proses pemilihan Try Out.

3. Jika waktu belum habis atau Siswa belum

menekan tombol “Simpan” maka Siswa masih dapat mengerjakan Try Out. Jika sebaliknya maka Siswa sudah tidak dapat mengerjakan Try Out lagi.

4. Sistem merekam jawaban Siswa.

17

No. Proses 4.2

Nama Proses Penghitungan Hasil Try Out

Sumber Proses Pemilihan Try Out

Masukan Data Try Out

Keluaran Info Data Nilai Try Out

Tujuan Siswa

Logika Proses

1. Jawaban Siswa yang telah direkam oleh Sistem dihitung berdasarkan ketentuan yang telah ditetapkan.


(54)

3.4.4.4.Kamus Data

Kamus data (data dictionary) merupakan katalog fakta tentang data dan kebutuhan-kebutuhan informasi dari suatu sistem. Kamus data dibuat berdasarkan arus data yang ada pada diagram aliran data. Dengan menggunakan kamus data, analisis sistem dapat mendefinisikan data yang mengalir pada sistem secara lengkap. Kamus data digunakan untuk merancang input dan merancang database. Kamus data yang dibutuhkan untuk membuat Aplikasi Bimbel Online LBB BEST, yaitu :

3.4.4.4.1.Data Login

Tabel 3-6. Data Login

Nama aliran data Data Login Where used / how

used

1. Pengajar, dan Siswa ke proses 1.1 Daftar.

2. Customer Service, Pengajar, dan Siswa ke proses 1.2 Login. Deskripsi Data untuk masuk ke aplikasi.

Struktur data Username_cs + Password_cs,

Username_pengajar + Password_pengajar, Username_siswa + Password_siswa Username_cs Password_cs Username_pengajar Password_pengajar Email_pengajar Username_siswa Password_siswa Email_siswa

Teks, Panjang: 5-15, Range: -, Null Teks, Panjang: 5-15, Range: -, Null Teks, Panjang: 5-15, Range: -, Null Teks, Panjang: 5-15, Range: -, Null Teks, Panjang: 5-35, Range: -, Null Teks, Panjang: 5-15, Range: -, Null Teks, Panjang: 5-15, Range: -, Null Teks, Panjang: 5-35, Range: -, Null


(55)

3.4.4.4.2.Data Cabang

Tabel 3-7. Data Cabang

Nama aliran data Data Cabang Where used / how

used

1. Customer Service ke proses 2.1.1 Tambah Data Cabang.

2. Customer Service ke proses 2.1.2 Ubah Data Cabang.

Deskripsi Identitas cabang.

Struktur data Id_cabang + Nama_ cabang + Alamat_ cabang Id_ cabang

Nama_ cabang Alamat_ cabang Kota_cabang

Numerik, Panjang: Auto_increment, Range: -, Not Null

Teks, Panjang: 25, Range: ‘a’..’Z’, spasi, Not Null

Teks, Panjang: 50, Range: -, spasi, Not Null Teks, Panjang: 25, Range: ‘a’..’Z’, spasi, Not Null

3.4.4.4.3.Data CS

Tabel 3-8. Data CS

Nama aliran data Data CS Where used / how

used

1. Customer Service ke proses 2.2.1 Tambah Data CS. 2. Customer Service ke proses 2.2.2 Ubah Data CS.

Deskripsi Identitas customer service.

Struktur data Id_cs + Nama_cs + Username_cs + Password_cs + Aktif_cs + Id_cabang

Id_cs Nama_ cs Username_cs Password_cs Email_cs Aktif_cs Id_cabang

Numerik, Panjang: 11, Range: -, Not Null

Teks, Panjang: 25, Range: ‘a’..’Z’, spasi, Not Null Teks, Panjang: 5-15, Range: -, Null

Teks, Panjang: 5-15, Range: -, Null Teks, Panjang: 5-35, Range: -, Null

Karakter, Panjang: 1, Range: ‘Y’ / ‘T’, Not Null


(56)

3.4.4.4.4.Data Program

Tabel 3-9. Data Program

Nama aliran data Data Program Where used / how

used

1. Customer Service ke proses 2.3.1 Tambah Data Program.

2. Customer Service ke proses 2.3.2 Ubah Data Program.

Deskripsi Identitas program.

Struktur data Id_ program + Nama_ program Id_ program

Nama_ program

Numerik, Panjang: Auto_increment, Range: -, Not Null

Teks, Panjang: 25, Range: ‘a’..’Z’, spasi, Not Null 3.4.4.4.5.Data Pengajar

Tabel 3-10. Data Pengajar

Nama aliran data Data Pengajar Where used / how

used

1. Customer Service ke proses 2.4.1 Tambah Data Pengajar.

2. Customer Service ke proses 2.4.2 Ubah Data Pengajar.

Deskripsi Identitas pengajar.

Struktur data Id_pengajar + Nama_pengajar + Username_pengajar + Password_pengajar + Aktif_pengajar + Id_cabang Id_pengajar

Nama_ pengajar Aktif_ pengajar Id_cabang

Numerik, Panjang: 11, Range: -, Not Null

Teks, Panjang: 25, Range: ‘a’..’Z’, spasi, Not Null

Karakter, Panjang: 1, Range: ‘Y’ / ‘T’, Not Null


(57)

3.4.4.4.6.Data Siswa

Tabel 3-11. Data Siswa

Nama aliran data Data Siswa Where used / how

used

1. Customer Service ke proses 2.5.1 Tambah Data Siswa.

2. Customer Service ke proses 2.5.2 Ubah Data Siswa.

Deskripsi Identitas siswa.

Struktur data Id_siswa + Nama_siswa + Notlp_siswa + Alamat_siswa + Sekolah_siswa + Aktif_siswa + Id_cabang

Id_siswa Nama_siswa Notlp_siswa Alamat_siswa Sekolah_siswa Aktif_siswa Id_cabang

Numerik, Panjang: 11, Range: -, Not Null

Teks, Panjang: 25, Range: ‘a’..’Z’, spasi, Not Null

Teks, Panjang: 15, Range: ‘0’..’9’, Not Null

Teks, Panjang: 100, Range: -, spasi, Not Null

Teks, Panjang: 25, Range: -, spasi, Not Null Karakter,

Panjang: 1, Range: ‘Y’ / ‘T’, Not Null

Numerik, Panjang: Auto_increment, Range: -, Not Null

3.4.4.4.7.Data Try Out

Tabel 3-12. Data Try Out

Nama aliran data Data Try Out Where used / how

used

1. Customer Service ke proses 2.5.1 Tambah Data Siswa.

2. Customer Service ke proses 2.5.2 Ubah Data Siswa. 3. Siswa ke proses 4.1 Pemilihan Try Out

4. Proses 4.1 Pemilihan Try Out ke proses 4.2 Penghitungan Hasil Try Out

Deskripsi Identitas try out siswa.

Struktur data Id_tryout + Id_siswa + Id_program


(58)

Id_siswa Id_program

Numerik, Panjang: 11, Range: -, Not Null

Numerik, Panjang: Auto_increment, Range: -, Not Null

3.4.4.4.8.Data Materi

Tabel 3-13. Data Materi

Nama aliran data Data Materi Where used / how

used

1. Pengajar ke proses 3.1 Upload Materi. 2. Pengajar ke proses 3.2 Hapus Materi. 3. Siswa ke proses 3.3 Download Materi.

Deskripsi Identitas materi.

Struktur data Id_ materi + Nama_ materi + File_materi + Deskripsi_materi

Id_ materi Nama_materi Direktori_materi Deskripsi_materi

Numerik, Panjang: Auto_increment, Range: -, Not Null

Teks, Panjang: 25, Range: ‘a’..’Z’, spasi, Not Null

Teks, Panjang: -, Range: ‘a’..’Z’, spasi, Not Null Teks, Panjang: 50, Range: -, spasi, Not Null

3.4.4.4.9.Data Nilai Try Out

Tabel 3-14. Data Nilai Try Out

Nama aliran data Data Try Out Where used / how

used

1. Proses 4.2 Penghitungan Hasil Try Out.

Deskripsi Hasil try out.

Struktur data Id_ nilai + Hasil_ tryout Id_ nilai

Nilai_tryout Id_tryout

Numerik, Panjang: Auto_increment, Range: -, Not Null Numerik, Not Null


(59)

3.5. Perancangan

Perancangan data atau lebih dikenal dengan perancangan basis data yaitu menciptakan atau merancang data yang terhubung dan disimpan secara bersama-sama. Untuk menggambarkannya digunakanlah skema relasi, diagram relasi dan perancangan struktur tabel. Dari tiga hasil tersebut, implementasi basis data akan bisa dikerjakan.

3.5.1. Perancangan Data

Perancangan data atau lebih dikenal dengan perancangan basis data yaitu menciptakan atau merancang data yang terhubung dan disimpan secara bersama-sama. Untuk menggambarkannya digunakanlah skema relasi, diagram relasi dan perancangan struktur tabel. Dari tiga hasil tersebut, implementasi basis data akan bisa dikerjakan.

3.5.1.1.Skema Relasi

Setiap himpunan entitas dipetakan menjadi sebuah relasi dasar dengan

primary key yang telah didefinisikan. Adapun skema relasi yang ada yaitu sebagai berikut:

1. Cabang = (id_cabang, nama_cabang, kota_cabang).

2. Customer Service = (id_cs, nama_cs, username_cs, password_cs, email_cs, aktif_cs, id_cabang).

3. Pengajar = (id_pengajar, nama_pengajar, username_pengajar, password_pengajar, email_pengajar, aktif_pengajar, id_cabang). 4. Program = (id_program, nama_program).

5. Materi = (id_materi, nama_materi, file_materi, deskripsi_materi, id_program, id_pengajar).

6. Siswa = (id_siswa, nama_siswa, notlp_siswa, alamat_siswa, sekolah_siswa, username_siswa, password_siswa, email_siswa, aktif_siswa, id_cabang).

7. Try Out = (id_tryout, id_siswa, id_program). 8. Nilai Try Out = (id_nilai, nilai_tryout, id_tryout).


(60)

3.5.1.2.Diagram Relasi

Setiap tabel haruslah memiliki hubungan dengan tabel yang lainnya. Bila tidak ada penghubungan antar tabel maka dapat dikatakan pemodelan untuk membuat satu basis data adalah gagal. Adapun gambaran diagram relasi yang ada yaitu:


(61)

3.5.1.3.Struktur Tabel

Tabel-tabel yang terdapat dalam basis data yang digunakan dalam pembangunan Aplikasi Bimbel Online LBB BEST adalah sebagai berikut:

1. Tabel Cabang

Tabel 3-15. Struktur Tabel Cabang

Nama Field Tipe Data Panjang Atribut Keterangan

id_cabang Integer - Primary key Auto_increment

nama_cabang Varchar 25 Not Null

alamat_cabang Teks 50 Not Null

nama_kota Varchar 25 Not Null

2. Tabel CS

Tabel 3-16. Struktur Tabel CS

Nama Field Tipe Data Panjang Atribut Keterangan

id_cs Varchar 10 Primary key Not Null

nama_cs Varchar 25 Not Null

username_cs Varchar 25 Not Null

password_cs Varchar 100 Not Null

email_cs Varchar 35 Not Null

aktif_cs Char 1 Not Null,

enum(‘Y’, ‘T’)

id_cabang Integer - Foreign key

(Cabang.id_cabang)

Not Null

3. Tabel Program

Tabel 3-17. Struktur Tabel Program

Nama Field Tipe Data Panjang Atribut Keterangan

id_program Integer - Primary key Auto_increment


(62)

4. Tabel Pengajar

Tabel 3-18. Struktur Tabel Pengajar

Nama Field Tipe

Data Panjang Atribut

Keterangan

id_pengajar Varchar 10 Primary key Not Null

nama_pengajar Varchar 25 Not Null

username_pengajar Varchar 25 Null

password_pengajar Varchar 100 Null

email_pengajar Varchar 35 Null

aktif_pengajar Char

1 Not Null,

enum(‘Y’, ‘T’)

id_cabang Integer

- Foreign key

(Cabang.id_cabang)

Not Null

5. Tabel Siswa

Tabel 3-19. Struktur Tabel Siswa

Nama Field Tipe Data Panjang Atribut Keterangan

id_siswa Varchar 10 Primary key Not Null

nama_siswa Varchar 25 Not Null

notlp_siswa Varchar 15 Not Null

alamat_siswa Teks 50 Not Null

sekolah_siswa Varchar 25 Not Null

username_siswa Varchar 25 Null

password_siswa Varchar 100 Null

email_siswa Varchar 35 Null

aktif_siswa Char

1 Not Null,

enum(‘Y’, ‘T’)

id_cabang Integer

- Foreign key

(Cabang.id_cabang)


(63)

6. Tabel Try Out

Tabel 3-20. Struktur Tabel Try Out

Nama Field Tipe Data Panjang Atribut Keterangan

id_tryout Integer - Primary key Auto_increment

id_siswa Varchar

10 Foreign key (Siswa.id_siswa)

Not Null

id_program Integer

- Foreign key

(Program.id_program)

Not Null

7. Tabel Materi

Tabel 3-21. Struktur Tabel Materi

Nama Field Tipe Data Panjang Atribut Keterangan

id_materi Integer - Primary key Auto_increment

nama_materi Varchar 25 Not Null

file_materi Attachment Not Null

deskripsi_materi Teks 50 Not Null

id_program Integer

- Foreign key

(Program.id_program)

Not Null

id_pengajar Varchar

10 Foreign key

(Pengajar.id_pengajar)

Not Null

8. Tabel Nilai Try Out

Tabel 3-22. Struktur Tabel Nilai Try Out

Nama Field Tipe

Data Panjang Atribut

Keterangan

id_nilai Integer - Primary key Auto_increment

nilai_tryout Integer - Not Null

id_tryout Integer

- Foreign key (Tryout.id_tryout)


(64)

3.5.2. Perancangan Arsitektur

Setelah melakukan perancangan data pada sistem yang dibangun, maka dilakukanlah perancangan arsitektur. Perancangan arsitektur yang telah dibuat meliputi beberapa perancangan diantaranya perancangan struktur menu, perancangan antarmuka, dan jaringan semantik.

3.5.2.1.Perancangan Struktur Menu

Struktur menu dirancang sesuai dengan level pengguna sistem. Terdapat tiga pengguna aplikasi ini yaitu customer service, pengajar, dan siswa. Adapun struktur menunya adalah sebagai berikut:

1. Perancangan Struktur Menu Customer Service

Gambar 3.17. Struktur Menu Customer Service

2. Perancangan Struktur Menu Pengajar

Gambar 3.18. Struktur Menu Pengajar

3. Perancangan Struktur Menu Siswa


(65)

3.5.2.2.Perancangan Antarmuka

Spesifikasi antarmuka merupakan suatu bentuk tampilan dari program yang akan dibuat untuk kebutuhan interface dengan user. Berikut beberapa perancangan antarmuka untuk Aplikasi Bimbel Online LBB BEST:

3.5.2.2.1.Perancangan Antarmuka Customer Service 1. Perancangan Antarmuka Login Customer Service

Gambar 3.20. Perancangan Antarmuka Login Customer Service

- Klik button Login untuk menuju ke A02

Nama Layar : A01

Ukuran Layar : 1024 x 768 Font : Times New Roman Warna Background : Putih A01


(66)

2. Perancangan Antarmuka Beranda Customer Service

Gambar 3.21. Perancangan Antarmuka Beranda Customer Service

- Klik ‘Beranda’ untuk menuju ke A02 - Klik ‘Logout’ untuk

menuju ke A01 - Klik ‘Olah Data Cabang’

untuk menuju ke A03 - Klik ‘Olah Data

Customer Service’ untuk menuju ke A04

- Klik ‘Olah Data Program’ untuk menuju ke A05

- Klik ‘Olah Data Pengajar’ untuk menuju ke A06

- Klik ‘Olah Data Siswa’ untuk menuju ke A07 - Klik ‘Nilai Try Out

Online’ untuk menuju ke A14

Nama Layar : A02

Ukuran Layar : 1024 x 768 Font : Times New Roman Warna Background : Putih


(67)

3. Perancangan Antarmuka Olah Data Cabang

Gambar 3.22. Perancangan Antarmuka Olah Data Cabang

- Klik ‘Beranda’ untuk menuju ke A02 - Klik ‘Logout’ untuk

menuju ke A01 - Klik ‘Olah Data Cabang’

untuk menuju ke A03 - Klik ‘Olah Data

Customer Service’ untuk menuju ke A04

- Klik ‘Olah Data Program’ untuk menuju ke A05

- Klik ‘Olah Data Pengajar’ untuk menuju ke A06

- Klik ‘Olah Data Siswa’ untuk menuju ke A07 - Klik button ‘Tambah’ untuk menuju ke A08 - Klik ‘Edit’ untuk

menuju ke A08 - Klik ‘Nilai Try Out

Online’ untuk menuju ke A14

Nama Layar : A03

Ukuran Layar : 1024 x 768 Font : Times New Roman Warna Background : Putih


(68)

4. Perancangan Antarmuka Form Data Cabang

Gambar 3.23. Perancangan Antarmuka Form Data Cabang

- Klik ‘Beranda’ untuk menuju ke A02 - Klik ‘Logout’ untuk

menuju ke A01 - Klik ‘Olah Data Cabang’

untuk menuju ke A03 - Klik ‘Olah Data Customer

Service’ untuk menuju ke A04

- Klik ‘Olah Data Program’ untuk menuju ke A05 - Klik ‘Olah Data Pengajar’

untuk menuju ke A06 - Klik ‘Olah Data Siswa’

untuk menuju ke A07 - Klik button ‘Simpan’ untuk menuju ke A03 - Klik ‘Batal’ untuk menuju

ke A03

- Klik ‘Nilai Try Out Online’ untuk menuju ke A14

Nama Layar : A08

Ukuran Layar : 1024 x 768 Font : Times New Roman Warna Background : Putih A08


(69)

5. Perancangan Antarmuka Olah Data Customer Service

Gambar 3.24. Perancangan Antarmuka Olah Data Customer Service

- Klik ‘Beranda’ untuk menuju ke A02 - Klik ‘Logout’ untuk

menuju ke A01 - Klik ‘Olah Data Cabang’

untuk menuju ke A03 - Klik ‘Olah Data Customer

Service’ untuk menuju ke A04

- Klik ‘Olah Data Program’ untuk menuju ke A05 - Klik ‘Olah Data Pengajar’

untuk menuju ke A06 - Klik ‘Olah Data Siswa’

untuk menuju ke A07 - Klik button ‘Tambah’ untuk menuju ke A09 - Klik ‘Edit’ untuk menuju

ke A09

- Klik ‘Nilai Try Out Online’ untuk menuju ke A14

Nama Layar : A04

Ukuran Layar : 1024 x 768 Font : Times New Roman Warna Background : Putih A04


(70)

6. Perancangan Antarmuka Form Data Customer Service

Gambar 3.25. Perancangan Antarmuka Form Data Customer Service

- Klik ‘Beranda’ untuk menuju ke A02 - Klik ‘Logout’ untuk

menuju ke A01 - Klik ‘Olah Data Cabang’

untuk menuju ke A03 - Klik ‘Olah Data Customer

Service’ untuk menuju ke A04

- Klik ‘Olah Data Program’ untuk menuju ke A05 - Klik ‘Olah Data Pengajar’

untuk menuju ke A06 - Klik ‘Olah Data Siswa’

untuk menuju ke A07 - Klik button ‘Simpan’ untuk menuju ke A04 - Klik ‘Batal’ untuk menuju

ke A04

- Klik ‘Nilai Try Out Online’ untuk menuju ke A14

Nama Layar : A09

Ukuran Layar : 1024 x 768 Font : Times New Roman Warna Background : Putih A09


(71)

7. Perancangan Antarmuka Olah Data Program

Gambar 3.26. Perancangan Antarmuka Olah Data Program

- Klik ‘Beranda’ untuk menuju ke A02 - Klik ‘Logout’ untuk

menuju ke A01 - Klik ‘Olah Data Cabang’

untuk menuju ke A03 - Klik ‘Olah Data Customer

Service’ untuk menuju ke A04

- Klik ‘Olah Data Program’ untuk menuju ke A05 - Klik ‘Olah Data Pengajar’

untuk menuju ke A06 - Klik ‘Olah Data Siswa’

untuk menuju ke A07 - Klik button ‘Tambah’ untuk menuju ke A10 - Klik ‘Edit’ untuk menuju

ke A10

- Klik ‘Nilai Try Out Online’ untuk menuju ke A14

Nama Layar : A05

Ukuran Layar : 1024 x 768 Font : Times New Roman Warna Background : Putih A05


(72)

8. Perancangan Antarmuka Form Data Program

Gambar 3.27. Perancangan Antarmuka Form Data Program

- Klik ‘Beranda’ untuk menuju ke A02 - Klik ‘Logout’ untuk

menuju ke A01 - Klik ‘Olah Data Cabang’

untuk menuju ke A03 - Klik ‘Olah Data Customer

Service’ untuk menuju ke A04

- Klik ‘Olah Data Program’ untuk menuju ke A05 - Klik ‘Olah Data Pengajar’

untuk menuju ke A06 - Klik ‘Olah Data Siswa’

untuk menuju ke A07 - Klik button ‘Simpan’ untuk menuju ke A05 - Klik ‘Batal’ untuk menuju

ke A05

- Klik ‘Nilai Try Out Online’ untuk menuju ke A14

Nama Layar : A10

Ukuran Layar : 1024 x 768 Font : Times New Roman Warna Background : Putih A10


(73)

9. Perancangan Antarmuka Olah Data Pengajar

Gambar 3.28. Perancangan Antarmuka Olah Data Pengajar

- Klik ‘Beranda’ untuk menuju ke A02 - Klik ‘Logout’ untuk

menuju ke A01 - Klik ‘Olah Data Cabang’

untuk menuju ke A03 - Klik ‘Olah Data Customer

Service’ untuk menuju ke A04

- Klik ‘Olah Data Program’ untuk menuju ke A05 - Klik ‘Olah Data Pengajar’

untuk menuju ke A06 - Klik ‘Olah Data Siswa’

untuk menuju ke A07 - Klik button ‘Tambah’ untuk menuju ke A11 - Klik ‘Edit’ untuk menuju

ke A11

- Klik ‘Nilai Try Out Online’ untuk menuju ke A14

Nama Layar : A06

Ukuran Layar : 1024 x 768 Font : Times New Roman Warna Background : Putih A06


(74)

10.Perancangan Antarmuka Form Data Pengajar

Gambar 3.29. Perancangan Antarmuka Form Data Pengajar

- Klik ‘Beranda’ untuk menuju ke A02 - Klik ‘Logout’ untuk

menuju ke A01 - Klik ‘Olah Data Cabang’

untuk menuju ke A03 - Klik ‘Olah Data Customer

Service’ untuk menuju ke A04

- Klik ‘Olah Data Program’ untuk menuju ke A05 - Klik ‘Olah Data Pengajar’

untuk menuju ke A06 - Klik ‘Olah Data Siswa’

untuk menuju ke A07 - Klik button ‘Simpan’ untuk menuju ke A06 - Klik ‘Batal’ untuk menuju

ke A06

- Klik ‘Nilai Try Out Online’ untuk menuju ke A14

Nama Layar : A11

Ukuran Layar : 1024 x 768 Font : Times New Roman Warna Background : Putih A11


(75)

11.Perancangan Antarmuka Olah Data Siswa

Gambar 3.30. Perancangan Antarmuka Olah Data Siswa

- Klik ‘Beranda’ untuk menuju ke A02 - Klik ‘Logout’ untuk

menuju ke A01 - Klik ‘Olah Data Cabang’

untuk menuju ke A03 - Klik ‘Olah Data Customer

Service’ untuk menuju ke A04

- Klik ‘Olah Data Program’ untuk menuju ke A05 - Klik ‘Olah Data Pengajar’

untuk menuju ke A06 - Klik ‘Olah Data Siswa’

untuk menuju ke A07 - Klik button ‘Tambah’ untuk menuju ke A12 - Klik ‘Edit’ untuk menuju

ke A12

- Klik ‘Detail Program’ untuk menuju ke A13 - Klik ‘Nilai Try Out

Online’ untuk menuju ke A14

Nama Layar : A07

Ukuran Layar : 1024 x 768 Font : Times New Roman Warna Background : Putih A07


(76)

12.Perancangan Antarmuka Form Data Siswa

Gambar 3.31. Perancangan Antarmuka Form Data Siswa

- Klik ‘Beranda’ untuk menuju ke A02 - Klik ‘Logout’ untuk

menuju ke A01 - Klik ‘Olah Data Cabang’

untuk menuju ke A03 - Klik ‘Olah Data Customer

Service’ untuk menuju ke A04

- Klik ‘Olah Data Program’ untuk menuju ke A05 - Klik ‘Olah Data Pengajar’

untuk menuju ke A06 - Klik ‘Olah Data Siswa’

untuk menuju ke A07 - Klik button ‘Simpan’ untuk menuju ke A07 - Klik ‘Batal’ untuk menuju

ke A07

- Klik ‘Nilai Try Out Online’ untuk menuju ke A14

Nama Layar : A12

Ukuran Layar : 1024 x 768 Font : Times New Roman Warna Background : Putih A12


(77)

13.Perancangan Antarmuka Detail Program Siswa

Gambar 3.32. Perancangan Antarmuka Detail Program Siswa

- Klik ‘Beranda’ untuk menuju ke A02 - Klik ‘Logout’ untuk

menuju ke A01 - Klik ‘Olah Data Cabang’

untuk menuju ke A03 - Klik ‘Olah Data Customer

Service’ untuk menuju ke A04

- Klik ‘Olah Data Program’ untuk menuju ke A05 - Klik ‘Olah Data Pengajar’

untuk menuju ke A06 - Klik ‘Olah Data Siswa’

untuk menuju ke A07 - Klik button ‘Simpan’ untuk menuju ke A07 - Klik ‘Batal’ untuk menuju

ke A07

- Klik ‘<<Kembali’ untuk menuju ke A07 - Klik ‘Nilai Try Out

Online’ untuk menuju ke A14

Nama Layar : A13

Ukuran Layar : 1024 x 768 Font : Times New Roman Warna Background : Putih A13


(78)

14.Perancangan Antarmuka Hasil Nilai Try Out Online

- Klik ‘Beranda’ untuk menuju ke A02 - Klik ‘Logout’ untuk

menuju ke A01 - Klik ‘Olah Data Cabang’

untuk menuju ke A03 - Klik ‘Olah Data Customer

Service’ untuk menuju ke A04

- Klik ‘Olah Data Program’ untuk menuju ke A05 - Klik ‘Olah Data Pengajar’

untuk menuju ke A06 - Klik ‘Olah Data Siswa’

untuk menuju ke A07 - Klik ‘Nilai Try Out

Online’ untuk menuju ke A14

Nama Layar : A14

Ukuran Layar : 1024 x 768 Font : Times New Roman Warna Background : Putih A14


(79)

3.5.2.2.2.Perancangan Antarmuka Pengunjung

1. Perancangan Antarmuka Halaman Utama Aplikasi

Gambar 3.33. Perancangan Antarmuka Halaman Utama Aplikasi

- Klik ‘Beranda’ untuk menuju ke T01 - Klik ‘Peserta Bimbel’

untuk menuju ke T02 - Klik ‘Pengajar’ untuk

menuju ke T03

- Klik ‘Daftar’ untuk menuju ke T04

- Klik ‘Login’ untuk menuju ke T05

Nama Layar : T01

Ukuran Layar : 1024 x 768 Font : Times New Roman Warna Background : Putih T01


(80)

2. Perancangan Antarmuka Daftar Peserta Bimbel

Gambar 3.34. Perancangan Antarmuka Daftar Peserta Bimbel

- Klik ‘Beranda’ untuk menuju ke T01 - Klik ‘Peserta Bimbel’

untuk menuju ke T02 - Klik ‘Pengajar’ untuk

menuju ke T03

- Klik ‘Daftar’ untuk menuju ke T04

- Klik ‘Login’ untuk menuju ke T05

Nama Layar : T02

Ukuran Layar : 1024 x 768 Font : Times New Roman Warna Background : Putih T02


(81)

3. Perancangan Antarmuka Daftar Pengajar

Gambar 3.35. Perancangan Antarmuka Daftar Pengajar

- Klik ‘Beranda’ untuk menuju ke T01 - Klik ‘Peserta Bimbel’

untuk menuju ke T02 - Klik ‘Pengajar’ untuk

menuju ke T03

- Klik ‘Daftar’ untuk menuju ke T04

- Klik ‘Login’ untuk menuju ke T05

Nama Layar : T03

Ukuran Layar : 1024 x 768 Font : Times New Roman Warna Background : Putih T03


(82)

4. Perancangan Antarmuka Form Pendaftaran

Gambar 3.36. Perancangan Antarmuka Form Pendaftaran

- Klik ‘Beranda’ untuk menuju ke T01 - Klik ‘Peserta Bimbel’

untuk menuju ke T02 - Klik ‘Pengajar’ untuk

menuju ke T03

- Klik ‘Daftar’ untuk menuju ke T04

- Klik ‘Login’ untuk menuju ke T05

- Klik ‘Daftar’ bawah kiri untuk menuju ke M01 jika berhasil atau ke M02 jika gagal

Nama Layar : T04

Ukuran Layar : 1024 x 768 Font : Times New Roman Warna Background : Putih T04


(83)

5. Perancangan Antarmuka Form Login

Gambar 3.37. Perancangan Antarmuka Form Login

- Klik ‘Beranda’ untuk menuju ke T01 - Klik ‘Peserta Bimbel’

untuk menuju ke T02 - Klik ‘Pengajar’ untuk

menuju ke T03

- Klik ‘Daftar’ untuk menuju ke T04

- Klik ‘Login’ untuk menuju ke T05

- Klik ‘Login’ bawah kiri untuk menuju ke P01 jika pengajar atau ke S01 jika siswa atau ke M03 jika gagal

Nama Layar : T05

Ukuran Layar : 1024 x 768 Font : Times New Roman Warna Background : Putih T05


(84)

3.5.2.2.3.Perancangan Antarmuka Pengajar 1. Perancangan Antarmuka Beranda Pengajar

Gambar 3.38. Perancangan Antarmuka Beranda Pengajar

- Klik ‘Beranda’ untuk menuju ke P01 - Klik ‘Ubah Password’

untuk menuju ke P02 - Klik ‘Upload Materi’

untuk menuju ke P03 - Klik ‘Logout’ untuk

menuju ke T01

Nama Layar : P01

Ukuran Layar : 1024 x 768 Font : Times New Roman Warna Background : Putih P01


(85)

2. Perancangan Antarmuka Ubah Password Pengajar

Gambar 3.39. Perancangan Antarmuka Ubah Password Pengajar

- Klik ‘Beranda’ untuk menuju ke P01 - Klik ‘Ubah Password’

untuk menuju ke P02 - Klik ‘Upload Materi’

untuk menuju ke P03 - Klik ‘Logout’ untuk

menuju ke T01 - Klik ‘Simpan’ untuk

menuju ke M04 jika benar atau M05 jika salah

Nama Layar : P02

Ukuran Layar : 1024 x 768 Font : Times New Roman Warna Background : Putih P02


(86)

3. Perancangan Antarmuka Daftar Materi Pengajar

Gambar 3.40. Perancangan Antarmuka Daftar Materi Pengajar

- Klik ‘Beranda’ untuk menuju ke P01 - Klik ‘Ubah Password’

untuk menuju ke P02 - Klik ‘Upload Materi’

untuk menuju ke P03 - Klik ‘Logout’ untuk

menuju ke T01 - Klik ‘Tambah’ untuk

menuju ke P04

Nama Layar : P03

Ukuran Layar : 1024 x 768 Font : Times New Roman Warna Background : Putih P03


(87)

4. Perancangan Antarmuka Form Upload Materi

Gambar 3.41. Perancangan Antarmuka Form Upload Materi

- Klik ‘Beranda’ untuk menuju ke P01 - Klik ‘Ubah Password’

untuk menuju ke P02 - Klik ‘Upload Materi’

untuk menuju ke P03 - Klik ‘Logout’ untuk

menuju ke T01 - Klik ‘Simpan’ untuk

menuju ke P03

- Klik ‘Batal’ untuk menuju ke P03

Nama Layar : P04

Ukuran Layar : 1024 x 768 Font : Times New Roman Warna Background : Putih P04


(88)

3.5.2.2.4.Perancangan Antarmuka Siswa 1. Perancangan Antarmuka Beranda Siswa

Gambar 3.42. Perancangan Antarmuka Beranda Siswa

- Klik ‘Beranda’ untuk menuju ke S01 - Klik ‘Ubah Password’

untuk menuju ke S02 - Klik ‘Download Materi’

untuk menuju ke S03 - Klik ‘Try Out Online’

untuk menuju ke S04 - Klik ‘Logout’ untuk

menuju ke T01

Nama Layar : S01

Ukuran Layar : 1024 x 768 Font : Times New Roman Warna Background : Putih S01


(89)

2. Perancangan Antarmuka Ubah Password Siswa

Gambar 3.43. Perancangan Antarmuka Ubah Password Siswa

- Klik ‘Beranda’ untuk menuju ke S01 - Klik ‘Ubah Password’

untuk menuju ke S02 - Klik ‘Download Materi’

untuk menuju ke S03 - Klik ‘Try Out Online’

untuk menuju ke S04 - Klik ‘Logout’ untuk

menuju ke T01 - Klik ‘Simpan’ untuk

menuju ke M04 jika benar atau M05 jika salah

Nama Layar : S02

Ukuran Layar : 1024 x 768 Font : Times New Roman Warna Background : Putih S02


(90)

3. Perancangan Antarmuka Download Materi

Gambar 3.44. Perancangan Antarmuka Download Materi

- Klik ‘Beranda’ untuk menuju ke S01 - Klik ‘Ubah Password’

untuk menuju ke S02 - Klik ‘Download Materi’

untuk menuju ke S03 - Klik ‘Try Out Online’

untuk menuju ke S04 - Klik ‘Logout’ untuk

menuju ke T01

Nama Layar : S03

Ukuran Layar : 1024 x 768 Font : Times New Roman Warna Background : Putih S03


(91)

4. Perancangan Antarmuka Pemilihan Try Out Online

Gambar 3.45. Perancangan Antarmuka Pemilihan Try Out Online

- Klik ‘Beranda’ untuk menuju ke S01 - Klik ‘Ubah Password’

untuk menuju ke S02 - Klik ‘Download Materi’

untuk menuju ke S03 - Klik ‘Try Out Online’

untuk menuju ke S04 - Klik ‘Logout’ untuk

menuju ke T01 - Klik ‘Nama Program’

untuk menuju ke S05

Nama Layar : S04

Ukuran Layar : 1024 x 768 Font : Times New Roman Warna Background : Putih S04


(92)

5. Perancangan Antarmuka Try Out Online

Gambar 3.46. Perancangan Antarmuka Try Out Online

- Klik ‘Beranda’ untuk menuju ke S01 - Klik ‘Ubah Password’

untuk menuju ke S02 - Klik ‘Download Materi’

untuk menuju ke S03 - Klik ‘Try Out Online’

untuk menuju ke S04 - Klik ‘Logout’ untuk

menuju ke T01

Nama Layar : S05

Ukuran Layar : 1024 x 768 Font : Times New Roman Warna Background : Putih S05


(93)

6. Perancangan Antarmuka Hasil Try Out Online

Gambar 3.47. Perancangan Antarmuka Hasil Try Out Online

- Klik ‘Beranda’ untuk menuju ke S01 - Klik ‘Ubah Password’

untuk menuju ke S02 - Klik ‘Download Materi’

untuk menuju ke S03 - Klik ‘Try Out Online’

untuk menuju ke S04 - Klik ‘Logout’ untuk

menuju ke T01

Nama Layar : S06

Ukuran Layar : 1024 x 768 Font : Times New Roman Warna Background : Putih S06


(94)

3.5.2.2.5.Perancangan Pesan

1. Perancangan Pesan Pendaftaran Berhasil

Gambar 3.48. Perancangan Pesan Pendaftaran Berhasil

2. Perancangan Pesan Pendaftaran Gagal

Gambar 3.49. Perancangan Pesan Pendaftaran Gagal

3. Perancangan Pesan Login Gagal

Gambar 3.50. Perancangan Pesan Login Gagal

M01

M02

M03


(95)

4. Perancangan Antarmuka Pesan Ubah Password Benar

Gambar 3.51. Perancangan Pesan Ubah Password Benar

5. Perancangan Antarmuka Pesan Ubah Password Salah

Gambar 3.52. Perancangan Pesan Ubah Password Salah

M04

M05


(1)

3.6.2.3.Implementasi Antarmuka Pengajar 1. Implementasi Antarmuka Beranda Pengajar

Halaman ini akan tampil jika pengajar berhasil login.

Gambar 3.92. Implementasi Antarmuka Beranda Pengajar

2. Implementasi Antarmuka Ubah Password Pengajar

Pada halaman ini terdapat form ubah password bagi pengajar untuk mengubah password.


(2)

3. Implementasi Antarmuka Data Materi Pengajar

Pada halaman ini terdapat daftar materi pengajar. Pengajar dapat menghapus dan juga menambah materi.

Gambar 3.94. Implementasi Antarmuka Data Materi Pengajar

4. Implementasi Antarmuka Form Upload Materi

Pada halaman ini terdapat form untuk mengunggah materi.


(3)

3.6.2.4.Implementasi Antarmuka Siswa 1. Implementasi Antarmuka Beranda Siswa

Halaman ini akan tampil jika siswa berhasil login.

Gambar 3.96. Implementasi Antarmuka Beranda Siswa

2. Implementasi Antarmuka Ubah Password Siswa

Pada halaman ini terdapat form bagi siswa untuk mengubah password.


(4)

3. Implementasi Antarmuka Download Materi

Pada halaman ini terdapat daftar materi yang dapat diunduh siswa sesuai dengan program yang dipilih. Program yang dapat dipilih adalah program yang diikuti oleh siswa.

Gambar 3.98. Implementasi Antarmuka Download Materi

4. Implementasi Antarmuka Pemilihan Try Out Online

Pada halaman ini siswa memilih try out online berdasarkan program yang diikuti oleh siswa. Program yang dapat dipilih adalah program yang diikuti oleh siswa.


(5)

5. Implementasi Antarmuka Try Out Online

Pada halaman ini siswa mengerjakan try out online berdasarkan program yang dipilih oleh siswa. Terdapat batas waktu dalam pengerjaan try out.

Gambar 3.100. Implementasi Antarmuka Try Out Online

6. Implementasi Hasil Try Out Online

Pada halaman ini siswa dapat melihat hasil try out online yang telah dikerjakan sebelumnya.


(6)

BAB 4

KESIMPULAN DAN SARAN

4.1. Kesimpulan

Penulis merancang suatu sistem yang dihasilkan berdasarkan hasil analisa dan pembahasan yang telah diuraikan pada bab-bab sebelumnya. Berdasarkan uraian tersebut, maka dapat diambil kesimpulan terhadap Aplikasi Bimbel Online LBB BEST yang dibangun , yaitu sebagai berikut :

a. Aplikasi Bimbel Online LBB BEST yang dibangun dapat menjadi media perantara antara pengajar dengan peserta bimbingan di LBB BEST dalam memberikan materi-materi pelajaran tambahan yang tidak sempat diberikan oleh pengajar kepada siswa pada waktu di kelas.

b. Aplikasi Bimbel Online LBB BEST ini memiliki fitur Try Out Online yang dapat dijadikan sebagai media evaluasi peserta bimbel sehingga dapat meningkatkan angka kelulusan try out.

4.2. Saran

Berdasarkan kesimpulan di atas, maka saran yang diharapkan yaitu dilakukan suatu pengembangan terhadap aplikasi Bimbel Online yang dibangun, sebagai berikut :

a. Aplikasi Bimbel Online LBB BEST yang telah dirancang dapat dikembangkan lagi untuk hasil yang lebih baik.

b. Aplikasi Bimbel Online LBB BEST dapat ditambahkan fitur – fitur tambahan mendukung yang dapat membantu peserta bimbingan dalam pembelajaran.