MAKALAH SISTEM INFORMASI MANAJEMEN

PEMBUATAN WEBSITE E-COMMERCE

“PEMESANAN PDL UII”
(pdluii.000webhostapp.com)

Dosen Pengampu :

Muhammad Muhajir,S.Si.,M.Sc.

Oleh:

Yunanda Mustofa Putri (17611062)

Muhammad Bariklana (18611079)

JURUSAN STATISTIKA
FAKULTAS MATEMATIKA DAN ILMU PENGETAHUAN ALAM
UNIVERSITAS ISLAM INDONESIA
YOGYAKARTA
2019
 ABSTRAK

Yunanda Mustofa Putri (17611062), Muhammad Bariklana (18611079),

“Pembuatan Website E-Commerce”. Program Studi Statistika Fakultas
Matematika dan Ilmu Pengetahuan Alam – Universitas Islam Indonesia. 2019.
Bagian utama dari tugas akhir semester ini adalah membuat website e-commerce
dengan nama pdluii.000webhostapp.com. pdluii.000webhostapp.com merupakan
website e-commerce yang diperuntukan khusus untuk mahasiswa(i) dan dosen
Universitas Islam Indonesia untuk melakukan pemesanan dan pembayaran PDL.

Kata kunci: Website, E-Commerce.

ii
 KATA PENGANTAR

Puji syukur kami panjatkan kehadirat Allah SWT, karena berkat rahmat
serta karunia-Nya lah kami dapat menyelesaikan makalah ini yang berjudul
Pembuatan Website E-Commerce “Pemesanan PDL UII” yang alhamdulillah
selesai tepat pada waktunya. Makalah ini disusun guna memenuhi Ujian Akhir
Semester pada mata kuliah Sistem Informasi Manajemen tahun ajaran 2019/2020
pada jurusan Statistika Universitas Islam Indonesia.

Terimaksih kami ucapkan kepada Bapak Muhammad Muhajir, S.Si., M.Sc.

selaku dosen pengampu mata kuliah Sistem Informasi Manajemen yang telah
memerikan bimbingan dan saran dalam pembuatan website kami.

Semoga makalah ini dapat memberi manfaat bagi pembaca. Kami

menyadari bahwa makalah ini masih memiliki banyak sekali kekurangan di
dalamnya, sehingga dalam kesempatan kali ini kami bermaksud untuk meminta
saran dan masukan dari semua pihak demi terciptanya makalah yang lebih baik.

Yogyakarta, Desember 2019

Penulis

iii
 DAFTAR ISI

HALAMAN JUDUL ................................................................................................

ABSTRAK.............................................................................................................. ii
KATA PENGANTAR.......................................................................................... iii
DAFTAR ISI..........................................................................................................iv
BAB I PENDAHULUAN......................................................................................1
1.1 Latar Belakang..................................................................................................... 1
1.2 Rumusan Masalah................................................................................................ 2
1.3 Tujuan Penulisan..................................................................................................2
Tujuan penelitian ini adalah :...........................................................................................2
BAB II LANDASAN TEORI............................................................................... 3
2.1 Pengertian Website...............................................................................................4
2.2 Pengertian Database............................................................................................ 5
2.3 Pengertian PHP....................................................................................................6
2.4 Pengertian DBMS.................................................................................................6
2.5 Pengertian MySQL............................................................................................... 7
2.6 Pengertian SQL.................................................................................................... 7
2.7 Pengertian Web Server......................................................................................... 7
2.8 Diagram Konteks................................................................................................. 8
2.9 DFD (Data Flow Diagram)................................................................................. 9
2.10 ERD (Entity Relationship Diagram).................................................................. 10
BAB III DESAIN DAN PERANCANGAN........................................................11
3.1 Rancangan Website............................................................................................ 11
3.1.1 Spesifikasi Website........................................................................................ 11
3.1.2 Analisa Kebutuhan Hardware....................................................................... 11
3.1.3 Analisa Kebutuhan Software..........................................................................11
3.2 Rancangan Sistem Website................................................................................ 12
3.2.1 Karakteristik atau Sifat Sistem.......................................................................12
3.2.2 Diagram Konteks........................................................................................... 13
3.2.3 Alur Sistem atau Diagram Alur..................................................................... 13
3.2.4 DFD............................................................................................................... 15

iv
 3.2.5 ERD (Entitiy Relationship Diagram).............................................................15
3.3 Desain Interface................................................................................................. 16
3.4 Struktur Database.............................................................................................. 17
3.5 Hosting Website................................................................................................. 18
BAB IV IMPLEMENTASI DAN ANALISA....................................................19
4.1 Deskripsi Sistem................................................................................................ 19
4.2 Deskripsi Fungsional......................................................................................... 20
4.3 Cara Menjalankan Program............................................................................... 20
4.4 Proses Hosting................................................................................................... 21
4.5 Implementasi Program....................................................................................... 21
BAB V PENUTUP...............................................................................................25
5.1 Kesimpulan........................................................................................................ 25
5.2 Saran.................................................................................................................. 25
DAFTAR PUSTAKA...........................................................................................26
LAMPIRAN..........................................................................................................27

