TUGAS AKHIR...Akhir kata semoga penulisan tugas akhir ini dapat berguna bagi penulis khususnya dan bagi para pembaca yang berminat pada umumnya. Jakarta, 10 Juli 2017 Penulis Andri

PERANCANGAN SISTEM INFORMASI PENJUALAN LAPTOP

BERBASIS WEB

TUGAS AKHIR

Diajukan untuk memenuhi salah satu syarat kelulusan Program Diploma Tiga (D.III)

ANDRI

NIM : 12140654

Program Studi Manajemen Informatika

Akademi Manajemen Informatika dan Komputer “BSI Jakarta”

Jakarta

2017

vii

KATA PENGANTAR

Alhamdulillah, Segala Puji dan Syukur kehadirat Allah SWT. Yang telah

melimpahkan rahmat serta karunia-Nya sehingga penulis dapat menyelesaikan

penulisan Tugas Akhir ini yang berjudul “PERANCANGAN SISTEM INFORMASI

PENJUALAN LAPTOP BERBASIS WEB”. Tugas Akhir ini diajukan untuk

memenuhi salah satu syarat kelulusan Program Diploma Tiga (D.III) AMIK BSI.

Penulis sangat menyadari bahwa tanpa adanya bimbingan dan dorongan dari

semua pihak, maka penulisan Tugas Akhir ini tidak berjalan dengan lancar dan tepat

waktu. Oleh karena itu pada kesempatan ini, maka perkenankanlah penulis

menyampaikan rasa terima kasih yang sebesar-besarnya kepada:

1. Direktur Akademi Manajemen Informatika dan Komputer Bina Sarana

Informatika.

2. Ketua Program Studi Manajemen Informatika AMIK Bina Sarana Informatika.

3. Anggi Oktaviani, M.Kom. selaku dosen pembimbing tugas akhir.

4. Staff/karyawan/dosen dilingkungan Akademi Bina Sarana Informatika.

5. Orang tua dan kakak-kakak yang telah memberikan dukungan moral maupun

spiritual.

6. Rekan-rekan mahasiswa kelas MI-6B.

Serta semua pihak yang terlalu banyak untuk disebutkan satu persatu dalam

mewujudkan penulisan ini. Penulis menyadari bahwa penulisan tugas akhir ini masih

viii

jauh dari sempurna, untuk itu penulis mohon kritik dan saran membangun demi

kesempurnaan penulisan dimasa yang akan datang.

Akhir kata semoga penulisan tugas akhir ini dapat berguna bagi penulis

khususnya dan bagi para pembaca yang berminat pada umumnya.

Jakarta, 10 Juli 2017

Penulis

Andri

ix

ABSTRAKSI

Andri (12140654), “Perancangan Sistem Informasi Penjualan Laptop Berbasis Web”. Pembuatan aplikasi penjualan laptop berbasis web dengan E-Commerce menggunakan PHP & JavaScript merupakan sebuah web sederhana untuk melakukan transaksi jual – beli laptop dengan sistem transaksi yang sedang banyak digunakan yaitu E-Commerce. Web ini bertujuan memudahkan seorang konsumen untuk membeli laptop yang diinginkan tanpa harus datang ke toko laptop, hanya melalui internet. Dalam pembuatan aplikasi ini, metodologi yang penulis gunakan antara lain adalah Struktur Navigasi dan Skema ERD (Entity Relationship Diagram). Aplikasi ini merupakan penggabungan dari berbagai elemen gambar, halaman dan database. Membentuk sebuah desain interface yang diharapkan mampu berinteraksi dengan user, sehingga membuat user merasa nyaman untuk terlibat di dalamnya. Cukup dengan mengklik pilihan yang ada, sebuah proses dan informasi dapat langsung didapatkan dengan cepat dan mudah. Dengan alasan tersebut maka penulis mencoba untuk memberikan solusi dengan memanfaatkan teknologi yang berkembang dengan membuat paket informasi dengan media website. Kata Kunci: Penjualan laptop, E-Commerce

x

ABTRACTION

Andri (12140654), " Designing Information System E-Commerce Online Notebookstore". Making web-based applications footwear with E-Commerce using PHP and JavaScript is a simple website to perform transactions - buying notebooks with a transaction system that is being widely used, namely the E-Commerce. This website aims to facilitate a consumer to buy the notebooks you want without having to come to the notebookstore, only through the Internet. In making this application, the methodology that I use include the Navigation Structure and Scheme of ERD (Entity Relationship Diagram). This application is an amalgamation of various elements of the image, the page and the database. Forming an interface design that is expected to interact with the user, thus making the user feel comfortable to engage in it. Simply by clicking on the options available, a process and information can be directly obtained quickly and easily. With these reasons, the author tries to provide a solution to utilize evolving technologies by creating a media information pack website. Keywords: Notebook selling, E-Commerce

xi

DAFTAR ISI

Halaman

Lembar Judul Tugas Akhir………………………………...…………. i Surat Pernyataan Keaslian Tugas Akhir...………………..…….……. ii Surat Pernyataan Persetujuan Publikasi Karya Ilmiah............…….… iii Lembar Persetujuan dan Pengesahan Tugas Akhir.......…………....... iv Lembar Dosen Pembimbing......…………………….…………….......... v Lembar Asisten Pembimbing....…………………….…………….......... vi

Kata Pengantar……………………………………………..…………... vii Abstraksi……………………………………………..………..……….... ix Daftar Isi……………………………………………………….......…… xi Daftar Simbol…………………………………………………...………. xii Daftar Gambar………………………………………………………...… xiv Daftar Tabel………………………………………………...………....… xvii Daftar Lampiran……………………………………………………….... xviii

BAB I PENDAHULUAN 1.1. Latar Belakang Masalah…………………..………..… 1 1.2. Maksud dan Tujuan……………...…..…………..…… 2 1.3. Teknik Pengumpulan Data…………………..………… 3 1.4. Ruang Lingkup……………………..…………….…… 3 1.5. Sistematika Penulisan………..…..………...………..… 4

BAB II LANDASAN TEORI 2.1. Konsep Dasar Web………...…………...…..………… 5

2.1.1. Pengertian Website…...……...………..……….. 5 2.1.2. Jenis-jenis Website ..................….…..………… 5 2.1.3. Bahas Pemrograman Web..……...…..………… 7 2.1.4. Desain Pemrograman Web..……..…..………… 8 2.1.5. Web Server. .....................……..……….……… 10 2.1.6. Database.. ………………...……….....………... 11

2.2. Teori Pendukung…………….……..…....…..………... 11 2.2.1. Model Pengembangan Perangkat Lunak….…… 11 2.2.2. Struktur Navigasi………………………….…… 13 2.2.3. ERD (Enterprise RelationShip Diagram) ….…. 16 2.2.4. LRS (Logical Record Structure)………………. 18 2.2.5. Pengujian Web...……………………….….…… 18

xii

BAB III PEMBAHASAN 3.1. Analisa Kebutuhan……………….…………………… 20 3.2. Spesifikasi Rancangan Web.......………..…………....… 21

3.2.1. Rancangan Halaman Web...........…....……....… 22 3.2.2. Rancangan Basis Data........................................ 29 3.2.3. Rancangan Struktur Navigasi …....……...……. 43

3.3. Implementasi dan Pengujian Unit………….…...…… 46 3.3.1. Implementasi………….…..........................…… 46 3.3.2. Spesifikasi Sistem Komputer.............................. 56 3.3.3. Pengujian Unit………….………………..…… 57

BAB IV PENUTUP 4.1. Kesimpulan………….….………..…………….…….… 60 4.2. Saran…………….………………..………………….… 61

DAFTAR PUSTAKA.…..……………………………………..…..…… 62 DAFTAR RIWAYAT HIDUP.………………………….....……..…… 63

xiii

DAFTAR SIMBOL

A. Simbol Entity Relationship Diagram (ERD)

Entitas atau Objek Data

Sebuah objek yang mewakili sesuatu yang terlihat

nyata dan dapat sibedakan dari sesuatu yang lain.

Simbol dari entity pada umumnya digambarkan

dengan sebuah persegi panjang.

Relationship

Hubungan antara sejumlah entitas yang berasal dari

himpunan entitas yang berbeda.

Atribut atau Elemen Data

Sebuah unsure dari setiap entitas yang fungsinya

