Pembangunan aplikasi database potensi pendidikan kota bandung berbasis web pada Badan Komunikasi dan Informatika (BAKOMINFO) pemerintahan kota bandung

(1)

1

BAB I

PENDAHULUAN

1.1 Latar Belakang Masalah

Badan Komunikasi dan Informatika (BAKOMINFO) di wilayah Pemerintah

Kota Bandung, mempunyai kewenangan untuk mengelola pelayanan masyarakat

di Kota Bandung. Salah satunya pada bidang Teknologi dan Informasi yang

bertugas memberikan layanan informasi kepada masyarakat.mengenai potensi

pendidikan di Kota Bandung. Saat ini data-data mengenai potensi pendidikan di

Kota Bandung masih berupa berkas-berkas yang disimpan dalam satu map yang

kadang sering tercecer.

Potensi pendidikan Kota Bandung merupakan informasi mengenai profil

semua lembaga pendidikan formal seperti SMP, SMA, SMK, maupun Perguruan

Tinggi. Berdasarkan tugas yang dimiliki oleh Bidang Teknologi dan Informasi

pada BAKOMINFO, seringkali menyulitkan staff dinas untuk meng-update

informasi mengenai profil SMP, SMA, SMK, maupun Perguruan Tinggi. Karena

tidak adanya database yang terstruktur.

Selain itu, karena tidak ada database yang mengelola semua informasi

lembaga pendidikan formal, masyarakat tidak dapat mengakses informasi

(2)

1.2 Perumusan Masalah

Dilihat dari fenomena yang terjadi di BAKOMINFO saat ini terdapat

masalah dalam pengolahan database potensi pendidikan Kota Bandung,

diantaranya :

1. Database masih berupa berkas-berkas yang seringkali tercecer.

2. Menyulitkan staff dinas untuk meng-update profil mengenai

SMP,SMA,SMK, maupun Perguruan Tinggi.

3. Masyarakat kesulitan mengakses informasi potensi pendidikan di Kota

Bandung karena tidak disajikan secara online.

Berdasarkan latar belakang di atas, maka diperoleh rumusan masalah

bagaimana membangun Aplikasi Potensi Pendidikan Pemerintahan Kota Bandung

Berbasis Web pada BAKOMINFO Pemerintahan Kota Bandung.

1.3 Maksud dan Tujuan

1.3.1 Maksud

Maksud dari dibangunnya database potensi pendidikan kota Bandung ini

adalah merancang dan membuat sebuah database potensi pendidikan kota

Bandung yang berbasis web, yang dalam hal ini adalah menggantikan database

(3)

1.3.2 Tujuan

Adapun tujuan dari dibangunnya database ini adalah :

1. Mengubah database yang masih berupa berkas-berkas menjadi

database yang lebih terstruktur.

2. Memudahkan staff dinas untuk meng-update profil mengenai SMP, SMA, SMK maupun Perguruan Tinggi.

3. Memudahkan masyarakat untuk mengakses informasi potensi

pendidikan Kota Bandung secara online.

1.4 Batasan Masalah

Aplikasi ini dibangun berdasarkan prosedur yang digunakan yaitu

prosedur pembuatan Aplikasi Potensi Pendidikan Berbasis Web pada

BAKOMINFO Pemerintah Kota Bandung. Data yang diperlukan dalam

pembuatan aplikasi ini terbatas pada data profil SMP, SMA, SMK, dan Perguruan

Tinggi baik negeri maupun swasta yang ada di Kota Bandung.

Perangkat lunak yang digunakan yaitu Microsoft Windows Server 2000

sebagai sistem operasi, Macromedia Dreamwever sebagai aplikasi pembangun

perangkat lunak, PHP sebagai bahasa pemrograman, dan MySQL sebagai Server Database Management System.

Perangkat keras yang dibutuhkan yaitu komputer dengan spesifikasi

(4)

User yang akan menggunakan perangkat lunak ini adalah pegawai

dengan jabatan Staff Perancangan dan Pengembangan Teknologi pada Bidang

Teknologi dan Informasi Badan Komunikasi dan Informatika

(BAKOMINFO).

Aplikasi ini akan dibangun dengan memanfaatkan jaringan internet yang

bisa diakses oleh siapa saja.

1.5 Metode Penelitian

Kebutuhan Sistem / Informasi

Analisis

Perancangan

Pengkodingan

Pengujian

Pemeliharaan

Gambar 1. 1 Metode Waterfall

Teknik analisis data dalam pembuatan perangkat lunak menggunakan

(5)

a. Sistem Informasi

Merupakan bagian dari sistem yang terbesar dalam pengerjaan suatu

proyek, dimulai dengan menetapkan berbagai kebutuhan dari semua

elemen yang diperlukan sistem dan mengalokasikannya kedalam

pembentukan perangkat lunak.

Pengumpulan datanya dilakukan dengan dua metode:

a. Observasi.

Teknik pengumpulan data dengan mengadakan penelitian dan terjun

langsung ke lingkungan objek yang diteliti.

b. Wawancara.

Teknik pengumpulan data dengan mengadakan tanya jawab secara

langsung kepada staff yang mengolah data pendidikan Kota Bandung.

b. Analisis

Merupakan tahap menganalisis hal-hal yang diperlukan dalam pelaksanaan

proyek pembuatan perangkat lunak, seperti analisis kebutuhan fungsional dan

nonfungsional.

c. Perancangan

Tahap perancangan interface yang mudah dimengerti user yang mengacu

pada data – data analisis.

d. Pengkodingan

Tahap penerjemahan data yang telah dirancang keadalam bahasa

(6)

e. Pengujian

Merupakan tahap pengujian terhadap perangkat lunak yang dibangun.

f. Pemeliharaan

Tahap akhir dimana suatu perangkat lunak yang sudah selesai dapat

mengalami perubahan–perubahan atau penambahan sesuai dengan

permintaan user.

1.6 Sistematika Penulisan

Adapun sistematika penulisan laporan kerja praktek ini adalah sebagai berikut:

BAB I PENDAHULUAN

Berisi pembahasan masalah umum yang berhubungan dengan penyusunan laporan

kerja praktek, yang meliputi latar belakang masalah, perumusan masalah, maksud

dan tujuan kerja praktek, batasan masalah, metode penelitian, dan sistematika

penulisan kerja praktek.

BAB II TINJAUAN PUSTAKA

Berisi pembahasan mengenai BAKOMINFO, yang meliputi sejarah, logo, badan

hukum, struktur organisasi, serta landasan teori.

BAB III PEMBAHASAN

Berisi mengenai seluruh aktivitas yang dilakukan selama kerja praktek di

BAKOMINFO. Dari mulai analisis program aplikasi, perancangan tampilan

(7)

BAB IV KESIMPULAN DAN SARAN

Bab ini terdiri dari kesimpulan mengenai seluruh hasil kerja praktek yang

dilaksanakan di BAKOMINFO Pemerintahan Kota Bandung serta saran untuk

(8)

8

BAB II

TINJAUAN PUSTAKA

2.1 Profil Tempat Kerja Praktek

2.1.1 Sejarah Instansi

BAKOMINFO Kota Bandung merupakan Lembaga Teknis Daerah

dibentuk berdasarkan Peraturan Daerah Kota Bandung Nomor 13 Tahun 2007.

Tanggal 4 Desember 2007 serta merupakan penggabungan Satuan Kerja

Pemerintah Daerah (SKPD) Dinas dan Kantor di lingkungan Pemerintah Kota

Bandung yaitu Dinas Informasi dan Komunikasi dengan Kantor Pengolahan Data

Elektronik (KPDE). BAKOMINFO diperuntukan untuk mengumpulkan data dan

informasi mengenai Kota Bandung, serta memberikan informasi tentang Kota

Bandung kepada masyrakat umum yang ingin mengetahui tentang informasi

potensi Kota Bandung. Dengan demikian Bakominfo berdiri sejak

diberlakukannya PERDA Nomor 13 Tahun 2007 tentang Pembentukan dan

(9)

2.1.2 Logo Instansi

Gambar 2. 1 Logo Pemerintahan Kota Bandung

2.1.3 Badan Hukum Instansi

PERDA Nomor 13 Tahun 2007 tentang Pembentukan dan Susunan

Organisasi Dinas Daerah Kota Bandung.