v
 BAB I
PENDAHULUAN

1.1 Latar Belakang

Teknologi informasi berkembang dengan pesat, sehingga mengubah
paradigma masyarakat dalam mencari dan mendapatkan informasi, yang tidak lagi
terbatas pada informasi surat kabar, audio visual dan elektronik, tetapi juga
sumber-sumber informasi lainnya yang salah satu diantaranya dapat diperoleh
melalui jaringan internet Teknologi internet dapat dimanfaatkan untuk
mempermudah dan memperlancar proses transaksi jual beli, sehingga dapat
dikatakan teknologi internet dapat meningkatkan peluang bisnis para pengusaha.
Beberapa bagian dari penjualan, pemasaran, pembelian dan transaksi jual beli
mendapatkan sentuhan media teknologi informasi dalam hal ini internet, sehingga
mencetuskan lahirnya ide tentang penjualan secara online atau e-commerce
(Electronic Commerce). Salah satu aplikasi yang memanfaatkan teknologi e-
commerce adalah Web E-commerce (penjualan berbasis website).
Yogyakarta merupakan kota pelajar dimana banyak kalangan muda dari
berbagai kota di indonesia yang hidup di Yogyakarta. Universitas Islam Indonesia
merupakan salah satu Universitas besar yang ada di Yogyakarta, yang pastinya
terdapat banyak mahasiswa. Mahasiswa seringkali membutuhkan Pakaian Dinas
Lapangan (PDL) untuk kebutuhannya. Hal ini dapat menjadi peluang bisnis.
Namun sistem pemesanan PDL saat ini dianggap kurang efisien karena sering
terjadinya kesalahan ukuran PDL karena masih dilakukan secara manual serta
memerlukan waktu yang lama dalam melakukan transaksi.
Oleh karena itu, dengan menggunakan teknologi internet, maka dibuat
sistem yang dapat memudahkan dalam melakukan pemesanan dan pembayaran
melalui suatu sistem. Melalui website PDL UII dapat mengatasi hambatan
tersebut, karena dapat memudahkan pengguna dalam melakukan pemesanan dan
pembayaran, melayani pembeli dalam jumlah banyak, waktu yang diperlukan
relatif sedikit, sebagai media promosi dan proses jual beli yang efektif dan efisien.

1
1.2 Rumusan Masalah
Berdasarkan uraian pada latar belakang diatas, maka dapat dirumuskan
permasalahan dalam proses pemuatan website pemesanan dan pembayaran PDL
UII sebagai berikut:
1. Bagaimana merancang dan membuat sistem informasi berbasis web yang
efektif untuk melakukan pemesanan serta pembayaran PDL UII?
2. Bagaimana membuat implementasi tampilan web yang menarik serta
memudahkan pengakses?

1.3 Tujuan Penulisan

Tujuan penelitian ini adalah :
1. Untuk mengetahui rancangan dan pembuatan website yang efektif
untuk melakukan pemesanan serta pembayaran PDL UII.
2. Untuk mengetahui implementasi tampilan web yang menarik serta
memudahkan pengakses.

2
 BAB II
LANDASAN TEORI

Sistem menurut McLeod yang dikutip (2010:34) dalam bukunya yang

berjudul “Management Information System” adalah sekelompok elemen-elemen
yang terintegrasi dengan maksud yang sama untuk mencapai tujuan. Menurut
Satzinger, Jackson, dan Burd (2010:6) sistem merupakan sekumpulan komponen
yang saling berhubungan dan bekerja bersama untuk mencapai suatu tujuan.
Secara umum sistem adalah sekumpulan elemen yang terintegasi dan bekerja
bersama guna mencapai suatu tujuan tertentu.
Informasi menurut McLeod (2010:35) merupakan data yang telah diproses
atau memiliki arti. Adapun karakteristik penting yang harus dimiliki oleh
informasi, seperti: relevansi, akurat , ketepatan waktu, dan kelengkapan.Secara
umum informasi dapat didefinisikan sebagai hasil dari pengolahan data dalam
suatu bentuk yang lebih berguna dan lebih berarti bagi penerimanya yang
menggambarkan suatu kejadian kejadian yang nyata yang digunakan untuk
pengambilan keputusan. Informasi merupakan data yang telah diklasifikasikan
atau diolah atau diinterpretasi untuk digunakan dalam proses pengambilan
keputusan.
Menurut Laudon (2012:16) sistem informasi adalah komponen-komponen
yang saling berkaitan yang bekerja bersama-sama untuk mengumpulkan,
mengolah, menyimpan, dan menampilkan informasi untuk mendukung
pengambilan keputusan, koordinasi, pengaturan, analisa, dan visualisasi pada
sebuah organisasi. Menurut Whitten, Bentley, dan Ditman (2009:10) sistem
informasi adalah pengaturan orang, data, proses, dan informasi (TI) atau teknologi
informasi yang berinteraksi untuk mengumpulkan, memproses, menyimpan, dan
menyediakan sebagai output informasi yang diperlukan untuk mendukung sebuah
intansi atau organisasi. Secara umum sistem informasi adalah suatu sistem dalam
suatu organisasi yang mempertemukan kebutuhan pengolahan transaksi harian
yang mendukung fungsi operasi organisasi yang bersifat manajerial dengan