mendeskripsikan karakteristik dari intetitas tersebuat.

Weak Entity

Suatu entity dimana Keberadaan dari entity tersebut

tergantung dari entity lain.

xiv

Atribut Multivalue

Atribut yang memiliki nilai lebih dari satu.

Connection

Sebagai penghubung antara relasi dengan entitas,

relasi dan entitas dengan atribut.

xv

DAFTAR GAMBAR

Halaman

1. Gambar II.1 Diagram Metode Waterfall.…………………............ 12 2. Gambar II.2 Struktur Navigari Linear…………………………... 14 3. Gambar II.3 Struktur Navigari Hirarki………………………….. 14 4. Gambar II.4 Struktur Navigari Non Linear..………………….... 15 5. Gambar II.5 Struktur Navigari Composite...……………….……. 16 6. Gambar III.1 Spesifikasi Rancangan Halaman

Admin................................................................................................ 22 7. Gambar III.2 Spesifikasi Rancangan Halaman

Beranda.............................................................................................. 24 8. Gambar III.3 Spesifikasi Rancangan Halaman Akun

Saya.................................................................................................... 25 9. Gambar III.4 Spesifikasi Rancangan Halaman Produk.................. 27 10. Gambar III.5 Entity Relation Diagram............................................ 29 11. Gambar III.6 Logikal Record Structure............................................ 30 12. Gambar III.7 Struktur Navigasi Halaman Pengunjung.................... 43 13. Gambar III.8 Struktur Navigasi Halaman Member.......................... 44 14. Gambar III.9 Struktur Navigasi Halaman Admin............................ 45 15. Gambar III.10 Tampilan Login Pada Admin................................... 46 16. Gambar III.11 Tampilan Halaman Beranda Pada

Admin.........................................…………….……………………... 47 17. Gambar III.12 Tampilan Halaman Pendaftaran Member................. 47 18. Gambar III.13 Tampilan Halaman Login Member........................... 48 19. Gambar III.14 Tampilan Beranda Member...................................... 48 20. Gambar III.15 Tampilan Halaman Keranjang Belanja..................... 49 21. Gambar III.16 Tampilan Halaman Data Member ........................... 49 22. Gambar III.17 Tampilan Halaman Konfirmasi

Pembayaran........................................................................................ 50 23. Gambar III.18 Tampilan Halaman Bukti Order

Pembelian............................................................................................ 50

xvi

DAFTAR TABEL

Halaman

1. Tabel III.1 Spesifikasi Tabel Admin….……………………………. 32 2. Tabel III.2 Spesifikasi Tabel Gambar Produk……..………………. 33 3. Tabel III.3 Spesifikasi Tabel Kategori……………..………………. 34 4. Tabel III.4 Spesifikasi Tabel Konfirmasi…………..……………..... 35 5. Tabel III.5 Spesifikasi Tabel Kontak………..……………..……..... 36 6. Tabel III.6 Spesifikasi Tabel Member....…………………………… 37 7. Tabel III.7 Spesifikasi Tabel Orders.....….………………………… 38 8. Tabel III.8 Spesifikasi Tabel Orders_detail………………………... 39 9. Tabel III.9 Spesifikasi Tabel Orders_temp...……………………..... 40 10. Tabel III.10 Spesifikasi Tabel Produk………..…………………...... 41 11. Tabel III.11 Spesifikasi Tabel Slide................…………………....... 42 12. Tabel III.12 Hasil Pengujian Black Box Testing

Halaman Login member……………………......................................... 52 13. Tabel III.13 Hasil Pengujian Black Box Testing

Halaman Login admin………………………….................................... 53 14. Tabel III.14 Hasil Pengujian Black Box Testing

Halaman Pendaftaran member...………………………........................ 55 15. Tabel III.15 Hasil Pengujian Black Box Testing

Login Halaman Selesai Belanja..…...………......................................... 57 16. Tabel III.16 Hasil Pengujian Black Box Testing

Halaman Konfirmasi Pembayaran..…...………..................................... 58

BAB I

PENDAHULUAN

1.1. Latar Belakang Masalah

Penggunaan internet sebagai media pemasaran dan saluran penjualan terbukti

mempunyai keuntungan antara lain untuk beberapa produk tertentu lebih sesuai

ditawarkan melalui internet harga lebih murah mengingat membuat situs di internet

lebih murah biayanya dibandingkan dengan membuka outlet retail di berbagai tempat,

internet merupakan media promosi perusahaan dan produk yang paling tepat dengan

harga yang relatif lebih murah serta pembelian melalui internet akan diikuti dengan

layanan pengantaran barang sampai di tempat pemesan.

Seiring dengan tingginya permintaan masyarakat terhadap komputer khususnya

pada laptop karena laptop adalah komputer portabel (kecil dan dapat dibawa kemana-

mana dengan mudah) dan beratnya berkisar antara 1 hingga 6 kilogram sehingga

laptop lebih disukai oleh konsumen dan untuk penjualannya lebih menjanjikan

ketimbang komputer desktop.

dan E-Commerce merupakan salah satu cara berjualan yang melewati media

internet E-Commerce menjadi salah satu pilihan karena selain cakupannya yang luas

yaitu mencakup ke seluruh negeri bahkan hingga mencapai keluar negeri dan juga

sangat efisien dalam pengeluaran biaya promosi yang di lakukan secara tradisional.

1

2

Sehubungan dengan hal tersebut maka penulis mengambil kesimpulan untuk

dijadikan bahan Penulisan Tugas Akhir dengan judul: "Perancangan Sistem

Informasi Penjualan Laptop Berbasis Web”.

1.2. Maksud dan Tujuan

Maksud dari penulisan Tugas Akhir ini adalah:

1. Membangun E-Commerce penjualan laptop untuk ditujukan kepada konsumen

sebagai media untuk promosi.

2. Memudahkan konsumen dalam berbelanja secara online sehingga tidak perlu

datang langsung ke toko laptop.

3. Menerapkan ilmu yang didapat di perkuliahan Akademi Bina Sarana Informatika.

4. Sebagai media promosi penjualan laptop melalui jaringan internet.

5. Sebagai pemikiran dalam stategi pasar untuk memperluas pemasaran dan

meningkatkan omset di dalam bisnis.

6. Sebagai sarana untuk belajar bisnis dengan memanfaatkan jaringan internet.

Sedangkan tujuan dari penulisan Tugas Akhir ini yaitu sebagai salah satu

syarat kelulusan pada Program Diploma Tiga (D.III) Program Studi Manajemen

Informatika (MI) pada Akademik Manajemen Informatika & Komputer Bina Sarana

Informatika (AMIK BSI) Jakarta.

3

1.3. Teknik Pengumpulan Data

Untuk mengumpulkan data yang diperlukan dalam penulisan Laporan Tugas

Akhir ini penulis menggunakan beberapa metode, diantaranya adalah:

1. Metode observasi

Metode yang merupakan observasi langsung terhadap orang-orang yang

berkeinginan dan pernah berbelanja online.

2. Metode studi pustaka

Metode ini digunakan untuk melengkapi data-data dengan membaca dan

mempelajari dari buku-buku serta berbagai sumber referensi yang berkaitan

dengan penulisan Tugas Akhir ini yang diangkat sebagai referensi.

1.4. Ruang Lingkup

Dalam pembuatan website E-Commerce ini penulis akan menjelaskan setiap

menu yang terdapat didalam website. Pada menu beranda berisi produk-produk yang

akan dijual secara acak, pada menu akun saya berisi informasi akun member yang

sudah melakukan registrasi, pada menu produk berisi produk-produk yang teratur

sesuai kategorinya, pada menu konfirmasi berfungsi untuk member yang sudah

melakukan pembelian diharuskan mengkonfirmasi pembeliannya kepada admin, pada

menu profil berisi informasi tentang profil toko, pada menu kontak kami member bisa

memberikan saran dan kritik kepada toko, dan pada menu cara belanja berisi

informasi tentang bagaimana tata cara berbelanja di web ini.

4

1.5. Sistematika Penulisan

Pada penulisan Tugas Akhir ini penulis telah menyusun sistematika penulisan

berikut diantaranya :

BAB I PENDAHULUAN

Pada bab ini penulis menjelaskan tentang latar belakang

masalah,maksud dan tujuan, teknik pengumpulan data, ruang lingkup

