Pembangunan website Profil BPPPAKB Kabupaten Bandung Barat

(1)

PEMBANGUNAN

WEBSITE

PROFIL

BPPPAKB KABUPATEN BANDUNG BARAT

KERJA PRAKTEK

Diajukan untuk Memenuhi

Tugas Mata Kuliah Kerja Praktek

Program S1 Jurusan Teknik Informatika

Fakultas Teknik dan Ilmu Komputer

Universitas Komputer Indonesia

Disusun Oleh :

MOCHAMAD VAMA YUSMAN 10109110

RESA NUR URFAN

10109111

JURUSAN TEKNIK INFORMATIKA

FAKULTAS TEKNIK DAN ILMU KOMPUTER

(2)

(3)

(4)

RIWAYAT HIDUP

Data Pribadi

Nama : Moch. Vama Yuman

TTL : Bandung, 29 Juni 1989

Umur : 24 Tahun

Jenis Kelamin : Laki - laki

Alamat : Komplek Permata Biru Blok AB-126 RT 07/RW 23

No. Tlp : 085721809910

Pendidikan Formal

1995–2000 SD Negeri 1 Batujajar

2000–2001 Lulus SD Negeri Cibiru 5

2001–2004 Lulus SMP Negeri 8 Bandung

2004–2007 Lulus SMA Negeri 24 Bandung

2007–2009 STT Telkom

2009–2013 UNIKOM

Demikian Riwayat Hidup ini saya buat dengan sebenar-benarnya.

Bandung, Januari 2013

Hormat Saya,

(5)

RIWAYAT HIDUP

Data Pribadi

Nama : Resa Nur Urfan

TTL : Bandung, 15 Maret 1991

Umur : 21 Tahun

Jenis Kelamin : Laki - laki

Alamat : Jl. Barulaksana No. 83 02/14 Ds Jayagiri Lembang

No. Tlp : (022) 2785350 / 087823930924

Pendidikan Formal

1997–2003 Lulus SDN Lembang V

2003–2006 Lulus SMP Negeri 1 Lembang

2006–2009 Lulus SMA Pasundan 2 Bandung

2009–2013 UNIKOM

Demikian Riwayat Hidup ini saya buat dengan sebenar-benarnya.

Hormat Saya,

(6)

DAFTAR ISI

LEMBAR JUDUL

LEMBAR PENGESAHAN

KATA PENGANTAR ... ii

DAFTAR ISI ... iv

DAFTAR TABEL ... viii

DAFTAR GAMBAR ... ix

DAFTAR SIMBOL ... xii

DAFTAR LAMPIRAN ... xiii

BAB 1 PENDAHULUAN ... 1

1.1 Latar Belakang Masalah ... 1

1.2 Perumusan Masalah ... 1

1.3 Maksud dan Tujuan ... 2

1.4 Batasan Masalah ... 2

1.5 Metode Penelitian ... 2

1.6 Sistematika Penulisan ... 4

BAB 2 TINJAUAN PUSTAKA ... 6

(7)

2.1.1 Sejarah Instansi Berdiri ... 6

2.2 Visi dan Misi Instansi ... 9

2.2.1 Visi ... 9

2.2.2 Misi ... 9

2.3 Logo Instansi ... 9

2.4 Struktur Organisasi dan Job Description ... 10

2.5 Landasan Teori ... 13

2.5.1 Waterfall Model ... 13

2.5.2 Internet ... 14

2.5.3 Web Server ... 14

2.5.4 Web Browser ... 14

2.5.5 Website ... 14

2.5.6 HTML ... 15

2.5.7 Cascading Style Sheet (CSS) ... 15

2.5.8 PHP ... 16

2.5.9 Pemrograman Database ... 17

2.6 Perangkat Lunak Pendukung ... 17

2.6.1 Adobe Dreamweaver CS6 ... 18

2.6.2 MySQL ... 19

(8)

BAB 3 PEMBAHASAN ... 23

3.1 Jadwal Kerja Praktek ... 23

3.2 Cara / Teknik Kerja Praktek ... 23

3.3 Analisis Masalah ... 25

3.3.1 Analisis Prosedur yang Sedang Berjalan ... 25

3.3.1.1 Prosedur Penyampaian Kegiatan dan Program ... 26

3.3.2 Analisis Kebutuhan Non Fungsional ... 28

3.3.2.1 Analisis Kebutuhan Perangkat Keras ... 28

3.3.2.2 Analisis Kebutuhan Perangkat Lunak ... 28

3.3.2.3 Analisis Kebutuhan Pengguna ... 29

3.3.3 Analisis Jaringan ... 30

3.3.4 Analisis Basis Data ... 30

3.3.5 Analisis Kebutuhan Fungsional ... 31

3.3.5.1 Diagram Konteks ... 32

3.3.5.2 Data Flow Diagram (DFD) ... 32

3.3.5.3 Kamus Data ... 36

3.3.5.4 Spesifikasi Proses ... 39

3.4 Perancangan Sistem ... 40

3.4.1 Perancangan Basis Data ... 40

(9)

3.4.2 Perancangan Menu User ... 41

3.4.3 Perancangan Antarmuka ... 43

3.3.4 Jaringan Semantik ... 55

3.5 Implementasi ... 57

3.5.1 Implementasi Database ... 57

3.5.2 Implementasi Antarmuka ... 63

BAB 4 KESIMPULAN DAN SARAN 4.1 Kesimpulan ... 88

4.2 Saran ... 88

(10)

KATA PENGANTAR

Puji syukur penulis panjatkan kehadirat Allah SWT karena tiada kata

terindah selain mengucap syukur kepada-Nya yang telah memeberikan rahmat dan

ridho-Nya hingga penulis dapat menyelesaikan laporan kerja praktek ini. Kerja

praktek yang berjudul “PEMBANGUNAN WEBSITE PROFIL BPPPAKB KABUPATEN BANDUNG BARAT” penulis ajukan sebagai syarat nilai mata

kuliah kerja praktek jurusan Teknik Informatika Fakultas Teknik dan Ilmu

Komputer Universitas Komputer Indonesia. Yang dalam penyusunannya

berlandaskan pada teori-teori yang penulis dapatkan selama mengikuti kuliah,

melakukan penelitian, menggunakan buku-buku dan pihak-pihak yang telah

memberibantuan. Dalam penulisan kerja pratek ini penulis melibatkan berbagai

pihak. Pada kesempatan ini penulis mengucapkan terima kasih kepada semua

pihak yang telah membantu tersusunnya kerja praktek ini, yakni kepada :

1. Keluarga tercinta yang selalu memberikan do’a, kasih sayang, semangat

dan dorongan moril maupun materil.

2. Ibu Tati Harihayati M.,S.T,M.T Selaku pembimbing yang telah

mengarahkan dan membimbing penulis dalam menyelesaikan Penulisan

Laporan Kerja Praktek.

3. Seluruh staf pengajar dan sekretariat Teknik Informatika, yang telah

(11)

4. Instansi BPPPAKB Kabupaten Bandung Barat sebagai tempat kerja

praktek.

5. Novita Handayani dan Theresia Ascanova Handayani yang telah

memberikan saran dalam membantu penulis menyelesaikan Kerja praktek

ini.

6. Seluruh teman-teman IF-3 2009 terima kasih atas saran, dukungan serta

kebersamaannya.

7. Semua rekan-rekan mahasiswa Teknik Informatika 2009 terima kasih atas

saran, dukungan serta kebersamaannya.

8. Pihak-pihak lain yang membantu penulis untuk dapat menyelesaikan kerja

praktek ini yang tidak dapat disebutkan satu per satu.

Penulis menyadari bahwa penulisan laporan ini masih jauh dari sempurna

maka kritik dan saran dari semua pihak dibutuhkan untuk menambah wawasan

penulis.

Akhir kata semoga Allah SWT membalas segala kebaikan yang telah

penulis terima dan harapan penulis semoga Laporan Kerja praktek ini dapat

bermanfaat bagi pihak yang membutuhkan.

(12)

DAFTAR PUSTAKA

[1] Satzinger JW, Jackson RB, Burd SD. 2007.System Analysis and Design in Changing a World, Fourth Edition. Canada : Thomson. ISBN : 1-41883766 -0.

[2] Kumaladewi N, Hidayah NA, Amalia TR 2011. Sistem Informasi Akuntansi Pengeluaran KAS. Yogyakarta : Seminar Nasional Aplikasi Teknologi Informasi. ISSN : 1907-5022. Hal A47–A57.

[3] Mengenal apa itu Internet. Diakses pada 27 November 2012. http://www.kamusilmiah.com/it/mengenal-apa-itu-internet/

[4] C. Nelson William, Srinivasan Arvind (CVR) Chintalapati Murthy.2010.

Sun Web Server The Essential Guide.USA : William Clayton. ISBN 978-0-13-7128892-1.

[5] Pengertian Web Browser. Diakses pada 27 November 2012. http://www.anneahira.com/pengertian-web-browser.htm

