Pembuatan website Company Profile CV. Arcons Indonesia

(1)

PEMBUATAN WEBSITE COMPANY PROFILE

CV. ARCONS INDONESIA

KERJA PRAKTEK

Diajukan Untuk Memenuhi Tugas Mata Kuliah Kerja Praktek Program Studi Teknik Informatika

Fakultas Teknik dan Ilmu Komputer

Edi Rizkinta Harahap

10110267

Maju Simon Manurung

10110754

Ajang Nusa Wisasmara

10110262

JURUSAN TEKNIK INFORMATIKA

FAKULTAS TEKNIK DAN ILMU KOMPUTER

(2)

E - 1

LAMPIRAN E

(3)

(4)

F - 1

LAMPIRAN F

(5)

F - 2

(6)

F - 1

LAMPIRAN F

(7)

F - 2

(8)

F - 1

LAMPIRAN F

(9)

F - 2

(10)

G - 1

LAMPIRAN G

(11)

G - 2

Ajang Nusa Wisasmara

Address: Jalan Mekarwangi, Desa Sariwangi RT 01/RW 13 Perumahan Bukit Taman Asri Blok a No. 3, Bandung Barat Phone: +6285659036831

Email : ajangnusa@gmail.com

Personal Information

Place & D.O.B : Dumai, May 9th 1991

Marital Status : Single

Religion : Moslem

Languages Known : Sunda, Indonesian, English, Spain, java

Formal Education

Indonesia Computer University Majoring Informatics Engineering

(12)

G - 3

Integrated Development Environtment : Adobe DreamWeaver CS5 Dev C++

Microsoft Visual Studio 2010 Express

Text Editor : Sublime Text 2 Notepad

Programming Language : HTML CSS Javascript PHP Java C / C++ / C#

Framework : Codeigniter

Achievement

(13)

G - 1

LAMPIRAN G

(14)

G - 2

Edi Rizkinta Harahap

Address : Jln. Kemang sari I No. 61A RT 001/011,

kecamatan pondok gede, kelurahan jatibening baru, bekasi Phone : +6289656080621

Languages Known : Sunda, Indonesian, English, Batak

Formal Education

WEB APPLICATION

 Company Profile Wahana Yasa Teknik  Company Profile QLAB

 Company Profile Arcons Indonesia

(15)

G - 3

Skills

Operating System : Microsoft Windows XP Microsoft Windows 7 Microsoft Windows Server

Integrated Development Environtment : Dev C++

Adobe DreamWeaverCS5

Text Editor : Sublime Text 2 Notepad Bricket

Programming Language : HTML CSS Javascript PHP

C / C++ / C#

(16)

G - 1

LAMPIRAN G

(17)

G - 2

Maju Simon Manurung

Address: Komp. Margaasih Permai T6 No 17, Cimahi Phone: +6281322434966

Email : simonmanurung18@gmail.com

Personal Information

Place & D.O.B : Bandung, May25th 1990

Marital Status : Single

Religion : Christian Protestan

Languages Known : Sunda, Indonesian, English, Batak

Formal Education

1. Dev Apartement Taman Rasuna 2. Dev Petra Antinomi Law Office

Skills

(18)

G - 3

Integrated Development Environtment : Adobe DreamWeaver CS6 Dev C++

Text Editor : Sublime Text 2 Notepad

Programming Language : HTML CSS Javascript PHP Java C / C++ / C#

Framework : Codeigniter

Achievement

2013 Nasionalisme Balap Karung

(19)

ii

DAFTAR TABEL ... viii

DAFTAR GAMBAR ... ix

DAFTAR LAMPIRAN ... xii

BAB I PENDAHULUAN 1.1 Latar Belakang Masalah ... 1

1.2 Perumusan Masalah... 1

1.3 Maksud dan Tujuan ... 2

1.3.1 Maksud ... 2

1.3.2 Tujuan ... 2

1.4 Batasan Masalah ... 2

1.5 Metode Penelitian ... 3

1.5.1 Tahap Pengumpulan Data ... 3

1.5.2 Metode Pembangunan Perangkat Lunak (Waterfall) ... 4

1.6 Sistematika Penulisan ... 6

BAB II TINJAUAN PUSTAKA 2.1 Profil Perusahaan... 7

2.1.1 Gambaran Umum Perusahaan ... 7

2.1.2 Visi & Misi Perusahaan ... 7

2.1.3 Sejarah Perusahaan ... 8

2.1.4 Logo Perusahaan ... 8

2.1.5 Struktur Organisasi Perusahaan ... 9

2.1.6 Deskripsi Jabatan ... 9

2.2 Landasan Teori ... 10

2.2.1 Kebutuhan Non Fungsional ... 10

2.2.2 Flowmap ... 10

(20)

iii

2.2.3.1Entitas ... 10

2.2.3.2Asumsi ... 10

2.2.3.3ERD (Entity Relational Diagram) ... 11

2.2.3.4Kardinalitas ... 11

2.2.3.5Skema Relasi ... 11

2.2.4 Structure Analysis and Design ... 12

2.2.4.1Diagram Konteks ... 12

2.2.4.2Data Flow Diagram ... 12

2.2.4.3Spesifikasi Proses ... 12

2.2.4.4Kamus Data ... 12

2.2.5 Implementasi ... 13

2.2.5.1Database ... 13

BAB III PEMBAHASAN 3.1Kegiatan Kerja Praktek ... 16

3.1.1 Waktu dan Tempat ... 16

3.1.2 Job Desk ... 16

3.2Analisis Sistem Berjalan ... 16

3.2.1 Analisis Masalah ... 16

3.2.2 Analisis Sistem Berjalan (Skenario & Flowmap) ... 16

3.3Analisis Kebutuhan Non-Fungsional ... 18

3.3.1 Kebutuhan Perangkat Lunak ... 18

3.3.2 Kebutuhan Perangkat Keras ... 18

3.3.3 Kebutuhan Pengguna ... 19

3.3.4 Kebutuhan Jaringan ... 20

3.3.5 Kebutuhan Non Fungsional pada Website ... 21

(21)

iv

3.4Analisis Data ... 21

3.4.1 Entitas ... 22

3.4.2 Asumsi ... 22

3.4.3 ERD & Kardinalitas ... 23

3.4.4 Skema Relasi ... 24

3.5Analisis Kebutuhan Fungsional ... 24

3.5.1 Structure Analysis and Design ... 24

3.5.1.1 Diagram Konteks... 25

3.5.1.2 Data Flow Diagram level 1 ... 26

3.5.1.3 Data Flow Diagram level 2 Katalog Produk ... 27

3.5.1.4 Data Flow Diagram level 2 Kategori Produk ... 28

3.5.1.5 Data Flow Diagram level 2 Artikel ... 29

3.5.1.6 Data Flow Diagram level 2 Slideshow ... 30

3.5.1.7 Data Flow Diagram level 2 Contact ... 31

3.5.1.8 Data Flow Diagram level 2 Setting ... 31

3.5.1.9 Spesifikasi Proses (per DFD) ... 32

3.5.1.10Spesifikasi Proses DFD Katalog Produk ... 36

3.5.1.11Spesifikasi Proses DFD Kategori Produk ... 38

3.5.1.12Spesifikasi Proses DFD Artikel... 41

3.5.1.13Spesifikasi Proses DFD Slideshow ... 43

3.5.1.14Spesifikasi Proses DFD Contact ... 45

3.5.1.15Spesifikasi Proses DFD Setting... 46

3.5.1.10 Kamus Data (per DFD)... 47

3.6Perancangan Data (Struktur Tabel) ... 53

3.6.1 Struktur Tabel Pengguna ... 53

3.6.2 Struktur Tabel Produk ... 53

3.6.3 Struktur Tabel KetProduk ... 54

3.6.4 Struktur Tabel Artikel ... 54

3.6.5 Struktur Tabel Slideshow ... 55

3.6.6 Struktur Tabel Contact ... 55

3.7Perancangan Arsitektur Menu Web ... 56

(22)

v

3.8.1 Perancangan Tampilan Web ... 57 3.8.1.1Perancangan Tampilan Admin ... 57 3.8.1.1.1 Perancangan Login Admin ... 57 3.8.1.1.2 Perancangan Dashboard Admin ... 58 3.8.1.1.3 Perancangan Produk Admin ... 59 3.8.1.1.4 Perancangan Kategori Admin ... 60 3.8.1.1.5 Perancangan Artikel Admin ... 60 3.8.1.1.6 Perancangan Slideshow Admin ... 61 3.8.1.1.7 Perancangan Tampilan Contact Admin ... 61 3.8.1.1.8 Perancangan Produk Tambah Data

