BAB 1
PENDAHULUAN

1.1. LATAR BELAKANG

Djarum Super adalah sebuah merk rokok kretek yang cukup terkenal di Indonesia.
Djarum Super sendiri menyediakan sebuat situs portal dimana pada situs tersebut terdapat
profil Perusahaan Djarum Super. Selain itu, dari situs ini para pengunjung dapat membaca
artikel-artikel mengenai acara-acara yang diselenggarakan oleh Djarum Super sendiri
maupun acara yang disponsori Djarum Super. Disini juga dapat dibaca artikel-artikel yang
berasal dari masyarakat mengenai petualangan yang telah dilalui. Dengan memanfaatkan
teknologi web ini, Djarum Super juga dapat menjadikan portal situs mereka sebagai ajang
promosi sehingga keberadaan Djarum Super dapat lebih dikenal masyarakat luas.
Adapun visi dan misi dalam pembuatan ulang portal situs Djarum Super adalah :
VISI
• Memaanfaatkan sistem informasi melalui website dengan memanfaatkan
keunggulan Teknologi Informasi terkini untuk membangun kekuatan bisnis
terdepan dalam teknologi.
• Menjadi yang terbaik dalam memberikan kemudahan bagi para pengunjung
situs untuk megetahui acara-acara terbaru yang memiliki hubungan dengan
Djarum Super.
• Memberikan penyajian pelayanan yang terbaik untuk pengguna website dan
menjadikan website ini menjadi suatu bisnis yang memiliki prospek yang
bagus untuk masa yang akan datang.

MISI
• Terus menyajikan artikel-artikel yang enak untuk dibaca dan selalu up to date
• Membuat situs Djarum Super menjadi lebih baik dalam kinerja dan isi

http://contoh.in
 
 

1.2 TUJUAN PENULISAN

Tujuan dari pembuatan karya tulis ini adalah :
• Membahas bagaimana cara membuat dan merancang sebuah situs dengan
referensi situs asli dari perusahaan Djarum Super ( www.djarumsuper.com)
sehingga pembaca dapat mengetahui tahapan-tahapan yang dibutuhkan dalam
pengembangan sebuah situs sesuai prosedur dan sistematis.
• Memenuhi tugas akhir dari Mata Kuliah Web Database, yaitu membuat sebuah
situs portal dari Djarum Super

http://contoh.in
 
 

BAB 2
METODE PENELITIAN

2.1 METODE PERANCANGAN SISTEM

Metode perancangan yang kami terapkan dalam pembuatan situs ini adalah sebagai
berikut:

Sebelum melakukan pengembangan dari portal situs yang ada, petama-tama kami
melakukan analisis atas situs yang telah ada sebelumnya dengan mengobservasi secara
langsung dan mencoba menelusuri situs Djarum Super, menganalisis data, dan juga
menganalisis data situs, setelah analisis dilakukan maka selanjutnya dilakukan perencanaan
berupa tahapan-tahapan desain logis data, desain logis web data, desain fisikal data, dan
desain fisikal data web. Kemudian implementasi dilakukan dengan cara melakukan
pembuatan database dan coding menggunakan bahasa pemograman. Setelah coding selesai
dilakukan, maka coding tersebut digabungkan dengan desain web tersebut. Selanjutnya
dilakukan pengecekan terhadap sistem yang ada untuk menemukan apakah ada kesalahan
pada sistem. Setelah selesai, merapikan semua desain dalam portal situs tersebu.
Penjelasan lebih lengkap akan dijabarkan pada Bab Perancangan dan Hasil.

http://contoh.in
 
 

2.2 CARA KERJA SISTEM

HIRARKI WEB
PORTAL SITUS 
DJARUM SUPER

PENGUNJUNG  ADMIN

Petualangan  Acara  Produk  Lihat  Masukkan  Log 

Super  Super  Super Artikel  Artikel Out

Jurnal Petualangan  Tentang Djarum  Ubah Artikel 

Tips Petualangan  Penghargaan Djarum  Hapus Artikel 

Acara Petualangan 

Acara Musik 

Acara Olahraga 

http://contoh.in
 
 

USE CASE

Validasi Login 

Insert, Update, Delete 

Artikel  ADMIN

USERS 

Insert 

PROGRAMMER
Photo 

Insert 

Video 

http://contoh.in
 
 

BAB 3
PERANCANGAN DAN HASIL

3.1 REQUIREMENT ANALYSIS

Tahap awal untuk membuat sebuah web yaitu mengumpulkan kebutuhan data dari
perusahaan. Kelompok kami menggunakan teknik observasi dan mempelajari dokomen.
- Observasi yakni kami menganalisis secara sistematis dan melakukan evaluasi secara
langsung terjun ke lapangan dalam arti menjelajahi komponen apa saja yang ada di
website www.djarum-super.com.
- Mempelajari dokumen dimana kami mempelajari system yang ada, kemudian
menganalisa data apa saja yang diperlukan dari web yang dulu untuk web yang kami
buat sekarang dan menentukan tabel-tabel beserta isinya.