3
kegiatan strategi dari suatu organisasi untuk dapat menyediakan kepada pihak luar
tertentu dengan informasi yang diperlukan untuk pengambilan keputusan. Sistem
informasi dalam suatu organisasi dapat dikatakan sebagai suatu sistem yang
menyediakan informasi bagi semua tingkatan dalam organisasi tersebut kapan saja
diperlukan. Sistem ini menyimpan, mengambil, mengubah, mengolah dan
mengkomunikasikan informasi yang diterima dengan menggunakan sistem
informasi atau peralatan sistem lainnya.
Untuk menunjang penulisan makalah ini maka diambil beberapa bahan
referensi untuk pembahasan dalam bab ini yaitu tentang pengertian website,
database, PHP, DBMS, MySQL, SQL, Web Server, Context Diagram (CD), Data
Flow Diagram (DFD), dan Entity Relationship Diagram (ERD).
2.1 Pengertian Website
Secara umum World Wide Web atau WWW atau juga dikenal dengan WEB
adalah salah satu layanan yang didapat oleh pemakai komputer yang terhubung ke
internet. Website atau situs dapat diartikan sebagai kumpulan halaman-halaman
yang digunakan untuk menampilkan informasi teks, gambar diam atau gerak,
animasi, suara, dan atau gabungan dari semuanya itu baik yang bersifat statis
maupun dinamis yang membentuk satu rangkaian bangunan yang saling terkait
dimana masing-masing dihubungkan dengan jaringan-jaringan halaman
(hyperlink).
Secara umum situs web mempunyai fungsi sebagai berikut:
1. Fungsi komunikasi
Situs web yang mempunyai fungsi komunikasi pada umumnya adalah
situs web dinamis. Karena dibuat menggunakan pemrograman web
(server side) maka dilengkapi fasilitas yang memberikan fungsi-fungsi
komunikasi, seperti web mail, form contact, chatting form, dan yang
lainnya.
2. Fungsi informasi
Situs web yang memiliki fungsi informasi pada umumnya lebih
menekankan pada kualitas bagian kontennya, karena tujuan situs tersebut

4
 adalah menyampaikan isisnya. Situs ini sebaiknya berisi teks dan grafik
yang dapat di-download dengan cepat.
3. Fungsi entertainment
Situs web juga dapat memiliki fungsi entertainment/hiburan. Bila situs
web kita berfungsi sebagai sarana hiburan maka penggunaan animasi
gambar dan elemen bergerak dapat meningkatkan mutu presentasi
desainnya, meski tetap harus mempertimbangkan kecepatan download-
nya. Beberapa fasilitas yang memberikan fungsi hiburan adalah game
online, film online, music online, dan sebagainya.
4. Fungsi transaksi
Situs web dapat dijadikan sarana transaksi bisnis, baik barang, jasa, atau
lainnya. Situs web ini menghubungkan perusahaan, konsumen, dan
komunitas tertentu melalui transaksi elektronik. Pembayarannya bisa
menggunakan kartu kredit, transfer, atau dengan membayar secara
langsung.
2.2 Pengertian Database
Basis Data (Database) terdiri dari 2 kata, yaitu Basis dan Data. Basis dapat
diartikan sebagai markas atau gudang dimana tempat bersarang/berkumpul.
Sedangkan Data adalah represntasi fakta dunia nyata yang mewakili suatu objek
yang direkam dalam bentuk angka, huruf, simbol, teks, gambar, bunyi, atau
kombinasisnya. Basis data adalah kumpulan file-file yang mempunyai kaitan
antara satu file dengan file lain sehingga membentuk suatu bangunan data untuk
menginformasikan suatu perusahaan atau instansi dalam batasan tertentu. Secara
umum database merupakan sekumpulan informasi yang saling berkaitan pada
suatu subjek tertentu untuk tujuan tertentu pula.
Database dapat dibuat dan diolah dengan menggunakan suatu program
komputer, yaitu yang biasa disebut dengan software (perangkat lunak). Software
yang digunakan untuk mengelola dan memanggil kueri (query) database disebut
Database Management System (DBMS) atau jika diterjemahkan kedalam bahasa
indonesia berarti “Sistem Manajemen Basis Data”.

