DPPL

DOKUMEN PERANCANGAN PERANGKAT LUNAK

IZI AUTO APKOR
Untuk :
Tugas Proyek Mata Kuliah Rekayasa Perangkat Lunak
Dipersiapkan Oleh :
KELOMPOK 1
Bisma Aulia F1E118006

Putri Setya Lestari F1E118011

Ahmad Zafar Alwa Silah F1E118014

Panji Al-Fath F1E118033

PROGRAM STUDI SISTEM INFORMASI

FAKULTAS SAINS DAN TEKNOLOGI
UNIVERSITAS JAMBI
2019

Nomor Dokumen Halaman

Prodi Sistem Informasi
DPPL-IZI AUTO APKOR 1/25
Universitas Jambi
Revisi

Prodi Sistem Informasi UNJA DPPL-IZI AUTO Halaman 1 dari 25

APKOR
 DAFTAR PERUBAHAN

Revisi Deskripsi
A

INDEX - A B C D E F G

Prodi Sistem Informasi UNJA DPPL-IZI AUTO Halaman 2 dari 25

APKOR
 Daftar Halaman Perubahan

Halaman Revisi Halaman Revisi

Prodi Sistem Informasi UNJA DPPL-IZI AUTO Halaman 3 dari 25

APKOR
Prodi Sistem Informasi UNJA DPPL-IZI AUTO Halaman 4 dari 25
APKOR
 Daftar Isi

1. Pendahuluan.....................................................................................................Error: Reference source not found

1.1 Tujuan Penulisan Dokumen.................................................................Error: Reference source not found
1.2 Lingkup Masalah..................................................................................Error: Reference source not found
1.3 Definisi dan Istilah...............................................................................Error: Reference source not found
1.4 Aturan Penamaan dan Penomoran........................................................Error: Reference source not found
1.5 Referensi...............................................................................................Error: Reference source not found
1.6 Ikhtisar Dokumen.................................................................................Error: Reference source not found
2 Rancangan Lingkungan Implementasi.........................................................Error: Reference source not found
3 Perancangan Data.........................................................................................Error: Reference source not found
3.1 Daftar Tabel..............................................................................................................................................9
3.2 Struktur Tabel.......................................................................................Error: Reference source not found
3.3 Skema Relasi........................................................................................Error: Reference source not found
4 Perancangan arsitektural...............................................................................Error: Reference source not found
4.1 Struktur Program yang diperoleh............................................................................................................16
4.2 Dekomposisi Fungsional Modul...........................................................Error: Reference source not found
5 Perancangan Antarmuka.................................................................................................................................19
5.1 Aturan Perancangan Antarmuka.............................................................................................................19
5.2 Daftar Antarmuka Pemakai.....................................................................................................................20
5.3 Spesifikasi Antarmuka............................................................................................................................21
5.3.1 Spesifikasi Layar Utama.................................................................................................................21
5.3.2 Spesifikasi Objek-objek pada Layar...............................................................................................22
6 Lampiran

Prodi Sistem Informasi UNJA DPPL-IZI AUTO Halaman 5 dari 25

APKOR
 Daftar Gambar

Prodi Sistem Informasi UNJA DPPL-IZI AUTO Halaman 6 dari 25

APKOR
1. Pendahuluan

1.1 Tujuan
Dokumen Deskripsi Perancangan Perangkat Lunak (DPPL) berrtujuan untuk
mendefinisikan perancangan perangkat lunak IZI Auto Apkor yang akan dikembangkan.
Tujuan dari penulisan dokumen ini adalah untuk memberikan penjelasan mengenai
perangkat lunak yang akan dibangun baik berupa gambaran umum maupun penjelasan
detil dan menyeluruh.

1.2 Lingkup Masalah

IZI Auto Apkor adalah sebuah aplikasi berbasis web yang memiliki fungsi utama
untuk berita dan pendaftaran bagi UKM yang terdapat di Universitas Jambi. Pengguna
yang berperan sebagai admin dapat melakukan pendaftaran, sign in, melihat record data
pendaftar. Sedangkan si pengguna biasa dapat melihat berita terbaru mengenai UKM dan
dapat pula mendaftar ke UKM yang dituju. Sehingga, permasalahan yang diangkat dalam
menyelesaikan penelitian ini yaitu bagaimana mahasiswa bisa melihat daftar ukm dan
berita beritanya lebih mudah dan melakukan pendaftaran secara mudah.