[6] Definisi Website. Diakses pada 27 November 2012. http://www.amperaweb.com/apa_itu_website.php

[7] Mengenal apa itu HTML (Hyper Text Markup Language).Diakses pada 27 November 2012. http://www.kamusilmiah.com/it/mengenal-apa-itu-html-hyper-text-markup-language/

[8] Hadisaputra Adi. 2009.HTML dan CSS Fundamental. Bogor : Kaffah [9] Yuana Rosihan Ari. 2009 Mudah Belajar PHP.

[10] Delishe Marc. 2007. Creating your MySQL Database Practical Design Tips and Techniques,USA

[11] Adobe Dreamweaver CS6. Diakses pada 27 November 2012. http://www.adobe.com/products dreamweaver.html

[12] What is MySQL?. Diakses pada 27 November 2012. http://dev.mysql.com/doc/refman/5.1/en/what -is-mysql.html

(13)

(14)

BAB 1

PENDAHULUAN

1.1 Latar Belakang Kerja Praktek

BPPPAKB Kabupaten Bandung Barat adalah instansi pemerintah yang bergerak dalam hal perlindungan anak, pemberdayaan perempuan dan keluarga berencana yang berlokasi di Batujajar, Kabupaten bandung Barat.

Dalam melakukan beberapa kegiatan seperti perencanaan agenda kegiatan, promosi program-program, dan beberapa kegiatan lain yang dimiliki oleh BPPPAKB Kabupaten Bandung Barat masih menggunakan cara manual, yaitu dengan cara tulis tangan. Berdasarkan wawancara dengan beberapa pegawai BPPPAKB Kabupaten Bandung Barat, hal ini memberikan kesulitan bagi mereka yang bertugas di luar kantor yang ingin mengetahui acara yang akan dilaksanakan, bagi masyarakat akan sulit mengenal BPPPAKB Kabupaten Bandung Barat dan mengetahui waktu pelaksanaan acara-acara seperti lomba dan pelatihan.

Solusi yang diusulkan untuk menangani permasalahan-permasalahan diatas adalah dengan membuat web profil yang selain berfungsi untuk mengenalkan BPPPAKB Kabupaten Bandung Barat ke masyarakat luas. Bagi pegawai kantor BPPPAKB Kabupaten Bandung Barat akan menghemat penggunaan waktu dan

biaya dalam mempromosikan acara-acara lomba dan pelatihan, dan bagi pegawai yang sedang bertugas diluar kantor tidak akan kesulitan untuk mengetahui kegiatan yang akan dilaksanakan kedepan karena dapat mengetahuinya melalui website.

1.2 Perumusan Masalah

(15)

1.3 Maksud dan Tujuan

Maksud pembuatan web profil adalah untuk memberikan informasi yang berhubungan dengan BPPPAKB Kabupaten Bandung Barat kepada masyarakat luas. Adapun tujuan pembuatan webprofil adalah sebagai berikut :

1. Memudahkan pegawai atau masyarakat dalam mengetahui kegiatan-kegiatan yang akan dilaksanakan.

2. Keluaran yang dihasilkan adalah berita dan agenda kegiatan,

3. Masyarakat dapat lebih mengenal BPPPAKB Kabupaten Bandung Barat,

4. Masyarakat dapat mengetahui lomba atau pelatihan yang akan diadakan oleh BPPPAKB Kabupaten Bandung Barat.

1.4 Batasan Masalah

Aplikasi ini dapat dikatakan sangat sederhana, sehingga fitur yang dimilikinya tidak banyak. Batasan dalam membangun web profil BPPPAKB Kabupaten Bandung Barat sebagai berikut :

1. Dalam web profil ini, data yang diolah adalah berita, buku tamu, agenda, dan kontak dan user,

2. Aplikasi yang digunakan adalah aplikasi berbasis web,

3. Software pendukung yang digunakandalam membuat aplikasi antara lain : a. Adobe Dreamweaver CS6 sebagaiphpeditor,

b. Adobe Photoshop CS6 sebagaiimageeditor,

c. XAMPP 1.8.0

1.5. Metode Penelitian

(16)

1. Tahap Pengumpulan Data

Proses pengumpulan data dilakukan dengan 2 cara yaitu studi literatur dan studi lapangan.

a. Studi Literatur

Tahap pengumpulan data berdasarkan sumber-sumber literatur yang bersifat bacaan dan berkenaan langsung dengan web profil BPPPAKB Kabupaten Bandung Barat.

b. Observasi

Observasi dilakukan dengan cara melihat langsung kegiatan-kegiatan yang dilakukan oleh BPPPAKB Kabupaten Bandung Barat, dalam hal

ini berfungsi untuk mendapatkan foto-foto. c. Wawancara

Wawancara dilakukan dengan melakukan tanya jawab secara langsung dengan pihak yang merupakan pegawai dari kantor BPPPAKB Kabupaten bandung Barat.

2. Tahap Pembangunan Perangkat Lunak

Metode yang digunakan dalam membangun aplikasi ini adalah Waterfall Model. Waterfall Model merupakan salah satu model yang dapat digunakan dalam pengembangan sistem informasi. Beberapa proses

Waterfall Modelmenurut Satzinger (2007)adalah sebagai berikut:

(17)

1. Project planning

Mengidentifikasi ruang lingkup sistem baru, memastikan bahwa proyek itu feasible, dan mengembangkan jadwal, resource plan, dan biaya untuk proyek yang dibangun.

2. Analysis

Memahami dan mendokumentasikan kebutuhan bisnis dan syarat pemrosesan sistem yang akan dibuat.

3. Design

Mendesain sistem berdasarkan kebutuhan yang telah ditetapkan dan keputusan yang telah dibuat selama analisis.

4. Implementation

Perangkat lunak mulai dimplementasikan, memberikan pelatihan, dan diuji kelayakannya. Apakah sudah memenuhi kebutuhan yang sudah didefinisikan sebelumnya, masih ada atau tidaknya kesalahan-kesalahan yang terdapat dalam perangkat lunak tersebut.

1.6. Sistematika Penulisan

Sistematika penulisan pada laporan kerja praktek ini terbagi menjadi beberapa bab yang dapat diuraikan sebagai berikut:

BAB I PENDAHULUAN

Bab ini menjelaskan mengenai Latar Belakang Masalah, Identifikasi Permasalahan, Batasan Masalah, Maksud dan Tujuan, Metodologi Penelitian dan Sistematika Penulisan

BAB II TINJAUAN PUSTAKA

(18)

BAB III PEMBAHASAN

Bab ini menjelaskan tentang gambaran secara umum aplikasi yang akan dibuat serta membuat perancangan dan pembangunan aplikasi dan membahas tentang proses pengimplementasian dari sistem yang dibangun serta bagaimana proses pengujian yang terjadi terhadap implementasi sistem yang diterapkan.

BAB IV KESIMPULAN DAN SARAN

Bab ini berisi tentang kesimpulan yang diperoleh dari pelaksanaan tugas dan berisi beberapa saran dari penulis yang berkaitan dengan penyusunan tugas ini,

(19)

BAB 2

TINJAUAN PUSTAKA

2.1 Profil Instansi

BPPPAKB Kabupaten Bandung Barat merupakan badan yang bergerak dalam bidang pemberdayaan perempuan, perlindungan anak, kesejahteraan keluarga dan keluarga berencana. BPPPAKB semula bernama BPPKB pada awal bulan Juli 2012 berubah nama menjadi BPPPAKB.

2.1.1. Sejarah Instansi Berdiri

Wacana pemekaran Kabupaten Bandung menjadi 2 kabupaten telah muncul sejak tahun l999. Berdasarkan surat permohonan Bupati KDH TK.II Bandung yang saat itu dijabat oleh bapak H.U.Hatta Djati Permana . S.Ip mengajukan surat kepada Ketua DPRD yang saat itu pimpinan DPRD / Ketua DPRD diketuai Bapak Agus Yasmin Surat permohonan Bupati bernomor :135/1235/Tapem tanggal 22 juni 1999 perihal permohonan persetujuan pemekaran wilayah Kabupaten Dati II Bandung. Bupati memohon kepada pimpinan beserta anggota DPRD kiranya dapat mengabulkan dan mendukung atas terselenggaranya rencana pemekaran Kabupaten Bandung menjadi Kabupaten DT II Bandung dan Kabupaten Padalarang (sekarang Kabupaten Bandung Barat). Hal tersebut disambut positif oleh DPRD Kabupaten Bandung dengan diterbitkannya surat keputusan DPRD Dati II Bandung no.5/1999/12/07 tentang persetujuan awal DPRDterhadap pemekaran wilayah Kabupaten Dati II Bandung. Namun pada tanggal 23 Desember 1999, Ketua DPRD Kabupaten Bandung melayangkan surat No.135/1499/TU tentang pemekaran Kabupaten Bandung yang

(20)