5
2.3 Pengertian PHP
PHP merupakan bahasa pemrograman yang digunakan untuk membuat
aplikasi berbasis web (website, blog, atau aplikasi web). PHP bersifat server slide
language, artinya hanya dapat berjalan pada sisi server saja dan tidak dapat
berfungsi tanpa adanya sebuah sever didalamnya. Program ini akan selalu
membutuhkan sebuah server pendukung yang disebut Web Server dan program
PHP itu sendiri untuk menjalankan semua script program.
Untuk dapat berjalan, PHP membutuhkan web server, yang bertugas untuk
memproses file-file php dan mengirimkan hasil pemrosesan untuk ditampilkan di
browser client. Oleh karena itu, PHP termasuk server-side scripting (script yang
diproses di sisi server). Web server sendiri adalah software yang di-install pada
komputer lokal ataupun komputer lain yang berada di jaringan intranet / internet
yang berfungsi untuk melayani permintaan-permintaan web dari client. Web
server yang paling banyak digunakan saat ini untuk PHP adalah “Apache”. Selain
Apache, PHP juga memerlukan PHP binary yang bisa dikonfigurasikan sebagai
modul Apache atau pun sebagai aplikasi CGI. Untuk media penyimpanan datanya
(database server), PHP biasa menggunakan ”MySQL”.
2.4 Pengertian DBMS
Database management system (DBMS) adalah merupakan suatu sistem
software yang memungkinkan seorang user dapat mendefinisikan, membuat, dan
memelihara serta menyediakan akses terkontrol terhadap data. Database sendiri
adalah sekumpulan data yang berhubungan dengan secara logika dan memiliki
beberapa arti yang saling berpautan.
Sistem Basis Data merupakan suatu sistem menyusun dan mengelola
record-record menggunakan Komputer untuk menyimpan atau merekam serta
memelihara data operasional lengkap sebuah organisasi/perusahaan sehingga
mampu menyediakan informasi yang optimal yang diperlukan pemakai untuk
proses mengambil keputusan.
DBMS terdiri dari dua komponen, yaitu Relational Database Management
System (RDBMS) dan Overview of Database Management System (ODBMS).
RDBMS meliputi Interface Drivers, SQL Engine, Transaction Engine, Relational

6
Engine, dan Storage Engine. Sedangkan ODBMS meliputi Language Drivers,
Query Engine, Transaction Engine, dan Storage Engine.
2.5 Pengertian MySQL
MySQL adalah Sebuah program database server yang mampu menerima
dan mengirimkan datanya sangat cepat, multi user serta menggunakan peintah
dasar SQL (Structured Query Language). MySQL merupakan dua bentuk lisensi,
yaitu FreeSoftware dan Shareware. MySQL yang biasa kita gunakan adalah
MySQL FreeSoftware yang berada dibawah Lisensi GNU/GPL (General Public
License). MySQL Merupakan sebuah database server yang free, artinya kita bebas
menggunakan database ini untuk keperluan pribadi atau usaha tanpa harus
membeli atau membayar lisensinya.
MySQL pertama kali dirintis oleh seorang programmer database bernama
Michael Widenius . Selain database server, MySQl juga merupakan program yang
dapat mengakses suatu database MySQL yang berposisi sebagai Server, yang
berarti program kita berposisi sebagai Client. Jadi MySQL adalah sebuah database
yang dapat digunakan sebagai Client mupun server. Database MySQL merupakan
suatu perangkat lunak database yang berbentuk database relasional atau disebut
Relational Database Management System (RDBMS) yang menggunakan suatu
bahasa permintaan yang bernama SQL (Structured Query Language).
2.6 Pengertian SQL
SQL (Structured Query Language) adalah sebuah bahasa permintaan
database yang terstruktur. Bahasa SQL ini dibuat sebagai bahasa yang dapat
merelasikan beberapa tabel dalam database maupun merelasikan antar database.
SQL dibagi menjadi tiga bentuk Query, yaitu DDL (Data Definition
Language), DML (Data Manipulation Language), dan DCL (Data Control
Language).
2.7 Pengertian Web Server
Web Server merupakan software yang memberikan layanan data yang
berfungsi menerima permintaan HTTP atau HTTPS dari klien yang dikenal
dengan browser web dan mengirimkan kembali hasilnya dalam bentuk halaman-
halaman web yang umumnya berbentuk dokumen HTML.

7
 Web server merupakan mesin dimana tempat aplikasi atau software