1.3 Definisi, Akronim dan Singkatan

Tabel 1. Definisi, Singkatan dan Akronim

Istilah, Akronim dan

Keterangan
Singkatan

DPPL Dokumen Perancangan Perangkat Lunak,

atau sering disebut sebagai Software
Requirements Spesification (SRS), dan
merupakan spesifikasi dari perangkat lunak

Prodi Sistem Informasi UNJA DPPL-IZI AUTO Halaman 7 dari 25

APKOR
 yang akan dikembangkan..

1.4 Aturan Penamaan dan Penomoran

Beberapa aturan penamaan dan penomoran pada perangkat lunak ini

adalah: tbl_[xxxx], adalah kode yang digunakan untuk aturan penamaan bagi
nama-nama tabel yang terdapat pada IZI Auto Apkor, dengan xxxx adalah
serangkaian huruf dari nama tabel yang bersangkutan.

1.5 Referensi
a. Spesifikasi Kebutuhan Perangkat Lunak IZI Auto Apkor

1.5 Ikhtisar Dokumen

Pada intinya, dokumen DPPL ini menjelaskan mengenai perancangan
perangkat lunak, dimana merupakan transformasi dari Use Case Diagram pada
dokumen SKPL ke dalam bentuk perancangan. Dengan mengacu pada hasil
collect requirement dan analisis yang tertuang pada dokumen SKPL, dokumen ini
menjelaskan perancangan modul-modul perangkat lunak yang akan digunakan
sesuai dengan SKPL beserta dekomposisi modulnya, tabel-tabel yang akan
diimplementasikan, algoritma & pernyataan-pernyataan MySQL yang akan
digunakan, serta perancangan hasil tampilan (output) sistem pada layar monitor.

Dokumen ini secara garis besar terdiri dari tiga bab dengan perincian
sebagai berikut:

a. Bab 1 Pendahuluan, merupakan pengantar

dokumen DPPL yang berisi tujuan penulisan dokumen, lingkup masalah
pengembangan perangkat lunak, juga memuat definisi, akronim dan istilah
yang digunakan serta deskripsi umum dokumen yang merupakan ikhtisar
dokumen DPPL.
b. Bab 2 Rancangan Lingkungan
Implementasi, menjelaskan spesifikasi hardware, software, basis data yang
akan digunakan untuk implementasi sistem.

Prodi Sistem Informasi UNJA DPPL-IZI AUTO Halaman 8 dari 25

APKOR
 c. Bab 3 Perancangan Data, yang berisikan
informasi daftar tabel, conceptual data model, dekomposisi fungsional
model,
d. Bab 4 Perancangan Arsitektural,
menjelaskan informasi hubungan antarmuka sistem dengan tabel sistem
e. Bab 5 Perancangan Antarmuka, yang
bersikan desain antarmuka sistem yang akan dibangun
f. Bab 6 Perancangan Prosedural, menjelaskan
fungsi-fungsi dari modul yang terdapat pada sistem

2. Rancangan Lingkungan Implementasi

Sistem ini di implemetasikan dalam lingkungan sebagai berikut :

a. Sistem operasi : Windows 10

b. Development Tools : Balsamiq Mockups 3
c. Bahasa pemrograman : PHP Framework Laravel
d. Database management : MySQL
3. Perancangan Data

3.1 Daftar Tabel

Nama Tabel Primary Key Data Store Deskripsi Isi
Tbl_Admin Id_UKM UKM Tbl_Admin adalah
basis data yang
berisikan data UKM
pengguna IZI Auto
Apkor sebagai
admin
Tbl_Info_UKM Id_UKM Info_UKM Tbl_Info_UKM
adalah basis data
yang berisikan info
UKM secara
lengkap.
Tbl_UKM_Berita Id_Berita UKM_Berita Tbl_UKM_Berita
adalah basis data
yang berisikan
berita-berita yang
akan diposting
kedalam halaman
website.
Tbl_Pendaftaran Id_Calon Pendaftaran Tbl_Pendaftaran
adalah basis data
yang berisikan
daftar calon anggota