2.1.4 Struktur Organisasi

(10)

2.2 Landasan Teori

Beberapa landasan teori menjadi acuan penulis dalam melakasanakan

kerja praktek ini adalah:

2.2.1 Database

Database adalah suatu koleksi data komputer yang terintegrasi, diorganisasikan dan disimpan dalam suatu cara yang memudahkan pengambilan

kembali. Dua tujuan utama dari database adalah meminimumkan pengulangan dan mencapai independensi data. Independensi data adalah kemampuan untuk

membuat perubahan dalam struktur data tanpa membuat perubahan pada program

yang memproses data.

Database atau basis data terdiri dari dua kata yaitu basis yang artinya markas atau gudang atau tempat berkumpul. Sedangkan data adalah representasi

fakta dunia nyata yang mewakili suatu objek.

2.2.2 Struktur Database

Integrasi logis file dapat dicapai secara eksplisit atau secara implisit.

1. Hubungan Eksplisit

Inverted index dan link field menetapkan hubungan eksplisit antara

data yang terintegrasi secara logis dalam file yang sama. Index dan field

ada secara fisik dan harus disatukan ke dalam file saat dibuat.

(11)

Hubungan implisit adalah hubungan yang dinyatakan secara tidak

langsung dari catatan data yang telah ada.

2.2.3 Operasi Dasar Database

1. Pembuatan database (create database) yaitu menciptakan database baru. 2. Penghapusan database (drop database) yaitu penghapusan suatu database. 3. Penambahan/pengisian data baru ke sebuah file/tabel disebuah database

(insert).

4. Pengambilan data dari sebuah file/tabel (retrieve/search) yaitu pencarian data pada suatu file.

5. Pengubahan data dari sebuah file/tabel (update) yaitu perbaikan data pada suatu file.

6. Penghapusan data dari sebuah file/tabel (delete).

2.2.4 PHP

PHP merupakan singkatan dari "PHP: Hypertext Preprocessor", adalah

sebuah bahasa scripting yang terpasang pada HTML. Sebagian besar sintaks mirip

dengan bahasa C, Java dan Perl, ditambah beberapa fungsi PHP yang spesifik.

Tujuan utama bahasa ini adalah untuk memungkinkan perancang web menulis

halaman web dinamik dengan cepat.

PHP merupakan bahasa pemograman web yang bersifat server-side HTML=embedded scripting, di mana script-nya menyatu dengan HTML dan berada si server. Artinya adalah sintaks dan perintah-perintah yang kita berikan

(12)

sebgai bahasa scripting yang menyatu dengan tag HTML, dieksekusi di server dan

digunakan untuk membuat halaman web yang dinamis seperti ASP (active Server

Pages) dan JSP (Java Server Pages).

Seluruh aplikasi berbasis web dapat dibuat dengan PHP. Namun kekuatan

yang paling utama PHP adalah pada konektivitasnya dengan system database di

dalam web. Sistem database yang dapat didukung oleh PHP adalah :

1. Oracle

2. MySQL

3. Sybase

4. PostgreSQL

5. dan lainnya.

PHP dapat berjalan di berbagai system operasi seperti windows 98/NT,

UNIX/LINUX, solaris maupun macintosh.

PHP merupakan software yang open source yang dapat anda download secara gratis dari situs resminya yaitu http://www.php.net, ataupun dari situs-situs yang menyediakan software tersebut seperti di ftp://gerbang.che.itb.ac.id.

Software ini juga dapat berjalan pada web server seperti PWS (Personal

Web Server), Apache, IIS, AOLServer, fhttpd, phttpd dan sebagainya. PHP juga

merupakan bahasa pemograman yang dapat kita kembangkan sendiri seperti

menambah fungsi-fungsi baru.

Keunggulan lainnya dari PHP adalah PHP juga mendukung komunikasi dengan

(13)

PHP dapat diinstal sebagai bagian atau modul dari apache web server atau

sebagai CGI script yang mandiri. Banyak keuntungan yang dapat diperoleh jika menggunakan PHP sebagai modul dari apache di antaranya adalah :

1. Tingkat keamanan yang cukup tinggi

2. Waktu eksekusi yang lebih cepat dibandingkan dengan bahasa pemograman

web lainnya yang berorientasi pada server-side scripting.

3. Akses ke system database yang lebih fleksibel. seperti MySQL.

Dalam kerja praktek ini menggunakan PHP sebagai server-side scripting

yang menggunakan apache sebagai webserver.

2.2.5 Web Server

Web server merupakan server internet yang mampu melayani koneksi

transfer data dalam protocol HTTP. Web server merupakan hal yang terpenting

dari server di internet dibandingkan server lainnya seperti e-mail server, ftp server

ataupun news server. Hal ini di sebabkan web server telah dirancang untuk dapat

melayani beragam jenis data, dari text sampai grafis 3 dimensi. Kemampuan ini

telah menyebabkan berbagai institusi seperti universitas maupun perusahaan dapat

menerima kehadirannya dan juga sekaligus menggunakannya sebagai sarana di

internet.

Salah satu software yang biasa digunakan oleh banyak web master di dunia

adalah apache. Software tersebut dapat di download secara gratis dari web resmi

apache yaitu http://www.apache.org. Apache merupakan software open source

(14)

fleksibel terhadap berbagai system operasi seperti windows9x/NT ataupun

unix/linux.

Beberapa keunggulan PHP dibandingkan dengan yang lain :

1. Autentikasi http menggunakan PHP menggunakan fungsi header() yang ada dalam modul apache PHP.

2. Pembuatan file GIF menggunakan library GD yang dikompilasi saat

menginstall php.

3. PHP dapat menerima metoda upload file

4. Mendukung penggunaan cookie

5. Mendukung integrasi dengan database

6. Mendukung ekspresi regular seperti ereg(), ereg_replace() dan lainnya.

7. Penanganan kesalahan berdasarkan tingkat kesalahan.

2.2.6 PHP MyAdmin

PHP MyAdmin merupakan software yang digunakan untuk memudahkan

bagi seseorang untuk membuat suatu database dengan cepat tanpa harus mengetik

secara manual di Dos-Prompt.

2.2.7 Cara Kerja PHP MyAdmin

Edit file httpd. onf pada agian Dire tor Inde tuliskan ekstention .php3 atau

.php agar ketika browser membuka folder tersebut, file tersebut otomatis terbuka.

Setelah software tersebut bekerja maka akan tampil browser seperti gambar di

(15)

Gambar 2. 3 Halaman Utama PHP MyAdmin

Pada browser tersebut tampak beberapa bagian yang menyatakan nama

database yang telah dibuat sebelumnya yaitu di sebelah kiri gambar sedangkan di

sebelah kanan tampak suatu kolom yang di peruntukkan untuk membuat suatu

(16)

16

BAB III

PEMBAHASAN

3.1 Analisis Masalah

Sesuai dengan penelitian didapat adanya masalah dengan database

konvensional yang digunakan untuk media penyimpanan data potensi pendidikan

di Kota Bandung. Belum adanya sistem informasi yang mengolah data secara

otomatis membuat pengolahan data sangat sulit. Semua proses input, edit, dan

hapus data masih dilakukan secara manual. Selain itu agar dapat memberikan

informasi kepada masyarakat luas mengenai potensi pendidikan di Kota Bandung,

diperlukan adanya suatu media yang dapat diakses oleh masyarakat manapun.

Berdasarkan hal tersebut maka diperlukannya pembangunan suatu sistem

informasi yang berbasis web.

3.1.1 Analisis Sistem

Dalam analisis sistem dilakukan penguraian dari suatu sistem informasi

yang utuh ke dalam bagian-bagian komponennya dengan maksud untuk

mengidentifikasikan dan mengevaluasi permasalahan-permasalahan sehingga

ditemukan kelemahan-kelemahannya, kesempatan-kesempatan,

hambatan-hambatan yang terjadi dan kebutuhan-kebutuhan yang diharapkan sehingga dapat

(17)

3.1.2 Analisis Prosedur yang sedang berjalan

Analisis prosedur atau proses sistem memberikan gambaran tentang sistem

yang saat ini sedang berjalan. Analisis sistem bertujuan untuk mengetahui lebih

jelas bagaimana cara kerja sistem tersebut, sehingga kelebihan dan kekurangan