beroperasi dalam medistribusikan web page ke user, tentu saja sesuai dengan
permintaan user tersebut. Hubungan antara Web Server dan Browser Internet
merupakan gabungan atau jaringan komputer yang ada di seluruh dunia. Setelah
terhubung secara fisik, Protocol TCP/IP (networking protocol) yang
memungkinkan semua komputer dapat berkomunikasi satu dengan yang lainnya.
Pada saat browser meminta data web page ke server maka instruksi permintaan
data oleh browser tersebut di kemas di dalam TCP yang merupakan protocol
transport dan dikirim ke alamat yang dalam hal ini merupakan protocol
berikutnya yaitu Hyper Text Transfer Protocol (HTTP). HTTP ini merupakan
protocol yg digunakan dalam World Wide Web (WWW) antar komputer yang
terhubung dalam jaringan di dunia ini. Untuk mengenal protocol ini jelas sangan
mudah sekali dimana setiap kali anda mengetik http://… anda telah
menggunakannya, dan membawa anda ke dunia internet.
Fungsi utama dari server web adalah untuk mentransfer berkas atas
permintaan pengguna melalui protokol komunikasi yang telah ditentukan.
Disebabkan sebuah halaman web dapat terdiri atas berkas teks, gambar, video, dan
lainnya pemanfaatan server web berfungsi pula untuk mentransfer seluruh aspek
pemberkasan dalam sebuah halaman web yang terkait, termasuk di dalamnya teks,
gambar, video, atau lainnya.
2.8 Diagram Konteks
Diagram konteks berisi gambaran umum (secara garis besar) sistem yang
akan dibuat. Dapat dikatakan bahwa context diagram berisi siapa saja yang
memberi data (dan data apa saja) ke sistem, serta kepada siapa saja informasi (dan
informasi apa saja) yang harus dihasilkan sistem.
Adapun komponen-komponen diagram konteks adalah sebagai berikut:

8
 Gambar 2.1 Komponen Diagaram Konteks

2.9 DFD (Data Flow Diagram)

Data Flow Diagram (DFD) merupakan salah satu komponen dalam
serangkaian pembuatan perancangan sebuah sistem komputerisasi. DFD
menggambarkan aliran data dari sumber pemberi data (input) ke penerima data
(output). Aliran data itu perlu diketahui agar si pembuat sistem tahu persis kapan
sebuah data harus disimpan, kapan harus ditanggapi (proses), dan kapan harus
didistribusikan ke bagian lain. Komponen-komponen DFD terdiri seperti pada
Gambar2.2.

Gambar 2.2 Komponen DFD

DFD memiliki beberapa level yang merupakan hasil perjejangan dasri
suatu system yang dibuat (level 0, 1, 2, dst).
1. DFD level 0 (context diagram)
DFD level 0 menggambarkan seluruh elemen sistem dengan sebuah
proses tunggal dengan data input atau output yang ditunjukan oleh anak
panh yang masuk dan keluar secara berurutan.
2. DFD level 1
DFD level 1 menggambarkan proses dan jalur informasi pada DFD level
0 yang telah detail.
3. DFD level 2

9
 DFD level 2 merupakan pengembangan alur data atau pemecahan proses
menjadi proses terpisah-pisah, tetapi masih berkaitan.
2.10 ERD (Entity Relationship Diagram)
ERD adalah gambaran mengenai berelasinya antarentitas. Sistem adalah
kumpulan elemen yang setiap elemen memiliki fungsi masing-masing dan secara
bersama-sama mencapai tujuan dari sistem tersebut. ‘Kebersama-sama’-an dari
sistem di atas dilambangkan dengan saling berelasinya antara satu entitas dengan
entitas lainnya.
Entitas (entity/ entity set), memiliki banyak istilah di dalam ilmu komputer,
seperti tabel (table), berkas (data file), penyimpan data (data store), dan
sebagainya.

10
 BAB III
DESAIN DAN PERANCANGAN

3.1 Rancangan Website

Website ini dirancang untuk pemesanan dan pembayaran PDL berbasis
website yang diperuntukan khusus untuk mahasiswa dan dosen UII.

3.1.1 Spesifikasi Website

Sistem ini ini berbasis web yang dikhususkan pada lingkup Universitas
Islam Indonesia. Website dengan nama PDL UII memberikan wadah bagi
mahasiswa dan dosen untuk melakukan pemesanan dan pembayaran PDL sesuai
dengan jurusan masing masing. Dengan menu produk, konsumen dapat memilih
PDL sesuai dengan jurusan yang tersedia, serta menu cart yang digunakan untuk
menampilkan rincian pemesanan. Website dibuat sedinamis mungkin agar dapat
memudahkan pengguna.

3.1.2 Analisa Kebutuhan Hardware

Perangkat keras yang digunakan untuk membuat website ini menggunakan
laptop dengan spesifikasi dan peralatan sebagai berikut :
a. Processor Intel® CoreTM i3-7020U
b. RAM 4 GB
c. Operating System 64-bit
d. Keyboard

3.1.3 Analisa Kebutuhan Software

Perangkat lunak atau software yang digunakan dalam pembuatan website
ini adalah :
a. Sistem Operasi : Windows 10
b. Web Server : Xampp 7.3.3.1
c. Database Server : MySQL
d. Software Pendukung : Notepad++, Chrome.