Prodi Sistem Informasi UNJA DPPL-IZI AUTO Halaman 9 dari 25

APKOR
 yang mendaftar.

3.2 Struktur Tabel

3.2.1 Tabel Admin

Nama Database : Project_RPL

Nama Tabel : Tbl_Admin

Primary Key : Id_UKM

Field Jenis Data Ukuran Key Keterangan

id Int 3 Primary, Auto ID Pengguna /
Increment Hak Akses
name Varchar 35 - Nama
Pengguna
Password Varchar 20 - Password
(Login) Admin
Email Vachar 30 - Email UKM
Admin
No.HP Varchar 13 - No.HP
pemegang akun
admin

3.2.2 Tabel Berita UKM

Nama Database : Project_RPL

Nama Tabel : Tbl_Info_UKM

Primary Key : Id_UKM

Field Jenis Data Ukuran Key Keterangan

Id_UKM Int 3 Primary, Auto ID Pengguna /
Incremet Hak Akses
Isi_Info Varchar 255 - Isi dari Info
UKM.
Gambar Varchar 25 - Gambar dari
UKM.

3.2.3 Tabel Info UKM

Nama Database : Project_RPL

Nama Tabel : Tbl_UKM_Berita

Primary Key : Id_Berita

Field Jenis Data Ukuran Key Keterangan

Prodi Sistem Informasi UNJA DPPL-IZI AUTO Halaman 10 dari 25

APKOR
Id_UKM Int 3 foreign ID Pengguna /
Hak Akses
Id_berita Int 3 Primary, Auto ID dari berita
Increment yang diposting
Isi_berita varchar 255 - Isi dari berita
UKM.
Gambar Varchar 25 - Gambar dari
berita UKM.

3.2.4 Tabel Pendaftaran

Nama Database : Project_RPL

Nama Tabel : Tbl_Pendaftaran

Primary Key : NIM

Field Jenis Data Ukuran Key Keterangan

Id_UKM Int 3 foreign ID Pengguna /
Hak Akses
Nama varchar 255 - Nama calon
pendaftar
NIM Varchar 25 Primary NIM calon
pendaftar
Prodi Varchar 20 - Prodi asal calon
anggota
pendaftar
Fakultas Varchar 20 - Fakultas asal
calon anggota
pendaftar
No_Hp Varchar 13 - No.Hp calon
pendaftar
Email Varchar 20 - email calon
pendaftar
Tgl_Lahir Varchar 20 - Tanggal lahir
calon pendaftar
Jenis_Kelamin Varchar 10 - Jenis kelamin
calon pendaftar
Foto Varchar 25 - Foto calon
pendaftar
File_yang_ Varchar 25 - File kebutuhan
dibutuhkan untuk calon
pendaftar
File_yang_ Varchar 25 - File kebutuhan
dibutuhkan_2 untuk calon
pendaftar

3.3 Skema Relasi

Berisi skema rancangan hubungan fisik antar tabel pada basis data yang digunakan oleh
perangkat lunak.

Prodi Sistem Informasi UNJA DPPL-IZI AUTO Halaman 11 dari 25

APKOR
4. Perancangan Arsitektural
4.1 Kajian Data dan Aliran Data

Model Analisis (USE CASE)

Prodi Sistem Informasi UNJA DPPL-IZI AUTO Halaman 12 dari 25

APKOR
Arsitektur Perangkat Lunak (Fisik)

Prodi Sistem Informasi UNJA DPPL-IZI AUTO Halaman 13 dari 25

APKOR
Prodi Sistem Informasi UNJA DPPL-IZI AUTO Halaman 14 dari 25
APKOR
Prodi Sistem Informasi UNJA DPPL-IZI AUTO Halaman 15 dari 25
APKOR
4.2 Struktur Program yang diperoleh
Structure Chart (SC) merepresentasikan organisasi komponen program atau
modul secara hirarki serta mengimplikasikan suatu hirarki kontrol. Notasi yang
digunakan merepresentasikan hirarki tersebut menggunakan diagram pohon.
Fungsi pada SC direpresentasikan sebagai bujur sangkar, input dan output yang
nantinya diimplementasikan sebagai parameter atau variabel bersama
digambarkan dengan panah. SC untuk IZI Auto Apkor diperlihatkan pada gambar
berikut.