sistem dapat diketahui.

Dokumen-dokumen yang ada yaitu berupa data-data profil lembaga

pendidikan di Kota Bandung seperti SMP, SMA, SMK dan Universitas yang

masih berupa berkas-berkas. Aliran dokumen – dokumen ini akan terlihat pada

prosedur sistem yang berjalan seperti yang digambarkan pada flow map di bawah ini.

3.1.2.1Flow Map Sistem Yang Sedang Berjalan

Bagan alir dokumen atau disebut juga bagan alir formulir merupakan

bagan alir yang menunjukan arus dari dokumen formulir termasuk

tembusan-tembusannya. Berdasarkan analisis di atas, maka terdapat beberapa prosedur yang

sedang berjalan mengenai data potensi dinas pendidikan di Kota Bandung.

Prosedur tersebut merupakan aturan-aturan yang digunakan dalam mengelola dan

mengolah data potensi pendidikan.

Berikut adalah procedur penyimpanan data

1. Staff dinas pendidikan memberikan data profil mengenai lembaga

pendidikan formal di Kota Bandung kepada staff BAKOMINFO bagian

(18)

2. Staff BAKOMINFO melakukan pengecekan data-data profil lembaga

pendidikan.

3. Jika lengkap, akan dibuat data potensi pendidikan dan disimpan dalam

berkas data potensi pendidikan yang sudah lengkap.

4. Jika belum lengkap, akan dikembalikan ke staff dinas pendidikan untuk

dilakukan pengolahan ulang data.

5. Data potensi pendidikan akan dibuat menjadi dua rangkap. Yang satu akan

disimpan di bagian BAKOMINFO, yang satu lagi akan disimpan di Dinas

Pendidikan berupa arsip.

6. Data potensi pendidikan yang ada di BAKOMINFO diklasifikasikan ke

dalam data profil berdasarkan jenis sekolah.

7. Kemudian dimasukan ke dalam arsip di setiap jenis sekolah, seperti arsip

SMP, SMA, SMK, dan Universitas.

(19)

Staff dinas pendidikan Staff BAKOMINFO bagian pengembangan _informasi

Data profil lembaga pendidikan formal

Pengecekan kelengkapan data

profil

Lengkap? Data profil tidak

lengkap

Pengolahan ulang data

A1

ya Data profil tidak

lengkap

Pembuatan data potensi pendidikan

Data potensi pendidikan

lengkap

Data potensi pendidikan

Klasifikasi berdasarkan

tingkatan

Data SMP Data SMA Data SMK _UniversitasData

A1 A1

A1

tidak

Gambar 3. 1 Flowmap

Keterangan :

A1 : Arsip data potensi pendidikan pada BAKOMINFO

A2 : Arsip data potensi pendidikan pada Dinas Pendidikan

A3: Arsip data SMP

(20)

A3: Arsip data SMK

A3: Arsip data Perguruan Tinggi Negeri atau Swasta

3.1.3 Analisis Kebutuhan Non Fungsional

Analisis kebutuhan non fungsional dilakukan untuk menghasilkan

spesifikasi yang rinci mengenai segala hal yang dapat dikerjakan sistem ketika

diimplementasikan (spesifikasi kebutuhan non fungsional). Hasil dari analisis ini

akan menentukan masukan yang dibutuhkan sistem, keluaran yang dihasilkan

sistem, lingkup proses yang digunakan untuk mengolah masukan sehingga

menghasilkan keluaran yang diinginkan, volume data yang akan ditangani sistem,

kendali terhadap sistem, dan macam-macam kategori pengguna sistem.

3.1.3.1Analisis Prangkat Keras

Perangkat keras yang ada saat ini di BAKOMINFO sudah memenuhi

standar untuk menjalankan aplikasi yang dibangun. Adapun spesifikasinya

sebagai berikut :

a. Processor : Pentium IV 2 GHz

b. RAM : 256 Mb

c. VGA : GeForce MX 4400, 64 Mb

d. Harddisk : 40 Gb

e. CD-ROM : min 52 x

f. Monitor : Color 17”

(21)

3.1.3.2Analisis Perangkat Lunak

Spesifikasi perangkat lunak yang telah ada di BAKOMINFO adalah

sebagai berikut :

a. Microsoft Windows Server 2000 sebagai sistem operasi

b. Macromedia Dreamwever sebagai aplikasi pembangun perangkat lunak

c. PHP sebagai bahasa pemrograman

d. MySQL sebagai Server Database Management System.

3.1.3.3Analisis User

Dalam aplikasi ini, terdapat dua user. Yang pertama admin yaitu staff

bidang Teknologi dan Informasi pada BAKOMINFO dengan minimal lulusan S1

Teknik Informatika yang sudah mempunyai pengalaman menjalankan aplikasi

berbasis web dan memahami bahasa pemrograman PHP. Yang kedua visitor, yaitu

masyarakat luas yang bisa mengakses aplikasi ini melalui jaringan internet

3.2 Analisis Basis Data

Usulan untuk diagram E-R yaitu terdapat kunci yang unik (primary key) pada setiap entitas (tabel induk) yang dapat membedakan dengan atribut lainnya

sehingga tabel tersebut dapat dijadikan referensi untuk tabel yang lainnya.

Dari usulan diatas maka dapat dibuat diagram E-R untuk sistem yang

terdri dari beberapa tabel yang dibutuhkan untuk menyimpan data. Untuk melihat

(22)

3.2.1 Entity Relationship Diagram

Admin Mengolah Data Sekolah

username email

nama no_id

password

no_id_sekolah

Id_sekolah nama_sekolah kode_sekolah

Mengolah Data Universitas

no_id no_id kode_pt nama_pt alamat_pt alamat

mengolah Data Pesan

no_id

nama email pesan

waktu

N 1

1 1

N

Id_pesan

N

Gambar 3. 2 Entity Relationship Diagram

3.2.2 Kamus Data

Untuk menjelaskan semua data yang digunakan dalam sistem, digunakan

kamus data. Kamus data untuk sistem ini diuraikan dalam tabel berikut:

Tabel 3. 1 Kamus Data

No. Detail Keterangan

1. Nama Data login

Deskripsi Berisi data admin yang digunakan untuk proses login Struktur data username + password

username password

{0..9|a..z|A..Z} {0..9|a..z|A..Z}

2. Nama Data sekolah

Deskripsi Berisi data profil sekolah

Struktur data id_sekolah+kode_sekolah+jenis_sekolah+nama_sekolah +alamat+no_telp+guru+non_guru+kelas_1+kelas_2+kel as_3+jm_ kelas+r_kelas+r_perpus+r_lab+email+website

id_sekolah kode_sekolah

(23)

No. Detail Keterangan jenis_sekolah nama_sekolah alamat no_telp guru non_guru kelas_1 kelas_2 kelas_3 jm_kelas r_kelas r_perpus r_lab email website {a..z|A..Z} {a..z|A..Z} {0..9|a..z|A..Z} {0..9} {0..9} {0..9} {0..9} {0..9} {0..9} {0..9} {0..9} {0..9} {0..9} {0..9|a..z|A..Z} {0..9|a..z|A..Z} 3. Nama Data Universitas

Deskripsi Berisi data profil Universitas

Struktur data no_id+kode_pt+nama_pt+alamat_pt+no_telp+fax+email +website no_id kode_pt nama_pt alamat_pt no_telp fax email website {0..9} {0..9} {0..9|a..z|A..Z} {0..9|a..z|A..Z} {0..9 } {0..9|a..z|A..Z} {0..9|a..z|A..Z} {0..9|a..z|A..Z}

4. Nama Data pesan

(24)

3.2.3 Skema Relasi T_Universitas no_id * id_pt ** nama_pt alamat_pt no_telp fax email website T_Sekolah id_Sekolah * no_id ** jenis_Sekolah kode_Sekolah nama_Sekolah alamat no_telp guru non_guru kelas_1 kelas_2 kelas_3 jm_kelas r_kelas r_perpus r_lab email website T_Admin no_id * nama email username password T_Pesan no_id * id_pesan ** nama email pesan waktu

Gambar 3. 3 Skema Relasi

3.2.4 Struktur Tabel

Tabel 3. 2 Tabel Admin

No. Nama Type Size Key Keterangan

1. nomor_id SMALLINT 5 Nomor Id Admin

