Ensiklopedia Anak Berbasis Website Chapter III V

BAB 3

ANALISIS DAN PERANCANGAN SISTEM

3.1 Analisis Sistem

Analisis merupakan penguraian sistem informasi yang sedang berjalan secara utuh
kedalam bagian-bagian komponennya dengan maksud untuk mengidentifikasi dan
mengevaluasi pemasalahan-permasalahan dan hambatan yang terjadi dan
kebutuhan-kebutuhan yang diharapkan sehingga di usulkan kebaikan-kebaikannya

3.2 Perancangan Sistem

Perancangan sistem merupakan tahap selanjutnya setelah analisa sistem,
mendapatkan gambaran dengan jelas tentang apa yang dikerjakan pada analisa
sistem, maka dilanjutkan dengan memikirkan bagaimana membentuk sistem
tersebut.

Perancangan sistem adalah suatu fase dimana diperlukan suatu keahlian
perancangan untuk elemen-elemen komputer yang akan mengunakan sistem yaitu
pemilihan peralatan dan program komputer untuk sistem yang baru.


Universitas Sumatera Utara

39

3.2.1 Diagram konteks

Proses ini mewakili dari dari seluruh sistem. Diagram konteks menggambarkan
input atau output suatu sistem dengan dunia luar atau dunia kesatuan luar. Disini
dijelaskan bahwa peran admin dalam sistem informasi ini adalah menginput data,
mengedit data serta menghapus data sedangkan pembaca dapat pembaca dapat
mencari informasi, meninggalkan komentar dan menerima informasi dari sistem
informasi ini.

Gambar 3.1 Diagram Konteks Ensiklopedia Anak

3.2.2 Data flow diagram (DFD)

Data flow diagram digunakan oleh analis sistem untuk merancang sistem
pemrosesan informasi tetapi juga sebagai cara untuk model seluruh organisasi.

Disini akan digambarkan DFD dari Ensiklopedia Anak

Universitas Sumatera Utara

40

Gambar 3.2 DFD Ensiklopedia Anak

3.2.3 Perancangan antarmuka

Perancangan antarmuka dibuat untuk menggambarkan tampilan program yang
akan digunakan oleh pengguna untuk berinteraksi dengan sistem informasi yang
dibuat. Perancangan dibuat berdasarkan tampilan antarmuka input saat sistem
informasi diimplementasikan.

Universitas Sumatera Utara

41

Gambar 3.3 Perancangan Antarmuka Ensiklopedia Anak


3.2.4 Entity relationship diagram (ERD)

Adapun dalam perancangan suatu sistem sangant diperlukan sebuah gambaran
ERD untuk mempermudah dilakukannya analisis dan memberikan gambaran alur
kerja yang jelas untuk mempermudah pengerjaan sistem sejak awal. ERD berikut
akan menjelaskan setiap entitas yang dipakai dalam sistem dan atribut-stribut apa
saja yang terdapat dalam setiap entitas tersebut.

Universitas Sumatera Utara

42

Gambar 3.4 Entity Relationship Diagram (ERD) Ensiklopedia Anak

3.2.5 Perancangan database

Pada perancangan basis data (databases) dipersiapkan tempat untuk menampung
data di server, data tersebut nantinya akan diproses oleh program yang kita buat
pada tahap pemrograman, baik penambahan, pengeditan, panghapusan dan

menampilkan isi database ke halaman website. Adapun database yang dibuat
adalah database “ensiklopedia-anak” dengan tabel-tabel sebagai berikut:

Universitas Sumatera Utara

43

Tabel 3.1 Tabel admin
Nama Field

Type

Size

id_user

Int

5


username

Varchar

50

password

Varchar

50

Keterangan
primary key

Tabel 3.2 Tabel isiensiklopedia
Nama Field

Type


Size

id_kategori

Int

3

judul

Varchar

100

isi

Text

tanggal


Date

gambar

Text

Keterangan
primary key

Tabel 3.3 Tabel kategori
Nama Field

Type

Size

id_kategori

Int


3

kategori

Varchar

35

Keterangan
primary key

Tabel 3.4 Tabel komentar
Nama Field
id_kategori

Type
Int

Size
3


Keterangan
primary key

Universitas Sumatera Utara

44

nama

Varchar

50

email

Varchar

50


komentar

Text

tanggal

Date

Tabel 3.5 Tabel pesan
Nama Field