Izi Auto Apkor

Pengelolaan Pengelolaan
Pendaftaran Pengumuman
akses Admin UKM

Pemilihan Pengumuman
Kelola Data Kelola Data UKM anggota
UKM
Akses Admin

Tambah data Tambah info

Login ukm
admin Input data
pendaftaran
Hapus data Ubah info ukm
Logout
admin

Lihat info ukm

Edit data
admin
Hapus info
ukm

Prodi Sistem Informasi UNJA DPPL-IZI AUTO Halaman 16 dari 25

APKOR
Secara logic IZI Auto Apkor dibagi ke dalam 4 modul. Dekomposisi logik dari
modul tersebut diperlihatkan pada tabel berikut:

Tabel 2 Dekomposisi Logik Modul

Kode Keterangan
Modul Nama Proses Nama Fungsi
Proses

Kelola Data 1.1 Login Login

Akses Logout Logout

Kelola Data 1.2 Tambah Data Tambah Data Admin

Admin Admin Ubah Data Admin
Ubah Data Admin Hapus Data Admin
Hapus Data Admin Lihat Data Admin
Lihat Data Admin

Pengelolaan 2.1 Pengelolaan UKM Tambah Info UKM

Admin UKM Ubah Info UKM
Hapus Info UKM
Lihat Info UKM

Pendaftaran 3.1 Pemilihan UKM Pemilihan UKM

3.2 Input Data Pemilihan UKM

Pendaftaran

Pengumuman 4.1 Pengumuman Pengumuman

Anggota Anggota

KoneksiDB KoneksiDB Modul untuk

melakukan koneksi
dengan database

Prodi Sistem Informasi UNJA DPPL-IZI AUTO Halaman 17 dari 25

APKOR
4.3 Dekomposisi Fungsional Modul

No Fungsi/proses Data Input Data Otput Keterangan

[SKPL.IZ Login Username, Status login Fungsi ini

I AUTO Password sebagai
APKOR-
proses login
001]
superadmin

[SKPL.IZI Pendaftaran Data Status Masukkan

AUTO admin pendaftaran pendaftaran field
pendaftaran
APKOR-
oleh admin
002]

[SKPL.IZI Tambah data Nama, Status input Memasukkan

AUTO admin username, data data akses
password admin
APKOR-
003]

[SKPL.IZI Login Admin Username, Status login Fungsi ini

AUTO Password sebagai
APKOR- proses login
004] admin UKM

[SKPL.IZI Logout Status logout Fungsi ini

AUTO sebagai
APKOR- proses logout
005] admin UKM

[SKPL.IZI Posting berita Data berita Status berita Posting

AUTO UKM di posting berita oleh
APKOR- admin UKM
006]

[SKPL.IZI Hapus berita & Field berita Status berita Hapus & edit
AUTO ubah berita di edit berita oleh
APKOR- admin UKM
007]

[SKPL.IZI Buat form Data Status Form bagi

Prodi Sistem Informasi UNJA DPPL-IZI AUTO Halaman 18 dari 25

APKOR
 AUTO Pendaftaran pendaftaran pendaftaran pendaftar
APKOR- oleh admin
008]

[SKPL.IZI Pendaftaraan pendaftaraan pendaftaraan Masukkan

AUTO field
APKOR- pendaftaran
009] UKM oleh
mahasiswa

5.Perancangan Antarmuka
5.1 Aturan Perancangan Antarmuka
Perancangan antarmuka sistem terdiri dari header, menu , tampilan proses
dan footer.

 Header
Bagian header berisi tulisan IZI auto apkor.
 Footer
Bagian footer berisi link kontak UKM.
 Menu
Menu akan diletakkan dibawah header sebelah kanan dan disusun
secara horizontal.
 Warna
Warna memiliki tujuan tertentu. Warna foreground harus berbeda
dengan warna background. Foreground menggunakan warna hitam
untuk teks, sedangkan background menggunakan warna yang kontras
dengan foreground yaitu oranye.
 Font
font yang digunakan adalah font jenis Arial. Penggunaan jenis huruf
tidak lebih dari dua jenis dan digunakan satu jenis huruf yang
mendominasi.
 Scrolling