2. nama VARCHAR 15 Nama Admin

3. email VARCHAR 35 Email Admin

4. username VARCHAR 10 User Name Admin

5. password VARCHAR 10 Sandi Admin

(25)

No Nama Type Size Key Keterangan 1. id_sekolah SMALLINT 5 * Nomor urut sekolah 2. kode_sekolah VARCHAR 11 Kode sekolah

3. jenis_sekolah VARCHAR 20 SMP, SMA, SMK

4. nama_smp VARCHAR 50 Nama sekolah

5. alamat VARCHAR 100 Alamat sekolah

6. no_telp INTEGER 15 No. telpon sekolah

7. guru INTEGER 5 Jumlah guru PNS

8. non_guru INTEGER 5 Jumlah guru Non PNS

9. kelas1 INTEGER 5 Jumlah siswa Kelas 1

12. jm_kelas INTEGER 3 Total Siswa SMP

13. r_kelas INTEGER 3 Jumlah ruang kelas

14. r_perpus INTEGER 3 Jumlah ruang perpus

15. r_lab INTEGER 3 Jumlah ruang lab

16. email VARCHAR 30 Alamat email sekolah

17. website VARCHAR 30 Alamat website sekolah

Tabel 3. 4 Tabel PTN/PTS

1. no_id SMALLINT 5 * Nomor Urut PTN/PTS

2. kode_pt INTEGER 11 Kode PTN/PTS

3. nama_pt VARCHAR 150 Nama PTN/PTS

4. alamat_pt VARCHAR 200 Alamat PTN/PTS

5. no_telp INTEGER 15 No. Telpon PTN/PTS

6. fax INTEGER 15 Nomor faximile PTN/PTS

7. email VARCHAR 40 Alamat email PTN/PTS

8. website VARCHAR 40 Alamat Website PTN/PTS

Tabel 3. 5 Tabel Pesan

1. no_id SMALLINT 5 * Nomor id Pesan/ komentar

2. nama VARCHAR 50 Nama Pengirim Pesan

3. email VARCHAR 40 Email Pengirim Pesan

4. pesan VARCHAR 250 Isi Pesan

(26)

3.3 Analisis Kebutuhan Fungsional

Analisis kebutuhan fungsional akan dimulai setelah tahap analisis terhadap

sistem selesai dilakukan, analisis kebutuhan fungsional dapat didefinsikan sebagai

penggambaran, perencanaan dan pembuatan sketsa atau pengaturan dari beberapa

elemen yang terpisah ke dalam satu kesatuan yang utuh dan berfungsi. Tahapan

ini menyangkut mengkonfigurasi dari komponen-komponen perangkat lunak dan

perangkat keras dari suatu sistem sehingga setelah instalasi dari sistem akan

benar-benar memuaskan dari rancang bangun yang telah ditetapkan pada akhir

tahap analisis sistem. Alat bantu yang digunakan untuk menggambarkan sistem

secara umum yang akan dibangun yaitu diagram konteks dan data flow diagram. Untuk menjelaskan bagaimana suatu masukan diproses pada sistem maka

digunakan spesifikasi proses dan kamus data untuk mengetahui aliran data yang

mengalir pada sistem.

3.3.1 Diagram Konteks

Diagram konteks atau disebut juga dengan model sistem pundamental

merepresentasikan seluruh elemen sistem sebagai sebuah bubble tunggal dengan

data input output yang ditunjukan oleh anak panah yang masuk dan keluar secara

(27)

VISITOR

Aplikasi Potensi Pendidikan Kota

Bandung

ADMIN Data Pesan Visitor

Info SMP, SMA, SMK, Universitas

Data Pesan Admin Data SMP Data SMA Data SMK Data Universitas

Data Login Data cari

Info Pesan Admin Info SMP Info SMA Info SMK Info Universitas

Info Login Info cari

Gambar 3. 4 Diagram Konteks Aplikasi Potensi Pendidikan Kota Bandung

3.3.2 Data Flow Diagram (DFD)

Data Flow Diagram digunakan untuk menggambarkan sistem secara lebih detail yang ada pada diagram konteks menjadi beberapa proses yang terjadi antara

entitas yang terlibat dalam Aplikasi Potensi Pendidikan Kota Bandung.

Dari diagram konteks di atas, aliran data yang ada pada sistem

(28)

3.3.2.1DFD Level 1 1.0 Login 3.0 Pengolahan Data SMA 2.0 Pengolahan Data SMP 7.0 Pengolahan Data Pesan 6.0 Penyajian Informasi 5.0 Pengolahan Data Universitas 4.0 Pengolahan Data SMK Admin Visitor T_Admin T_SMA T_SMP T_SMK T_Universitas T_Pesan Data Login Info Login

Login Valid Login Valid

Login Valid Login Valid Data SMP

Data SMA

Data SMK

Data SMP yang sudah diolah Info SMP Info SMA Info Universitas Info SMK Request Informasi

Data SMA yang Sudah diolah Verifiksai Login Valid

Data Universitas Data SMK yang

sudah diolah

Info SMP, SMA, SMK, Universitas

Data Pesan Visitor Info Data PesanVisitor

In fo S MP Info Universitas D a ta u ni ve rs itas Y a ng su da h di o la h Info SMA

Data Pesan Admin Info Pesan Admin

Info SMK

Data Login Valid

(29)

3.3.2.2DFD Level 2 untuk Proses 1.0

ADMIN 1.1 Input Data

Login

1.2 Cek Data Login Data Login Admin

Data Login Yang Sudah Diisi

Data Login Valid

Verifikasi Login T_Admin

Info pesan admin

Gambar 3. 6 DFD Level 2 Proses Login

3.3.2.3DFD Level 2 untuk Proses 2.0

ADMIN

2.1 Tambah Data SMK

2.3 Edit Data SMP

2.4 Hapus Data SMP Info Data Sudah Terhapus

Data Hapus

T_SMK Data SMK baru

Info SMK baru

Info Hapus Data Yang Sudah Diedit

Info Edit

Info Data Yang Sudah Dihapus 2.2 Cari Data

Data Tambah SMK

Data Edit SMK Info SMK

Info SMK

Data Hapus SMK

Info SMK Data Cari

Info Cari

(30)

3.3.2.4DFD Level 2 untuk Proses 3.0

ADMIN

3.1 Tambah Data SMA

3.3 Edit Data SMA

3.4 Hapus Data SMA Info Data Sudah Terhapus

Data Hapus

T_SMA Data SMA baru

Info SMA baru

Info Edit

Data Tambah SMA

[image:30.595.126.498.144.386.2]

Data Edit SMA Info SMA Info SMA Data Hapus SMA Info SMA Data Cari Info Cari

Gambar 3. 8 DFD Level 2 Proses Pengolahan Data SMA

3.3.2.5DFD Level 2 untuk Proses 4.0

ADMIN

4.1 Tambah Data SMK

4.3 Edit Data SMK

4.4 Hapus Data SMK Info Data Sudah Terhapus

Data Hapus

T_SMK Data SMK baru

Info SMK baru

Info Edit

Data Tambah SMK

Data Edit SMK Info SMK Info SMK Data Hapus SMK Info SMK Data Cari Info Cari

[image:30.595.128.498.447.691.2]

(31)

3.3.2.6DFD Level 2 untuk Proses 5.0

ADMIN

5.1 Tambah Data Universitas

5.3 Edit Data Universitas

5.4 Hapus Data Universitas Info Data Sudah Terhapus

Data Hapus

T_Universitas Data Universitas baru

Info Universitas baru

Info Edit

Data Tambah Universitas

Data Edit SMK Info Universitas Info SMK Data Hapus Universitas Info Universitas Data Cari Info Cari

Gambar 3. 10 DFD Level 2 Proses Pengolahan Data Universitas

3.3.3 Spesifikasi Proses

Spesifikasi proses dari DFD di atas diuraikan pada tabel berikut:

Tabel 3. 6 Spesifikasi Proses

No. Proses Keterangan

1. No. Proses 1.0

Nama Proses Login Source (Entitas) Admin

Input Data Login

Output Info Login ( valid, invalid ) Logika Proses Begin

{Admin memasukan data login}

If data login valid then menuju database T_Admin Else info login invalid

End

2. No. Proses 2.0

Nama Proses Pengolahan Data SMP Source (Entitas) Admin