dan sistematika penulisan.

BAB II LANDASAN TEORI

Bab ini menguraikan tentang konsep dasar web yang berisikan teori

konsep dasar program yaitu: Website, Bahasa Pemograman, Desain

Pemrograman, Web Server, Basis Data dan Pengembangan Perangkat

Lunak. Pada bab ini juga membahas teori pendukung yang berisikan

tentang Struktur Navigasi, Enterprise Relationship Diagram (ERD),

LRS dan Pengujian Web.

BAB III PEMBAHASAN

Bab ini berisikan analisa kebutuhan, perancangan perangkat lunak,

proses pembuatan aplikasi, dan implementasi pengujian unit.

BAB IV PENUTUP

Pada bab ini merupakan bab penutup atau akhir yang berisi tentang

kesimpulan dan saran dari keseluruhan pembahasan website yang telah

dianalisa yang berguna untuk perkembangan sistem tersebut dimasa

depan.

BAB II

LANDASAN TEORI

2.1. Konsep Dasar Web

Untuk menunjang penulisan tugas akhir ini, diambil dari beberapa refrensi

seperti bahasa pemrograman PHP dan MySQL, serta beberapa bahan lainnya yang

diperlukan dalam pembuatan website e-commerce ini.

2.1.1. Pengertian Website

Menurut Kustiyahningsih (2011:113), “Web adalah layanan yang didapat oleh

pemakai komputer yang terhubung ke internet”. Sibero (2011:11) adalah “suatu

sistem yang berkaitan dengan dokumen digunakan sebagai media untuk menampilkan

teks, gambar, multimedia dan lainnya pada jaringan internet”.

2.1.2. Jenis-jenis Website

Jenis-jenis website yang saat ini berkembang sebagai berikut:

1. Web Bisnis yaitu web yang di dalamnya terdapat proses bisnis seperti jual beli,

sewa menyewa, penggunaan jasa, lelang, dan sebagainya. Contoh situs yang

menggunakan aplikasi web bisnis seperti bhineka.com, ebay.com.

2. Web Berita dan Informasi yaitu web yang menyediakan konten informasi

berbayar maupun gratis. Contoh situs yang menggunakan aplikasi web berita dan

informasi: kompas.com, detik.com.

5

6

3. Web Profil yaitu web yang mendeskripsikan tentang profil suatu perusahaan,

lembaga ataupun orang personal. Aplikasi web ini biasanya digunakan untuk

memperkenalkan profil perusahaan, lembaga atau orang personal kepada umum.

Contoh aplikasi web profil seperti internet.go.id, blogspot.com.

4. Web Services yaitu web yang menyediakan layanan pengolahan data dan

sebagainya. Perbedaan umum aplikasi web service dan aplikasi web lain pada

umunya adalah aplikasi web service tidak memilki antarmuka, namun dapat

diakses melalui internet. Contoh aplikasi web services seperti aws.amazon.com,

konakart.com.

5. Web Social Networking yaitu web yang memberikan fasilitas pertemanan tempat

berkumpul dan dapat juga menjadi tempat atau wadah suatu kelompok. Aplikasi

web social networking seperti facebook.com, twitter.com.

6. Web Banking yaitu web yang di dalamnya terdapat proses transaksi keuangan

pada perbankan secara umum, seperti transfer dana, pembayaran, pembelian, dan

lainnya. Contoh aplikasi web banking seperti klikbca.com, bankmandiri.co.id,

bni.co.id.

7. Web Search Engine Optimize (SEO) yaitu web yang didalamnya terdapat proses

pencarian pada internet. Contoh web SEO seperti google.com, yahoo.com,

bing.com.

8. E-Learning merupakan situs yang menyediakan pembelajaran online melalui

internet. Pembelajaran dilakukan melalui berbagai media seperti tulisan, gambar

hingga multimedia. Contoh: elearning.bsi.ac.id.

http://mousetik.blogspot.com/2013/03/jenis-jenis-aplikasi-web.html

7

9. Web E-Commerce dapat didefinisikan sebagai transaksi perdagangan melalui

media elektronik yang terhubung dengan internet. Contohnya: tokopedia.com,

lazada.com, zalora.com.

2.1.3. Bahasa Pemrograman Web

Untuk mengembangkan proses pembuatan website penulis menggunakan

beberapa bahasa pemrograman diantaranya, adalah:

1. HTML

Menurut Soeryana dan Koesheryatin (2014:21) “Hyper Text Markup

Language atau HTML adalah bahasa yang digunakan pada dokumen web sebagai

bahasa untuk pertukaran dokumen web”.

HTML merupakan pengembangan dari standar dari pemformatan

dokumen teks, yaitu Standart Generalized Markup Languange (SGML). HTML

pada dasarnya merupakan dokumen ASCII atau teks biasa, yamg dirancang

untuk tidak tergantung pada suatu system operasi tertentu.

2. PHP

Menurut Prasetio (2015:130), “PHP (PHP: Hypertext Preprocessor) adalah

bahasa script yang ditanam di sisi server.” Prosesor PHP dijalankan di server

(Windows atau Linux). Saat sebuah halaman dibuka dan mengandung kode PHP,

prosesor itu halaman tersebut, dan kemudian menampilkan hasilnya ke browser

sebagai halaman HTML biasa. Karena penerjemahan ini terjadi di server, sebuah

8

halaman ditulis dengan PHP dapat dilihat dengan menggunakan semua jenis

browser, di sistem operasi apapun.

Seperti sebagian besar bahasa script lainnya, PHP dapat ditanamkan

langung ke dalam HTML. Kode PHP dipisahkan dari HTML dengan

menggunakan tanda Start dan End. Ketika sebuah dokumen dibaca, prosesor

PHP hanya menerjemahkan area yang ditandai saja, dan menampilkan hasilnya

pada tempat yang sama.

3. JavaScript

Menurut Kadir (2013:5) “JavaScript adalah bahasa skrip yang biasa

diletakkan bersama kode HTML untuk menentukan suatu aksi”. Sedangkan

menurut Prasetio (2015:332), “JavaSrcipt adalah bahasa pemrograman yang

digunakan untuk membuat web lebih dinamis dan interaktif.”

Kode JavaScript biasanya dituliskan dalam bentuk fungsi yang ditaruh

ditag <head> yang dibuka dengan tag <script type=”teks/JavaScript>. Kode

JavaScript juga bisa diletakkan di file tersendiri yang berekstensi .js (singkatan

dari JavaScript).

2.1.4. Desain Pemrograman Web

Dalam pembuatan web ini penulis menggunakan desain pemrograman web

sebagai berikut:

9

1. CSS

Menurut Jayan (2010:2) “CSS merupakan singkatan dari Cascading Style

Sheet. kegunaannya adalah untuk mengatur tampilan dokumen HTML.” contohnya

seperti pengaturan jarak antar baris, teks, warna dan format border bahkan

penampilan file gambar.

2. Dreamweaver CS5

Menurut Sadeli (2011:2) “Dreamweaver merupakan suatu perangkat lunak

web editor keluaran Adobe System yang digunakan untuk membangun dan

mendesign suatu website dengan fitur-fitur yang menarik dan kemudahan dalam

penggunaannya”.

Selain mudah digunakan dalam membuat dan mendesign web

Dreamweaver juga menambah flexibilitasnya dengan bahasa pemrograman web

lainnya dan juga berintegrasi pada beberapa perangkat lunak ini menjadi pilihan

utama bagi para web-designer amatir maupun expert.

Pada Dreamweaver CS5 terdapat beberapa fitur baru yang keran yang dapat

anda gunakan segera mulai dari seputar CSS, penggunaan fitur canggih Ajax dan

Jquery menggunakan Browser Widget, serta pengujian tampilan web menggunakan

Web Adobe BrowserLab.

10

2.1.5. Web Server

Untuk memulai pemograman PHP, tidak cukup hanya dengan menginstal PHP

saja, diperlukan beberapa perangkat lunak tambahan yang harus diinstal. Beberapa

perangkat lunak tersebut saling ketergantungan satu sama lain, diantaranya:

1. XAMPP

Menurut Buana (2014:4), XAMPP adalah : Perangkat lunak opensource yang bisa diunggah secara gratis dan bisa dijalankan di semua sistem operasi seperti Windows, Linux, Solaris dan Mac dan XAMPP ini sendiri dibuat dan dikembangkan oleh Apache Friends. Perangkat lunak tersebut berisik kumpulan beberapa perangkat lunak yang dibutuhkan, antara lain PHP, Apache, MySQL dan PHPMyAdmin.