11
3.2 Rancangan Sistem Website
Perancangan sistem bertujuan untuk menentukan rancangan sistem yang
akan diwujudkan ke dalam website PDL UII. Perancangan sistem ini meliputi
karakteristik sistem, CD (Context Diagram), Flowchart (Diagram Alur), DFD
(Data Flow Diagram), dan ERD (Entity Relationship Diagram).

3.2.1 Karakteristik atau Sifat Sistem

Karakteristik atau sifat sistem ini terbagi menjadi beberapa hal sebagai
berikut :
1. Komponen Sistem
Konsumen, Admin, PDL
2. Batasan Sistem
Mahasiswa dan dosen UII
3. Lingkungan Luar Sistem
Konveksi.
4. Input
a. Form konsumen baru
b. Form pemesanan PDL
5. Output
a. Data pemesanan PDL
b. Data Pembayaran PDL
6. Interface
Jaringan internet
7. Proses
1) Calon konsumen menunjungi website PDL UII
2) Calon konsumen melakukan register kemudian login
3) Konsumen memilih menu produk kemudian memilih jenis PDL
4) Konsumen melakukan klik pada tombol “Buy” untuk memesan,
melakukan pembayaran secara transfer
5) Komsumen meng-upload bukti pembayaran melalui e-mail
6) Konsumen menerima konfirmasi dari admin melalui e-mail

12
 7) PDL diproses lalu dikirm.
8. Sasaran dan Tujuan
Mahasiswa dan dosen UII dapat melakukan pemesanan PDL dengan
mudah

3.2.2 Diagram Konteks

Diagram konteks berisi gambaran umum (secara garis besar) sistem yang
dibuat. Dapat dikatakan bahwa diagram konteks berisi siapa saja yang memberi
data (dan data apa saja) ke sistem, serta kepada siapa saja informasi (dan
informasi apa saja) yang harus dihasilkan sistem. Diagram konteks menyoroti
sejumlah karakteristik penting sistem. Dari Gamar3.1. Pemesanan PDL
merupakan pusat sistem yang menjadi perantara antara admin dan pengguna yang
saling berkaitan untuk memudahkan semua pihak. Berikut merupakan diagram
konteks website PDL UII.

Gambar 3.1 Diagram Konteks

3.2.3 Alur Sistem atau Diagram Alur

a. Dari sisi pengguna
- Mulai, pengguna mengakses website PDL UII
- Apabila konsumen sudah memiliki akun, konsumen melakukan
proses login. Jika belum memiliki akun, maka konsumen membuat
akun terlebih dahulu dengan mengisi form registrari konsumen
baru, lalu melakukan proses login.
- Konsumen memilih jenis PDL.

13
 - Apabila konsumen tidak memesan PDL maka langsung selesai.
Apabila konsumen memesan PDL, maka proses selanjutnya adalah
melakukan pembayaran.
- Selanjutnya konsumen mengirim bukti pembayaran melalui email.
- Selesai.
b. Dari sisi sistem
- Mulai, sistem melakukan proses verifikasi pemesanan dari
konsumen pada menu Cart.
- Sistem melakukan proses verifikasi pembayaran
- Selesai
Berikut adalah diagram alur dari website PDL UII.

Gambar 3.2 Diagram Alur

14
3.2.4 DFD
Untuk mengetahui gambaran aliran informasi dan transformasi yang
diaplikasikan pada saat bergerak dari input menjadi output, maka digunakan DFD.
DFD dapat digunakan untuk menyajikan sebuah sistem atau perangkat lunak pada
setiap tingkat abstraksi.
DFD level 0 menggambarkan seluruh elemen sistem dengan sebuah proses
tunggal dengan data input atau output yang ditunjukan oleh anak panh yang
masuk dan keluar secara berurutan.
Berikut merupakan DFD pada website PDL UII:

Gambar 3.3 DFD

3.2.5 ERD (Entitiy Relationship Diagram)

Entity Relationship Diagram sebuah konsep yang mendeskripsikan
hubungan antara penyimpanan (database) dan didasarkan pada persepsi dari

15
sebuah dunia nyata yang terdiri dari sekumpulan objek yaitu disebut sebagai
entity dan hubungan atau relasi antar objek-objek tersebut. Berikut merupakan
ERD dari website PDL UII:

Gambar 3.4 ERD

3.3 Desain Interface

Perancangan desain untuk website PDL UII ditunjukan seperti Gambar3.5.
di bawah ini yang terbagi menjadi beberapa bagian yaitu:

a. Header, bagian kepala/atas yang berisi judul website.

b. Home, adalah bagian yang memuat tentang rincian singkat dari website.
c. Product, adalah bagian yang berisi rincian produk yang telah
dikelompokkan berdasarkan fakultas di UII. Rinciannya antara lain adalah
harga, stock, keterangan, dan size.
d. Curt, adalah bagian yang berisi tentang rincian pemesanan PDL.
Rinciannya antara lain id cart, tanggal, kode, nama, size, harga, kuantitas,
dan jumlah harga.
e. Footer, adalah bagian yang berisi tentang tahun pembuatan sistem,
pembuat dan hak cipta.