Input Data SMP

(32)

Logika Proses Begin

{Admin input data SMP}

If input data SMP lengkap then data disimpan di T_SMP

Else input data SMP gagal End

3. No. Proses 3.0

Nama Proses Pengolahan Data SMA Source (Entitas) Admin

Input Data SMA

Output Info SMA

Logika Proses Begin

{Admin input data SMA}

If input data SMA lengkap then data disimpan di T_SMA

Else input data gagal End

4. No.Proses 4.0

Nama Proses Pengolahan Data SMK Source (Entitas) Admin

Input Data SMK

Output Info SMK

Logika Proses Begin

{Admin input data SMK}

If input data SMK lengkap then data disimpan di T_SMK

5. No.Proses 5.0

Nama Proses Pengolahan Data Universitas Source (Entitas) Admin

Input Data Universitas

Output Info Universitas Logika Proses Begin

{Admin input data Universitas}

If input data Universitas lengkap then data disimpan di T_Universitas

6. No.Proses 6.0

Nama Proses Penyajian Informasi Source (Entitas) Visitor

Input Info SMP, info SMA, info SMK, info Universitas Output Info SMP, SMA, SMK, Universitas

(33)

{Visitor request informasi}

If visitor akses web then informasi disajikan Else akses gagal

End

7. No.Proses 7.0

Nama Proses Pengolahan Data Pesan Source (Entitas) Admin dan Visitor

Input Data pesan admin, data pesan visitor

Output Info data pesan admin, info data pesan visitor Logika Proses Begin

{Visitor dan admin masuk ke data pesan}

If visitor kirim komentar then data disimpan di T_Pesan

Else If visitor kirim komentar then admin balas komentar

Else komentar gagal End

8. No.Proses 1.1

Nama Proses Input Data Login Source (Entitas) Admin

Input Data login admin

Output Data login yang sudah diisi Logika Proses Begin

{Admin masuk proses login}

If admin input data login admin then cek data login Else input gagal

End

9. No.Proses 1.2

Nama Proses Cek Data Login Source (Entitas) Admin

Input Data login yang sudah diisi Output Login valid atau invalid Logika Proses Begin

{Admin memasukan data login}

If data login valid then masuk ke tabel T_Admin Else login gagal

End

10. No.Proses 2.1

Nama proses Tambah Data SMP Source (Entitas) Admin

Input Tambah data

Output Info data baru

Logika Proses Begin

{Admin menambah data SMP}

(34)

T_SMP

Else tambah data gagal End

11. No.Proses 2.2 Nama Proses Cari Data Source (Entitas) Admin

Input Cari data

Output Info cari

Logika Proses Begin

{Admin mencari data SMP}

If data cari ketemu then edit data and hapus data Else data tidak ada

End

12. No. Proses 2.3

Nama Proses Edit Data SMP Source (Entitas) Admin

Input Edit data

Output Info edit baru Logika Proses Begin

{Admin mengedit data SMP}

If data sudah diedit then disimpan ke tabel T_SMP Else edit data gagal

End

13. No.Proses 2.4

Nama Proses Hapus Data SMP Source (Entitas) Admin

Input Hapus data

Output Info hapus data

Logika Proses Begin

{Admin menghapus data SMP}

If data sudah diedit then disimpan ke table T_SMP Else hapus gagal

End 14. No.Proses 3.1

Nama Proses Tambah Data SMA Source (Entitas) Admin

Input Tambah data

Logika Proses Begin

{Admin menambah data SMA}

(35)

15. No.Proses 3.2

NamaProses Cari Data Source (Entitas) Admin

Input Cari data

Output Info cari

Logika Proses Begin

{Admin mencari data SMA}

End

16. No.Proses 3.3

NamaProses Edit Data SMA Source (Entitas) Admin

Input Edit data

{Admin mengedit data SMA}

If data sudah diedit then disimpan ke tabel T_SMA Else edit data gagal

End

17. No.Proses 3.4

Nama Proses Hapus Data SMA Source (Entitas) Admin

Input Hapus data

Logika Proses Begin

{Admin menghapus data SMA}

If data sudah diedit then disimpan ke table T_SMA Else hapus gagal

End

18. No.Proses 4.1

Nama Proses Tambah Data SMK Source (Entitas) Admin

Input Tambah data

Logika Proses Begin

{Admin menambah data SMK}

If data sudah ditambahkan then disimpan ke table T_SMK

19. No.Proses 4.2

(36)

Source (Entitas) Admin

Input Cari data

Output Info cari

Logika Proses Begin

End

20. No.Proses 4.3

Nama Proses Edit Data SMK Source (Entitas) Admin

Input Edit data

Logika Proses Info edit baru Begin

{Admin mengedit data SMK}

If data sudah diedit then disimpan ke tabel T_SMK Else edit data gagal

End

21. No.Proses 4.4

Nama Proses Hapus Data SMK Source (Entitas) Admin

Input Hapus data

Logika Proses Begin

{Admin menghapus data SMK}

If data sudah diedit then disimpan ke table T_SMK Else hapus gagal

End

22. No.Proses 5.1

Nama Proses Tambah Data Universitas Source (Entitas) Admin

Input Tambah data

Logika Proses Begin

{Admin menambah data Universitas}

If data sudah ditambahkan then disimpan ke table T_Universitas

23. No.Proses 5.2

Nama Proses Cari Data Source (Entitas) Admin

Input Cari data

Output Info cari

(37)

End

24. No.Proses 5.3

Nama Proses Edit Data Universitas Source (Entitas) Admin

Input Edit data

{Admin mengedit data Universitas }

If data sudah diedit then disimpan ke tabel T_ Universitas

Else edit data gagal End

25. No.Proses 5.4

Nama Proses Hapus Data Universitas Source (Entitas) Admin

Input Hapus data

Logika Proses Begin

{Admin menghapus data Universitas }

If data sudah diedit then disimpan ke table T_ Universitas

Else hapus gagal End

3.4 Struktur Menu

Struktur menu dirancang sesuai dengan level pengguna yang

menggunakan sistem. Terdapat dua pengguna aplikasi ini yaitu Admin dan

(38)

3.4.1 Struktur Menu Admin Pengolahan Data Pengolahan Data SMP Pengolahan Data SMA Pengolahan Data SMK Pengolahan Data PTN/ PTS

View Data View Data

View Data View Data Input Data Edit Data Hapus Data Input Data Edit Data Hapus Data Input Data Edit Data Hapus Data Input Data Edit Data Hapus Data Login Admin

Gambar 3. 11 Struktur Menu Admin

3.4.2 Struktur Menu Visitor

Aplikasi Main Menu Dinas Pendidikan Pemerintah

Daerah Guest Book

Bakominfo Kontak _Kami About _PendidikanPotensi

Profile Visi Misi Fungsi Tugas Pokok Program Kerja SMP SMA SMK PTN/ PTS User

(39)

3.5 Perancangan Antar muka Aplikasi Potensi Pendidikan

3.5.1 Perancangan Antarmuka Admin

a. Perancangan Antarmuka Proses Login Admin

T01

IMAGE HEADER

IMAGE FOOTER Login Admin

Login User ID

Password

Nama Form : T01 Ukuran Form : Full Screen

Font, Verdana, Tahoma, Vertica, Arial, Sans-Serif Warna : Biru Muda, Orange, Kuning

- Klik Tombol Login, menuju T02

Gambar 3. 13 Proses Login Admin b. Perancangan Antarmuka Pengolahan Data

T02

IMAGE HEADER

IMAGE FOOTER Berita

Kutipan

Info User Pengolahan Input/View Data Admin

Logout

Pengolaha data SMP Pengolaha data SMA

Pengolaha data PTN/PTS Pengolaha data SMK

View Data View Data

Cari

- Klik Tombol View Data SMP, menuju T021A - Klik Tombol View Data SMA, menuju T022A - Klik Tombol View Data SMK, menuju T023A - Klik Tombol View Data Universitas, menuju T024A - Klik Tombol Logout, menuju T01

Nama Form : T02 Ukuran Form : Full Screen

Font, Verdana, Tahoma, Vertica, Arial, Sans-Seri Warna : Biru Muda, Orange, Kuningf

(40)

c. Perancangan Antarmuka View Data SMP T021A IMAGE HEADER IMAGE FOOTER Berita Kutipan Info User