Type

Size

id_pesan

Int

3


nama

Varchar

50

email

Varchar

50

subyek

Varchar

50

pesan

Text

tanggal

Date

Keterangan
primary key

3.2.6 Flowchart

Disini flowchart menjelaskan alur kerja mulai dari awal sampai akhir dari sistem
yang akan dibuat. Flowchart berikut menjelaskan secara rinci alur kerja sistem
Ensiklopedia Anak

Universitas Sumatera Utara

45

Gambar 3.5 Flowchart Tampilan Pembaca

Universitas Sumatera Utara

46

Gambar 3.6 Flowchart login Admin

Universitas Sumatera Utara

BAB 4

IMPLEMENTASI SISTEM

4.1 Pengertian Implementsi Sistem

Implementasi sistem adalah prosedur yang dilakukan untuk menyelesaikan desain
yang ada dalam dokumen desain sistem yang disetujui dan menguji, menginstal,
memulai, serta menggunakan sistem yang baru atau sistem yang diperbaiki.
Penggunaan suatu komputer untuk pemecahan masalah membutuhkan suatu
sistem yang baik, sehingga memungkinkan berhasilnya komputer dalam
melaksanakan tugasnya, yaitu mengolah data menjadi informasi.

Implementasi sistem mempunyai 4 tahap, yaitu :
1. Membuat dan menguji basis data & jaringan.
Penerapan sistem yang baru atau perbaikan sistem dibuat pada basis data dan
jaringan yang telah ada. Jika penerapan sistem yang baru memerlukan basis
data dan jaringan yang baru atau dimodifikasi, maka sistem yang baru ini
biasanya harus diimplementasikan sebelum pemasangan program komputer.
2. Membuat dan menguji program.
Merupakan tahap pertama untuk siklus pengembangan sistem yang spesifik
bagi programer. Bertujuan untuk mengembangkan rencana yang lebih rinci
dalam pengembangan dan pengujian program komputer yang baru.

Universitas Sumatera Utara

48

3. Memasang dan menguji sistem baru.
Tahap ini dilakukan untuk menyakinkan bahwa kebutuhan integrasi sistem
baru terpenuhi.

4. Mengirim sistem baru kedalam sistem operasi.
Tujuan tahap ini adalah untuk mengubah secara perlahan – lahan sistem lama
menjadi sistem baru sehingga perlu dilakukan pemasangan basis data yang
akan digunakan pada sistem baru.

4.2 Tujuan Implementasi Sistem

Tujuan Implementasi sistem adalah sebagai berikut:
1. Menyelesaikan desain sistem yang telah disetujui sebelumnya.
2. Memastikan bahwa pemakai (user) dapat mengoperasikan sistem baru.
3. Menguji apakah sistem baru tersebut sesuai dengan pemakai.
4. Memastikan bahwa konversi ke sistem baru berjalan yaitu dengan membuat
rencana, mengontrol dan melakukan instalasi baru secara benar.

4.3 Komponen Utama dalam Sistem

Adapun komponen-komponen utama dalam pembuatan website Ensiklopedia
Anak adalah sebagai berikut:

Universitas Sumatera Utara

49

4.3.1 Perangkat keras (hardware)

Perangkat keras yang dibutuhkan dalam pembuatan website ensiklopedia anak ini
antara lain:
1. Prosesor
2. Harddisk
3. Memori
4. Monitor
5. Keyboard
6. Mouse

4.3.2 Perangkat lunak (software)

Adapun software yang digunakan dalam pembuatan website ensiklopedia anak ini
adalah :
1. System Opersai Ms. Windows 8.1
2. Google Chrome sebagai browser
3. Xampp Control Panel v 3.2.1
4. Sublime text 3

4.3.3 Tenaga pelaksana (brainware)

Manusia yang terlibat dalam mengoperasikan atau pemakaian serta mengatur
sistem di dalam perangkat komputer. Dapat diartikan juga sebagai perangkat

Universitas Sumatera Utara

50

intelektual yang mengoperasikan dan juga mengeksplorasi kemampuan dari
perangkat keras (hardware) maupun perangkat lunak (software).

4.4

Tampilan Website Ensiklopedia