Meniadakan horizontal scrolling dengan menetapkan ukuran lebar
halaman secara default.
 Ukuran dan Resolusi Layar
Resolusi normal yang digunakan untuk PC dan notebook yaitu 1024x800
pixel.

Prodi Sistem Informasi UNJA DPPL-IZI AUTO Halaman 19 dari 25

APKOR
5.2 Daftar Antarmuka Pemakai

Modul BR LM LA LD LSA

Modul CRUD (create, read, update, - - - - √

delete) data admin.

Modul pendaftaran admin untuk - - √ - -

akses

Modul CRUD (create, read, update, - - - √ -

delete) berita UKM.

Modul Seputar UKM √ - - - -

Modul mengubah password. - √ √ √ √

Modul pendaftaran UKM. √ - - - -

Modul login. √ - - - -

Modul logout - √ √ √ √

Modul Kontak √ - - - -

Modul melihat informasi UKM √ √ √ √ √

Ket : HD = Beranda

LM = Setelah Mahasiswa daftar

LA = Setelah Admin UKM daftar

LD = Setelah Admin UKM login

LSA = Setelah superadmin login

Prodi Sistem Informasi UNJA DPPL-IZI AUTO Halaman 20 dari 25

APKOR
5.3 Spesifikasi Antarmuka
5.3.1 Spesifikasi Layar Utama
Rancangan antarmuka untuk tampilan depan:

5.3.1.1 Deskripsi Objek

Id_Objek Jenis Keterangan

Header Header Berisi Informasi judul dan header ini akan tampil di
semua halaman.
Footer footer Berisi Informasi hak cipta

Beranda Menu Tombol untuk menampilkan halaman utama/home

Seputar UKM Menu Tombol untuk menampilkan halaman seputar UKM

Pendaftaran Menu Tombol untuk menampilkan halaman pendaftaran

UKM
Kontak Menu Tombol untuk menampilkan kontak yang bisa
dihubungi
Login Button Fungsi login, jika username dan password tidak
sesuai dengan tabel user maka proses login tak
akan berjalan

Prodi Sistem Informasi UNJA DPPL-IZI AUTO Halaman 21 dari 25

APKOR
5.3.2 Spesifikasi Objek-objek pada Layar

5.3.2.1 Form Login

5.3.2.1.1 Deskripsi Objek

Objek Jenis Keterangan

e-mail address Label input Pengisian email

Password Label input Pengisian password

Login Perintah aksi Tombol Login untuk masuk

ke halaman utama admin
atau petugas.

Forgot your password Perintah aksi Tombol forgot your

password ketika lupa
password

Prodi Sistem Informasi UNJA DPPL-IZI AUTO Halaman 22 dari 25

APKOR
5.3.2.2 Beranda Admin

5.3.2.1.2 Deskripsi Objek

Objek Jenis Keterangan

Seputar IZI Auto Apkor Menu Menu halaman depan

Tambah berita Menu Menu Tambah berita

Tambah info Menu Menu tambah info

Pendaftaraan Menu Menu Pendaftaraan

Home Menu Menu kembali ke halaman

awal

Dashboard Menu Menu Dashboard

Keluar Menu Menu keluar beranda

admin

Prodi Sistem Informasi UNJA DPPL-IZI AUTO Halaman 23 dari 25

APKOR
5.3.2.3 Form Pendaftaran UKM

5.3.2.1.2 Deskripsi Objek

Objek Jenis Keterangan

Beranda Menu Menu halaman awal

UKM Unja Menu Menu UKM

Pendaftaraan Menu Menu Pendaftaraan

Kontak Menu Menu kontak dihubungi

Pendaftaran UKM Menu Menu Daftar

Prodi Sistem Informasi UNJA DPPL-IZI AUTO Halaman 24 dari 25

APKOR
5.3.2.4 Info UKM

5.3.2.1.3 Deskripsi Objek

Objek Jenis Keterangan

Beranda Menu Menu halaman awal

UKM Unja Menu Menu UKM

Pendaftaraan Menu Menu Pendaftaraan

Kontak Menu Menu kontak dihubungi

Home UKM Menu Menu UKM

Prodi Sistem Informasi UNJA DPPL-IZI AUTO Halaman 25 dari 25

APKOR