Perkembanguan selanjutnya sesuai UU No.22/1999, sebagian kecil dari wilayah Kabupaten Bandung yaitu Kota Administratif Cimahi ditingkatkan statusnya menjadi Pemerintah Kota Cimahi ( yang meliputi 3 Kecamatan ) yaitu Kecamatan Cimahi Selatan, Kecamatan Cimahi tengah dan Kecamatan Cimahi utara, maka rencana pemekaran Kabupaten Bandung semakin tertunda karena Kota Cimahi sebelumnya merupakan bagian dari wilayah administratif Kabupaten Bandung. Setelah Cimahi menjadi Kota Otonom, terpisah dari kabupaten Bandung, tuntutan pemekaran Kabupaten Bandung mencuat kembali ke permukaan sejalan dengan dibukanya ruang publik untuk mengaspirasikan kehendak membentuk daerah otonom baru hal tersebut dijamin oleh Undang-Undang No.22/1999.

(21)

dilaksanakan di Gedung Diklat Keuangan Gado Bangkong Kecamatan Ngamprah pada tanggal 30 Agustus 2003 Naskah Deklarasi dibacakan dan ditanda tangani berbagai elemen masyarakat Bandung Barat. Hal tersebut diakukan KPPKBB sebagai bentuk komitmen bersama dalam upayanya memperjuangkan dan menyampaikan aspirasi keberbagai lembaga baik legislatif maupun eksekutif Daerah Kab.Bandung, Provinsi Jawa Barat dan Pemerinah Pusat serta DPR RI/DPD RI . sampai lahirnya Undang-Undang Republik Indonesia No12.tahun 2007 Tentang Pembentukan Kabupaten Bandung Barat Menjadi Daerah Otonom di Provinsi Jawa Barat.

Penjabat Sementara Bupati Bandung Barat Drs.H.Tjatja Kuswara ,SH.MH selesai menjalankan tugasnya pada tanggal 17 Juli 2008, Bupati dan Wakil Bupati Bandung

Barat pertama Drs.H.Abubakar M.Si dan Drs.Ernawan Natasaputra hasil pemilihan langsung dilantik pada tanggal 17 juli 2008 oleh Gubernur Jawa Barat Achmad Heriawan, Lc atas nama Presiden. Kabupaten Bandung Barat adalah kabupaten baru provinsi Jawa Barat, Indonesia, pemekaran dari Kabupaten Bandung. Kabupaten ini berbatasan dengan Kabupaten Purwakarta dan Kabupaten Subang di sebelah barat dan utara, Kabupaten Bandung dan Kota Cimahi di sebelah timur, serta Kabupaten Cianjur di sebelah barat dan timur. Kabupaten Bandung Barat mewarisi sekitar 1,4 juta penduduk dari 42,9% wilayah lama Kabupaten Bandung. Sedangkan ibu kota Kabupaten Bandung Barat berlokasi di Padalarang.

(22)

dan Keluarga Berencana (BPPKB) berubah menjadi Badan Pemberdayaan Perempuan Perlindungan Anak dan Keluarga Berencana (BPPPAKB).

2.2 Visi dan Misi Instansi

BPPPAKB mempunyai visi dan misi dalam menjalankan tugas pokok dan fungsi serta untuk mencapai target yang diharapkan.

2.2.1 Visi

Visi dari BPPPAKB KabupatenBandung Barat yaitu Mewujudkan Masyarakat yang Sejahtera, Mandiri, dan Berdaya Saing Melalui Pemberdayaan Keluarga.

2.2.2 Misi

Misi dari BPPPAKB Kabupaten Bandung Barat antara lain : 1. Meningkatnya pengarusutamaan gender

2. Meningkatnya perlindungan anak dan perempuan 3. Mengendalikan tingkat kelahiran

4. Meningkatnya kualitas ketahanan keluarga

2.3 Logo Instansi

(23)

Gambar 2.1 Logo BPPPAKB

Sesuai dengan nama dari instansi tersebut logo dipilih mempunyai makna sebagai berikut :

1. Gambar setengah lingkaran dan keluarga berwarna biru

Melambangkan keharmonisan antar anggota keluarga dan dua anak yang memegang erat orang tuanya merupakan simbol dari keluarga harmonis dimana kedua orang tua menjaga dan membimbing anak.

2. BPPPAKB Kabupaten Bandung Barat

Logo tersebut melambangkan nama BPPPAKB dan lokasi BPPPAKB berdinas.

3. Warna Biru

Warna Biru pada logo melambangkan keeratan keluarga dan juga melambangkan keluarga yang sejahtera.

2.4 Struktur Organisasi dan Job Description

(24)

Gambar 2.2 Struktur Organisasi BPPPAKB

Job DescriptionBPPPAKB Kabupaten Bandung Barat dipimpin oleh Kepala Badan.

Kepala Badan adalah pimpinan instansi yang memiliki tugas dan tanggungjawab dalam mengawasi terhadap seluruh kegiatan para pegawainya, Kepala Badanberperan dalam memutuskan kebijakan. Kepala badan mempunyai staf yang terbagi dalam beberapa bagian dalam upaya mensukseskan program-program BPPPAKB, diantaranya Kepala Sub Bagian Program yang mempunyai tugas untuk menyusun program-program yang akan dilaksanakan.

(25)

berkaitan dengan pemberdayaan wanita, perlindungan anak. Kepala Bidang Keluarga Sejahtera (KS) mempunyai tanggung jawab terhadap hal-hal yang berkaitan dengan pemberdayaan keluarga dan membangun kemandirian kepada setiap keluarga untuk mencapai kesejahteraan.Kepala Bidang Keluarga Berencana (KB) mempunyai tanggung jawab terhadap hal-hal yang berkaitan dengan kesehatan reproduksi, PIK remaja,dan sosialisasi alat kontrasepsi.

Kepala Sub Bidang pengarustamaan gender mempunyai tanggung jawab terhadap hal-hal yang berkaitan dengan kesetaraan gender. Kepala sub bidang perlindungan perempuan dan anak mempunyai tanggung jawab terhadap hal-hal yang berkaitan dengan masalah kekerasan terhadap perempuan dan anak. Kepala sub bidang ketahanan dan pemberdayaan keluarga mempunyai tanggung jawab terhadap hal-al yang berkaitan dengan pemberdayaan keluarga mandiri dengan memanfaatkan sumber daya yang supaya tercipta keluarga yang sejahtera. Kepal Sub Bidang Advokasi dan Peningkatan Instansi Masyarakat mempunyai tanggung jawab terhadap hal-hal yang berkaitan dengan peningkatan instansi masyarakat melalui promosi ke Pemkab Bandung Barat agar diberi dana untuk mengembangkan instansinya. Kepala Sub Bidang Keluarga Berencana (KB) mempunyai tanggung jawab terhadap hal-hal yang berkaitan dengan sosialisasi alat kontrasepsi dan sosialisasi PIK remaja. Kepala Sub Bidang Kesehatan Reproduksi (KR) mempunyai tanggung jawab terhadap hal-hal yang berkaitan dengan kesehatan reproduksi, sosialisasi mengenai pencegahan pernikahan di bawah umur dan seks bebas.

(26)

2.5 Landasan Teori

Landasan teori yang mendukung proses analisis system serta mendukung proses perancangan Pembangunan Website Profil BPPPAKB Kabupaten Bandung Barat adalah sebagai berikut :

2.5.1Waterfall Model

Waterfal Model merupakan salah satu model yang dapat digunakan dalam pengembangan sistem informasi. Model ini memiliki empat fase [1]. Fase Perencanaan bertujuan untuk mengidentifikasi ruang lingkup sistem baru, memastikan bahwa proyek itu feasible, dan mengembangkan jadwal,resource plan,

dan biaya untuk proyek yang dibangun. Fase analisis bertujuan untuk memahami dan

mendokumentasikan kebutuhan bisnis dan syarat pemrosesan sistem baru. Fase desain bertujuan untuk mendesain sistem berdasarkan kebutuhan yang telah ditetapkan dan keputusan yang telah dibuat selama analisis [2]. Terakhir, fase Implementasi: pembangunan, pengujian, dan instalasi sistem. Seperti pada gambar 2.3.

(27)

2.5.2 Internet

Internet adalah sebuah jaringan komputer yang terdiri dari berbagai macam ukuran dan jenis jaringan komputer di seluruh dunia. Jaringan-jaringan komputer ini saling berhubungan dan berkomunikasi satu sama lain melalui bantuan telepon dan satelit, yang digunakan untuk keperluan pemerintahan, pendidikan, perdagangan, ilmu pengetahuan dan perorangan[3].

2.5.3 WebServer

Web server adalah suatu program untuk menawarkan pelayanan yang bisa diperoleh seluruh jaringan. Webservermerupakan uatu tipeserverkhusus yang dapat berkomunikasi langsung dengan client dan menggunakan HTTP, web server

meresponnya, biasanya dengan mengembalikan sebuah dokumen atau gambar [4].

2.5.4 WebBrowser

Web browser adalah sebuah aplikasi perangkat lunak unutk melintasi, mengambil, dan menyajikan informasi yang tersedia di internet. Sumber informasi diidentifikasikan dengan Uniform Resource Identifier (URL) termasuk sebuah halaman web, gambar, video atau bagian lain dari web[5].