Admin ... 62

3.8.1.1.9 Perancangan Produk Edit Data Admin ... 62 3.8.1.1.10 Perancangan Kategori Tambah Data

Admin ... 63

3.8.1.1.11 Perancangan Kategori Edit Tambah

Admin ... 63

3.8.1.1.12 Perancangan Artikel Tambah Data

Admin ... 64

3.8.1.1.13 Perancangan Artikel Edit Data Admin ... 64 3.8.1.1.14 Perancangan Slideshow Tambah Data ... 65 3.8.1.1.15 Perancangan Slideshow Edit Data

Admin ... 65

3.8.1.1.16 Perancangan Contact Tambah Data

Admin ... 66

3.8.1.1.17 Perancangan Contact Edit Data Admin.... 66 3.8.1.2Perancangan Tampilan User ... 67 3.8.1.2.1 Perancangan Home User... 67 3.8.1.2.2 Perancangan About User... 68 3.8.1.2.3 Perancangan Arcons Truss User ... 69 3.8.1.2.4 Perancangan Product Arcons Roof

(23)

vi

3.8.1.2.5 Perancangan Product Arcons Accessories User... 71

(24)

vii

3.10.4.10 Halaman Setting Password Admin ... 98 3.10.4.11 Halaman Home User ... 99 3.10.4.12 Halaman About User ... 99 3.10.4.13 Halaman Product Arcons Truss User ...100 3.10.4.14 Halaman Product Arcons Roof User...100 3.10.4.15 Halaman Product Arcons Accessories User ...101 3.10.4.16 Halaman Blog User ...101 3.10.4.17 Halaman Contact Us User ...102 3.11 Pengujian ...102 3.11.1 Pengujian Blackbox ...103 3.11.1.1 Skenario Pengujian ...103 3.11.1.2 Kasus dan Hasil Pengujian ...104 3.11.2 Kesimpulan Hasil Pengujian ...105 BAB IV KESIMPULAN DAN SARAN

4.1Kesimpulan ...106 4.2Saran ...106 DAFTAR PUSTAKA

(25)

i

KATA PENGANTAR

Assalamualaikum Wr. Wb.

Alhamdulillah, puji dan syukur penulis panjatkan kehadirat Allah SWT yang telah memberikan rahmat dan karunianya serta atas izin-NYA lah penulis dapat menyelesaikan laporan kerja praktek hasil kerja praktek penulis laksanakan selama kurang lebih satu bulan di CV. Arcons Indonesia.

Dalam melaksanakan kerja praktek, banyak sekali manfaat yang diperoleh oleh kami selama di perusahaan. Disamping mendapatkan ilmu dan wawasan tentang teknologi informasi, penulis dapat membantu perusahaan dengan menerapkan dan mempraktekan berbagai macam ilmu dan teori yang telah kami dapatkan selama kuliah. Jadi dengan adanya mata kuliah kerja praktek yang diberikan kepada mahasiswa, hal ini sangat penting dalam mendapatkan pengalaman untuk mampu menyesuaikan diri di dunia kerja nantinya.

Kami berusaha membuat sebaik mungkin laporan kerja praktek ini, namun kami menyadari bahwa dalam penulisan laporan kerja praktek masih banyak kesalahan dan kekurangan-kekurangan baik penyusunan kata maupun kalimat yang kurang sempurna, memyebabkan laporan ini jauh dari sempurna.

Akhirnya, semoga laporan kerja praktek ini dapat membawa manfaat yang besar bagi penulis khususnya maupun kepada pembaca dan sudi kiranya memberikan kritik, saran serta masukan atas ketidak sempurnaannya penyusunan laporan kerja praktek ini.

Bandung, 14 Januari 2014

(26)

i

DAFTAR PUSTAKA

[1] Agusdar.wordpress.2013.”metode-pengembangan-sistem-waterfall”.

[2] Mukharil, Adam. Rekayasa Perangkat Lunak 1 Analisis Kebutuhan Perangkat Lunak (2).Bandung : Universitas Komputer Indonesia.

[3] http://en.wikipedia.org/wiki/Flow_map. Diakses 22-November-2013.

[4] Supriyanto Wahyu, Muhsin Ahmad. 2008. “Teknologi Informasi Perpustakaan”. Yogyakarta. Kanisius.

[5] Kusrini. 2007. “Strategi Perancangan dan Pengelolaan Basis Data”. Yogyakarta. Andi.

[6] Cohen, William A. 2008. “A class with Drucker: Pelajaran Berharga dari Guru Manajemen No. 1 di Dunia”.Jakarta. Gramedia Pustaka Utama.

[7] Fatta, Hanif. 2009. “Rekayasa Sistem Pengenalan Wajah”.Yogyakarta. Andi. [8] Wiki. 2013. Struktured analysis and Design “Structured Analysis and Design