2. Apache

Menurut Buana (2014:2), “Apache merupakan web server yang bersifat

opensource, yang digunakan oleh PHP.” Karena sifatnya yang opensource,

sehingga bisa diambil, digunakan, bahkan bisa mengubah kode programnya

tanpa harus membayar. Apache bertugas untuk menampilkan hasil proses script

PHP yang ditulis oleh pembuat halaman web, sehingga dihasilkan halaman web

yang benar kepada peminta, dan dapat juga suatu database diakses terlebih

dahulu misalnya MsSQL, untuk mendukung halaman web yang dihasilkan.

3. PHPMyAdmin

Dengan menggukan MySQL, pengolahan database dilakukan dengan

mengetikan baris-baris perintah (misalnya menggunakan MySQL console) yang

sesuai untuk keinginan tertentu. Jika kita ingin membuat database dan

memanipulasi table, maka kita harus mengetikan baris perintah yang sesuai. Hal

diatas tersebut tentu cukup sulit dilakukan karena kita harus menghafal semua

11

baris sintak dan harus mengetikan satu persatu baris sintak tersebut. Oleh karena

itu, diperlukan perangkat lunak tambahan yang disebut dengan PHPMyAdmin.

Dengan PHPMyAdmin, pengolahan atau manipulasi database jadi lebih mudah,

karena tidak perlu menghafal sintaknya.

2.1.6. Database

Untuk database penulis menggunakan MySQL, menurut Buana (2014:2),

“MySQL merupakan database yang paling sering digunakan dalam pemrograman

PHP.” MySQL digunakan untuk menyimpan data di dalam database dan

memanipulasi data-data yang diperlukan memanipulasi data tersebut berupa

menambah, mengubah, dan menghapus data yang berada dalam database.

2.2. Teori Pendukung

2.2.1. Model Pengembangan Perangkat Lunak

Menurut Sukamto dan Shalahudin, (2013:26) “Model SDLC air terjun

(waterfall) sering juga disebut model sekuensial linier (sequential linear) atau alur

hidup klasik (classic life cycle)”. Model air terjun menyediakan pendekatan alur

hidup perangkat lunak secara sekuensial atau terurut dimilai dari analisis, desain,

pengodean, pengujian, dan tahap pendukung (support). Berikut adalah gambar model

air terjun:

12

Sumber : Sukamto dan Shalahudin (2013)

Gambar II.1. Waterfall Model

1. Analisis kebutuhan perangkat lunak

Proses pengumpulan kebutuhan dilakukan secara intensif untuk

menspesifikasikan kebutuhan perangkat lunak agar dapat dipahami perangkat

lunak seperti apa yang dibutuhkan oleh user. Spesifikasi kebutuhan perangkat

lunak pada tahap ini perlu untuk didokumentasikan.

2. Desain

Desain perangkat lunak adalah proses multi langka yang fokus pada desain

pembuatan program perangkat lunak termasuk struktur data, arsitektur perangkat

lunak, representasi antar muka, dan prosedur pengodean. Tahap ini mentranslasi

kebutuhan perangkat lunak dari tahap analisi kebutuhan ke representasi desain

agar dapat diimplementasikan menjadi program pada tahap selanjutnya. Desain

perangkat lunak yang dihasilkan pada tahap ini juga perlu didokumentasikan.

Sistem/rekayasa

informasi

Analisis Desain Pengodean pengujian

13

3. Pembuatan kode program

Desain harus ditranslasikan ke dalam program perangkat lunak. Hasil dari

tahap ini adalah program komputer sesuai dengan desain yang telah dibuat pada

tahap desain.

4. Pengujian

Pengujian fokus pada perangkat lunak secara dari segi logic dan fungsional

dan memastikan bahwa semua bagian sudah diuji, hal ini dilakukan untuk

meminimalisir kesalahan (error) dan memastikan keluaran yang dihasilkan

sesuai dengan yang diinginkan.

5. Pendukung (support) atau pemeliharaan (maintanance)

Tidak menutup kemungkinan sebuah perangkat lunak mengalami

perubahan ketika sudah dikirimkan ke user. Perubahan bisa terjadi karena adanya

kesalahan yang muncul dan tidak terdeteksi saat pengujian atau perangkat lunak

harus beradaptasi dengan lingkungan baru. Tahap pendukung atau pemeliharaan

dapat mengulangi proses pengembangan mulai dari analisis spesifikasi untuk

perubahan perangkat lunak yang sudah ada, tapi tidak untuk membuat perangkat

lunak baru.

2.2.2. Struktur Navigasi

Menurut Binanto (2010:268) “Struktur navigasi adalah gabungan dari struktur

referensi informasi situs web dan mekanisme link yang mendukung pengunjung untuk

melakukan penjelajahan situs”. Binanto (2010:268) menyatakan bahwa terdapat

empat struktur dasar navigasi, yaitu:

14

a. Struktur Navigasi Linier

Struktur navigasi linier hanya mempunyai satu rangkaian cerita yang berurut

yang menampilkan satu demi satu tampilan layar secara berurut menurut

urutannya dan tidak diperbolehkan adanya percabangan.

Sumber : Binanto (2010:269)

Gambar II.2. Struktur Navigasi Linier

b. Struktur Navigasi Hirarki

Struktur navigasi hirarki biasa disebut struktur bercabang, merupakan suatu

struktur yang mengandalkan percabangan unuk menampilkan data berdasarkan

kan kriteria tertentu. Tampilan pada menu pertama akan disebut sebagai Master

Page (halaman utama pertama), halaman utama ini mempunyai halaman

percabangan yang disebut Slave Page (halaman pendukung).


Gambar II.3. Struktur Navigasi Hirarki

15

c. Struktur Navigasi Non-Linier

Struktur navigasi non-linier merupakan pengembangan dari struktur navigasi

linier. Pada struktur ini diperkenankan membuat navigasi bercabang.

Percabangan yang dibuat pada struktur non-linier ini berbeda dengan

percabangan pada struktur hirarki, karena pada percabangan non-linier ini

walaupun terdapat banyak percabangan, tetapi tiap-tiap tampilan mempunyai

kedudukan yang sama yaitu tidak ada Master Page dan Slave Page.


Gambar II.4. Struktur Navigasi Non-Linier

d. Struktur Navigasi Campuran (Composite)

Struktur navigasi campuran merupakan gabungan dari ketiga struktur

sebelumnya, yaitu :linier, hirarki dan non-linier. Struktur navigasi ini juga biasa

disebut dengan struktur navigasi bebas.Struktur navigasi ini banyak digunakan

dalam pembuatan website, karena dapat memberikan keinteraksian yang lebih

tinggi.

16


Gambar II.5. Struktur Navigasi Campuran (Composite)

2.2.3. Entity Relationship Diagram (ERD)

Indrajani (2015:17) memaparkan bahwa : Entity Relation (ER) Modeling adalah sebuah pendekatan top-bottom dalam perancangan basis data yang dimulai dengan mengidentifikasikan data-data terpenting yang disebut dengan entitas dan hubungan antara entitas-entitas tersebut yang digambarkan dalam suatu model. Karena terdapat keterbatasan pada ER Model, maka terdapat pengembangan penambahan konsep semantik pada ER yang disebut Enhance Entity Relational (EER) Model.

Ada beberapa komponen dan notasi simbolik yang digunakan pada Entity-

Relationship Diagram (ERD), yaitu:

1. Persegi panjang, menyatakan himpunan entitas (Entity)

Entitas adalah suatu objek yang dapat didefinisikan dalam lingkungan pemakai,

dan sesuatu yang penting bagi pemakai dalam konteks sistem yang akan dibuat.

17

2. Lingkaran/Elips, menyatakan Atribut (Attribute)

Atribut adalah bagian dari suatu entity yang berfungsi mendeskripsikan karakter

entity, sehingga atribut dapat digunakan sebagai identifier (key) untuk

menentukan entity secara unik. Dan deskriptor (non key) untuk menentukan

secara tidak unik.

3. Belah ketupat, menyatakan himpunan relasi (Relationship)

Relasi adalah suatu objek yang menghubungkan antar entity dengan entity.