2.5.5 Website

(28)

2.5.6 HTML

HTML (Hypertext Markup Language) bisa disebut bahasa yang digunakan untuk menampilkan dan mengelola hypertext. Hypertext dalam HTML berarti bahwa kita dapat menuju suatu tempat, misalnya website atau halaman homepage lain, dengan cara memilih link yang biasanya digarisbawahi atau diwakili oleh suatu gambar. Selain link ke website atau homepage halaman lain, hypertext ini juga mengizinkan kita untuk menuju ke salah satu bagian dalam satu teks itu sendiri.

HTML terdiri dari sejumlah perintah dimana kita bisa men-set judul, garis, tabel, gambar dan lain- lain yang disebut tag. Setiap tag masih dapat dilengkapi lagi oleh sejumlahattribute[7].

2.5.7 Cascading Style Sheet (CSS)

(29)

sheet dimana css jenis ini dituliskan bersama dengan file konten yang diaturnya dan biasanya diletakan pada bagian tag <head>pada dokumen html tersebut.CSS sangat memudahkan designer web Karena dengan css pengguna dapat menggunakan style

(baca: format tampilan) halaman web terus menerus pada bagian mana saja (masih pada blok script yang sama) tanpa harus mengulang-ngulang menulis format style nya. Hal ini bisa dianalogikan dengan function pada berbagai bahasa pemrograman, kesimpulannya adalah CSS akan memudahkan pekerjaan kita dalam hal format tampilan web dan mengurangi besarnya ukuran skrip yang akan kita buat [8].

2.5.8 PHP

PHP adalah bahasa pemorgraman yang memungkinkan para web developeruntuk membuat aplikasi web yang dinamis dengan cepat. PHP merupakan singkatan dari “PHP: Hypertext Preprocessor”. PHP ditulis dan diperkenalkan pertama kali sekitar tahun 1994 oleh Rasmus Lerdorf melalui situsnya untuk mengetahui siapa saja yang telah mengakses ringkasan onlinenya.PHP merupakan salah satu bahasa script yang terbilang baru dan tersedia secara bebas dan masih memungkinkan untuk dikembangkan lebih lanjut. PHP dapat diintegrasikan (embedded) ke dalam web server, atau dapat berperan sebagai program CGI yang terpisah. Karakteristik yang paling unggul dan paling kuat dalam PHP adalah lapisan integrasidatabase(database integration layer). Database yang didukung PHP adalah: Oracle, Adabas-D, Sybase, FilePro, mSQL, Velocis, MySQL, Informix, Solid, dBase, ODBC, Unix dbm, dan PostgreSQL.

(30)

merupakan kependekan dari Personal Home Page atau Situs Personal yang dibuat oleh Rasmus Lerdorf pada tahun 1995.

Awalnya PHP bernama FI (Form Interpreted) yaitu sekumpulan script untuk mengolah data “Form” dari web.Pengkodean yang dibuat oleh Rasmus kemudian dijadikan “Open Source” sehingga banyak para programmer tertarik untuk mengembangkan dan menggunakan bahasa pemrograman PHP yang kemudian interpreter PHP sudah diimplementasikan dalam program C dan disertakan modul-modul ekstensi untuk meningkatkan kemampuan PHP/FI. Pada perkembangannya sekitar tahun 1997,

Zend menulis ulang interpreter PHP sehingga menjadi lebih bersih, lebih baik,

dan lebih cepat. Kemudian pada Juni 1998, perusahaan tersebut merilis interpreter baru untuk PHP dan meresmikan rilis tersebut sebagai PHP 3.0 dan singkatan PHP dirubah menjadi akronim berulang “PHP: Hypertext Preprocessing”. Pada pertengahan tahun 1999, Zend merilis interpreter PHP baru dan rilis tersebut dikenal dengan PHP 4.0. PHP 4.0 adalah versi PHP yang paling banyak dipakai pada awal abad ke-21. Versi ini banyak dipakai disebabkan kemampuannya untuk membangun aplikasi web kompleks tetapi tetap memiliki kecepatan dan stabilitas yang tinggi. PHP dalam rentang waktu 5 tahun yakni pada pertengahan 2004, Zend merilis PHP 5.0. PHP 5.0 versi ini, inti dari interpreter PHP mengalami perubahan besar, dalam versi ini dilengkapi dengan memasukkan model pemrograman berorientasi objek ke dalam PHP untuk menjawab perkembangan bahasa pemrograman ke arah paradigma berorientasi objek[9].

2.5.9 PemrogramanDatabase

(31)

memiliki satu unit data yang disebut record dan kolom di dalam table (disebut denganfield) merupakan keterangan dari masing - masingrecord.

Pemograman database merupakan kegiatan yang dilakukan untuk meningkatkan memudahan dalam melakukan manajemen dan akses sebuah database. Pemograman Sebuah Database banyak dilakukan dengan menggunakan bahasa yang disebut dengan Structure Query language (SQL).Selain SQL,pemograman database juga meliputi manipulasi objek-objek database,analisa query,dan juga interaksi database denganOpen DatabaseConnectivity (ODBC)[10].

2.6. Perangkat Lunak Pendukung

Perangkat lunak pendukung dalam pembangunan web profil BPPPAKB

Kabupaten Bandung Barat adalah sebagai berikut :

2.6.1 Adobe Dreamweaver CS6

Salah satu software web editor adalah Adobe Dreamweaver CS6 yang merupakan penyempurnaan dari versi. Adobe Dreamweaver CS6 adalah sebuah perangkat lunak yang dapat digunakan oleh setiap orang untuk belajar bagaimana membuat web dengan mudah. Cara penggunaanya juga sangat mudah untuk dimengerti. Dreamweaver adalah software yang dikhususkan untuk pembuatan halaman web secara visual. Software ini paling inovatif dan lebih lengkap dibandingkan software web editor lain menyertakan banyak perangkat yang berkaitan dengan pengkodean dan fitur seperti HTML, CSS, PHP, HTML5 serta JavaScript[11].

(32)

1. Insert Bar

Insert bar merupakan tool yang digunakan untuk menyisipkan objek ke dalam dokumen web.

2. Document Window

Jendela kerja dokumen terdiri atas layar kerja serta fasilitasnya. Yang dimaksud dengan fasilitas adalah tool untuk mengatur layar kerja atau sering disebut Document Toolbar, antara lain Coding tool dan Zoom & Guide tool. Di samping Document Toolbar, tersedia fasilitas lain yaitu Tag Selection. 3. Panel Groups

Panel pada Adobe Dreamweaver CS6 merupakan suatu media yang berfungsi sebagai fasilisator. Kumpulan berbagai panel disebut Panel Groups, terletak pada sebelah kanan layar kerja. Panel-panel tersebut diantaranya CSS, Application, Tag Inspector, Files dan History yang masing-masing memiliki bagian dan fungsi.

4. Property Inspector

Property Inspector merupakan area kerja untuk mengatur dalam mengelola properti-properti seperti pada text, image, maupun tabel dalam suatu dokumen web. Cara kerja Property Inspector hanya dengan memasukkan nilai-nilai parameter yang sudah disediakan. Secara umum Property Inspector terdiri dari Page Property, Table Property, Image Property, dan Form Property.

5. Page Property

Page Property berguna untuk mengatur properti halaman. Page Property Inspector juga menyediakan fasilitas Page Properties.

2.6.2 MySQL

(33)

didistribusikan, dan didukung oleh perusahaan Oracle (dev.mysql.com/doc/refman/5.1/en/what-is-mysql.html, diakses pada 27 November 2012). MySQL adalah DBMS yang paling banyak digunakan di Internet karena berlisensi free yang maksudnya bebas digunakan untuk pribadi maupun untuk organisasi atau perusahaan [12].

Kelebihan MySQL:

1. Source MySQL dapat diperoleh dengan mudah dan gratis 2. Sintaksnya lebih mudah dipahami dan tidak rumit

3. Pengaksesan database dapat dilakukan dengan mudah

Keunggulan MySQL:

1. MySQL merupakan program yang multi-threaded, sehingga dapat dipasang pada server yang memiliki multi-CPU.

2. Didukung program-program umum seperti C, C++, Java, Perl, PHP, Python, TCL APIs dls.

3. Bekerja pada berbagai platform(tersedia berbagai versi untuk berbagai sistem operasi seperti Linux).

4. Memiliki jenis kolom yang cukup banyak sehingga memudahkan konfigurasi sistemdatabase.

5. Memiliki sistem keamanan yang cukup baik dengan verifikasi host. 6. Mendukung ODBC untuk sistem operasi Microsoft Windows.

7. Mendukung record yang memiliki kolom dengan panjang tetap atau panjang bervariasi. dan masih banyak keunggulan lainnya.

(34)

9. MySQL dan PHP saling terintegrasi. Maksudnya adalah pembuatan database dengan menggunakan sintak PHP dapat dibuat. Sedangkan input yang di masukkan melalui aplikasi web yang menggunakan script server-side seperti PHP dapat langsung dimasukkan ke database MySQL yang ada di serverdan tentunya web tersebut berada di sebuah webserver.