- KlikTombol Logout menuju T01

- Klik Tombol Menu Admin menuju T02

- Klik Tombol Tambah Data menuju T021A1

- Klik Edit menuju T021A2 - Klik Hapus menuju M01

Nama Form : T021A Ukuran Form : Full Screen

Logout Sekolah Menengah Pertama

Jumlah data ditemukan “…” data sekolah

___________________ ___________________ ___________________

Edit Hapus

Menu Admin Tambah Data

Gambar 3. 15 Perancangan Antarmuka View Data SMP d. Perancangan Antarmuka View Data SMA

T022A IMAGE HEADER IMAGE FOOTER Berita Kutipan Info User

Logout Sekolah Menengah Atas

___________________ ___________________ ___________________

Edit Hapus

(41)

e. Perancangan Antarmuka View Data SMK T023A IMAGE HEADER IMAGE FOOTER Berita Kutipan Info User

Logout Sekolah Menengah Kejuruan

___________________

Edit Hapus

Gambar 3. 17 Perancangan Antarmuka View Data SMK f. Perancangan Antarmuka View Data Universitas

T024A IMAGE HEADER IMAGE FOOTER Berita Kutipan Info User

Logout Perguruan Tinggi Negeri/ Swasta

___________________ ___________________ ___________________

Edit Hapus

(42)

g. Perancangan Antarmuka Tambah Data SMP T021A1 IMAGE HEADER IMAGE FOOTER Berita Kutipan Info User

- Klik Modifikasi, akan tetap di T021A1

- Klik Tombol Simpan, menuju ke T021A - Klik Tombol Logout, menuju T01

Nama Form : T021A1 Ukuran Form : Full Screen

INPUT DATA

Sekolah Menengah Pertama (SMP)

Logout Modifikasi _________ _________ _________ _________ _________ Simpan

Gambar 3. 19 Perancangan Antarmuka Tambah Data SMP h. Perancangan Antarmuka Tambah Data SMA

T022A1 IMAGE HEADER IMAGE FOOTER Berita Kutipan Info User

INPUT DATA Sekolah Menengah Atas (SMA)

(43)

i. Perancangan Antarmuka Tambah Data SMK T023A1 IMAGE HEADER IMAGE FOOTER Berita Kutipan Info User

INPUT DATA

Sekolah Menengah Kejuruan (SMK)

Gambar 3. 21 Perancangan Antarmuka Tambah Data SMK j. Perancangan Antarmuka Tambah Data Universitas

INPUT DATA Perguruan Tinggi Negeri / Swasta

(44)

k. Perancangan Antarmuka Edit Data SMP T021A2 IMAGE HEADER IMAGE FOOTER Berita Kutipan Info User

- Klik Tombol Edit tetap di T021A2

- Klik Tombol Logout, menuju T01

EDIT DATA

Sekolah Menengah Pertama (SMP)

[image:44.595.116.507.426.715.2]

Logout _________ _________ _________ _________ _________ Edit

Gambar 3. 23 Perancangan Antarmuka Edit Data SMP l. Perancangan Antarmuka Edit Data SMA

EDIT DATA Sekolah Menengah Atas (SMA)

Logout _________ _________ _________ _________ _________ Edit

(45)

m. Perancangan Antarmuka Edit Data SMK T023A2 IMAGE HEADER IMAGE FOOTER Berita Kutipan Info User

EDIT DATA

Sekolah Menengah Kejuruan (SMK)

Logout _________ _________ _________ _________ _________ Edit

Gambar 3. 25 Perancangan Antarmuka Edit Data SMK n. Perancangan Antarmuka Edit Data Universitas

EDIT DATA

Perguruan Tinggi Negeri / Swasta

Logout _________ _________ _________ _________ _________ Edit

(46)

3.5.2 Perancangan Antarmuka Visitor

a. Perancangan Antarmuka Menu Home

T01H

IMAGE HEADER

Nama Form : T01H Ukuran Form : Full Screen

Font : Verdana, Tahoma, Helvetica, Arial, Sans-Serif Warna : Biru Muda, Orange, Kuning

- Klik Home, akan tampil T01H - Klik Dinas Pendidikan menuju T01V - Klik Pemerintah Dinas, menuju T02H - Klik Guestbook, menuju T03H - Klik Bakominfo Access, menuju ke website Bakominfo

- Klik Kontak Kami, menuju ke T05H

IMAGE FOOTER

Dinas Pendidikan Pemerintah Dinas Guestbook Home Main Menu Bakominfo Access Kontak Kami Selamat Datang dd/mm/yyy _________________ _________________ _________________ _________________ _________________ Berita _______________ Kutipan Info User _______________ _______________

Gambar 3. 27 Perancangan Antarmuka Menu Home b. Perancangan Menu Pemerintah Dinas

T02H

IMAGE HEADER

- Klik Home, menuju T01H - Klik Dinas Pendidikan menuju T01V - Klik Pemerintah Dinas, akan tampil T02H

- Klik Guestbook, menuju T03H

IMAGE FOOTER

Dinas Pendidikan Pemerintah Dinas Guestbook Home

Pemerintah Dinas Kota Bandung

_________________ _________________ _________________ _________________ _________________ _________________ _________________ _________________ _________________ _________________ Berita _______________ Kutipan Info User _______________ _______________

(47)

c. Perancangan Antarmuka Menu Guest Book

T03H

IMAGE HEADER

- Klik Home, menuju T01H - Klik Dinas Pendidikan menuju T01V - Klik Pemerintah Dinas, menuju T02H - Klik Guestbook, akan tampil T03H - Klik Tombol Tulis Baru akan menuju T04H

- Klik Profil, menuju T01V - Klik Visi dan Misi menuju T02V - Klik Fungsi, menuju T03V - Klik Tugas Pokok, menuju T04V - Klik Program Kerja, menuju T05V - Klik SMP, menujul T06V - Klik SMA, menuju T07V - Klik SMK, menuju T08V - Klik PTN/PTS, menuju T09V

IMAGE FOOTER

Dinas Pendidikan Profil

Visi dan Misi Fungsi Ttugas Pokok Program Kerja Potensi Pendidikan SMP SMA SMK PTN/PTS

Daftar Buku Tamu

_________________ _________________ _________________ _________________ _________________ Berita _______________ Kutipan Info User _______________ _______________ Tulis Baru

Gambar 3. 29 Perancangan Antarmuka Menu Guest Book d. Perancangan Antarmuka Tulis Pesan Baru

T04H

IMAGE HEADER

- Klik Home, menuju T01H - Klik Dinas Pendidikan menuju T01V - Klik Pemerintah Dinas, menuju T02H - Klik Guestbook, akan tampil T03H - Klik Profil, menuju T01V - Klik Visi dan Misi menuju T02V - Klik Fungsi, menuju T03V - Klik Tugas Pokok, menuju T04V - Klik Program Kerja, menuju T05V - Klik SMP, menujul T06V - Klik SMA, menuju T07V - Klik SMK, menuju T08V - Klik PTN/PTS, menuju T09V

IMAGE FOOTER

Dinas Pendidikan Pemerintah Dinas Guestbook Home Nama Berita _______________ Kutipan Info User _______________ _______________ Tulis Baru Pesan Email

(48)

e. Perancangan Antarmuka Menu Kontak Kami

T05H

IMAGE HEADER

- Klik Home, akan tampil T01H - Klik Dinas Pendidikan menuju T01V - Klik Pemerintah Dinas, menuju T02H - Klik Guestbook, menuju T03H - Klik Bakominfo Access, menuju ke website Bakominfo

- Klik Kontak Kami, akan tampil T05H

IMAGE FOOTER

Dinas Pendidikan Pemerintah Dinas Guestbook Home Main Menu Bakominfo Access Kontak Kami Kontak _________________ _________________ _________________ _________________ _________________ Berita _______________ Kutipan Info User _______________ _______________

Gambar 3. 31 Perancangan Antarmuka Menu Kontak Kami f. Perancangan Antarmuka Menu Profil

T01V

IMAGE HEADER

Nama Form : T01V Ukuran Form : Full Screen

- Klik Home, menuju T01H - Klik Dinas Pendidikan menuju T01V - Klik Pemerintah Dinas, menuju T02H - Klik Guestbook, menuju T03H