Sehingga dalam menentukan hubungan harus dibedakan antara hubungan atau

bentuk hubungan antar entity dengan isi dari hubungan itu sendiri.

4. Garis, menyatakan adanya hubungan (Link)

Link adalah garis penghubung antara himpunan relasi dengan himpunan entitas

dan himpunan dengan atributnya.

Selain komponen, ERD juga mempunyai Derajat Relationship menunjukan

jumlah maksimum tupel yang dapat berelasi dengan entitas pada entitas yang lain

sebagai berikut :

a. One to one

Tingkat hubungan satu ke satu, dinyatakan dengan satu kejadian pada entitas

pertama, hanya mempunyai satu hubungan dengan satu kejadian pada entitas

yang kedua dan sebaliknya. Yang berarti setiap tupel pada entitas A berhubungan

paling banyak satu tupel pada entitas A, dan begitu juga sebaliknya setiap tuple

pada entitas A berhubungan dengan paling banyak satu tupel pada entitas A.

18

b. One to many atau many to one

Tingkat hubungan satu kebanyak adalah sama dengan banyak ke satu.

Tergantung dari arah mana hubungan tersebut dilihat. Untuk satu kejadian pada

entitas yang pertama dapat mempunyai banyak hubungan dengan kejadian pada

entitas yang kedua. Sebaliknya satu kejadian pada entitas yang kedua hanya

dapat mempunyai satu hubungan dengan satu kejadian pada entitas yang sama.

c. Many to many

Tingkat hubungan kebanyakan terjadi jika tiap kejadian pada sebuah entitas akan

mempunyai banyak hubungan dengan kejadian pada entitas lainnya. Baik dilihat

dari segi entitas pertama maupun dilihat dari entitas lainnya.

2.2.4. LRS (Logical Record Structure)

Menurut Hasugian dan Shidiq (2012:608) memberikan batasan bahwa LRS

adalah “sebuah model sistem yang digambarkan dengan sebuah diagram-ER akan

mengikuti pola atau aturan permodelan tertentu dalam kaitanya dengan konvensi ke

LRS”.

2.2.5. Pengujian Web

Menurut Sukamto dan Shalahuddin (2013:275) “Black-box testing yaitu

perangkat lunak dari segi spesifikasi fungsional tanpa menguji desain dan kode

program”.

19

Pengujian dimaksudkan untuk mengetahui apakah fungsi-fungsi masukan dan

keluaran dari perangkat lunak sesuai dengan spesifikasi yang dibutuhkan. Kasus uji

yang dibuat untuk melakukan pengujian kotak hitam harus dibuat dengan kasus benar

dan kasus salah, misalkan untuk kasus proses login maka kasus uji coba yang

dilakukan adalah:

a. Jika user memasukkan nama pemakai (username) dan kata sandi (password) yang

benar.

b. Jika user memasukkan nama pemakai (username) dan kata sandi (password) yang

salah,misalkan nama pemakai benar tapi kata sandi salah, atau sebaliknya atau

keduanya salah

BAB III

PEMBAHASAN

3.1. Analisa Kebutuhan

Analisis kebutuhan adalah mengidentifikasi kebutuhan yang dibutuhkan

berdasarkan kebutuhan pengguna. Berikut adalah uraian kebutuhan pengguna:

a. Administrasi.

Dalam rancangan web ini penulis membuat dua halaman utama yaitu halaman

admin, dimana halaman ini hanya dikelolah oleh para administrator saja yang

dimana di halaman admin ini penulis menyediakan pengelolahan penambahan

produk, kategori, manampilkan pesan yang masuk, konfirmasi pembayaran, data

member, kontak, laporan semua fasilitas ini dimaksudkan untuk mempermudah

para admin dalam mengelolah website ini.

b. Pengguna.

Sedangkan dihalaman pengguna disediakan halaman home yang berisi katalog

dari kumpulan semua produk yang ada, halaman akun saya berisikan data

member yang telah terdaftar sebagai member, halaman notebook berisikan

produk beserta kategorinya, halaman profil berisikan tentang profil toko laptop

kontak, halaman kontak kami berisikan form untuk berhubungan dengan kami,

halaman pertunjuk web ini berisikan semua petunjuk mengenai website ini,

halaman login sign up untuk melakukan pendaftaran dan masuk untuk

memberikan hak akses member kepada member.

20

21

Berikut adalah proses pembelian laptop di web perancangan sistem

informasi penjualan laptop melalui website yang penulis buat.

1. Klik pada tombol Beli pada produk yang ingin Anda pesan.

2. Produk yang Anda pesan akan masuk ke dalam Keranjang Belanja. Anda

dapat melakukan perubahan jumlah produk yang diinginkan dengan

mengganti angka di kolom Jumlah. Sedangkan untuk menghapus sebuah

produk dari Keranjang Belanja, klik tombol hapus yang berada di kolom

paling kanan.

3. Jika sudah selesai, klik tombol lanjut, maka akan tampil data member

untuk pengisian data member jika sudah menjadi member anda tinggal

melakukan login.

4. Setelah data pembeli selesai diisikan, klik tombol lanjut lagi, maka akan

tampil data pembeli beserta detail produk yang dipesannya dan detail

pembayarannya.

5. Apabila telah melakukan pembayaran kurang dari 1x24 jam, maka

produk/barang akan segera kami kirimkan.

3.2. Spesifikasi Rancangan Website

Penulis akan memberikan penjelasan secara lebih mendetail mengenai

rancangan website yang dibuat pada sub-sub bab berikut ini:

22

3.2.1. Rancangan Halaman Website

Penulis Dalam hal ini penulis akan menggambarkan rancangan website yang

akan dibuat, yaitu mengenai bentuk layout maupun fungsinya yang nantinya dapat

membantu dalam tahap perancangan website E-Commerce.

1. Rancangan Halaman admin

Gambar III.1.

Spesifikasi Rancangan Halaman Admin

Keterangan :

Header : Berisikan judul, logo, dan Gambar Slide Show

Link 1 : Berisi link Beranda, ucapan selamat datang

Link 2 : Berisi link Slide Show, menampilkan, edit, hapus

Slide Show

Link 3 : Berisi link Produk, menampilkan data produk.

23

Link 4 : Berisi link Gambar Pendukung, menampilkan

gambar pendukung dari produk

Link 5 : Berisi link Member, menampilkan dan menghapus

data-data member.

Link 6 : Berisi link Kategori, menampilkan dan menghapus

data-data kategori

Link 7 : Berisi link Kontak, menampilkan data-data kontak

Link 8 : Berisi link Pemesanan, menampilkan, menghapus

data-data Pemesanan.

Link 9 : Berisi link Laporan, menampilkan data Laporan

perbulan.

Link 10 : Berisi link Order Sementara, menampilkan dan

menghapus data-data Orders Temporarily .

Link 11 : Berisi link Konfirmasi, menampilkan dan menghapus

data-data konfirmasi

Link 12 : Berisi link Keluar, untuk keluar dari halam admin

Content : Berisi Tampilan-tampilan dari berbagai Link yang

ada

24

2. Rancangan Halaman Beranda

Gambar III.2.

Spesifikasi Rancangan Halaman Beranda

Keterangan :


Link 1 : Berisi link Beranda, menampilkan data produk.

Link 2 : Berisi link akun saya, menampilkan data member.

Link 3 : Berisi link Notebook, menampilkan data produk.

Link 4 : Berisi link Konfirmasi Pembayaran, menampilkan

form input pembayaran.

Link 5 : Berisi link Profil, menampilkan data profil.

Link 6 : Berisi link kontak kami, menampilkan form input

kontak kami.

25

Link 7 : Berisi link cara belanja, menampilkan cara belanja.

Link 8 : Berisi link login, menampilkan form input login

member.

Link 9 : Berisi link keranjang belanja, menampilkan keranjang

belanja.

Link 10 : Merupakan tampilan keranjang belanja

Link 11 : Merupakan tampilan rekening bank

Link 12 : Merupakan tampilan status pengiriman barang

Produk : Tampilan-tampilan dari produk

Footer : Alternatif link.

3. Rancangan Halaman Akun Saya

Gambar III.3.

Spesifikasi Rancangan Halaman Akun Saya

26

Keterangan :









kontak kami.



member.


belanja.




Produk : Berisi Tampilan dari produk secara random