2.6.3 Adobe Photoshop CS6

Adobe Photoshop CS6 adalah sebuah software yang dapat digunakan untuk membuat, mengolah, serta memanipulasi tampilan sebuah gambar atau foto. Selain itu, dapat juga digunakan untuk mengoreksi warna dan memberikan

efek-efektampilan yang sangat menakjubkan hasilnya.

Keandalan Adobe Photoshop CS6 dalam berbagai pekerjaan memang tidak diragukan lagi, terbukti beberapa bidang sangat memerlukan software ini untuk keperluan fotografi, percetakan, animasi, periklanan, maupun untuk membuat

website[13].

Dengan kemampuannya dalam mengolah grafis gambar dan foto, pengguna dapat memanfaatkan untuk membuat desain grafis sebuah halaman web.Selain itu, kemampuan Adobe Photoshop CS6 dalam mengoptimalkan file gambar, sangat mendukung kebutuhan sebuah halaman web dalam penggunaan gambar. Sebagai contoh, pengguna dapat membuat desain header, footer, menu, tombol, serta animasi pendukung sebuah halaman web dengan menggunakan peranti-peranti dalam Adobe Photoshop CS6.

2.6.4 XAMPP 1.8.0

(35)

(36)

BAB 3

PEMBAHASAN

3.1 Jadwal Kerja Praktek

Pelaksanaan kerja praktek dilaksanakan di Kantor BPPPAKB Kabupaten

Bandung Barat yang beralamat di Jln. Raya Batujajar km 3.5 No 46 Komplek

Pemda Kabupaten Bandung Barat. Pelaksanaan kerja praktek dilaksanakan pada

tanggal 09 Juli sampai dengan 31 Juli 2012.

3.2 Cara / Teknik Kerja Praktek

Dalam pelaksanaan kerja praktek ini dibagi kedalam beberapa tahapan

kegiatan, yang antara lain :

1. Pembuatan surat permohonan kerja praktek ditujukan untuk Kantor

BPPPAKB Kabupaten Bandung Barat.

2. Kantor BPPPAKB Kabupaten Bandung Barat memberikan surat balasan

permohonan kerja praktek di Kantor BPPPAKB Kabupaten Bandung

Barat.

3. Penempatan posisi kerja praktek.

4. Pelaksanaan kerja praktek.

Dalam pelaksanaan kerja praktek ini dibagi kedalam beberapa tahapan

kegiatan untuk mengetahui permasalahan yang ada di dalam pelaksanaan kegiatan

penyampaian informasi di Kantor BPPPAKB Kabupaten Bandung Barat. Adapun

(37)

a. Pengumpulan data yang dibagi ke dalam tiga tahapan, yaitu :

1. Wawancara

Dilakukan dengan memberikan beberapa pertanyaan kepada pembimbing

kerja praktek yang telah dipilih mengenai cara yang dilakukan untuk

menyampaikan informasi yang berada di Kantor BPPPAKB Kabupaten

Bandung Barat.

2. Observasi

Dilakukan dengan cara terjun langsung untuk mengikuti kegiatan harian di

Kantor BPPPAKB Kabupaten Bandung Barat yang sebelumnya telah

mendapatkan izin dari pembimbing Kerja Praktek

3. Studi Literatur

Studi literatur yaitu mengumpulkan data melalui buku - buku, situs internet,

dan catatan kuliah yang diperlukan dalam pembangunan web profil Kantor

BPPPAKB Kabupaten Bandung Barat.

b. Analisis

Memahami dan mendokumentasikan kebutuhan bisnis dan syarat pemrosesan sistem yang akan dibuat.

c. Desain

Mendesain sistem berdasarkan kebutuhan yang telah ditetapkan dan keputusan yang telah dibuat selama analisis.

d. Implementasi

(38)

sebelumnya, masih ada atau tidaknya kesalahan-kesalahan yang terdapat dalam perangkat lunak tersebut.

3.3 Analisis Masalah

Analisis sistem merupakan kegiatan penguraian suatu sistem informasi yang utuh dan nyata kedalam bagian-bagian atau komponen-komponen komputer yang bertujuan untuk mengidentifikasi masalah-masalah yang muncul yang diharapkan sehingga mengarah kepada suatu solusi untuk perbaikan maupun

pengembangan ke arah yang lebih baik. Analisis permasalahan pada BPPPAKB Kabupaten Bandung Barat yaitu

1. Informasi tentang BPPPAKB Kabupaten Bandung Barat yang diketahui masyarakat masih minim.

2. Pegawai cukup kesulitan untuk mengetahui apa ada kegiatan dalam waktu dekat.

3. Bagaimana membangun web profil yang dapat mengenalkan BPPPAKB Kabupaten Bandung Barat kepada masyarakat luas.

3.3.1 Analisis Prosedur yang Sedang Berjalan

Sistem yang sedang berjalan diartikan sebagai sistem yang sedang dipakai, sedangkan analisis sistem yang sedang berjalan diartikan sebagai cara untuk memahami terlebih dahulu masalah yang dihadapi oleh sistem, seperti mendefinisikan kebutuhan fungsional dari sistem sehingga dapat diketahui apa saja kebutuhan pemakai yang belum terpenuhi oleh sistem yang sedang berjalan tersebut.

(39)

3.3.1.1Prosedur Penyampaian Kegiatan dan Program

Prosedur merupakan urutan langkah-langkah yang terjadi atau yang dilakukan dalam sistem yang sedang berjalan. Pada prosedur pendaftran anggota terdapat beberapa entitas yang terlibat didalamnya diantaranya : Kepala Bidang PP,KB, dan KS, Kepala Badan BPPPAKB, Bagian Perencanaan dan Program dan UPTB Kecamatan yaitu :

1. Kepala Bidang PP,KB, dan KS membuat rencana kegiatan dan program. 2. Setelah rencana kegiatan selesai dibbuat kemudian dibuat data untuk

diserahkan ke Kepala Badan BPPPAKB untuk disetujui, apabila tidak disetujui maka diserahkan kembali ke Kepala Bidang PP,KB, dan KS untuk disusun ulang diperbaiki kembali.

3. Setelah data disetujui oleh Kepala Badan BPPPAKB Kemudian diserahkan ke Bagian Perencanaan dan Program untuk di periksa kembali, setelah diperiksa kemudian dimasukan ke database, setelah dimasukan ke

database, Bagian Perencanaan dan Program membuat surat rekomendasi unutk UPTB Kecamatan, kemudian surat tersebut dijadikan arsip kantor, lalu surat rekomendasi dikirim ke tiap UPTB kecamatan.

(40)

(41)

3.3.2 Analisis Kebutuhan Non Fungsional

Analisis non fungsional adalah sebuah langkah dimana seorang pembangun perangkat lunak menganalisis sumber daya yang dibutuhkan untuk menggunakan aplikasi yang akan dibangun. Analisis non fungsional yang dilakukan dibagi dalam 3 tahapmeliputi analisis kebutuhan perangkat keras, perangkat lunak dan analisis pengguna (user).

3.3.2.1 Analisis Kebutuhan Perangkat Keras

Perangkat keras yang dimiliki oleh BPPPAKB Kabupaten Bandung Barat ada 3 unit komputer dengan spesifikasi rata-rata :

a. Processor Intel Core 2 Duo (2,2 GHz ) b. RAM 1 GB

c. Harddisk 160 GB

Kebutuhan perangkat keras untuk mendukung aplikasiyang dibutuhkan minimal:

a. Processor Intel Pentium (2,1 GHz) b. RAM 256

c. Hard Disk 40 GB

Berdasarkan spesifikasi rata-rata perangkat keras yang berada di BPPPAKB Kabupaten Bandung Barat, apabila dibandingkan dengan analisis minimal perangkat keras yang dibutuhkan, maka analisis perangkat keras yang berada di BPPPAKB Kabupaten Bandung Barat sudah memenuhi spesifikasi analisis perangkat keras yang diperlukan.

(42)

a. Sistem operasi Windows XP Service Pack 3 b. Web server XAMPP 1.8.0

c. Web browserseperti Mozilla Firefox dan Internet Explorer

Kebutuhan perangkat lunak untuk mendukung aplikasi yang dibutuhkan minimal:

a. Sistem operasi minimal Windows XP Service Pack 2 b. Webserver XAMPP 1.8.1

c. Web browserseperti Google Chrome, Mozilla Firefox, Opera, atau web browser lainnya.

Berdasarkan analisis spesifikasi kebutuhan perangkat lunak yang berada di BPPPAKB Kabupaten Bandung Barat, apabila dibandingkan dengan analisis kebutuhan perangkat lunak yang diperlukan, beberapa perangkat lunak sudah terpenuhi, seperti sistem operasi, web server, dan web browser.

3.3.2.3 Analisis Kebutuhan Pengguna