3.2 DATA ANALYSIS

Tabel dalam database Djarum Super adalah sebagai berikut :

NAMA 
TABEL  ISI TABEL  KETERANGAN 
AnggotaID  PrimaryKey 
Nama Pengguna  untuk melakukan log in 
Kode Sandi  untuk melakukan log in 
Anggota 
Nama Lengkap    
Email    
Telepon    
  
JenisArtikelID  Primary Key 
Jenis Artikel  Untuk mengelompokkan 
JenisArtikel 
artikel sesuai jenisnya 
  
Artikel  ArtikelID  Primary Key 
JudulArtikel    
IsiArtikel  Isi artikel paragraf 1 
IsiArtikel2  Isi artikel paragraf 2 
isiArtikel3  Isi artikel paragraf 3 
IsiArtikel4  Isi artikel paragraf 4 

http://contoh.in
 
 

GambarArtikel    
JenisArtikel  Foreign Key 
  
PhotoID  Primary Key 
JudulPhoto    
Photo 
Photo    
AnggotaID  Foreign Key 

3.3 WEB DATA ANALYSIS

Dalam web ini user di bagi menjadi 2 yaitu pengunjung dan admin dimana
pengunjung dapat mengakses semua menu dan sub menu yang ada dalam web ini, namun
tidak dapat mengakses bagian admin. Juga admin yang dapat log in untuk dapat masuk ke
halaman khusus admin dan melakukan penghapusan, perubahan, atau penambahan artikel
dan photo.

Hak akses pengunjung dan Admin :

User Hak akses
Pengunjung Membaca artikel dan acara yang ada, melihat
foto dan mengunduh video yang tertera dalam
website
Admin Memasukkan, menghapus, dan mengubah
artikel yang telah ada
Memasukkan dan menghapus photo yang ada.

PENGUNJUNG SITUS :
− BERANDA
Ada submenu yaitu Petualangan Super yaitu artikel yang menuliskan tentang aksi
petualangan yang pernah dilakukan dan memiliki berbagai tantangan, Acara Super
yaitu artikel tentang acara-acara yang diadakan dan disponsori oleh Djarum Super,
serta Produk Super yaitu mengenai Djarum Super.

− PETUALANGAN SUPER

http://contoh.in
 
 

Submenu dalam Petualangan Super yaitu Jurnal Petualangan yang berisi tentang jurnal
petualangan yang pernah dilakukan dan Tips Petualang yang berisi tips-tips bagi para
pengunjung situs baik secara umum maupun dalam melakukan petualangan dan
bagaimana cara bertahan dalam bertualang itu sendiri.

− ACARA SUPER
Menu dalam Acara Super adalah acara-acara yang dibuat maupun disponsori oleh
Djarum Super yang berupa : Acara Petualangan berupa acara-acara yang berhubungan
petualangan dan memiliki tantangan, Acara Musik berupa acara-acara yang
behubungan dengan musik, serta Acara Olahraga berupa acara-acara yang
berhubungan dengan olahraga.

− PRODUK SUPER
Sub menu berisikan Tentang Djarum Super yaitu informasi mengenai rokok kretek
Djarum Super serta Penghargaan yaitu apa saja penghargaan yang pernah diterima
oleh Djarum Super.

− INFO JADWAL
Berupa info mengenai jadwal event yang diadakan Djarum Super untuk para pecinta
offroad dan rally, yaitu Djarum Super Real Adventure Offroad

− PHOTO & VIDEO

Berisi kumpulan foto-foto dari acara-acara yang diselenggarakan Djarum Super, serta
video iklan-iklan Djarum Super yang dapat di unduh.

ADMIN :
− BERANDA
Berisi informasi siapa yang sedang log in juga profil dari admin, yaitu nama lengkap,
email, dan telepon. Selain itu juga ada kolom pencarian sehingga admin dapat mencari
artikel yang ingin diubah atau dihapus berdasarkan judul artikel yang ada. Disini

http://contoh.in
 
 

admin dapat melakukan proses log out bila telah selesai agar tidak ada pihak yang
tidak bertanggung jawab dapat melakukan hal-hal yang tidak diinginkan.

− ARTIKEL
Menampilkan semua artikel yang ada di database Djarum Super, dan dapat dilakukan
penghapusan atau perubahan pada artikel-artikel tersebut.

− MASUKKAN ARTIKEL
Untuk memasukkan artikel baru pada database Djarum Super dan nanti akan tampil di
bagian pengunjung.

− MASUKKAN FOTO
Untuk memasukkan foto-foto baru pada database Djarum Super dan nanti akan tampil
di halaman Photo dan Video.