form : Berisi form data member yang telah login

Footer : Alternatif link

27

4. Rancangan Halaman Produk.

Gambar III.4.

Spesifikasi Rancangan Halaman Produk

Keterangan :









kontak kami.


28


member.


belanja.




Produk : Berisi Tampilan dari produk secara random

kategori : Berisi kategori produk berdasarkan merk

Footer : Alternatif link.

29

3.2.2. RANCANGAN BASIS DATA

A. ENTITY RELATION DIAGRAM (ERD)

Gambar III.5.

Entity Relationship Diagram

30

B. Logikal Record Structure (LRS)

Gambar III.6.

Logikal Record Strukture

31

C. Spesifikasi File

File merupakan kumpulan dari beberapa record yang berhubungan satu sama

lain yang berisi data suatu bidang tertentu. Sedangkan record dapat diartikan sebagai

kumpulan dari beberapa field, begitu juga dengan field merupakan kumpulan data

sejenis.

Spesifikasi file dibuat sebagai pendukung agar pemakai (user) program

mengetahui segala yang berhubungan dengan file ataupun field name pada

pengolahan database. Untuk itu, penulis memaparkan spesifikasi file perancangan

sistem informasi penjualan laptop berbasis web adalah sebagai berikut;

1. Spesifikasi File tabel admin

Nama Tabel : admin

Akronim : Userid dan Pswd

Fungsi : untuk menampilkan file admin

Tipe File : File Master

Organisasi File : index sequential

akses file : Random

Media File : Harddisk

Kunci Field : User id

Software : MySQL

jumlah Record : 45 byte

32

Tabel III.1

Spesifikasi Tabel Admin

No Elemen data Akronim Type Panjang Keterangan

1 User id Userid Varchar 30 Primary

key

2 Password Pswd Varchar 15

2. Spesifikasi File tabel gambar_produk

Nama Tabel : gambar_produk

Akronim : gambar_pendukung dan id_produk

Fungsi : untuk menampilkan file gambar produk



akses file : Random


Kunci Field : -

Software : MySQL


33

Tabel III.2

Spesifikasi Tabel Gambar_Produk


1 Gambar pendukung gambar_pendukung Varchar 100

2 Id produk id_produk Int 3 Foreign key

3. Spesifikasi File tabel kategori

Nama database : notebook

Akronim : kd_kategori dan nama_kategori

Fungsi : untuk menampilkan file kategori

Nama Tabel : kategori



akses file : Random


Kunci Field : kd_kategori

Software : MySQL


34

Tabel III.3

Spesifikasi Tabel Kategori


1 Kode kategori kd_kategori Int 2 Primary key

2 Nama kategori nama_kategori Varchar 15 -

4. Spesifikasi File tabel konfirmasi

Nama Tabel : konfirmasi

Akronim : id_konfirmasi, kd_member, Bank, id_orders, tgl_transfer,

total_transfer dan atas_nama

Fungsi : untuk menampilkan file konfirmasi

Tipe File : File Transaksi


akses file : Random


Kunci Field : Id_konfirmasi

Software : MySQL


35

Tabel III.4

Spesifikasi Tabel Konfirmasi


1 Id_konfirmasi id_konfirmasi Int 3 Primary key

2 Kode member kd_member Int 2 Foreign key

3 Bank Bank Varchar 20

4 Id orders id_orders Varchar 5 Foreign key

5 Tanggal transfer tgl_transfer Date

6 Total transfer total_transfer int 10

7 Atas nama atas_nama Varchar 30

5. Spesifikasi File tabel kontak

Nama Tabel : kontak

Akronim : kd_kontak, nama, email, tlp, dan pesan

Fungsi : untuk menampilkan file kontak



akses file : Random


Kunci Field : kd_kontak

Software : MySQL


36

Tabel III.5

Spesifikasi Tabel Kontak


1 Kode kontak kd_kontak Varchar 3 Primary key

2 Nama Nama Varchar 30

3 Email Email Varchar 30

4 Telepon Tlp Varchar 13

5 Pesan Pesan text

6. Spesifikasi File tabel member

Nama Tabel : member

Akronim : kd_member, nama_member, nama_member, alamat_member,

email_member, tlp_member, kd_pos__member, dan Password

Fungsi : untuk menampilkan file member



akses file : Random


Kunci Field : kd_member

Software : MySQL


37

Tabel III.6

Spesifikasi Tabel Member


1 Kode member kd_member int 2 Primary key

2 Nama nama_member Varchar 35 -

3 Alamat alamat_member Text -

4 Email email_member Varchar 30

5 Telepon tlp_member Varchar 13

6 Kode pos kd_pos__member Varchar 5

7 Password Password Varchar 15

7. Spesifikasi File tabel orders

Nama Tabel : order

Akronim : Id_orders, kd_member, status_order, dan tgl_order

Fungsi : untuk menampilkan file orders



akses file : Random


Kunci Field : id_orders

Software : MySQL


38

Tabel III.7

Spesifikasi Tabel Orders


1 Id orders Id_orders Varchar 5 Primary key

2 Kode member kd_member Int 2 Foreign key

3 Status order status_order Varchar 6

4 Tanggal tgl_order Date

8. Spesifikasi File tabel orders_detail

Nama Tabel : orders_detail

Akronim : id_orders, id_produk, dan Jumlah

Fungsi : untuk menampilkan file orders_detail



akses file : Random


Kunci Field : -

Software : MySQL


39

Tabel III.8

Spesifikasi Tabel Orders_detail


1 Id orders id_orders Varchar 5 Foreign key

2 Id produk id_produk Int 3 Foreign key

3 Jumlah Jumlah int 3

9. Spesifikasi File tabel orders_temp

Nama Tabel : order_temp

Akronim : id_orders_temp, id_ produk, dan jumlah

Fungsi : untuk menampilkan file orders_temp



akses file : Random


Kunci Field : id_orders_temp

Software : MySQL


40

Tabel III.9

Spesifikasi Tabel Order_temp


1 Id orders

temporarily

id_orders_temp Int 5 Primary key

2 Id produk id_ produk Int 3 Foreign key

3 Id session id_session Varchar 100

4 Jumlah Jumlah Int 5

10. Spesifikasi File tabel produk

Nama Tabel : produk

Akronim : Id_produk, kd_kategori, nama_produk, harga, stok, gambar,

warna, prosesor, ram, hardisk, baterai, keyboard, keyboard,

vga, dimensi_layar, ukuran_layar, display_teknologi, usb,

audio, berat, bluetooth, wifi, os, dan garansi

Fungsi : untuk menampilkan file produk



akses file : Random


Kunci Field : id_produk

41

Software : MySQL


Tabel III.10

Spesifikasi Tabel Produk


1 Id produk id_produk int 3 Primary key

2 Kode kategori kd_kategori int 3 Foreign key

3 Nama produk nama_produk Varchar 50

4 Harga Harga Int 9

5 Stok Stok Int 2

6 Gambar Gambar Varchar 100

7 Warna Warna Varchar 15

8 Prosesor Prosesor Varchar 30

9 Ram Ram Varchar 30

10 Hardisk Hardisk Varchar 30

11 Baterai Baterai Varchar 30

12 Keyboard Keyboard Varchar 30

13 Vga Vga Varchar 30

14 Dimens layar dimensi_layar Varchar 30

15 Ukuran layar ukuran_layar Varchar 30

16 Display teknologi display_teknologi Varchar 30

17 Usb Usb Varchar 30

18 Audio Audio Varchar 30

19 Berat Berat Varchar 3

42

20 Bluetooth Bluetooth Varchar 30

21 Wifi Wifi Varchar 30

22 Os Os Varchar 30

23 Garansi Garansi Varchar 10

11. Spesifikasi File tabel slide

Nama Tabel : slide

Akronim : id_slide dan gambar_slide



akses file : Random


Kunci Field : Id_slide

Software : MySQL


Tabel III.11

Spesifikasi Tabel Slide


1 Id slide id_slide int 2 Primary key

2 Gambar slide gambar_slide Varchar 100 -

43

3.2.3. Rancangan Struktur Navigasi

Rancangan arsitektur yang penulis buat adalah struktur navigasi campuran

karena dapat memberikan ke interaksian yang lebih tinggi dan dapat di lihat dari

struktur navigasi campuran di bawah ini:

1. Struktur navigasi halaman pengunjung

Gambar III.7.

Struktur Navigasi Halaman Pengunjung

44

2. Struktur navigasi halaman member

Gambar III.8.

Struktur Navigasi Halaman Member

45

3. Struktur navigasi halaman admin

Gambar III.9.

Struktur Navigasi Halaman Admin

46

3.3. Implementasi dan Pengujian Unit

3.3.1. Implementasi

Tahap implementasi sistem merupakan tahap penerapan sistem agar dapat

dioperasikan secara optimal sesuai kebutuhan. Implementasi antar muka yang dibuat

pada tahap perancangan, diimplementasikan menjadi bentuk halaman web yang yang

dibangun menggunakan perangkat lunak yang dijelaskan pada implementasi program.

a. Implementasi Rancangan Antar Muka (Interface)

Implementasi rancangan antar muka (Interface) pada aplikasi e-commerce

berdasarkan rancangan antar muka:

1. Implementasi Halaman Login Admin

Admin harus melakukan login untuk memilih menu yang tersedia jika berhasil

login, maka menu-menu yang berada di halaman admin akan ditampilkan.

Gambar III.10.

Tampilan Login pada Admin

47

2. Implementasi Halaman Beranda Admin

Pada halaman beranda admin, seorang admin dapat memperbaharui dan

memilih informasi yang berada didalam website.

Gambar III.11.

Tampilan Halaman Beranda pada Admin

3. Implementasi Halaman Pendafataran Member

Untuk member yang belum memiliki akun maka akan diharuskan untuk

mengisi pendaftaran untuk menjadi member.

Gambar III.12.

Tampilan Pendaftaran Member

48

4. Implementasi Halaman Login Member

Member yang telah mendaftar maka harus melakukan login terlebih dahulu

dengan mengisi kolom email dan password.

Gambar III.13.

Tampilan Halaman Login Member

5. Implementasi Halaman Beranda Member.

Member dapat melihat, memilih, dan melakukan pembelian produk laptop

yang telah disediakan di website.

Gambar III.14.

Tampilan Halaman Beranda Member

49

6. Implementasi Halaman Keranjang Belanja

Member dapat melakukan perubahan jumlah produk yang diinginkan dengan

mengganti angka di kolom jumlah dan menghapus produk di tombol hapus.

Gambar III.15.

Tampilan Halaman Keranjang Belanja

7. Implementasi Halaman Data Member

Setelah member selesai belanja maka akan dialihkan ke halaman data member

yang dapat diedit sesuai dengan keinginan member.

Gambar III.16.

Tampilan Halaman Selesai Belanja

50

8. Implementasi Halaman Konfirmasi Pembayaran

Member dapat melakukan konfirmasi pembayaran dengan memilih salah satu

bank yang telah disediakan di halaman ini.

Gambar III.17.

Tampilan Halaman Konfirmasi Pembayaran

9. Implementasi Halaman Bukti Order Pembelian

Dihalaman ini member akan mendapat bukti pembelian produk sesuai dengan

pesanan.

Gambar III.18.

Tampilan Halaman Bukti Order Pembelian

51

3.3.2. Spesifikasi Sistem Komputer

Berikut ini adalah spesifikasi perangkat keras dan perangkat lunak minimum

yang dibutuhkan untuk mengimplementasikan web e-commerce yang dibuat penulis.

a. Perangkat Keras

Adapun perangkat keras yang diperlukan adalah sebagai berikut :

a. Processor : Pentium Dual-Core CPU B960 @ 2.20GHz

b. Monitor : LCD Widescreen 14”

c. Harddisk : 500 GB

d. RAM : 4 Gb

e. Keyboard : Standar 84-key

f. Mouse : Standar

g. Printer : Deskjet

b. Perangkat Lunak

Perangkat lunak yang dibutuhkan agar aplikasi program ini dapat digunakan

dengan maksimal adalah :

a. Sistem Operasi : Windows 7 Ultimate

b. Program Design : Adobe Dreamweaver CS8

c. Bahasa Script : PHP

d. Web Server : XAMPP

e. Web Browser : Mozilla Firefox

f. Database : MySQL

52

3.3.3. Pengujian Unit

Pengujian perangkat lunak merupakan elemen kritis yang mempresentasikan

kajian pokok dari spesifikasi, desain dan pengkodean. Pengujian ini dilakukan untuk

mengetahui kelemahan dari aplikasi yang telah dibuat, sehingga akhirnya

memberikan kualitas yang baik untuk pengguna.

Dengan adanya aplikasi yang telah dibuat ini proses pengujian blacbox

berfokus pada kinerja sistemnya, baik dari database maupun interface.

A. Pengujian Terhadap Halaman Login Member

Tabel III.12

Hasil Pengujian Black Box Testing Halaman Login member

No Skenario Pengujian

Test Case Hasil yang diharapkan

Hasil Pengujian

Ket.

1. User Name dan Password tidak diisi kemudian klik tombol login

Email: (kosong) Password: (kosong)

Sistem akan menolak akses User dan menampilkan “Username or Password anda tidak valid”

Sesuai Harapan

Berhasil

2. Mengetikan User Name dan Password tidak diisi atau kosong kemudian klik tombol login

Email : [email protected](salah) Password: (kosong)


Sesuai Harapan

Berhasil

53

B. Pengujian Terhadap Halaman Login Admin

Tabel III.13

Hasil Pengujian Black Box Testing Halaman Login admin

3.

User Name

tidak diisi

(kosong)

dan

password

diisi

kemudian di

klik tombol

login

Email :

(kosong)

Password :

12345


Sesuai

Harapan

Berhasil

4. Mengetik salah satu kondisi salah pada User Name atau Password kemudian klik tombol login

Email : [email protected] (benar) Password: 123465 (salah)


Sesuai Harapan

Berhasil

5. Mengetik User Name dan Password dengan data yang benar kemudian kliik tombol login

User Name: [email protected] (benar) Password: 12345 (benar)

Sistem menerima akses login dan kemudian langsung menampilkan “login sukses” kemudian ke halaman utama user.

Sesuai Harapan

Berhasil



Hasil Pengujian

Ket.

1. User Name dan Password tidak diisi

User Name: (kosong) Password: (kosong)

Sistem akan menolak akses User dan menampilkan “Mohon Isi

Sesuai Harapan

Berhasil

54

kemudian klik tombol login

Username OR Password Anda”

2. Mengetikan User Name dan Password tidak diisi atau kosong kemudian klik tombol login

User Name: 1 Password: (kosong)

Sistem akan menolak akses User dan menampilkan “Mohon Isi Username OR Password Anda”

Sesuai Harapan

Berhasil

3.

User Name

tidak diisi

(kosong)

dan

password

diisi

kemudian di

klik tombol

login

UserName:

(kosong)

Password :

12345

Sistem akan menolak akses User dan menampilkan “Mohon Isi Username OR Password Anda”

Sesuai

Harapan

Berhasil

4. Mengetik salah satu kondisi salah pada User Name atau Password kemudian klik tombol login

User Name: 1 (benar) Password: 123465 (salah)

Sistem akan menolak akses User dan menampilkan “Username or Password tidak valid”

Sesuai Harapan

Berhasil

5. Mengetik User Name dan Password dengan data yang benar kemudian kliik tombol login

User Name: 1 (benar) Password: 1(benar)

Sistem menerima akses login dan kemudian langsung menampilkan halaman utama admin.

Sesuai Harapan

Berhasil

55

C. Pengujian Terhadap Halaman Pendaftaran Member

Tabel III.14

Hasil Pengujian Black Box Testing Halaman Pendaftaran Member


Testing Case Hasil yang diharapkan Hasil Pengujian

Ket.

1. Semua data pelanggan tidak diisi kemudian klik tombol Daftar

Nama: (kosong) Alamat: (kosong) Email: (kosong) No.Telp/HP: (kosong) Kode Post: (kosong) Password: (Kosong) Ulangi Password: (Kosong) Kode Captha: (Kosong)

Sistem akan menampilkan: *Kolom nama harus diisi *Kolom alamat harus diisi *Alamat email harus diisi *Kode POS harus diisi *Kolom password harus diisi *Kolom password harus diisi

Sesuai Harapan

Berhasil

2. Mengisi hanya data nama pelanggan yang lain tidak diisi atau kosong kemudian klik tombol Daftar