Pengguna yang akan mengatur atau menjadi administrator website BPPPAKB Kabupaten Bandung Barat adalah Bagian Perencanaan dan ProgramBPPPAKB Kabupaten Bandung Barat yaitu:

Tabel 3.1 User Profile

(43)

berita, data event, data user, data buku tamu, dan data kontak. Sedangkan pengunjung hanya melihat front end site.

Berdasarkan hasil analisis, pengguna yang berada di BPPPAKB Kabupaten Bandung Barat sudah memenuhi analisis kebutuhan pengguna website BPPPAKB Kabupaten Bandung Barat.

Tabel 3.2 Kebutuhan Pengguna Web Profile BPPPAKB Tipe semua operasi di dalam Back End

mengakses Front End Site.

3.3.3 Analisis Jaringan

BPPPAKB Kabupaten Bandung Barat saat ini telah menggunakan jaringan komputer. Model hubungan jaringan di BPPPAKB Kabupaten Bandung Baratmenggunakan model hubungan Wi-Fi.

3.3.4 Analisis Basis Data

(44)

Gambar 3.2 Entity Relationship Diagram

3.3.5 Analisis Fungsional

(45)

3.3.5.1 Diagram Konteks

Diagram konteks menggambarkan aliran data dari sutu sistem baik aliran data yang masuk maupun aliran data yang keluar serta pemrosesan yang mengubah data maupun penyimpanan data tersebut. Diagram kontek dari pembuatan web ini dapat dihat pada gambar 3.3 diagram konteks:

Gambar 3.3 Diagram Konteks Web Profile BPPPAKB

3.3.5.2 Data Flow Diagram (DFD)

(46)

Gambar 3.4 DFD Level 1 Web Profile BPPPAKB

DFD level 1 menjelaskan bahwa pengunjung melakukan akses website dengan memilih menu yang ada, salah satu menu tersebut event, buku tamu, berita, kontak, kemudian sistem akan mencari pilihan menu tersebut pada file

pengolahan data kemudian menampilkan menu tersebut kepada pengunjung. Pada bagian kontak, pengunjung mengisi nama, telepon, email, dan pesan. Proses pengisian buku tamu adalah data buku tamu yang dapat dibaca kembali oleh pengunjung.

(47)

Proses pengolahan data yang dilakukan oleh admin yaitu bisa input, ubah, dan hapus data. DFD level 0 diatas diuraikan menjadi proses DFD level 1 yaitu tentang pengolahan data event yang dilakukan oleh admin seperti pada gambar 3.5 DFD level Proses 2.

Gambar 3.5 DFD Level 1 Proses 2 Web Profile BPPPAKB

(48)

DFD level 1 proses 4 Menjelaskan bahwa kegiatan admin mengolah data

buku tamu. Pengolahan data dapat dilihat pada gambar 3.7 DFD level 1 proses 4 dibawah ini :

(49)

DFD level 1 proses 5 Menjelaskan bahwa kegiatan admin mengolah data kontak. Pengolahan data dapat dilihat pada gambar 3.8 DFD level 1 proses 5 dibawah ini :

3.3.4.2Kamus Data

(50)

Tabel 3.3 Kamus Data

Kamus Keterangan

Nama aliran Data Deskripsi

Struktur Data

username admin agar dapat mengakses aplikasi web admin.

Nama Aliran Data Deskripsi

(51)

Deskripsi

Struktur Data id_berita nama_berita

Data Berita adalah berisi tentang berita – berita yang aada di BPPPAKB.

id_berita + nama_berita

[A..Z|a..z|0..9|simbol]

Struktur Data id_berita nama_berita pesan

Data Buku Tamu

Data Buku Tamu merupakan data yang

diisi oleh pengguna melalui form pada menu buku tamu

id_nama + email + pesan

[A..Z|a..z|0..9|simbol]

Data Kontak merupakan data yang diisi oleh pengguna melalui form pada menu kontak.

(52)

3.3.5.4 Spesifikasi Proses

Spesifikasi proses digunakan untuk menggambarkan proses model aliran yang terdapat pada DFD spesifikasi proses dan gambaranDFD diatas aliran

dijelaskan pada tabel 3.4 Spesifikasi proses dibawah ini:

Tabel 3.4 Spesifikasi Proses

No Nama

Proses Deskripsi Input Output

(53)

3 Mengolah

3.4 Perancangan Sistem

Perancangan sistem adalah suatu proses yang menggambarkan bagaimana suatu sistem dibangun untuk memenuhi kebutuhan pada fase analisis. Tahapan yang dilakukan dalam perancangan sistem ini membahas mengenai Perancangan Basis Data, Perancangan Menu, dan Perancangan Antarmuka.

(54)

3.4.1.1 Diagram Relasi

Relasi tabel menggambarkan hubungan antara entitas-entitas yang ada pada diagram ER. Gambar 3.9 berikut adalah diagram relasi dalam web profil BPPPAKB Kabupaten Bandung Barat.

Gambar 3.9 Skema Relasi

3.4.2 Perancangan Menu User

(55)

Gambar 3.10 Perancangan Menu User

Perancangan menu admin ini adalah semua tampilan menu-menu yang ada pada halaman utama menu admin, yang terdiri dari menu Beranda, Ubah Data

User, Berita, Buku Tamu, Kontak, Agenda dan Logout.

Gambar 3.11 Perancangan Menu Admin Menu Utama

(56)

3.4.3 Perancangan Antarmuka

Perancangan antarmuka diperlukan pada program aplikasi ini dengan tujuan untuk mempermudah pengguna dalam menggunakan program aplikasi ini. Dengan adanya perancangan antarmuka ini berbagai pengguna baik awam, maupun yang sudah berpengalaman dapat mengoperasikan aplikasi ini tanpa adanya kesulitan yang besar.

1. Perancangan antarmuka tampilan utamaweb pengunjung a. Perancangan tampilan utama pengunjung(T01)

- Klik

Ukuran Tampilan : 1024 x 768

(57)

b. Perancangan tampilan agenda (T02)

Gambar 3.13 Perancangan Tampilan Agenda

c. Perancangan tampilan program keluarga berencana (T03.1)

(58)

T04.1

Gambar 3.14 Perancangan Tampilan Keluarga Berencana

d. Perancangan tampilan keluarga sejahtera (T03.2)

- Klik

(59)

e. Perancangan tampilan pemberdayaan perempuan dan perlindungan

Gambar 3.16 Perancangan Tampilan Pemberdayaan Perempuan dan

(60)

f. Perancangan tampilan galeri kunjungan Kuningan (T04.1)

Kuningan untuk ke T04.1

- Klik Kunjungan Kuningan T04.1 - Klik Penghargaan

untuk ke T04.2 - Klik Pelatihan

Manajemen untuk ke T04.3

- Klik Recheking Lomba Kelompok UPPKS untuk ke T04.4

- Klik Buku Tamu T05

- Klik Kontak T06

Gambar 3.17 Perancangan Tampilan Kunjungan Kuningan

(61)

- Klik Beranda

Gambar 3.18 Perancangan Tampilan Penghargaan

h. Perancangan tampilan bantuan alat produksi (T04.3.1)

- Klik Beranda

untuk ke T01

- Klik Agenda untuk

ke T02

- Klik Program

untuk ke T03.1

- Klik Kunjungan

Kuningan T04.1

- Klik Penghargaan

untuk ke T04.2

- Klik Pelatihan

- Klik Recheking

Lomba Kelompok UPPKS untuk ke T04.4

- Klik Buku Tamu

T05

(62)

i. Perancangan tampilan Hari Keluarga XIX Depok (T04.3.2)

Kuningan untuk

ke T04.1

- Klik Kunjungan

Kuningan T04.1

- Klik Penghargaan

untuk ke T04.2

- Klik Pelatihan

- Klik Recheking

- Klik Buku Tamu

T05

- Klik Kontak T06

Gambar 3.20 Perancangan Tampilan Hari Keluarga XIX Depok

j. Perancangan tampilan pelatihan manajemen (T04.3.3)

- Klik Beranda untuk ke

T01

- Klik Agenda untuk ke

T02

- Klik Program untuk ke

T03.1

- Klik Penghargaan

untuk ke T04.2

- Klik Pelatihan

- Klik Recheking

Lomba Kelompok

UPPKS untuk ke

T04.4

- Klik Kontak T06

(63)

k. Perancangan tampilan proses produksi (T04.3.4)

- Klik Kontak T06

Gambar 3.24 Perancangan Tampilan Proses Produksi

l. Perancangan tampilan recheking lomba kelompok UPPKS (T04.3.5)

- Klik Beranda untuk

ke T01

- Klik Penghargaan

untuk ke T04.2

- Klik Pelatihan

- Klik Recheking

- Klik Buku Tamu

T05

(64)

m. Perancangan tampilan buku tamu (T05)

Gambar 3.26 Perancangan Tampilan Buku Tamu

n. Perancangan tampilan kontak (T06)

- Klik Beranda untuk ke T01 - Klik Agenda untuk

ke T02

(65)

2. Perancangan antarmuka tampilan administrator a. Perancangan tampilan login (T07)