- Klik Profil akan tampil T01V (Default) - Klik Visi dan Misi menuju T02V - Klik Fungsi, menuju T03V - Klik Tugas Pokok, menuju T04V - Klik Program Kerja, menuju T05V - Klik SMP, menuju T06V - Klik SMA, menuju T07V - Klik SMK, menuju T08V - Klik PTN/PTS, menuju T09V

IMAGE FOOTER

Dinas Pendidikan

Profil Visi dan Misi Fungsi Ttugas Pokok Program Kerja Potensi Pendidikan SMP SMA SMK PTN/PTS Profil _________________ _________________ _________________ _________________ _________________ Berita _______________ Kutipan Info User _______________ _______________

(49)

g. Perancangan Antarmuka Menu Visi dan Misi

T02V

IMAGE HEADER

- Klik Home, menuju T01H - Klik Dinas Pendidikan menuju T01V - Klik Pemerintah Dinas, menuju T02H - Klik Guestbook, menuju T03H - Klik Profil, menuju T01V

- Klik Visi dan Misi akan tampil T02V - Klik Fungsi, menuju T03V - Klik Tugas Pokok, menuju T04V - Klik Program Kerja, menuju T05V - Klik SMP, menuju T06V - Klik SMA, menuju T07V - Klik SMK, menuju T08V - Klik PTN/PTS, menuju T09V

IMAGE FOOTER

Visi dan Misi

_________________ _________________ _________________ _________________ _________________ Berita _______________ Kutipan Info User _______________ _______________

Gambar 3. 33 Perancangan Antarmuka Menu Visi dan Misi h. Perancangan Antarmuka Menu Fungsi

T03V

IMAGE HEADER

- Klik Profil, menuju T01V - Klik Visi dan Misi menuju T02V - Klik Fungsi, akan tampil T03V - Klik Tugas Pokok, menuju T04V - Klik Program Kerja, menuju T05V - Klik SMP, menuju T06V - Klik SMA, menuju T07V - Klik SMK, menuju T08V - Klik PTN/PTS, menuju T09V

IMAGE FOOTER

[image:49.595.116.509.417.724.2]

Visi dan Misi Fungsi Ttugas Pokok Program Kerja Potensi Pendidikan SMP SMA SMK PTN/PTS Fungsi _________________ _________________ _________________ _________________ _________________ Berita _______________ Kutipan Info User _______________ _______________

(50)

i. Perancangan Antarmuka Menu Tugas Pokok

T04V

IMAGE HEADER

- Klik Home, menuju T01H - Klik Dinas Pendidikan menuju T01V - Klik Pemerintah Dinas, menuju T02H - Klik Guestbook, menuju T03H - Klik Profil, menuju T01V - Klik Visi dan Misi menuju T02V - Klik Fungsi, menuju T03V - Klik Tugas Pokok, akan tampil T04V - Klik Program Kerja, menuju T05V - Klik SMP, menuju T06V - Klik SMA, menuju T07V - Klik SMK, menuju T08V - Klik PTN/PTS, menuju T09V

IMAGE FOOTER

[image:50.595.113.509.112.413.2]

Visi dan Misi Fungsi Ttugas Pokok Program Kerja Potensi Pendidikan SMP SMA SMK PTN/PTS Tugas Pokok _________________ _________________ _________________ _________________ _________________ Berita _______________ Kutipan Info User _______________ _______________

Gambar 3. 35 Perancangan Antarmuka Menu Tugas Pokok j. Perancangan Antarmuka Menu program Kerja

T05V

IMAGE HEADER

- Klik Profil, menuju T01V - Klik Visi dan Misi menuju T02V - Klik Fungsi, menuju T03V - Klik Tugas Pokok, menuju T04V - Klik Program Kerja,akan tampil T05V - Klik SMP, menuju T06V

- Klik SMA, menuju T07V - Klik SMK, menuju T08V - Klik PTN/PTS, menuju T09V

IMAGE FOOTER

[image:50.595.114.510.420.713.2]

Profil Visi dan Misi Fungsi Ttugas Pokok Program Kerja Potensi Pendidikan SMP SMA SMK PTN/PTS Program Kerja _________________ _________________ _________________ _________________ _________________ Berita _______________ Kutipan Info User _______________ _______________

(51)

k. Perancangan Antarmuka Menu SMP

T06V

IMAGE HEADER

- Klik Home, menuju T01H - Klik Dinas Pendidikan menuju T01V - Klik Pemerintah Dinas, menuju T02H - Klik Guestbook, menuju T03H - Klik Profil, menuju T01V - Klik Visi dan Misi menuju T02V - Klik Fungsi, menuju T03V - Klik Tugas Pokok, menuju T04V - Klik Program Kerja, menuju T05V - Klik SMP, akan tampil T06V - Klik SMA, menuju T07V - Klik SMK, menuju T08V - Klik PTN/PTS, menuju T09V

IMAGE FOOTER

Potensi Kota Bandung Di Bidang Pendidikan Sekolah Menengah Pertama (SMP)

[image:51.595.113.511.112.408.2]

Gambar 3. 37 Perancangan Antarmuka Menu SMP

l. Perancangan Antarmuka Menu SMA

T07V

IMAGE HEADER

- Klik Profil, menuju T01V - Klik Visi dan Misi menuju T02V - Klik Fungsi, menuju T03V - Klik Tugas Pokok, menuju T04V - Klik Program Kerja, menuju T05V - Klik SMP, menuju T06V - Klik SMA, akan tampil T07V - Klik SMK, menuju T08V - Klik PTN/PTS, menuju T09V

IMAGE FOOTER

Potensi Kota Bandung Di Bidang Pendidikan Sekolah Menengah Atas (SMA)

[image:51.595.113.511.436.727.2]

(52)

m. Perancangan Antarmuka Menu SMK

T08V

IMAGE HEADER

- Klik Home, menuju T01H - Klik Dinas Pendidikan menuju T01V - Klik Pemerintah Dinas, menuju T02H - Klik Guestbook, menuju T03H - Klik Profil, menuju T01V - Klik Visi dan Misi menuju T02V - Klik Fungsi, menuju T03V - Klik Tugas Pokok, menuju T04V - Klik Program Kerja, menuju T05V - Klik SMP, menujul T06V - Klik SMA, menuju T07V - Klik SMK, akan tampil T08V - Klik PTN/PTS, menuju T09V

IMAGE FOOTER

Potensi Kota Bandung Di Bidang Pendidikan Sekolah Menengah Kejuruan (SMK)

[image:52.595.113.511.114.413.2]

Gambar 3. 39 Perancangan Antarmuka Menu SMK

n. Perancangan Antarmuka Menu PTN/PTS

T09V

IMAGE HEADER

- Klik Profil, menuju T01V - Klik Visi dan Misi menuju T02V - Klik Fungsi, menuju T03V - Klik Tugas Pokok, menuju T04V - Klik Program Kerja, menuju T05V - Klik SMP, menuju T06V - Klik SMA, menuju T07V - Klik SMK, menuju T08V - Klik PTN/PTS, akan tampil T09V

IMAGE FOOTER

Profil Visi dan Misi Fungsi Ttugas Pokok Program Kerja Potensi Pendidikan SMP SMA SMK PTN/PTS

Potensi Kota Bandung Di Bidang Pendidikan Perguruan Tinggi Negeri / Swasta

[image:52.595.113.511.440.709.2]

(53)

3.6 Perancangan Antar Muka Pesan

a. Perancangan Antarmuka Pesan Hapus

M01

Data dengan kode “---“ akan dihapus

OK Batal

Gambar 3. 41 Perancangan Antarmuka Pesan Hapus

b. Perancangan Antarmuka Pesan Kesalahan Pengisian Data

M02

Input Data Form Input

Ada Kesalahan Dalam Pengisian Data, Silahkan Ulangi Lagi !

Gambar 3. 42 Perancangan Antarmuka Pesan Kesalahan Pengisian Data

c. Perancangan Antarmuka Pesan Tanpa Perubahan

M03

Pengolahan Form Edit

Tidak Ada Perubahan << View Data >>

Gambar 3. 43 Perancangan Antarmuka Pesan Tanpa Perubahan

d. Perancangan Antarmuka Pesan Simpan Perubahan Data

M04

Pengolahan Form Edit