Nama: Andri Alamat: kosong Email: (kosong) No.Telp/HP: (kosong) Kode Post: (kosong) Password: (Kosong) Ulangi Password: (Kosong) Kode Captha: (Kosong)

Sistem akan menampilkan: *Kolom alamat harus diisi *Alamat email harus diisi *Kode POS harus diisi *Kolom password harus diisi *Kolom password harus diisi

Sesuai Harapan

Berhasil

56

3.

Tidak

mengisi

sebagian

form

kemudian

klik tombol

Daftar

Nama: Andri Alamat: Jl. Kayumanis 3 No.35 Email: (kosong) No.Telp/HP: (kosong) Kode Post: (kosong) Password: (Kosong) Ulangi Password: (Kosong) Kode Captha: (Kosong)

Sistem akan menampilkan: *Alamat email harus diisi *Kode POS harus diisi *Kolom password harus diisi *Kolom password harus diisi

Sesuai

Harapan

Berhasil

4. Mengisi semua data pelanggan, namun data username sudah ada kemudian klik tombol Daftar

Nama: Andri Alamat: Kayumanis Email: [email protected] No.Telp/HP: 085211252230 Kode Post: 13120 Password: 12345 Ulangi Password: 12345 Kode Captha: (Diisi)

Sistem akan menampilkan: email anda sudah terdaftar

Sesuai Harapan

Berhasil

5. Semua data pelanggan diisi dan tidak ada username

Nama: Fhijar Alamat: Jl. Kayuringin Raya

Sistem akan menyimpan data member dan menampilkan “Login Succsess”

Sesuai Harapan

Berhasil

57

D. Pengujian Terhadap Halaman Selesai Belanja

Tabel III.15

Hasil Pengujian Black Box Testing Login Halaman Selesai Belanja

No

Skenario

pengujian


Hasil

pengujian

Ket

1.

Membeli

tanpa login

Email:

(kosong)

Password :

(kosong)

Sistem akan

menampilkan:

“Anda belum

login silahkan

login terlebih

dahulu atau

mendaftar

menjadi

member”.

Sesuai

harapan

Berhasil

2.

Membeli

dengan

login lalu

mengedit

dan tidak

mengisi

Nama: (kosong)

Alamat:

(kosong)

Email:

(kosong)

Sistem akan

menolak dan

menampilkan:

*Kolom nama

harus diisi

*Kolom alamat

Sesuai

harapan

Berhasil

yang sama kemudian klik tombol Daftar

Email: [email protected] No.Telp/HP: 083814749802 Kode Post: 14120 Password: 12345 Ulangi Password: 12345 Kode Captha: (Diisi)

58

data

member

Telpon/HP:

(kosong)

Kode Pos:

(kosong)

harus diisi

*Alamat Email

harus diisi

*Kolom telepon

harus diisi

*Kode pos harus

diisi

3.

Mengisi

semua data

dan klik

tombol

lanjut

Nama: Andri Alamat:

Kayumanis 3

Email:

andri@gmail.

com

Telpon/HP:

08521125223

0

Kode Pos:

13120

Sistem akan

menampilkan:

Bukti Order

Andri Alamat:

Kayumanis 3

Email:

[email protected]

Telpon/HP:

085211252230

Nomor Order:

NF001

Sesuai

harapan

Berhasil

E. Pengujian Terhadap Halaman Konfirmasi Pembayaran

Tabel III.16

Hasil Pengujian Black Box Testing Halaman Konfirmasi Pembayaran

No

Skenario

pengujian

Test Case

Hasil yang

diharapkan

Hasil

pengujian

Ket

1.

Semua data

konfirmasi

pembayaran

tidak diisi

No.Invoice:

(kosong)

Atas Nama:

(kosong)

Total

Transfer:

(kosong)

Kode Captha:

(kosong)

Sistem akan

menolak dan

menampilkan:

*Kolom Invoice

harus diisi

*Kolom nama

harus diisi

*Kolom total

harus diisi

*Kolom kode

harus diisi.

Sesuai

harapan

Berhasil

59

2 Semua data

konfirmasi

pembayaran

diisi

No.Invoice:

NF001

Atas Nama:

Andri

Total

Transfer: Rp

5000000

Kode Captha:

x3mwdk atau

diisi

Sistem akan dan

menampilkan:

Terima kasih

telah

mengkonfirmasi

pembayaran anda.

Kami akan

memproses data

pesanan anda

untuk dikirim ke

alamat tujuan.

Sesuai

harapan

Berhasil

Berdasarkan hasil pengujian dengan kasus sample uji diatas dapat ditarik

kesimpulan bahwa perangkat lunak sistem informasi penjualan dapat berjalan

dengan baik dan secara fungsional sistem dapat menghasilkan output yang

diharapkan.

61

BAB IV

PENUTUP

4.1. Kesimpulan

Setelah mengamati dan mempelajari, penulis mengambil kesimpulan

mengenai web perancangan sistem informasi penjualan laptop, kesimpulan tersebut

antara lain yaitu:

1. Website yang dibuat oleh penulis ini adalah sarana penjualan laptop secara

online dan dapat diakses di mana saja dan kapan saja.

2. Website ini dibangun juga untuk menghemat biaya karena tidak perlu

menyewa toko.

3. Penjualan online melalui website mampu menarik konsumen dalam bentuk

teks dan gambar, dan membantu website tersebut lebih menarik untuk

dikunjungi kemudian konsumen dapat membeli barang.

4. Sasaran dari website ini adalah konsumen yang tidak mempunyai waktu

untuk mengunjungi toko.

60

61

4.2. Saran

Dari kesimpulan yang telah dibuat berdasarkan proses perancangan

website, maka penulis mencoba mengajukan saran–saran agar dapat membuat

website yang jauh lebih baik lagi, yaitu:

1. Website ini diharapkan dapat memudahkan bagi konsumen untuk membeli

barang secara online.

2. Website ini diharapkan bisa menambah kepercayaan konsumen kepada toko

online tersebut.

3. Ada baiknya untuk tahap pengembangan sistem baru diharapkan dibuat

semenarik mungkin dan dikembangkan lebih lanjut dengan tambahan

informasi yang lebih lengkap dan pastinya bisa lebih bermanfaat bagi

pengelola dan pengguna website tersebut.

4. Halaman utama website harus dibuat lebih spesifik agar konsumen tertarik

untuk membeli barang. Jangan sampai konsumen merasa bingung dengan

website yang dibuat.

62

DAFTAR PUSTAKA

Binanto, Iwan. 2010. Multimedia Digital Dasar Teori dan Pengembanganya.

Yoyakarta: Andi Offset. Buana, I komang Setia. 2014. Jago Pemrograman PHP. Jakarta: Dunia Komputer. Indrajani. 2015. Database Design (Case Study All in One). Jakarta: Elex Media

Komputindo. Hasugian, H., & Shidiq, A. N. 2012 Rancang bangun sistem informasi industri kreatif

bidang penyewaan sarana olahraga, 2012(Semantik). Jayan. 2010. CSS untuk Orang Awam. Palembang: Maxikom. Kadir, Abdul. 2013. From Zero to A pro – Javascript & Jquery. Yogyakarta: Andi. Kustiyahningsih, Yeni. 2011. “Pemrograman Basis Data Berbasis Web Menggunakan

PHP & MySQL”. Jakarta: Graha Ilmu. Prasetio, Adhi 2015. Buku Pintar Webmaster Untuk Pemula. Jakarta: Mediakita. Sadeli, Muhammad. 2011. 7 Jam Belajar Internet Dreamweaver CS5 untuk Orang

Awam. Palembang: Maxikom. Sibero, Alexander, F.K. 2011. Kitab Suci Web Programming. Yogyakarta: Mediakom

Soeryana, Taryana dan Koesheryatin. 2014. Aplikasi Internet Menggunakan HTML, CSS dan JavaSript. Jakarta: Elex Media Komputindo.

Sukamto, Rosa A dan M. Shalahudin. 2013. Rekayasa Perangkat Lunak (Terstruktur

dan Berorientasi Objek), Bandung: Informatika

Documents

TUGAS AKHIR...Akhir kata semoga penulisan tugas akhir ini dapat berguna bagi penulis khususnya dan bagi para pembaca yang berminat pada umumnya. Jakarta, 10 Juli 2017 Penulis Andri