Gambar 3.28 Perancangan Tampilan Login

b. Perancangan tampilan home (T08)

- Klik Beranda

(66)

c. Perancangan tampilan ubah data user (T09)

Gambar 3.30 Perancangan Tampilan Ubah Data User

d. Perancangan tampilan berita (T10)

- Klik Beranda

(67)

e. Perancangan tampilan buku tamu (T11)

Gambar 3.32 Perancangan Tampilan Buku Tamu

f. Perancangan tampilan kontak (T12)

- Klik Beranda

(68)

g. Perancangan tampilan agenda (T13)

Gambar 3.37 Perancangan Tampilan Agenda

h. Perancangan tampilan logout (T15)

Gambar 3.34 Perancangan Tampilan Logout

3.4.4 Jaringan Semantik

(69)

Jaringan semantik pada aplikasi web profil BPPPAKB Kabupaten Bandung Barat untuk pengunjung dapat dilihat pada gambar 3.35 jaringan semantik pengunjung :

(70)

Sedangkan jaringan semantik untuk admin dapat dilihat pada gambar 3.36 :

Gambar 3.36 Jaringan Semantik Admin

3.5 Implementasi

Impelementasi merupakan tahap sistem siap untuk dipergunakan. Tahap ini merupakan kelanjutan dari tahap analisi dan perancangan. Implementasi bertujuan untuk menguji coba aplikasi yang telah dibuat apakah sesuai dengan tujuan yang diharapkan, sehingga pengguna dapat memberikan masukan untuk pengembangan.

3.5.1 Implementasi Database

(71)

`user_id` int(6) NOT NULL AUTO_INCREMENT ,

`user_name` varchar(32) CHARACTER SET latin1 COLLATE latin1_swedish_ci NOT NULL DEFAULT '' ,

`password` varchar(32) CHARACTER SET latin1 COLLATE latin1_swedish_ci NOT NULL DEFAULT '' ,

`temp_password` varchar(32) CHARACTER SET latin1 COLLATE latin1_swedish_ci NULL DEFAULT NULL ,

`email` varchar(64) CHARACTER SET latin1 COLLATE

latin1_swedish_ci NOT NULL DEFAULT '' ,

`sedit` tinyint(1) UNSIGNED NOT NULL DEFAULT 0 , `privs` tinyint(1) UNSIGNED NULL DEFAULT 0 , `login_0` date NOT NULL DEFAULT '9999-00-00' , `login_1` date NOT NULL DEFAULT '9999-00-00' , `login_cnt` int(8) NOT NULL DEFAULT 0 ,

`language` varchar(32) CHARACTER SET latin1 COLLATE latin1_swedish_ci NULL DEFAULT NULL ,

`color` varchar(10) CHARACTER SET latin1 COLLATE latin1_swedish_ci NULL DEFAULT NULL ,

`nama` varchar(100) CHARACTER SET latin1 COLLATE latin1_swedish_ci NOT NULL DEFAULT '0' ,

`alamat` text CHARACTER SET latin1 COLLATE latin1_swedish_ci NOT NULL ,

`telepon` varchar(30) CHARACTER SET latin1 COLLATE latin1_swedish_ci NULL DEFAULT NULL ,

`nip` varchar(30) CHARACTER SET latin1 COLLATE latin1_swedish_ci NOT NULL ,

`status` int(1) NOT NULL DEFAULT 0 ,

(72)

)

ENGINE=InnoDB

DEFAULT CHARACTER SET=latin1 COLLATE=latin1_swedish_ci AUTO_INCREMENT=3;