Technique”. (diakses 22 November 2013

[9] Marimin, Tanjung Hendri, Prabowo Haryo. 2006. “Sistem Informasi Manajemen: Sumber Daya Manusia”. Bogor. Grasindo.

[10]Junindar. Panduan Lengkap Menjadi Programmer (plus CD). Jakarta: Penerbit MediaKita, 2008.

[11]Sakur, Stendy B. Aplikasi WEB Database dengan Dreamweaver MX 2004. Yogyakarta : Penerbit Andi, 2005.

[12]Anhar, ST. Panduan Menguasai PHP & MySQL Secara Otodidak. Jakarta : Penerbit Mediakita, 2010.

[13]Kuswayatno, Lia. Mahir dan Terampil Berkomputer. Jakarta : Penerbit Grafindo Media Pratama, 2006.

(27)

ii

[15]Zaki, Ali. AJAX untuk Pemula. Jakarta : Penerbit PT Elex Media Komputindo, 2008.

[16]Sigit, Aloysius W. Website Super Canggih dengan Plugin Jquery Terbaik. Jakarta : Penerbit Mediakita, 2011.

[17]Soeherman, Bonnie dan Pinontoan, Marion. Designing Information System. Jakarta : Penerbit PT Elex Media Komputindo, 2008.

[18]Al fatta, Hanif. Analisis dan Perancangan Sistem Informasi untuk Keunggulan Bersaing Perusahaan dan Organisasi Modern. Yogyakarta :

(28)

1

BAB I

PENDAHULUAN

1.1 Latar Belakang Masalah

CV. Arcons Indonesia adalah perusahaan yang bergerak pada bidang penjualan dan pembuatan genteng metal dijalan Kemang Sari IV No.88 Jatibening Baru, Bekasi. Kegiatan penjualan genteng metal, truss, dan aksesoris genteng metal.

Kegiatan penyampaian informasi dalam pengenalan produk yang dilakukan diperusahaan ini masih menggunankan proses manual yaitu dalam bentuk katalog. Hal ini menyebabkan sulitnya klien dalam mendapatkan informasi karena jika jarak klien berada jauh dari perusahaan seperti di luar pulau atau bahkan di luar negeri hal ini bisa menyulitkan karena harus datang langsung ke perusahaan. Untuk mengatasi permasalahan tersebut maka perlu diadakan pembuatan website company profile CV. Arcons Indonesia agar penyampaian informasi ke khalayak luar lebih efisien dan akurat.

Dari uraian di atas, maka disini mencoba untuk mengusulkan adanya suatu pembuatan website company profile yang mampu memaksimalkan dan meminimalisir kesalahan yang mungkin timbul pada saat penyampaian informasi, maka dari hal itu diwujudkan dalam bentuk laporan dengan judul “Website Company Profile CV. Arcons Indonesia”. Karena itu dengan adanya website yang kami buat ini, kami dan perusahaan berharap besar dapat mempermudah pengguna untuk mendapatkan informasi yang lebih efisien dari perusahaan CV. Arcons Indonesia.

1.2 Perumusan Masalah

(29)

2

1.3 Maksud dan Tujuan 1.3.1 Maksud

Maksud kami dalam pembuatan aplikasi website ini adalah sebagai berikut:

1. Membuat aplikasi website produk dari perusahaan CV. Arcons Indonesia, yang dapat diakses oleh banyak pengguna.

2. Perusahaan dapat lebih mudah memberikan informasi sekaligus mempromosikan dan mengenalkan produk perusahaaan kepada banyak klien atau pelanggan.

1.3.2 Tujuan

Adapun tujuan dibuatnya aplikasi website perusahaan tempat dimana kami melakukan penelitian kerja peraktek ini adalah sebagai berikut:

1. Pelanggan yang letak posisinya jauh dari tempat perusahaan tersebut dapat lebih mudah mendapatkan informasi yang lebih efisien dengan adanya aplikasi website yan kami buat.

2. Meningkatkan kualias dan kuantitas perusahaan CV. Arcons Indonesia sesuai dengan persaingan teknologi dalam dunia teknologi.

3. Memudahkan pegawai perusahaan untuk melayani klien atau pelanggan dari jarak jauh.

1.4 Batasan Masalah

Pengamatan difokuskan pada “Website Company Profile CV. Arcons Indonesia”, yang akan dibuat perangkat lunak melalui tahapan analisis dan perancangan pada perangkat lunak tersebut. Adapun batasan yang diamati yaitu :

1. Data yang akan diolah adalah katalog produk yang terdapat pada CV Arcons Indonesia.

(30)

3 3. Website company profile ini dibangun menggunakan sistem operasi Windows 7, dimana mancakup aplikasi Sublime Text 2, Adobe Photoshop

CS3 dan phpMyAdmin (Web Server Apache, My Sql, dan Cascading Style

Sheet).

4. Tahap Pengembangan website company profile menggunakan model sekuensial. Model sekuensial adalah suatu metode yang melakukan pendekatan perkembangan perangkat lunak melalui kemajuan sistem pada seluruh analisis, desain, kode, dan pengujian.

5. Pemodelan data terstruktur.

6. Admin dapat melakukan proses update seperti tambah, hapus, lihat dan ubah.

7. Informasi yang di hasilkan adalah mengenai informasi perusahaan dan produk yang dijual.

1.5 Metode Penelitian

1.5.1 Tahapan Pengumpulan Data

Untuk metodologi yang kami implementasikan dalam laporan tugas kami adalah sebagai berikut:

a. Interview.

Teknik pengumpulan data dengan mengadakan tanya jawab secara langsung kepada narasumber pemilik perusahaan yang ada kaitannya dengan topik yang diambil.

b. Studi Literatur.

Pengumpulan data dengan cara mengumpulkan literatur, jurnal, paper dan bacaan-bacaan yang ada kaitannya dengan judul penelitian seperti informasi dari internet, buku, dan perusahaan itu sendiri. c. Observasi.

(31)

4

1.5.2 Tahap Pembangunan Perangkat Lunak.

Model untuk membangun tahapan aplikasi website yang kami buat adalah model sekuensial.

Gambar 1. Model sekuensial.

Tahapan-tahapan dari model sekuensial ini adalah sebagai berikut: a. Analisis Permasalahan

Pada tahap ini, akan dilakukan analisis data apa saja yang akan dimasukan kedalam database.

b. Desain

Pada tahap desain akan dilakukan perancangan antarmuka program. c. Pembuatan Coding

Tahap menterjemahkan perancangan kedalam bentuk bahasa yang dapat dimengerti oleh komputer.

d. Pengujian

Proses untuk memastikan bahwa semua pernyataan sudah diuji yang selanjutnya akan mengarahkan penguji untuk menemukan kesalahan-kesalahan yang mungkin terjadi dan juga memastikan bahwa hasil yang diharapkan telah tercapai.

(32)

5 Metode waterfall merupakan metode yang sering digunakan oleh penganalisa sistem pada umumnya. Inti dari metode waterfall adalah pengerjaan dari suatu sistem dilakukan secara berurutan atau secara linear. Jadi jika langkah ke-1 belum dikerjakan, maka langkah 2 tidak dapat dikerjakan. Jika langkah ke-2 belum dikerjakan maka langkah ke-3 juga tidak dapat dikerjakan, begitu seterusnya. Secara otomatis langkah ke-3 akan bisa dilakukan jika langkah ke-1 dan ke-2 sudah dilakukan.[1]

 Kelebihan Waterfall

Metode pengembangan waterfall mempunyai keunggulan dalam membangun dan mengembangkan suatu sistem, antara lain:

1. Kualitas dari sistem yang dihasilkan akan baik. Ini dikarenakan oleh pelaksanaannya secara bertahap. Sehingga tidak terfokus pada tahapan tertentu.

2. Dokumen pengembangan sistem sangat terorganisir, karena setiap fase harus terselesaikan dengan lengkap sebelum melangkah ke fase berikutnya. Jadi setiap fase atau tahapan akan mempunyai dokumen tertentu.

 Kelemahan Waterfall

Dalam proses membangun dan mengembangkan suatu sistem, metode waterfall mempunyai beberapa kelemahan, antara lain:

1. Diperlukan majemen yang baik, karena proses pengembangan tidak dapat dilakukan secara berulang sebelum terjadinya suatu produk.. 2. Kesalahan kecil akan menjadi masalah besar jika tidak diketahui sejak

awal pengembangan.

(33)

6

1.6 Sistematika Penulisan

Adapun sistematika penulisan laporan kerja praktek ini adalah sebagai berikut:

BAB I : PENDAHULUAN

Berisi latar belakang masalah yang ada, perumusan masalah berdasarkan tujuan, batasan masalah yang akan dibahas, maksud dan tujuan dari pembuatan aplikasi, metodologi penelitian, serta sistematika penulisan.

BAB II : TINJAUAN PUSTAKA

Berisi pembahasan mengenai profil instansi perusahaan, yang meliputi sejarah, struktur organisasi, visi dan misi perusahaan, aktivitas perusahaan dan hal-hal lain yang menjelaskan tentang perusahaan..

BAB III : PEMBAHASAN

Berisi tentang kegiatan jadwal kerja praktek, analisis sistem yang berjalan, analisis kebutuhan non-fungsional, hingga implementasi serta pengujian black box, sesuai dengan aplikasi website perusahan tempat kami kerja praktek.

BAB IV : KESIMPULAN DAN SARAN

(34)

7

BAB II

TINJAUAN PUSTAKA

2.1 Profil Perusahaan

2.1.1 Gambaran Umum Perusahaan

CV. Arcons Indonesia merupakan sebuah perusahaan yang bergerak dalam bidang penjualan dan pembuatan genteng metal, truss, dan aksesoris genteng metal. Berlokasi di Jalan Kemang Sari IV No. 88 Jatibening Baru, Bekasi, CV. Arcons Indonesia didirikan pada tahun 2011 yang didirikan oleh Bapak Viktor Arman. Yang merupakan sarjana lulusan teknik sipil Universitas Persada Indonesia YAI Jakarta.

Pada awalnya CV. Arcons Indonesia hanya sebagai menjual truss ( rangka atap baja ringan) saja. Namun dengan meningkatnya perkembangan dan kebutuhan dalam bidang property, dengan melihat kesuksesan peluang usaha pada beberapa perusahaan yang memproduksi genteng metal, CV. Arcons Indonesia mulai memberanikan diri dalam mengembangkan usahanya. Yaitu dalam menjual dan meproduksi genteng metal serta aksesoris properti.

Mendapat sambutan yang cukup baik dari beberapa konsumen, CV. Arcons Indonesia pun semakin yakin untuk terus mengembangkan usaha ini. Saat ini CV. Arcons Indonesia telah banyak memiliki konsumen baik dari dalam kota maupun luar kota.

2.1.2 Visi & Misi Perusahaan

 VISI

Menjadi Perusahaan yang Terjamin, Terpercaya dan Bermutu.

 MISI

(35)

8

2.1.3 Sejarah Perusahaan

CV. Arcons Indonesia merupakan sebuah perusahaan yang bergerak dalam bidang penjualan dan pembuatan genteng metal, truss, dan aksesoris genteng metal. Berlokasi di Jalan Kemang Sari IV No. 88 Jatibening Baru, Bekasi, CV. Arcons Indonesia didirikan pada tahun 2011 yang didirikan oleh Bapak Viktor Arman. Yang merupakan sarjana lulusan teknik sipil Universitas Persada Indonesia YAI Jakarta.

Pada awalnya CV. Arcons Indonesia hanya sebagai menjual truss ( rangka atap baja ringan) saja. Namun dengan meningkatnya perkembangan dan kebutuhan dalam bidang property, dengan melihat kesuksesan peluang usaha pada beberapa perusahaan yang memproduksi genteng metal, CV. Arcons Indonesia mulai memberanikan diri dalam mengembangkan usahanya. Yaitu dalam menjual dan meproduksi genteng metal serta aksesoris properti.

Mendapat sambutan yang cukup baik dari beberapa konsumen, CV. Arcons Indonesia pun semakin yakin untuk terus mengembangkan usaha ini. Saat ini CV. Arcons Indonesia telah banyak memiliki konsumen baik dari dalam kota maupun luar kota.

2.1.4 Logo Perusahaan

(36)

9

2.1.5 Struktur Organisasi Perusahaan

Gambar 3. StrukturOrganisasi CV. Arcons Indonesia.

2.1.6 Deskripsi Jabatan

Berikut keterangan dari struktur organisasi tim pengembang CV. Arcons Indonesia pada pada Gambar 1:

1. Pemilik merupakan perintis dari CV.Arcons Indonesia itu sendiri.

2. Tugas dari admin adalah menyiapkan dan menyediakan segala keperluan administratif marketing/sales sesuai dengan SOP (Standart Operational Procedure) yang berlaku di sebuah perusahaan. Contoh simple nya di perusahaan saya. Hal petama yang dilakukan oleh admin marketing di perusahaan penjual barang adalah menerima orderan dari customer dengan menyesuaikan ketersediaan stock barang di gudang.

3. Bagian produksi bertugas menangani produksi barang barang yang akan di buat.

(37)

10

2.2 Landasan Teori

2.2.1 Kebutuhan Non Fungsional

Batasan-batasan dari layanan-layanan dan fungsi-fungsi dari sebuah sistem, seperti: batasan waktu, batasan dari pengembangan proses, dan batasan pengguna. Analisis kebutuhan non fungsional pada system ini meliputi analisis perangkat lunak, analisis perangkat keras, analisis jaringan, perangkat pikir dan analisis pengkodean.[2]

2.2.2 Flowmap

Flowmap adalah campuran peta dan flowchart, yang menunjukkan pergerakan benda dari satu lokasi kelokasi lain, seperti jumlah orang dalam migrasi, jumlah barang yang diperdagangkan, atau jumlah paket dalam jaringan. Flowmap menolong analis dan programmer untuk memecahkan masalah ke dalam segmen-segmen yang lebih kecil dan menolong dalam menganalisis alternative-alternatif lain dalam pengoperasian. [3]

2.2.3 Data

Data merupakan bahan baku informasi, dapat didefinisikan sebagai kelompok teratur simbol-simbol yang mewakilikuantitas, fakta, tindakan, benda dan sebagainya. Data terbentuk dari karakter, dapat berupa alphabet, angka, maupun symbol khusus seperti *,$ dan /. Data disusun mulai dari bits, bytes, fields, records, file dan database [4].

2.2.3.1Entitas

Entitas adalah objek di dunia yang bersifat unik walaupun tidak harus dalam bentuk fisik. Setiap entitas mempunyai atribut yang membedakannya dengan entitas lainnya. Contoh: entitas Mahasiswa, Dosen, Mobil, dan lain sebagainya[5].

2.2.3.2Asumsi

(38)

11 eksternal mengenai suatu objek. Asumsi-asums iini menjadi penting karena kita menggunakan asumsi kita ini sebagai panduan bagi tindakan dan pengambilan keputusan yang kita lakuan[6].

2.2.3.3ERD (Entity Relational Diagram)

ERD (Entity Relationship Diagram) adalah suatu model jaringan yang menggunakan susunan data yang disimpan dalam system secara abstrak. ERD merupakan model jaringan data yang menekankan pada struktur dan hubungan antardata[7].

Terdapat beberapa notasi symbol pada ERD yaitu: 1. Persegi Panjang, menyatakan himputan entitas.

2. Oval, menyatakan atribut (atribut key digaris bawahi). 3. Belah ketupat, menyatakan himpunan relasi.

4. Garis, menyatakan penghubung antara himpunan relasi dengan himpunan entitas dan himpunan entitas dengan atributnya.

2.2.3.4Kardinalitas

Kardinalitas atau derajat relasi menunjukkan jumlah maksimum entitas yang dapat berelasi dengan entitas pada himpunan entitas yang lain. Macam-macam kardinalitas adalah:

1. Satu ke satu (one to one),Setiap anggota entitas A hanya boleh berhubungan dengan satu anggota entitas B, begitu pula sebaliknya.

2. Satu kebanyak (one to many), setiap anggota entitas A dapat berhubungan dengan lebih dari satu anggota entitas B tetapi tidak sebaliknya.

3. Banyak kebanyak (many to many), setiap entitas A dapat berhubungan dengan banyak entitas himpunan entitas B dan demikian pula sebaliknya[5].

2.2.3.5Skema Relasi

(39)

12

2.2.4 Structure Analysis and Design

Struktur analisis dan design adalah sebuah metodologi yang di gunakan pada rekayasa perangkat lunak untuk mendeskripsikan system menjadi sebuah fungsi hirarki[8].

2.2.4.1Diagram Konteks

Diagram Konteks adalah diagram yang menggambarkan sebuah system secara menyeluruh. Yang selanjutnya akan lebih didetailkan oleh DFD. Konteks diagram juga biasa disebut sebagai DFD level 0. Contoh gambar diagram konteks.

2.2.4.2Data Flow Diagram

Data Flow Diagram atau biasa di singkat DFD merupakan serangkai diagram yang menggambarkan kegiatan-kegiatan yang ada dalam suatu sistem. Teknik pembuatan DFD dimulai dengan menggambarkan system secara global dan dilanjutkan dengan analisis masing-masing bagian. Pada awalnya digambarkan konteks diagram yang menggambarkan sebuah system secara menyeluruh yang akan diinvestigasi. Konteks diagram tersebut dapat dikatakan sebagai DFD level 0. Analisis sistem yang lebih detail selanjutnya dapat dilakukan dengan menggambarkan DFD level 1,2 dan seterusnya.

2.2.4.3Spesifikasi Proses

Spesifikasi Proses merupakan tabel yang berisi keterangan deskripsi dari semua proses yang terdapat di DFD. Logika proses harus dituliskan secara jelas baik menggunakan bahasa deskriptif atau pseudo code (tidak boleh campuran).

2.2.4.4Kamus Data

(40)

13 menggunakan data dictionary, analis system dapat mendefinisikan data yang mengalir dalam system dengan lengkap. Tahapan analisis dapat digunakan sebagai alat komunikasi antara anlisis system dengan pemakai system tentang data yang mengalir di sistem, yaitu tentang data yang masuk ke system dan tentang informasi yang dibutuhkan oleh pemakai sistem[9]. Contoh Kamus Data:

2.2.5 Implementasi

Berikut adalah landasan teori dari tahap-tahap yang ada pada bagian implementasi.

2.2.5.1Database

Database adalah kumpulan data yang saling berelasi[10]. Data sendiri

merupakan fakta mengenai objek, orang, dan lain-lain. Data dinyatakan dengan nilai (angka, deretan karakter, atau symbol). Basis data dapat didefinisikan dalam berbagai sudut pandang seperti berikut :

1. Himpunan kelompok data yang saling berhubungan yang diorganisasi sedemikian rupa sehingga kelak dapat dimanfaatkan dengan cepat dan mudah.

2. Kumpulan data yang saling berhubungan yang disimpan secara bersama sedemikian rupa tanpa pengulangan (redudancy) yang tidak perlu, untuk memenuhi kebutuhan.

Kumpulan file/table/arsip/ yang saling berhubungan yang disimpan dalam media penyimpan elektronik.

2.2.5.2Mysql

(41)

14

2.2.5.3PHP

PHP (Hypertext Preprocessor) yaitu bahasa pemrograman web-server side yang bersifat open source. PHP merupakan script yang terintegrasi dengan HTML dan berada pada server (server side HTML embedded scripting). PHP adalah script yang digunakan untuk membuat halaman website yang dinamis. Dinamis berarti halaman yang akan ditampilkan dibuat saat halaman itu diminta oleh client. Mekanisme ini menyebabkan informasi yang diterima client selalu yang terbaru. Semua script PHP dieksekusi pada server dimana script tersebut dijalankan[12].

2.2.5.4HTML & CSS

HTML (Hyper Text Markup Language) merupakan metode yang

menautkan (link) satu dokumen ke dokumen lain melalui suatu teks. HTML merupakan kumpulan kode-kode yang ditampilkan dalam format tag untuk ditampilkan dalam halaman Web[13].

CSS (Cascading Style Sheet) adalah sebuah dokumen yang berdiri

sendiri dan dapat dimasukkan dalam kode HTML atau sekedar menjadi rujukan oleh HTML dalam pendefinisian style. CSS menggunakan kode-kode yang tersusun untuk menetapkan style pada elemen HTML atau dapat juga digunakan untuk membuat style baru yang biasa disebut class[14].

2.2.5.5Ajax & Jquery

Ajax adalah singkatan dari Asynchronous Javascript and XML. AJAX

merupakan teknik baru didunia pengembangan web yang berguna untuk membuat aplikasi web, yang lebih “kaya” dibandingkan dengan aplikasi web biasa. AJAX memungkinkan sebuah halaman web memperbarui data dari server yang ditampilkan tanpa harus melakukan refresh, sehingga halaman terlihat lebih responsif[15].

Jquery adalah library atau kumpulan kode Javascript siap pakai.

(42)

15 yaitu menyederhanakan kode javascript dengan cara memanggil fungsi-fungsi yang disediakan oleh jquery. Javascript sendiri merupakan bahasa scripting yang bekerja disisi client/browser sehingga website bisa lebih interaktif[16].

2.2.6 Flowchart

Flowchart atau bagan alur merupakan metode untuk menggambarkan tahap-tahap penyelesaian masalah (prosedur) beserta aliran data dengan simbol-simbol standar yang mudah dipahami. Tujuan utama penggunaan flowchart adalah untuk menyederhanakan rangkaian proses atau prosedur untuk memudahkan pemahaman pengguna terhadap informasi tersebut. Untuk itu desain sebuah flowchart harus ringkas, jelas, dan logis[17].

2.2.7 Blackbox

Blackbox Testing adalah pengujian perangkat lunak yang terfokus

(43)

16

BAB III

PEMBAHASAN

3.1 Kegiatan kerja praktek 3.1.1 Waktu dan Tempat

Kerja Praktek dilaksanakan di kantor CV. Arcons Indonesia berlokasi di Jalan Kemang Sari 4 No.88 Jati Bening Baru, Bekasi Barat.

3.1.2 Job Desk

Membuat atau membangun aplikasi website produk CV.Arcons Indonesia.

3.2 Analisis Sistem Berjalan

Berikut adalah analisis Sistem Berjalan di CV. ARCONS INDONESIA: 3.2.1 Analisis Sistem Berjalan (Skenario & Flowmap)

1. Pemesan datang ke workshop CV. Arcons Indonesia.

2. Admin perusahaan memberikan katalog produk kepada pengunjung. 3. Pengunjung melihat produk yang ingin di beli, dan menanyakan

ketersediaan barang kepada admin.

4. Admin langsung memeriksa ketersediaan produk yang di inginkan oleh pengunjung.

5. Jika barang tersedia maka admin akang langsung membuatkan nota pembelian untuk pengunjung.

(44)

(45)

18

3.3Analisis Kebutuhan Non-Fungsional 3.3.1 Kebutuhan Perangkat Lunak

Pada bagian analisis kebutuhan perangkat lunak ini akan diuraikan kebutuhan-kebutuhan non fungsional yang berhubungan dengan spesifikasi perangkat lunak yang berhubungan dengan proses pembuatan perangkat lunak.

 Kebutuhan Non fungsional :

1. Aplikasi yang dibangun berbasis web.

2. Aplikasi yang dibangun dapat di jalankan pada browser Mozilla Firefox dan Google Chrome.

 Kebutuhan Perangkat Lunak : 1. Sistem operasi Windows 7.

2. Browser Mozilla Firefox, Google Chrome, dan Opera. 3. Aplikasi Sublime Text 2.

4. XAMPP versi 1.8.2. 3.3.2 Kebutuhan Perangkat Keras

Pada bagian analisis kebutuhan perangkat keras ini akan diuraikan kebutuhan-kebutuhan non fungsional yang berhubungan dengan spesifikasi perangkat keras yang berhubungan dengan proses pembangunan perangkat lunak.

 Kebutuhan Non fungsional :

1. Sistem dibangun dengan spesifikasi hardware yang memenuhi standar minimum kebutuhan.

2. Sistem yang dibangun menggunakan media jaringan berupa modem atau perangkat sejenis untuk dapat mengakses internet.  Kebutuhan Perangkat Keras pada Website

Kebutuhan perangkat keras (Hardware) yang diperlukan adalah satu unit komputer yang minimal memiliki spesifikasi sebagai berikut :

(46)

19 5. Monitor : 14‟‟

6. Mouse dan Keyboard 7. Printer

8. Modem

9. USB2 port minimal 3

3.3.3 Kebutuhan Pengguna

Pada bagian analisis kebutuhan perangkat pengguna ini akan diuraikan kebutuhan-kebutuhan non fungsional yang berhubungan dengan spesifikasi pengguna yang berhubungan dengan proses pembangunan perangkat lunak.

 Kebutuhan Non Fungsional pada Website

1. Dibutuhkan seorang admin yang memiliki kemampuan troubleshooting hardware, software dan jaringan untuk mengelola

server sistem.

(47)

20  Kebutuhan Perangkat Pengguna :

Tabel 1. Kebutuhan Perangkat Pengguna

3.3.4 Kebutuhan Jaringan

Pada bagian analisis jaringan ini akan diidentifikasi spesifikasi jaringan yang ada maupun yang dibutuhkan dalam pembangunan perangkat lunak.

Pengguna Sistem

Hak Akses Tingkat

Keterampilan yang

Admin Dapat mengelola dan memanipulasi data.

Memahami troubleshooting

komputer dan

jaringan, mahir dalam menggunakan

komputer dan

internet.

Minimal pernah mengoperasikan komputer, bisa menggunakan

Jika diperlukan, akan diberikan pelatihan singkat kepada admin

agar mampu

mengoperasikan komputer, web browser, beserta troubleshooting komputer dengan baik. Serta akan diberikan

pelatihan dalam menggunakan aplikasi yang akan digunakan khususnya

Company Profile

CV. Arcons

Indonesia

berbasis website.

User Mengakses front end aplikasi menggunakan web browser (Mozilla

atau Google

Chrome)

Tidak diharuskan memiliki

keterampilan khusus.

Minimal pernah

dan mampu

(48)

21

3.3.5 Kebutuhan Non fungsional pada website:

1. Sistem dijalankan menggunakan akses internet unlimited (tidak terbatas kuotanya).

2. Sistem dihosting dengan prediksi space sebesar 50MB dan bandwidth sebesar 1GB.

3.3.6 Kebutuhan Jaringan pada website:

1. Modem USB dengan koneksi internet yang unlimited menggunakan wifi.

2. Sistem dihosting dengan prediksi space sebesar 50MB dan bandwidth sebesar 1GB.

3.4Analisis Data

Setiap aplikasi membutuhkan data untuk menghasilkan informasi yang dibutuhkan. Data yang ada saling berhubungan atau berelasi antara satu dengan yang lain untuk menyajikan informasi yang benar. Apabila data yang ada tidak berelasi, maka tidak akan terbentuk suatu pengolahan data menjadi informasi. Dalam memodelkan data dan menggambarkan hubungan antara data yang ada pada sistem yang sedang berjalan, digunakan alat bantu yaitu Entity Relationship Diagram (ERD). ERD digunakan untuk merancang tabel yang akan dibuat beserta relasi antar tabel basis data. ERD juga merupakan model konseptual yang mendeskripsikan hubungan antara penyimpanan.ERD digunakan untuk memodelkan struktur hubungan antar data.

(49)

22

3.4.1 Entitas

Berikut adalah entitas-entitas serta atribut-atribut yang kami analisa dan tentukan, sesuai dengan yang ada dalam data acuan.

ENTITAS ATTRIBUT

Pengguna Idpengguna*,nama,un,pw

Produk Idproduk*,nama,namagambar,ketproduk

KatProduk Idkatproduk*,namakat

Artikel Idartikel*,judul,isi,tag,tgl Slideshow Idslide*,namaslide,ketslide Contact Idcontact,alamat,tlp,hp,fax,email

Tabel 2. Tabel ERD (Entity Relationship Diagram)

3.4.2 Asumsi

Pada studi kasus pembuatan aplikasi company profile di CV. Arcons Indonesia berbasis web ini berlaku asumsi-asumsi berikut :

1. Produk yang terdapat pada aplikasi company profile ini merupakan produk yang di produksi atau dijual oleh CV. Arcons Indonesia

2. Contact merupakan alamat atau data dari CV. Arcons Indonesia

3. Kategori produk merupakan kategori-kategori produk yang dijual oleh CV. Arcons Indonesia.

4. Satu kategori dapat memiliki satu atau banyak produk, yang nantinya akan menghasilkan katalog produk.

5. Pembuatan entitas contact diasumsikan untuk menangani perubahan dan penambahan data contact CV. Arcons Indonesia.

(50)

23

3.4.3 ERD & Kardinalitas

Berikut adalah ERD dan kardinalitas dari kasus pembuatan aplikasi company profile di CV. Arcons Indonesia berbasis website.

(51)

24

3.4.4 Skema Relasi

Berikut adalah skema relasi dari kasus pembangunan aplikasi company profile di CV. Arcons Indonesia berbasis website.

Gambar 6. Skema Relasi aplikasi website.

3.5Analisis Kebutuhan Fungsional

Pada implementasi kebutuhan fungsional aplikasi kami ini, kami menggunakan dua buah pendekatan analisis kebutuhan. Yakni pendekatan analisis terstruktur (Structure Analysis and Design) untuk menganalisis kebutuhan dari sisi backend (website administrator) dan pendekatan analisis berorientasi objek (Object Oriented Analysis and Design) untuk menganalisis kebutuhan dari sisi frontend client di mobile android. Berikut akan dipaparkan mengenai kebutuhan fungsional dari aplikasi ini.

3.5.1 Structure Analysis and Design

(52)

25 data dimodelkan dengan cara menggambarkan bagaimana proses-proses tersebut mengubah data sebagai aliran objek melalui sistem.

Untuk implementasi SAD pada sistem kami, kami gunakan untuk menganalisis kebutuhan dari sisi backend dimana pada backend ini disajikan dalam bentuk website admin yang mengelola data portofolio. Berikut akan dipaparkan Structure Analysis dan Design dari aplikasi kami.

3.5.1.1Diagram Konteks

Dibawah ini akan digambarkan diagram konteks yang mana Diagram Konteks adalah diagram yang menggambarkan secara umum yang menjadi masukan, proses dan keluaran yang terjadi pada sebuah sistem. Diagram Konteks untuk dari aplikasi website yang telah dibuat.:

(53)

26

3.5.1.2Data Flow Diagram level 1

Berikut ini adalah DFD level 1 dari aplikasi website yang telah dibuat.

(54)

27

3.5.1.3Data Flow Diagram level 2 – Pengolahan Data Katalog Produk

Berikut ini adalah DFD level 2 - Pengolahan Data Katalog Produk dari aplikasi website yang telah dibuat.

(55)

28

3.5.1.4Data Flow Diagram level 2 – Pengolahan Data Kategori Produk

Berikut ini adalah DFD level 2 - Pengolahan Data Kategori Produk dari aplikasi website yang telah dibuat.

(56)

29

3.5.1.5Data Flow Diagram level 2 – Pengolahan Data Artikel

Berikut ini adalah DFD level 2 - Pengolahan Data Artikel dari aplikasi website yang telah dibuat.

(57)

30

3.5.1.6Data Flow Diagram level 2 – Pengolahan Data Slideshow

Berikut ini adalah DFD level 2 - Pengolahan Data Slideshow dari aplikasi website yang telah dibuat.

(58)

31

3.5.1.7Data Flow Diagram level 2 – Pengolahan Data Contact

Berikut adalah DFD level 2 - Pengolahan Data Contact dari aplikasi website yang telah dibuat.

Gambar 13. DFD level 2 – Pengolahan Data Contact

3.5.1.8Data Flow Diagram level 2 –Setting

Berikut adalah DFD level 2 - Pengolahan Data Setting dari aplikasi website yang telah dibuat.

(59)

32

3.5.1.9Spesifikasi Proses (perDFD)

Deskripsi proses digunakan untuk menggambarkan proses model aliran yang terdapat pada DFD. Spesifikasi proses dari gambaran DFD level 1 diatas akan dijelaskan pada tabel dibawah ini :

No Proses Keterangan

1 No Proses 1

Nama Proses Login

Source (sumber) Admin

Input Data User

Output Info User

Destination Admin

Logika Proses 1. Admin memasukkan username dan password 2. Sistem melakukan validasi terhadap inputan

ke database yang ada

3. Jika username & password yang dimasukkan valid, maka sistem akan langsung masuk ke halaman pengolahan data portofolio.

4. Jika username & password yang dimasukkan tidak valid, maka sistem akan memberikan warning yang sesuai dan kemudian mengisi ulang username & password

2 No Proses 2

Nama Proses Pengolahan Data Katalog Produk Source (sumber) Admin, Pengunjung

Input Data Katalog Produk Output Info Katalog Produk Destination Admin, Pengunjung

(60)

33 produk.

2. Pengunjung memilih menu katalog untuk melihat data katalog produk.

3. Sistem akan menampilkan Halaman Pengolahan data portofolio dimana admin selanjutnya dapat memilih menu tambah data portofolio, ubah data portofolio, dan hapus data portofolio.

3 No Proses 3

Nama Proses Pengolahan Data Katagori Produk Source (sumber) Admin, Pengunjung

Input Data Kategori Produk Output Info Kategori Produk Destination Admin, Pengunjung

Logika Proses 1. Admin memilih menu Kategori Produk untuk melakukan Pengolahan Data Kategori

Produk.

2. Pengunjung memilih menu Kategori Produk untuk melihat data Kategori Produk.

3. Sistem akan menampilkan Halaman Pengolahan data services dimana admin selanjutnya dapat memilih menu tambah data Kategori Produk, ubah data Kategori Produk, dan Kategori Produk.

4 No Proses 4

Nama Proses Pengolahan Data Artikel Source (sumber) Admin, Pengunjung

Input Data Artikel

(61)

34 Destination Admin, Pengunjung

Logika Proses 1. Admin memilih menu artikel untuk melakukan Pengolahan Data artikel. 2. Pengunjung memilih menu artikel untuk

melihat data artikel

3. Sistem akan menampilkan Halaman Pengolahan data artikel dimana admin

selanjutnya dapat memilih menu tambah data artikel, ubah data artikel, dan hapus data artikel.

5 No Proses 5

Nama Proses Pengolahan Data Slideshow Source (sumber) Admin

Input Data Slideshow

Output Info Slideshow Destination Admin

Logika Proses 1. Admin memilih menu Contact untuk melakukan Pengolahan Data Slideshow. 2. Sistem akan menampilkan Halaman

Pengolahan Data Slideshow dimana admin selanjutnya dapat memilih menu Tambah Data Slideshow, ubah Data Slideshow, dan Hapus Data Slideshow.

6 No Proses 6

Nama Proses Pengolahan Data Contact Source(sumber) Admin

Input Data Contact

(62)

35 Logika Proses 1. Admin memilih menu Contact untuk

melakukan Pengolahan Data contact. 2. Sistem akan menampilkan Halaman

Pengolahan data contact dimana admin selanjutnya dapat memilih untuk mengubah atau tidak data contact yang ada.

7 No Proses 7

Nama Proses Setting Source(sumber) Admin

Input Data User

Output Info User

Logika Proses 1. Admin memilih menu Setting untuk melakukan Pengubahan data setting. 2. Sistem akan menampilkan pop up halaman

setting.

3. Admin dapat mengubah isi form ubah data user sesuai dengan atribut yang telah

disediakan.

4. Admin dapat menekan tombol ubah untuk menyimpan data input yang telah diubah atau admin dapat menekan tombol batal untuk membatalkan pengubahan data.

(63)

36

3.5.1.10 Spesifikasi Proses DFD level 2 – Pengolahan Data Katalog Produk

Spesifikasi proses dari gambaran DFD level 2 – Pengolahan Data Katalog Produk diatas akan dijelaskan pada tabel dibawah ini :

8 No Proses 2.1

Nama Proses Tampil Data Katalog Produk Source (sumber) Admin, Pengunjung

Input Data Katalog produk Output Info Katalog Produk Destination Admin, Pengunjung

Logika Proses 1. Admin memilih menu Katalog Produk. 2. Sistem akan menampilkan daftar Katalog

Produk.

3. Pengunjung memilih data Katalog Produk untuk melihat data katalog.

9 No Proses 2.2

Nama Proses Tambah Data Katalog Produk Source (sumber) Admin

Input Data Katalog Produk Output Info Katalog Produk Destination Admin

Logika Proses 1. Admin memilih menu Tambah Data Katalog produk.

2. Sistem akan menampilkan popup halaman tambah Data Katalog produk.

(64)

37 4. Admin dapat menekan tombol simpan untuk

menyimpan data input yang telah diisi atau admin dapat menekan tombol batal untuk membatalkan pengisian data.

10 No Proses 2.3

Nama Proses Ubah Data Katalog Produk Source (sumber) Admin

Logika Proses 1. Admin memilih menu ubah Data Katalog Produk.

2. Sistem akan menampilkan popup halaman ubah Data Katalog produk.

3. Admin dapat mengubah isi form ubah katalog produk sesuai dengan atribut yang telah disediakan.

4. Admin dapat menekan tombol ubah untuk menyimpan data input yang telah diubah atau admin dapat menekan tombol batal untuk membatalkan pengubahan data.

11 No Proses 2.4

Nama Proses Hapus Data Katalog Produk Source (sumber) Admin

(65)

38 2. Admin menekan tombol hapus dengan icon x

untuk menghapus data Katalog Produk yang dipilih.

3. Sistem akan menampilkan pesan konfirmasi “Hapus Katalog Produk {nama_katalog} ?”. 4. Jika memilih tombol OK, maka data yang

dipilih akan terhapus, jika cancel, data yang dipilih tidak jadi terhapus.

Tabel 4. Proses DFD Level 2 – Pengolahan Data Katalog Produk.

3.5.1.11 Spesifikasi Proses DFD level 2 – Pengolahan Data Kategori Produk

Spesifikasi proses dari gambaran DFD level 2 – Pengolahan Data Kategori Produk diatas akan dijelaskan pada tabel dibawah ini :

12 No Proses 3.1

Nama Proses Tampil Data Kategori Produk Source (sumber) Admin, Pengunjung

Input Data Kategori Produk Output Info Kategori Produk Destination Admin, Pengunjung

Logika Proses 1. Admin memilih menu Kategori Produk. 2. Sistem akan menampilkan daftar Kategori

Produk.

3. Pengunjung memilih data Kategori Produk untuk melihat data Ketegori Produk.

(66)

39 Nama Proses Tambah Data Kategori Produk

Source (sumber) Admin

Input Data Kategori Produk Output Info Kategori Produk

Destination Admin

Logika Proses 1. Admin memilih menu Tambah Data Kategori Produk.

2. Sistem akan menampilkan popup halaman tambah data Kategori Produk.

3. Admin dapat mengisi form tambah Kategori Produk sesuai dengan atribut yang telah disediakan.

4. Admin dapat menekan tombol simpan untuk menyimpan data input yang telah diisi atau admin dapat menekan tombol batal untuk membatalkan pengisian data.

14 No Proses 3.3

Nama Proses Ubah Data Kategori Produk Source (sumber) Admin

Input Data Kategori Produk Output Info Kategori Produk Destination Admin

Logika Proses 1. Admin memilih menu ubah Data Kategori Produk.

2. sistem akan menampilkan popup halaman ubah data Kategori Produk.

3. Admin dapat mengubah isi form ubah Kategori Produk sesuai dengan atribut yang telah disediakan.

(67)

40 menyimpan data input yang telah diubah atau admin dapat menekan tombol batal untuk membatalkan pengubahan data.

15 No Proses 3.4

Nama Proses Hapus Data Kategori Produk Source (sumber) Admin

Input Data Kategori Produk Output Info Kategori Produk Destination Admin

Logika Proses 1. Admin memilih data Kategori Produk yang akan dihapus.

2. Admin menekan tombol hapus dengan icon x untuk menghapus data Kategori Produk yang dipilih.

3. Sistem akan menampilkan pesan konfirmasi “Hapus Kategori Produk {nama_ kat_produk } ?”.

4. Jika OK, maka data yang dipilih akan terhapus, jika cancel, data yang dipilih tidak jadi terhapus.

(68)

41

3.5.1.12 Spesifikasi Proses DFD level 2 – Pengolahan Data Artikel

Spesifikasi proses dari gambaran DFD level 2 – Pengolahan Data Artikel diatas akan dijelaskan pada tabel dibawah ini :

16 No Proses 4.1

Nama Proses Tampil Data Artikel Source (sumber) Admin, Pengunjung

Output Info Artikel

Destination Admin, Pengunjung

Logika Proses 1. Admin memilih menu Artikel.

2. Sistem akan menampilkan daftar Artikel. 3. Pengunjung memilih data artikel untuk

melihat artikel.

17 No Proses 4.2

Nama Proses Tambah Data Client Source (sumber) Admin

Output Info Artikel Destination Admin

Logika Proses 1. Admin memilih menu Tambah Data Artikel. 2. Sistem akan menampilkan popup halaman

tambah data Artikel.

3. Admin dapat mengisi form tambah Artikel sesuai dengan atribut yang telah disediakan. 4. Admin dapat menekan tombol simpan untuk

(69)

42

18 No Proses 4.3

Nama Proses Ubah Data Artikel Source (sumber) Admin

Logika Proses 1. Admin memilih menu ubah Data Artikel. 2. Sistem akan menampilkan popup halaman

ubah data Artikel.

3. Admin dapat mengubah isi form ubah Artikel sesuai dengan atribut yang telah disediakan. 4. Admin dapat menekan tombol ubah untuk

menyimpan data input yang telah diubah atau admin dapat menekan tombol batal untuk membatalkan pengubahan data.

19 No Proses 4.4

Nama Proses Hapus Data Artikel Source (sumber) Admin

Logika Proses 1. Admin memilih data Artikel yang akan dihapus.

2. Admin menekan tombol hapus dengan icon x untuk menghapus data Artikel yang dipilih. 3. Sistem akan menampilkan pesan konfirmasi

“Hapus Artikel {nama_ artikel } ?”. 4. Jika OK, maka data yang dipilih akan

(70)

43 jadi terhapus.

Tabel 6. Proses DFD Level 2 – Pengolahan Data Artikel.

3.5.1.13 Spesifikasi Proses DFD level 2 – Pengolahan Data Slideshow

Spesifikasi proses dari gambaran DFD level 2 – Pengolahan Data Slideshow diatas akan dijelaskan pada tabel dibawah ini :

20 No Proses 5.1

Nama Proses Tampil Data Slideshow Source (sumber) Admin

Logika Proses 1. Admin memilih menu Slideshow.

2. Sistem akan menampilkan daftar Slideshow.

21 No Proses 5.2

Nama Proses Tambah Data Slideshow Source (sumber) Admin

Logika Proses 1. Admin memilih menu Tambah Data Slideshow.

2. Sistem akan menampilkan popup halaman tambah data Slideshow.

(71)

44 4. Admin dapat menekan tombol simpan untuk

menyimpan data input yang telah diisi atau admin dapat menekan tombol batal untuk membatalkan pengisian data.

22 No Proses 5.3

Nama Proses Ubah Data Slideshow Source (sumber) Admin

Input Data Slideshow

Output Info Slideshow

Destination Admin

Logika Proses 1. Admin memilih menu ubah Data Slideshow. 2. Sistem akan menampilkan popup halaman

ubah data Slideshow.

3. Admin dapat mengubah isi form ubah Slideshow sesuai dengan atribut yang telah

disediakan.

4. Admin dapat menekan tombol ubah untuk menyimpan data input yang telah diubah atau admin dapat menekan tombol batal untuk membatalkan pengubahan data.

23 No Proses 5.4

Nama Proses Hapus Data Slideshow Source (sumber) Admin

Input Data Slideshow

Output Info Slideshow

Logika Proses 1. Admin memilih data Slideshow yang akan dihapus.

(72)

45 untuk menghapus data Slideshow yang dipilih.

3. Sistem akan menampilkan pesan konfirmasi “Hapus Slideshow {nama_ slideshow } ?”. 4. Jika OK, maka data yang dipilih akan

terhapus, jika cancel, data yang dipilih tidak jadi terhapus.

Tabel 7. Proses DFD Level 2 – Pengolahan Data Slideshow.

3.5.1.14 Spesifikasi Proses DFD level 2 – Pengolahan Data Contact

Spesifikasi proses dari gambaran DFD level 5 – Pengolahan Data Contact diatas akan dijelaskan pada tabel dibawah ini :

24 No Proses 6.1

Nama Proses Tampil Data Contact Source (sumber) Admin

Output Info Contact Destination Admin

Logika Proses 1. Admin memilih menu contact.

2. Sistem akan menampilkan daftar contact.

25 No Proses 6.2

Nama Proses Ubah Data Contact Source (sumber) Admin

(73)

46 Logika Proses 1. Admin memilih menu ubah Data contact

2. Sistem akan menampilkan popup halaman ubah data contact

3. Admin dapat mengubah isi form ubah contact sesuai dengan atribut yang telah disediakan. 4. Admin dapat menekan tombol ubah untuk

Tabel 8. Proses DFD Level 2 – Pengolahan Data Contact.

3.5.1.15 Spesifikasi Proses DFD level 2 –Setting

Spesifikasi proses dari gambaran DFD level 5 – Setting diatas akan dijelaskan pada tabel dibawah ini :

26 No Proses 7.1

Nama Proses Tampil Data Setting Source (sumber) Admin

Input Data Setting

Output Info Setting Destination Admin

Logika Proses 1. Admin memilih menu Setting.

2. Sistem akan menampilkan daftar Setting.

27 No Proses 7.2

Nama Proses Ubah Data Setting Source (sumber) Admin

(74)

47 Output Info Setting

Logika Proses 1. Admin memilih menu ubah Data Setting. 2. Sistem akan menampilkan popup halaman

ubah data Setting.

3. Admin dapat mengubah isi form ubah Setting sesuai dengan atribut yang telah disediakan. 4. Admin dapat menekan tombol ubah untuk

Tabel 9. Proses DFD Level 2 –Setting.

3.5.1.16 Kamus Data

Kamus data dari data flow diagram aplikasi website company profile di CV. Arcons Indonesia berbasis website ini adalah sebagai berikut :

Nama Aliran Data Data Login

Where used / how used

admin - Proses 1 (input), admin - Proses 7 (input)

Deskripsi Data ini digunakan untuk dapat masuk kedalam sistem sebagai admin.

Struktur Data idpengguna + un + pw

idpengguna [0..9]

un [a..z|A..Z|0..9]

pw [a..z|A..Z|0..9]

Nama Aliran Data Data Katalog Produk

(75)

48 admin - Proses 2.4 (input)

Deskripsi

Data ini digunakan oleh admin untuk mengolah data katalog produk (tambah, ubah, atau hapus)

Struktur Data idproduk + nama + namagambar + ketproduk + idkatproduk + penambah

idproduk [0..9] nama [a..z|A..Z|0..9]

namagambar [a..z|A..Z|0..9|.jpg|.png|gif] idkatproduk [0..9]

penambah [0..9]

Nama Aliran Data Data Kategori Produk

admin - Proses 2 (input), admin - Proses 3 (input), admin

- Proses 2.2 (input) , admin - Proses 2.3 (input), admin - Proses 3.1 (input) , admin - Proses 3.2 (input) , admin - Proses 3.3 (input) , admin - Proses 3.4 (input)

Deskripsi

Data ini digunakan oleh admin untuk mengolah data kategori produk (tambah, ubah, atau hapus)

Struktur Data

idkatproduk + namakat

idkatproduk [0..9] namakat [a..z|A..Z]

Nama Aliran Data Data Artikel

admin - Proses 4 (input), admin - Proses 4.1 (input),

admin - Proses 4.2 (input) , admin - Proses 4.3 (input),

admin - Proses 4.4 (input)

Deskripsi

Data ini digunakan oleh admin untuk mengolah data artikel (tambah, ubah, atau hapus)

Struktur Data

idartikel + judul + isi + tag + tgl + penambah

(76)

49 isi [a..z|A..Z|0..9]

tag [a..z|A..Z] tgl [a..z|A..Z|0..9] penambah [0..9]

Nama Aliran Data Data Slideshow

admin - Proses 5 (input), admin - Proses 5.1 (input) ,

admin - Proses 5.2 (input), admin - Proses 5.3 (input),

admin - Proses 5.4 (input)

Deskripsi

Data ini digunakan oleh admin untuk mengolah data slideshow(tambah, ubah, atau hapus).

Struktur Data

Idslide + namaslide + ketslide

idslide[0..9]

namaslide[a..z|A..Z|0..9|.jpg|.png|.gif] ketslide[a..z|A..Z]

Nama Aliran Data Data Contact

admin - Proses 5 (input), admin - Proses 5.1 (input),

admin - Proses 5.2 (input), admin - Proses 5.3 (input)

Deskripsi

Data ini digunakan oleh admin untuk mengolah data contact (tambah, ubah).

Struktur Data

(77)

50 Adapun Kamus Data Output dari aplikasi website tersebut sebagai tabel di bawah ini:

Nama Aliran Data Data Login

Where used / how

used

admin - Proses 1 (output), admin - Proses 7 (output)

Deskripsi Data ini digunakan untuk dapat masuk kedalam sistem sebagai admin.

Struktur Data idpengguna + un + pw

idpengguna [0..9]

un [a..z|A..Z|0..9]

pw [a..z|A..Z|0..9]

Nama Aliran Data Data Katalog Produk

Where used / how

used

admin - Proses 2 (output), admin - Proses 2.1 (output) ,

pengunjung - Proses 2.1 (output) , admin - Proses 2.2 (output) , admin - Proses 2.3 (output) , admin - Proses 2.4 (output)

Deskripsi

Data ini digunakan oleh admin untuk mengolah data katalog produk (tambah, ubah, atau hapus)

Struktur Data idproduk + nama + namagambar + ketproduk + idkatproduk + penambah

idproduk [0..9] nama [a..z|A..Z|0..9]

(78)

51 penambah [0..9]

Nama Aliran Data Data Kategori Produk

Where used / how

used

admin - Proses 2 (output), admin - Proses 3 (output),

admin - Proses 2.2 (output) , admin - Proses 2.3 (output),

admin - Proses 3.1 (output) , pengunjung - Proses 3.1

(output) , admin - Proses 3.2 (output) , admin - Proses 3.3 (output) , admin - Proses 3.4 (output)

Deskripsi

Data ini digunakan oleh admin untuk mengolah data kategori produk (tambah, ubah, atau hapus)

Struktur Data

idkatproduk + namakat

idkatproduk [0..9] namakat [a..z|A..Z]

Nama Aliran Data Data Artikel

Where used / how

used

admin - Proses 4 (output), admin - Proses 4.1 (output),

pengunjung - Proses 4.1 (output), admin - Proses 4.2 (output) , admin - Proses 4.3 (output), admin - Proses 4.4 (output)

Deskripsi

Data ini digunakan oleh admin untuk mengolah data artikel (tambah, ubah, atau hapus)

Struktur Data

(79)

52 Where used / how

used

admin - Proses 5 (output), admin - Proses 5.1 (output) ,

admin - Proses 5.2 (output), admin - Proses 5.3 (output),

admin - Proses 5.4 (output)

Deskripsi

Data ini digunakan oleh admin untuk mengolah data slideshow(tambah, ubah, atau hapus).

Struktur Data

Idslide + namaslide + ketslide

idslide[0..9]

namaslide[a..z|A..Z|0..9|.jpg|.png|.gif] ketslide[a..z|A..Z]

Nama Aliran Data Data Contact

Where used / how

used

admin - Proses 5 (output), admin - Proses 5.1 (output),

admin - Proses 5.2 (output), admin - Proses 5.3 (output)

Deskripsi

Data ini digunakan oleh admin untuk mengolah data contact(tambah, ubah).

(80)

53

3.6Perancangan Data

Berikut adalah perancangan data dari company profile di CV. Arcons Indonesia berbasis website:

3.6.1 Struktur Tabel

Berikut adalah struktur tabel dari aplikasi website company profile di CV. Arcons Indonesia:

3.6.1.1Tabel Pengguna

Nama file : pengguna.db

Tempat penyimpanan : Harddisk

Tabel Pengguna

Nama Field Tipe

Data Panjang Kunci Keterangan

idpengguna int 3 Primary Key Not Null, Auto Increment

nama varchar 80 Not Null

un varchar 50 Not Null

pw varchar 32 Not Null

Tabel 12. Tabel Pengguna.

3.6.1.2Tabel Produk

Nama file : produk.db

Tabel Produk

Nama Field Tipe

idproduk int 5 Primary Key Not Null, Auto Increment

nama varchar 25 Not Null

namagambar varchar 255 Not Null

ketproduk varchar 600 Not Null

(81)

54

3.6.1.3Tabel Ketproduk

Nama file : ketproduk.db

Tabel Ketproduk

Nama Field Tipe

idketproduk int 5 Primary Key Not Null, Auto Increment

namakat varchar 25 Not Null

Tabel 14. Tabel Ketproduk.

3.6.1.4Tabel Artikel

Nama file : artikel.db Tempat penyimpanan : Harddisk

Tabel Artikel

Nama Field Tipe

idartikel int 5 Primary Key Not Null, Auto Increment

judul varchar 300 Not Null

isi text Not Null

tag varchar Not Null

tgl date Not Null

(82)

55

3.6.1.5Tabel Slideshow

Nama file : slideshow.db

Tabel Slideshow

Nama Field Tipe

idslide int 5 Primary Key Not Null, Auto Increment

namaslide varchar 255 Not Null

ketslide varchar 600 Not Null

Tabel 16. Tabel Slideshow.

3.6.1.6Tabel Contact

Nama file : contact.db

Tabel Contact

Nama Field Tipe

idcontact int 2 Primary Key Not Null, Auto Increment

(83)

56

3.7Perancangan Arsitektur Menu Web

Perancangan arsitektur menyediakan gambaran dari stuktur menu program aplikasi website yang akan dibuat. Tujuan perancangan ini adalah untuk membangun struktur program secara moduler dan menggambarkan hubungan diantara modul program. Berikut adalah gambaran perancangan arsitektural menu pada company profile CV. Arcons Indonesia:

Gambar 15. Struktur menu admin.