3.4 LOGICAL DATA DESIGN

http://contoh.in
 
 

3.5 LOGICAL WEB DATA DESIGN

BERANDA : Ini adalah tampilan beranda dimana user atau pengguna dapat melihat isi dari
artikel, foto dan juga mengunduh video. Adapun search box untuk memudahkan user menemukan
artiikel yang diinginkan. Pada footer terdapat menu login untuk admin dapat masuk ke halaman
admin.

http://contoh.in
 
 

PETUALANGAN SUPER

http://contoh.in
 
 

- JURNAL PETUALANGAN

http://contoh.in
 
 

- TIPS PETUALANGAN

http://contoh.in
 
 

ACARA SUPER

http://contoh.in
 
 

- ACARA PETUALANGAN

http://contoh.in
 
 

ACARA MUSIK

http://contoh.in
 
 

ACARA OLAHRAGA

http://contoh.in
 
 

PRODUK SUPER

http://contoh.in
 
 

- TENTANG DJARUM SUPER

http://contoh.in
 
 

- PENGHARGAAN

http://contoh.in
 
 

PHOTO & VIDEO : Untuk para user yang ingin melihat gallery photo-photo dan video bisa
langsung membuka photo dan video kemudian ada juga pilihan untuk mengunduh video yang ada
dalam artikel.

http://contoh.in
 
 

JADWAL

http://contoh.in
 
 

HASIL PENCARIAN

http://contoh.in
 
 

LOGIN ADMIN

ADMIN_BERANDA : Berikut adalah contoh tampilan admin , dimana admin memiliki tampilan
beranda , admin dapat melihat artikel , kemudian mengupdate artikel dan tampilan log out .

http://contoh.in
 
 

ADMIN_LIHAT ARTIKEL : Jika admin ingin melakukan update atau penghapusan artikel,
admin dapat mengisi form di bawah ini untuk menentukan artikel mana yang akan di ubah

ADMIN_HAPUS & UBAH ARTIKEL

http://contoh.in
 
 

ADMIN_UBAH ARTIKEL : Jika admin ingin melakukan update artikel, admin dapat mengisi
form di bawah ini untuk menentukan artikel mana yang akan di ubah, selanjutnya admin dapat
browse file kemudian pilih simpan untuk melakukan update

http://contoh.in
 
 

ADMIN_TAMBAH ARTIKEL

http://contoh.in
 
 

ADMIN_HASIL PENCARIAN

http://contoh.in
 
 

3.6 PHYSICAL DATA DESIGN

Database yang kami gunakan pada situs ini adalah MySql dengan web server nya
yaitu xampp.

NAMA 
ISI TABEL  DATA TYPE  KETERANGAN 
TABEL 
AnggotaID  int(2)  PrimaryKey 
Nama Pengguna  varchar(50)    
Kode Sandi  varchar(100)    
Anggota 
Nama Lengkap  varchar(100)    
Email  varchar(100)    
Telepon  int(20)    
           
JenisArtikelID  int(2)  Primary Key 
Jenis Artikel 
JenisArtikel  varchar(100)    
           
ArtikelID  int(2)  Primary Key 
JudulArtikel  varchar(100)    
IsiArtikel  varchar(2000)    
IsiArtikel2  varchar(2000)    
Artikel  isiArtikel3  varchar(2000)    
IsiArtikel4  varchar(2000)    
GambarArtikel  varchar(100)    
AnggotaID  int(2)  Foreign Key 
JenisArtikelID  int(2)  Foreign Key 
           
PhotoID  int(2)  Primary Key 
JudulPhoto  varchar(100)    
Photo 
Photo  varchar(100)    
AnggotaID  int(2)  Foreign Key 

3.7 PHYSICAL WEB DATA DESIGN

Situs Djarum Super adalah sebuah situs yang akan dibuat menggunakan bahasa
pemrograman PHP. Pembuatan website ini juga akan menggunakan database MySQL untuk
menyimpan database yang akan diperlukan. Halaman-halaman website akan memuat beberapa
gambar-gambar agar halaman website terlihat lebih menarik.
JQuery : Pada header untuk menampilkan pergeseran gambar dan video gallery.

http://contoh.in
 
 

BAB 4
KESIMPULAN DAN SARAN

4.1 KESIMPULAN
Dari situs Djarum Super yang telah dibuat ulang, dapat diambil kesimpulan
bahwa dari situs yang hanya berupa situs statis, diubah menjadi situs yang dinamis dimana
situs ini terhubung dengan database dan membuat lebih cepat kinerja nya. Selain itu juga
ditambahkan halaman khusus admin sehingga dapat melakukan penambahan, pengubahan
dan penghapusan artikel serta penambahan dan penghapusan foto.

4.2 SARAN
Tidak ada.

http://contoh.in