Perubahan Data Telah Disimpan ! << View Data >>

(54)

3.7 Jaringan Semantik

3.7.1 Jaringan Semantik Admin

T01 T02 T021A T022 A T024A login Kemb ali logout K e m b a li P e n g o la h a n D a ta S M P Peng olaha n Data SMA T02_3A Kemb ali Pen gola han Data_SM

K K e m b a li P e n g o la h a n D a ta P T N /P T S T022A2 T022A1

Edit Data SMA kemb

ali

T02 3A2

T023A1

Edit_Da ta S_MK

kemb ali Tamb

ah D ata SMK kem bali T021A2 T021A1 kemb ali Ta mb ah Da ta SMP kemb ali T024A2 T02 4A1 kem bal_i k e m b a li EDIT Data SMP Tamb ah Data SMP

Tam bah_Da

[image:54.595.116.496.187.674.2]

ta PTN /PT_S E d it D a ta P T N / P T S M 02 M03 M 02 M01 M 0 2 M03 M01 M03 M01 M02 M02 M 0 4 M03 M 04 M0₁ M 02 M 04 M 02 M04 M 02

(55)

3.7.2 Jaringan Semantik Visitor T01H T02H T03H T04H T05H T09V T08V T07V T06V T05V T04V T03V T02V T01V pilih

[image:55.595.126.503.149.535.2]

pilihpilih pilih pilih pilih pilih pilih pilih pilih pilih kembali kembali kembali kembali kembali kembali kembali kembali kembali kembali kembali pilih pilih kembali pilih kembali pilih kembali pilih kembali pilih kembali pilih kembali pilih kembali pilih kembali pilih pilih kembali pilih kembali pilih kembali pilih kembali pilih kembali pilih kembali pilih kembali pilih kembali pilih kembali pilih kembali pilih kembali kembali pilih pilih pilih kembali pilih kembali Pilih kembali pilih kembali kembali pilih pilih kembali kembali pilih kembali pilih

(56)

3.8 Implementasi

Pada tahap ini, hasil dari tahap perancangan diterjemahkan ke dalam

bahasa pemrograman. Wujud dari hasil tahap implementasi ini nantinya adalah

sebuah sistem yang siap untuk diuji.

3.8.1 Halaman Tampilan Admin

3.8.1.1Halaman Login Admin

Pada halaman ini, admin mempunyai hak akses untuk melakukan

pengolahan database. Meliputi penambahan, pengeditan, dan penghapusan data

SMP, SMA, SMK, maupun PTN/PTS. Tetapi sebelumnya admin harus melakukan

[image:56.595.138.484.420.641.2]

proses login terlebih dahulu dengan memasukan username dan password.

(57)

Jika admin salah memasukan username dan password, maka akan kembali

ke tampilan login seperti diatas lagi.

3.8.1.2Halaman Menu Admin

Pada halaman ini, admin dapat melakukan pengolahan data SMP, SMA,

SMK, maupun PTN/PTS. Adimn juga dapat melihat isi database profil SMP,

[image:57.595.136.489.297.527.2]

SMA,SMK, maupun PTN/PTS dengan cara mengklik tombol View Data.

Gambar 3. 48 Halaman Menu Admin

3.8.1.3Halaman View Data SMP

Pada halaman ini, admin dapat memodifikasi data SMP. Sebelumnya

admin dapat melihat data-data SMP yang telah ada dalam database sebelumnya.

Kemudian admin dapat melakukan proses operasi seperti edit, tambah, dan hapus

(58)

[image:58.595.134.491.112.328.2]

Gambar 3. 49 Halaman View Data SMP

3.8.1.4Halaman Form Input Data SMP

Pada halaman ini, admin menginputkan data SMP. Telah disediakan

caption untuk mengisi data. Ada tombol logout untuk admin jika ingin keluar dari

aplikasi dan tombol ,menu admin untuk mengolah database yang lain.

[image:58.595.115.479.495.726.2]

(59)

3.8.1.5Pesan Kesalahan Pengisian Data SMP

Akan muncul pesan seperti di bawah ini jika ada kesalahan pengisian data

[image:59.595.126.499.464.699.2]

SMP.

Gambar 3. 51 Pesan Kesalahan Pengisian Data SMP

3.8.1.6Halaman Form Edit Data SMP

Admin bisa melakukan pengeditan data SMP yang telah tersimpan di

database.

(60)

3.8.1.7Pesan Jika Tidak Melakukan Perubahan Edit SMP

Akan mucul pesan seperti di bawah ini jika setelah mengklik tombol

edit, tidak melakukan perubahan data apapun.

Gambar 3. 53 Pesan Jika Tidak Melakukan Perubahan Edit SMP

3.8.1.8Pesan Perubahan Data Yang Telah Disimpan

Akan muncul pemberitahuan data telah disimpan setelah melakukan

pengeditan data. Untuk melihat data, klik view data.

Gambar 3. 54 Pesan Perubahan Data Yang Telah Disimpan

3.8.1.9 Pesan Hapus SMP

Jika admin akan menghapus data SMP, maka akan muncul message alert

seperti di bawah ini. Jika yakin akan menghapus, klik OK dan jika tidak, klik

(61)

[image:61.595.126.498.338.576.2]

Gambar 3. 55 Pesan Hapus SMP

3.8.1.10 Halaman Jika Akan Menghapus Data SMP

Akan muncul tampilan peringatan seperti ini jika admin akan melakukan

hapus data SMP seperti di bawah ini.

Gambar 3. 56 Halaman Jika Akan Menghapus Data SMP

3.8.1.11 Halaman View Data SMA

Pada halaman ini, admin dapat memodifikasi data SMA. Sebelumnya

admin dapat melihat data-data SMA yang telah ada dalam database sebelumnya.

(62)

[image:62.595.141.483.129.363.2]

Gambar 3. 57 Halaman View Data SMA

3.8.1.12 Halaman Form Input Data SMA

Pada halaman ini, admin menginputkan data SMA. Telah disediakan

(63)

3.8.1.13 Pesan Kesalahan Pengisian Data SMA

[image:63.595.140.485.439.695.2]

SMA.

Gambar 3. 58 Pesan Kesalahan Pengisian Data SMA

3.8.1.14 Halaman Form Edit Data SMA

Admin bisa melakukan pengeditan data SMA yang telah tersimpan di

(64)

3.8.1.15 Pesan JikaTidak Melakukan Perubahan Edit SMA

Akan mucul pesan seperti di bawah ini jika setelah mengklik tombol

edit, tidak melakukan perubahan data apapun.

Gambar 3. 59 Pesan Jika Tidak Melakukan Perubahan Edit SMA

3.8.1.16 Pesan Perubahan Data Yang Telah Disimpan

Akan muncul pemberitahuan data telah disimpan setelah melakukan

pengeditan data. Untuk melihat data, klik view data.

Gambar 3. 60 Pesan Perubahan Data Yang Telah Disimpan

3.8.1.17 Pesan Konfirmasi Hapus SMA

Jika admin akan menghapus data SMA, maka akan muncul message alert

seperti di bawah ini. Jika yakin akan menghapus, klik OK dan jika tidak, klik

(65)

[image:65.595.134.490.334.550.2]

Gambar 3. 61Pesan Konfirmasi Hapus SMA

3.8.1.18 Halaman Jika Akan Menghapus Data SMA

Akan muncul tampilan peringatan seperti ini jika admin akan melakukan

hapus data SMP seperti di bawah ini.

Gambar 3. 62 Halaman Jika Akan Menghapus Data

3.8.1.19 Halaman View Data SMK

Pada halaman ini, admin dapat memodifikasi data SMK. Sebelumnya

admin dapat melihat data-data SMK yang telah ada dalam database sebelumnya.

(66)

[image:66.595.148.500.111.351.2]

Gambar 3. 63 Halaman View Data SMK

3.8.1.20 Halaman Form Input Data SMK

Pada halaman ini, admin menginputkan data SMK. Telah disediakan

(67)

3.8.1.21 Pesan Kesalahan Pengisian Data SMK

[image:67.595.140.481.454.707.2]

SMK.

Gambar 3. 64 Pesan Kesalahan Pengisian Data SMK

3.8.1.22 Halaman Form Edit Data SMK

Admin bisa melakukan pengeditan data SMK yang telah tersimpan di