16
 Gambar 3.5 Rancangan Website

3.4 Struktur Database

Database dari website PDL UII terdiri dari beberapa tabel yang
menyimpan data dan informasi yang terdapat dapat website, antara lain yaitu:
1. Tabel Customer

Gambar 3.6 Tabel Customer

2. Tabel Produk

Gambar 3.7 Tabel Produk

17
 3. Tabel Cart

Gambar 3.8 Tabel Cart

3.5 Hosting Website

Hosting adalah penyewaan tempat untuk menampung data-data yang
diperlukan oleh sebuah website sehingga dapat diakses dengan jaringan Internet.
Data disini dapat berupa file, gambar, email, aplikasi/program/script dan database.
Dalam melakukan hosting, pertama-tama harus membuat domain terlebih dahulu.
Untuk membuat domain dan hosting bisa dilakukan melalui berbagai website
hosting yang berbayar maupun tidak. Setelah membuat domain lalu dapat
dilakukan upload semua file website melalui aplikasi FileZilla lalu meng-connect
database ke wadah website hosting tersebut.

18
 BAB IV
IMPLEMENTASI DAN ANALISA

Tema website yang dibuat adalah bertema online shop yang dikhususkan
pada lingkup Universitas Islam Indonesia. Website dengan nama PDL UII
memberikan wadah bagi mahasiswa dan dosen untuk memesan serta membaar
PDL sesuai dengan jurusan masing masing. Dengan menu dan fitur yang
ditampilkan dapat memudahkan proses pemesanan dan pembayaran PDL. Website
dibuat sedinamis mungkin agar memudahkan admin dalam melakukan perubahan
pada web seperti update, dan memperbaiki sistem website.

4.1 Deskripsi Sistem

Pada halaman pertama pengguna akan disuguhkan tampilan halaman awal
dari web PDL UII dihalaman ini pengguna dapat melihat produk dan klik buy
yang akan otomatis tersambung ke halaman log in customer jika belum masuk
akun, atau user dapat login dengan meng-klik pada menu login lalu pilih customer.
Pada menu login terdapat dua sub menu yaitu menu customer dan admin.
Pengguna yang belum memiliki akun harus daftar terlebih dahulu dengan klik
daftar, jika sudah mempunyai akun langsung login. Setelah pengguna masuk akun
tampilan yang diperlihatkan tidak jauh beda dari sebelum masuk akun, hanya
tambahan menu chart saja untuk menampung barang yang akan dibeli.
Selanjutnya jika ingin membeli dan memesan PDL pilih menu product dan pilih
fakultas lalu akan ditampilkan program studi di fakultas yang dipilih, setelah itu
pengguna memilih program studi PDL yang akan dibeli lalu isi size dan meng-klik
buy, PDL akan otomatis tersimpan dalam menu chart. Selanjutnya klik menu cart
lalu klik check out untuk konfirmasi pemesanan dan membayar.
Untuk melakukan konfirmasi pembayaran customer dibawa ke halaman
dashboard customer terlebih dahulu lalu pilih bagian pembayaran , klik pada tools
berwarna biru dan isi data setelah itu klik konfirmasi.

19
4.2 Deskripsi Fungsional
Website ini dibuat untuk mempermudah mahasiswa dan dosen Universitas
Islam Indonesia untuk melakukan pemesanan dan pembayaran PDL sesuai
jurusan program studi masing-masing secara efektif dan efisien. Keunggulan
penggunaan website ini adalah transaksi yang dilakukan dapat terdata dan
transparan serta dapat diakses dimanapun dan kapanpun dengan menggunakan
koneksi internet. Dengan didukung fitur-fitur yang memudahkan pengguna
sehingga tidak sulit dalam urusan pendataan, pemesanan dan pembayaran PDL.

4.3 Cara Menjalankan Program

Terdapat 2 kategori yang mendukung web ini dapat berjalan yaitu admin
dan pengguna atau customer. Admin merupakan orang yang mengelola website,
memiliki hak dalam mengontrol segala sesuatu pada website seperti mnambah
barang, meng-update website, dsb. Untuk masuk kedalam akun admininistrator,
admin tinggal login menggunakan akun admin yang hanya diketahui oleh admin.
Sedangkan customer adalah mahasiswa dan dosen yang menggunakan website ini.
Level penggunaan hak otoritas atas pembagian level tersebut:
a. Admin
1. Memperbaiki system dan website.
2. Mengupdate atau memperbaharui sistem atau website.
3. Menghapus atau menambah barang (PDL).
4. Menerima data pemesanan.
5. Menerima laporan konfirmasi pembayaran dan mengubah status
konfirmasi pembayaran.
b. Pengguna
1. Mendaftar menjadi pengguna
2. Login sebagai pengguna.
3. Meemilih dan memesan PDL masing masing program studi.
4. Membayar dan meng-upload bukti pembayaran.