b. Implementasi struktur tabel berita DROP TABLE IF EXISTS `berita`; CREATE TABLE `berita` (

`id_berita` int(11) NOT NULL AUTO_INCREMENT ,

`user_id` int(6) NOT NULL ,

`judul` varchar(100) CHARACTER SET utf8 COLLATE utf8_general_ci NOT NULL ,

`keterangan` varchar(150) CHARACTER SET utf8 COLLATE utf8_general_ci NOT NULL ,

`detail` longtext CHARACTER SET utf8 COLLATE utf8_general_ci NOT NULL ,

`gambar` varchar(50) CHARACTER SET utf8 COLLATE utf8_general_ci NOT NULL ,

`tanggal` datetime NULL DEFAULT NULL , PRIMARY KEY (`id_berita`),

FOREIGN KEY (ùser_id`) REFERENCES ùsers` (ùser_id`) ON DELETE NO ACTION ON UPDATE NO ACTION,

INDEX `iuser_id` (`user_id`) USING BTREE )

ENGINE=InnoDB

c. Implementasi struktur tabel dt_tamu DROP TABLE IF EXISTS `dt_tamu`; CREATE TABLE `dt_tamu` (

(73)

`nm_tamu` varchar(50) CHARACTER SET latin1 COLLATE latin1_swedish_ci NOT NULL ,

`email_tamu` varchar(255) CHARACTER SET latin1 COLLATE latin1_swedish_ci NOT NULL ,

`pesan_tamu` text CHARACTER SET latin1 COLLATE latin1_swedish_ci NOT NULL ,

`tanggal` datetime NOT NULL , PRIMARY KEY (`id_tamu`),

INDEX `idtuser_id` (`user_id`) USING BTREE )

ENGINE=InnoDB

d. Implementasi struktur tabel events DROP TABLE IF EXISTS `events`; CREATE TABLE `events` (

`event_id` int(8) UNSIGNED NOT NULL AUTO_INCREMENT , `event_type` tinyint(1) UNSIGNED NOT NULL DEFAULT 0 , `title` varchar(64) CHARACTER SET latin1 COLLATE

latin1_swedish_ci NULL DEFAULT NULL ,

`description` text CHARACTER SET latin1 COLLATE latin1_swedish_ci NULL ,

`category_id` int(11) NOT NULL ,

`venue` varchar(64) CHARACTER SET latin1 COLLATE

latin1_swedish_ci NULL DEFAULT NULL , `user_id` int(6) NOT NULL ,

(74)

`checked` text CHARACTER SET latin1 COLLATE latin1_swedish_ci NULL ,

`s_date` date NULL DEFAULT NULL ,

`e_date` date NOT NULL DEFAULT '9999-00-00' ,

`x_dates` text CHARACTER SET latin1 COLLATE latin1_swedish_ci NULL ,

`s_time` time NULL DEFAULT NULL ,

`e_time` time NOT NULL DEFAULT '99:00:00' ,

`r_type` tinyint(1) UNSIGNED NOT NULL DEFAULT 0 , `r_interval` tinyint(1) UNSIGNED NOT NULL DEFAULT 0 , `r_period` tinyint(1) UNSIGNED NOT NULL DEFAULT 0 , `r_month` tinyint(1) UNSIGNED NOT NULL DEFAULT 0 , `r_until` date NOT NULL DEFAULT '9999-00-00' ,

`notify` tinyint(1) NOT NULL DEFAULT '-1' ,

`not_mail` varchar(255) CHARACTER SET latin1 COLLATE latin1_swedish_ci NULL DEFAULT NULL ,

`a_date` date NOT NULL DEFAULT '9999-00-00' , `m_date` date NOT NULL DEFAULT '9999-00-00' , `status` tinyint(1) NOT NULL DEFAULT 0 ,

PRIMARY KEY (`event_id`),

FOREIGN KEY (`category_id`) REFERENCES `categories`

(`category_id`) ON DELETE NO ACTION ON UPDATE NO ACTION, FOREIGN KEY (ùser_id`) REFERENCES ùsers` (ùser_id`) ON DELETE NO ACTION ON UPDATE NO ACTION,

INDEX ìeuser_id` (ùser_id`) USING BTREE , INDEX ìecategory` (`category_id`) USING BTREE

)

ENGINE=InnoDB

(75)

DROP TABLE IF EXISTS `categories`; CREATE TABLE `categories` (

`category_id` int(4) NOT NULL AUTO_INCREMENT , `name` varchar(40) CHARACTER SET latin1 COLLATE latin1_swedish_ci NOT NULL DEFAULT '' ,

`sequence` int(2) UNSIGNED NOT NULL DEFAULT 1 , `rpeat` tinyint(1) UNSIGNED NOT NULL DEFAULT 0 , `public` tinyint(1) UNSIGNED NOT NULL DEFAULT 1 ,

`color` varchar(10) CHARACTER SET latin1 COLLATE latin1_swedish_ci NULL DEFAULT NULL ,

`background` varchar(10) CHARACTER SET latin1 COLLATE latin1_swedish_ci NULL DEFAULT NULL ,

`check1` tinyint(1) UNSIGNED NOT NULL DEFAULT 0 , `label1` varchar(40) CHARACTER SET latin1 COLLATE latin1_swedish_ci NOT NULL DEFAULT 'approved' , `mark1` varchar(10) CHARACTER SET latin1 COLLATE latin1_swedish_ci NOT NULL DEFAULT 'ok' ,

`check2` tinyint(1) UNSIGNED NOT NULL DEFAULT 0 , `label2` varchar(40) CHARACTER SET latin1 COLLATE latin1_swedish_ci NOT NULL DEFAULT 'complete' , `mark2` varchar(10) CHARACTER SET latin1 COLLATE latin1_swedish_ci NOT NULL DEFAULT '✓' , `status` tinyint(1) NOT NULL DEFAULT 0 ,

PRIMARY KEY (`category_id`) )

ENGINE=InnoDB

(76)

`no_kontak` int(11) NOT NULL AUTO_INCREMENT , `user_id` int(6) NOT NULL ,

`nama` varchar(100) CHARACTER SET utf8 COLLATE utf8_general_ci NOT NULL ,

`email` varchar(100) CHARACTER SET utf8 COLLATE utf8_general_ci NOT NULL ,

`telepon` varchar(20) CHARACTER SET utf8 COLLATE utf8_general_ci NULL DEFAULT NULL ,

`pesan` longtext CHARACTER SET utf8 COLLATE utf8_general_ci NOT NULL ,

`tanggal` datetime NOT NULL , PRIMARY KEY (`no_kontak`),

INDEX `ikuser_id` (`user_id`) USING BTREE )

ENGINE=InnoDB

3.5.2 Implementasi Antarmuka 1. Halaman Pengunjung

Beranda

(77)

Gambar 3.37 Tampilan Beranda

Visi dan Misi

(78)

Gambar 3.38 Visi dan Misi

Tugas dan Fungsi Pokok

(79)

Gambar 3.39 Tugas dan Fungsi Pokok

Struktur Organisasi

(80)

Gambar 3.40 Struktur Organisasi

Detail

Gambar 3.41 berfungsi untuk melihat detail dari informasi yang pengguna pilih di bagian informasi di halaman utama web BPPPAKB Kabupaten bandung Barat.

(81)

Agenda

Gambar 3.42 berfungsi untuk melihat acara apa saja yang akan diselenggarakan (berikut dengan tanggal) oleh BPPPAKB Kabupaten bandung Barat.

(82)

Program Keluarga Berencana

Gambar 3.43 berfungsi untuk melihat program-program yang dijalankan oleh bidang Keluarga Berencana.

Gambar 3.43 Tampilan Program Keluarga Berencana

Program Keluarga Sejahtera

(83)

Gambar 3.44 Tampilan Program Keluarga Sejahtera

Program Pemberdayaan Perempuan dan Perlindungan Anak

(84)

Gambar 3.45 Tampilan Program Pemberdayaan Perempuan dan Perlindungan Anak

Galeri (Kunjungan Kuningan)

Gambar 3.46 berfungsi untuk melihat foto-foto kegiatan selama

mengunjungi Kabupaten Kuningan.

(85)

Galeri (Penghargaan)

Gambar 3.47 berfungsi untuk melihat penghargaan-penghargaan yang diterima oleh BPPPAKB Kabupaten Bandung Barat.

Gambar 3.47 Tampilan Galeri (Penghargaan)

Galeri (UPPKS Bantuan Alat Produksi)

(86)

Gambar 3.48 Tampilan Galeri (UPPKS Bantuan Alat Produksi)

Galeri (Pameran Hari Keluarga di Depok)

Gambar 3.49 berfungsi untuk melihat foto-foto selama mengikuti Hari Keluarga di Depok.

Gambar 3.49 Tampilan Galei (Pameran Hari Keluarga di Depok)

Galeri (Pameran Hari Keluarga di Lombok)

(87)

Gambar 3.50 Tampilan Galeri (Pameran Hari Keluarga di Lombok)

Galeri (Penyelenggaraan Hari Keluarga Tingkat Kabupaten)

(88)

Galeri (Pelatihan Manajemen)

Gambar 3.52 berfungsi untuk melihat foto-foto selama mengadakan pelatihan manajemen.

Gambar 3.52 Tampilan Galeri (Pelatihan Manajemen)

Galeri (Proses Pembuatan Abon Ikan)

(89)

Gambar 3.53 Tampilan Galeri (Proses Pembuatan Abon Ikan)

Galeri (Proses Pembuatan Keripik Singkong)

Gambar 3.54 berfungsi untuk melihat foto-foto selama proses pembuatan

(90)

Galeri (Proses Pembuatan Peyek Bayam)

Gambar 3.55 berfungsi untuk melihat foto-foto selama proses pembuatan peyek bayam yang dikerjakan oleh salah satu kelompok UPPKS di Kabupaten Bandung Barat.

Gambar 3.55 Tampilan Galeri (Proses Pembuatan Peyek Bayam)

Galeri (Proses Pembuatan Sirup Markisa)

(91)

Gambar 3.56 Tampilan Galeri (Proses Pembuatan Sirup Markisa)

Galeri (Rechecking Lomba UPPKS di Ngamprah)

Gambar 3.57 berfungsi untuk melihat foto-foto selama kegiatan Recheking lomba kelompok UPPKS di daerah Ngamprah, Kabupaten Bandung Barat.

(92)

Gambar 3.58 berfungsi untuk melihat foto-foto selama kegiatan Recheking lomba kelompok UPPKS di daerah Padalarang, Kabupaten Bandung Barat.

Gambar 3.58 Tampilan Galeri (Recheking Lomba UPPKS di Padalarang)

Buku Tamu

Gambar 3.59 berfungsi mengisi buku tamu, di halaman tersebut pengguna cukup mengisikan Nama, Email, dan Pesan pengguna bagi pengelola web BPPPAKB Kabupaten Bandung Barat. Pesan yang disampaikan oleh pengguna juga akan langsung ditampilkan setelah pengguna menekan tomol Submit.

(93)

Kontak

Gambar 3.60 berfungsi mengisi kontak, di halaman tersebut pengguna cukup mengisikan Nama, Email, Telepon dan Pesan pengguna bagi pengelola web BPPPAKB Kabupaten Bandung Barat. Di halamn tersebut juga ditampilkan alamat, nomor telepon, nomor fax, lokasi dari kantor BPPPAKB Kabupaten Bandung Barat.Yang membedakan dengan menu Buku Tamu adalah pesan yang pengguna sampaikan tidak akan ditampilkan.

Gambar 3.60 Tampilan Kontak

2. Halaman Administrator Login

(94)

Gambar 3.61 Tampilan Login

Beranda

Gambar 3.62 berfungsi sebagai halaman utama setelah pengguna melakukan login.

(95)

Ubah Data User

Gambar 3.63 berfungsi sebagai halaman bagi pengguna yang ingin mengubah data penggunanya, pada halaman tersebut user dapat mengubah nama user, nama lengkap, password, alamat, telepon, email, dan nip.

Gambar 3.63 Tampilan Data User

Berita

(96)

Gambar 3.64 Tampilan Berita

Tambah Berita

Gambar 3.65 berfungsi untuk menambah berita yang ada pada database,

pada halaman tersebut pengguna dapat mengisi judul berita, keterangan singkat, detail dari berita, dan gambar. Jika pengguna tidak memasukan gambar, maka

secara default field gambar pada database akan diisi ‘no_image.jpg’.

(97)

Ubah Berita

Gambar 3.66 berfungsi untuk mengubah berita yang ada pada database, pada halaman tersebut pengguna dapat mengubah judul berita, keterangan singkat, detail dari berita, dan gambar.

Gambar 3.66 Tampilan Ubah Berita

Buku Tamu

(98)

Gambar 3.67 Tampilan Buku Tamu

Kontak

Gambar 3.68 berfungsi untuk melihat siapa saja user yang telah mengirimkan pesan melalui menu kontak yang disediakan pada halaman pengunjung, pengguna yang dalam hal ini administrator dapat menghapus data

yang tidak diinginkan atau tidak diperlukan.

(99)

Agenda

Gambar 3.69 berfungsi untuk mengubah, menambah, atau menghapus

eventyang sudah selesai atau tidak diperlukan lagi, di halaman tersebut juga pengguna dapat menambah list kategori yang ada.

Gambar 3.69 Tampilan Agenda

Logout

(100)

Lupa Password

Gambar 3.71 berfungsi bagi pengguna yang lupa dengan password akunnya, pada halaman tersebut user cukup mengisi nip, nama user, nama lengkap user, dan email user.

(101)

BAB 4

KESIMPULAN DAN SARAN

4.1. Kesimpulan

Berdasarkan uraian yang telah dibahas pada bab-bab sebelumnya serta proses yang telah dilalui dalam pembuatan laporan kerja praktek ini maka diperoleh beberapa hal sebagai berikut:

1. Telah berhasil dilakukan Pembangunan Website Profil BPPPAKB Kabupaten Bandung Barat.

2. Web profil ini mempermudah masyarakat dalam mengenal BPPPAKB Kabupaten Bandung Barat.

3. Web profil ini mempercepat pegawai dalam penyampaian informasi kepada masyarakat.

4.2. Saran

Beberapa saran yang dapat penulis berikan adalah sebagai berikut :

1. Pembuatan web profil ini masih dapat dikembangkan lebih lanjut disesuaikan dengan berkembangnya spesifikasi kebutuhan pengguna.