Adapun tampilan program yang dirancang penulis adalah sebagai berikut:
1. Tampilan halaman utama
Disini ditampilkan halaman utama, tersedia menu Beranda, Tentang Kami,
dan Konten. Dihalaman utama terdapat halaman konten yang terdiri dari 5
konten yang dapat kita pilih. Dihalaman ini juga terdapat artikel terbaru yang
baru di update.

Universitas Sumatera Utara

51

Gambar 4.1 Tampilan halaman utama

Universitas Sumatera Utara

52

2. Tampilan halaman tentang kami
Dihalaman tentang kami berisi tentang tujuan dibuatnya website ensiklopedia
anak ini dengan tampilan gambar yang interaktif

Gambar 4.2 Tampilan halaman tentang kami

3. Tampilan halaman konten
Pada bagian ini terdapat 5 jenis bacaan yang akan dibaca, pada menu ini
tampilan akan muncul bila di klik di jenis atau konten bacaan. Semua artikel
berdasarkan konten yang dipilih akan muncul

Universitas Sumatera Utara

53

Gambar 4.3 Tampilan halaman konten

4.5 Tampilan Halaman Admin

Adapun tampilan program yang dirancang penulis untuk halaman admin adalah
sebagai berikut:

Universitas Sumatera Utara

54

1. Tampilan halaman login admin
Di halaman ini ditampilkan kotak dialog untuk memasukkan username dan
password, apabila password atau username yang dimasukkan salah, maka
akan ada pesan ‘Username atau Password Salah”. Apabila benar maka
langsung masuk ke halaman dashboard.

Gambar 4.4 Tampilan halaman login admin

2. Tampilan halaman dashboard
Pada halaman ini, dibagian sebelah kiri terdapat menu beranda, artikel dan
komentar. Beranda merupakan tampilan awal saat setelah login admin, artikel
merupakan halaman untuk menambahkan, menghapus dan mengedit artikel,
komentar merupakan halaman untuk melihat komentar yang masuk. Dibagian

Universitas Sumatera Utara

55

kiri atas halaman terdapat kotak yang berisi foto admin, dan terdapat button
logout untuk keluar dari halaman admin

Gambar 4.5 Tampilan halaman dashboard

3. Tampilan halaman artikel
Di halaman ini terdapat 5 kolom tabel masing-masing adalah gambar, judul,
waktu update, kategori dan proses. Dibagian proses terdapat 3 button yaitu
lihat, sunting dan hapus. Button melihat untuk melihat hasil jadi ke halaman
utama website, tombol sunting untuk mengedit artikel dan tombol hapus
untuk menghapus artikel. Dibagian kanan atas terdapat button tambah artikel
dimana admin dapat menambah artikel

Universitas Sumatera Utara

56

Gambar 4.6 Tampilan halaman artikel

4. Tampilan button tambah artikel di halaman artikel
Dihalaman ini digunakan untuk menambah artikel, terdapat 4 kategori yang
harus diisi yaitu judul artikel, kategori, gambar, dan isi artikel dan terdapat
tombol simpan untuk menyimpan artikel.

Gambar 4.7 Tampilan button tambah artikel halaman artikel

Universitas Sumatera Utara

57

5. Tampilan halaman komentar
Dihalaman ini berisi daftar komentar yang terhubung dari website utama.
Terdapat kolom identitas, komentar, waktu dan proses. Di kolom proses
terdapat 2 button yaitu butto lihat dan hapus.

Gambar 4.8 Tampilan halaman komentar

Universitas Sumatera Utara

BAB 5

KESIMPULAN DAN SARAN

5.1 Kesimpulan

Dari hasil pembahasan tentang perancangan website ensiklopeda ini, maka penulis
dapat mengambil beberapa kesimpulan diantaranya adalah sebagai berikut :
1

Dengan adanya website ensiklopedia anak ini diharapkan keinginan anak
untuk membaca meningkat.

2

Untuk menarik minat pembaca, perlu dibuat rancangan tampilan yang
menarik.

3

Dengan adanya ensiklopedia anak berbasis website diharapkan pembaca
dapat membaca dimana pun mereka berada dengan adanya bantuan internet.

5.2 Saran

Dari hasil pembahasan tentang perancangan website ensiklopeda ini, maka penulis
dapat memberi saran sebagai berikut :
1. Hendaknya dengan dibuat website ensiklopedia anak ini dapat menarik minat
anak membaca.
2. Untuk implementasi website ini kedepannya akan dibuat lebih baik lagi.

Universitas Sumatera Utara