20
4.4 Proses Hosting
Untuk membuat sebuah halaman web, terlebih dahulu penulis harus
mempunyai domain dan hosting. Untuk website kali ini, pembuat web
menggunakan web hosting infinityfree.net sebagai penyedia domain dan akun
hosting. Domain yang digunakan adalah PDLUII.000webhostapp.com .

4.5 Implementasi Program

Berikut halaman utama website PDLUII.000webhostapp.com :

Gambar 4.1 Tampilan Halaman Utama

Tampilan gambar 4.1 diatas merupakan halaman utama yang akan muncul
pertama kali saat membuka website PDLUII. 000webhostapp.com. Tampilan awal
diatas memuat beberapa komponen seperti nama website dan deskripsi tentang
website.
Pengguna harus terlebih dahulu melakukan login dan jika belum
mempunyai akun maka harus mendaftar terlebih dahulu. Klik menu login lalu
pilih submenu customer. Pada halman login customer pengguna akan
diperlihatkan halaman seperti gambar 4.2. Klik daftar untuk mendaftar akun isi
data seperti pada gambar 4.3.

21
 Gambar 4.2 Tampilan Login

Gambar 4.3 Tampilan Form Registrasi

Setelah mengisi semua data yang diperlukan dan mengklik register maka
secara resmi menjadi member atau pengguna pada website
PDLUII.000webhostapp.com Kemudian setelah melakukan login kembali
pengguna akan melihat tampilan halaman akun seperti halaman sebelum nya
hanya saja ditambahkan menu cart. Halaman akun dapat dilihat pada gambar 4.4
dan terdapat pula dashboard untuk konfirmasi pembayaran seperti gambar 4.5

22
 Gambar 4.3 Tampilan utama setelah login

Gambar 4.4 Tampilan dashboard

Setelah masuk akun, pengguna akan memilih produk sesuai fakultas dan
program studi masing masing. Misal nya akan memilih FMIPA -Statistika maka
pengguna klik menu product lalu memilih FMIPA lalu pilih detail pada produk
statistika. Setelah memilih produk statistika maka akan tampil halaman detail
produk dengan keterangan harga, stok, keterangan bahan, dan ukuran yang dapat
dipilih sesuai kebutuhan.

23
 Gambar 4.5 Tampilan menu produk

Gambar 4.6 Tampilan detail produk

Untuk membeli produk maka klik buy dan otomatis produk akan di
masukan dalam keranjang atau menu cart. Menu cart dapat dilihat pada gambar
4.8. Customer yang ingin menyelesaikan pembayaran dapat langsung klik check
out jika ingin menambah barang maka klik continue shopping. Customer yang
klik checkout akan langsung dipindahkan ke halmaan dashboard customer untuk
melihat kode pembayaran dan meng-upload bukti pembayaran.

Gambar 4.7 Tampilan menu cart

24
 BAB V
PENUTUP

5.1 Kesimpulan
Dalam penulisan makalah ini telah di uraikan berbagai macam kebutuhan
yang menunjang dalam pembuatan website PDL UII. Maka penulis
menyimpulkan
1. Website yang dibuat adalah website E-Commerce untuk pemesanan
dan pembayaran PDL UII.
2. Dengan Website PDL UII dapat mempermudah pemesanan dan
pembayaran PDL UII.
3. Dalam membangun sebuah website, diperlukan pemahaman mengenai
database , coding dan hosting yang benar agar tidak terjadi error.

5.2 Saran
Adapun beberapa saran yang dapat penulis berikan dan diharapkan dapat
berguna dimasa yang akan datang adalah sebagai berikut:
1. Pembaharuan web sangat diperlukan agar selalu update terhadap prodi
baru yang mana akan menambah jumlah produk PDL.
2. Makalah ini disarankan untuk menjadi bahan rujukan atau referensi
tehadap masyarakat pada umumnya terkhusus mahasiswa. Makalah ini
juga dapat digunakan bagi yang ingin membahas sistem pemesanan PDL
UII lebih lanjut.

25
 DAFTAR PUSTAKA

Fajriya., dan Rahmadi Yotenka. 2019. Modul Praktikum Basis Data

MySQL.Universitas Islam Indonesia: Yogyakarta.

Novrina. 2015. Konsep Dasar Sistem dan Informasi.Universitas Gunadarma.

Suprapto, Haris. 2012. Modul Pembelajaran Praktek Basis Data (MySQL).

Setyo, Dwi. 2019. Pengertian Data Base. Universitas PGRI Semarang.

Yuliano, Triswansyah. 2007. Pengenalan PHP. https://ilmukomputer.org/wp-

content/uploads/2009/03/triswan-pengenalanphp.pdf.

26
 LAMPIRAN

Website:

https://pdluii.000webhostapp.com/

Akun customer yang sudah terdaftar:

Username : Yunanda
Password : 1212

Akun admin:
Username : Yunanda
Password : yunanda

27