PRISANTYA MAGHRIBI FRIDAYANA M3209066

(1)

commit to user

PEMBUATAN APLIKASI MOBILE WE BSITE M-COMME RCE UNTUK

BATIK SOLO

TUGAS AKHIR

Diajukan Untuk Memenuhi Salah Satu Syarat Untuk Mencapai Gelar Ahli Madya Program Diploma III Teknik Informatika Fakultas Matematika Dan Ilmu

Pengetahuan Alam Universitas Sebelas Maret

Disusun Oleh :

PRISANTYA MAGHRIBI FRIDAYANA NIM. M3209066

PROGRAM DIPLOMA III TEKNIK INFORMATIKA FAKULTAS MATEMATIKA DAN ILMU PENGETAHUAN ALAM

UNIVERSITAS SEBELAS MARET 2012


(2)

commit to user


(3)

commit to user


(4)

commit to user

iv

ABSTRACT

Prisantya Maghribi Fridayana. 2012. B UILDING M-COMME RCE MOBILE

WEB F OR SOLO BATIK. Diploma III Informatics Engineering Matematika and

Nature Science Faculty. Sebelas Maret University Surakarta. Juny 2012.

The number of mobile users, such a s mobile phone, sma rtphone or ta blet from yea r to yea r is increa se. Based on Effective Mea sure, in 2011 ther e a re a s much a s 61.88 percent of Internet users a ccess via mobile phones in Indonesia. This number is directly proportiona l to the needs of the Internet in accessing informa tion. These developments ha ve an impa ct on the commercia l sector by the a ppeara nce of a new term, m-commerce. Batik product itself was very fa milia r in commercia l a ctivities. Implementa tion of technology in batik ma rketing is expected to increase profits. Therefore, a s a n alterna tive m-commerce, especia lly mobile web, needed in ma rket batik product.

For the first step of ma king this a pplica tion is by designing requir ements through the SRS system and then designing UML (Use Ca se Dia gra m, Activity Diagra m, Cla ss Dia gra m a nd Sequence Diag ram). From the system design then continued designing data base a nd interface. The development of this mobile web a pplications is using CodeIgniter framework version 2.1.0 with progra mming language PHP version 5.3.1 a nd MySQL data ba se version 3.2.4.

The result of the applica tion m-commer ce, mobile web Solo ba tik such a s transaction a ctivity, a ccount setting, report a nd a ccessible via mobile. For the a dministra tor, there a re product ma nagement, shipping ma na gement, web informa tion ma na gement a nd order mana gement. For the ma nag er, it ca n received reports of tra nsa ctions in a specified period. In system, there is checking a bout the status of order. If in 3 da ys, no pa yment confirma tion, order a utomatica lly canceled and stock restored.

Keyword : Online Store, M-Commerce, Mobile Web, fra mework CodeIgniter, Batik Solo.


(5)

commit to user

v

ABSTRAK

Prisantya Maghribi Fridayana. 2012. PEMBUATAN APLIKASI MOBILE

WEB SITE M-COMME RCE UNTUK BATIK SOLO, Diploma III Teknik

Informatika, Fakultas Matematika dan Ilmu Pengetahuan Alam, Universitas Sebelas Maret Surakarta. Juni 2012.

Jumlah pengguna mobile, seperti handphone, sma rtphone ataupun tablet dari tahun ke tahun semakin meningkat. Berdasarkan Effective Mea sure, pada tahun 2011 sebanyak 61,88 persen dari pengguna Internet Indonesia mengakses melalui ponsel. Peningkatan ini berbanding lurus dengan kebutuhan internet untuk mengakses informasi. Perkembangan ini berdampak pada sektor komersial dengan munculnya istilah baru m-commerce. Produk batik sendiri sudah sangat familiar dalam kegiatan perdagangan. Penerapan teknologi dalam pemasaran batik diharapkan dapat meningkatkan keuntungan. Oleh karena itu, dibutuhkan alternatif implementasi teknologi m-commerce, khususnya mobile web dalam memasarkan produk batik.

Tahap awal pembuatan aplikasi ini dengan merancang kebutuhan sistem melalui SRS lalu kemudian perancangan UML (Use Ca se Diagra m, Activity

Diagra m, Cla ss Dia gram dan Sequence Diagra m). Dari perancangan sistem

tersebut kemudian dilanjutkan perancangan database dan desain interfa ce. Pembuatan aplikasi mobile web ini menggunakan fra mework CodeIgniter versi 2.1.0 dengan bahasa pemrograman PHP versi 5.3.1 dan data ba se MySQL versi 3.2.4.

Terbangunnya aplikasi mobile web m-commerce batik Solo meliputi kegiatan transaksi jual-beli, pengaturan a ccount dan dapat diakses melalui mobile. Untuk admin meliputi manajemen produk, pengiriman, informasi web dan manajemen pesanan. Untuk manajer, mendapat laporan kegiatan transaksi dalam kurun waktu tertentu. Pada sistem, terdapat pengecekan status order. Jika lebih dari 3 hari tidak terdapat konfirmasi pembayaran, maka pesanan otomatis dibatalkan dan stok dikembalikan.

Kata Kunci : Aplikasi toko online, M-Commerce, Mobile Web, fra mewor k CodeIgniter, Batik Solo


(6)

commit to user

vi

HALAMAN MOTTO

Selesaikan apa yang sudah kamu mulai (Anonim)

Sesungguhnya di balik kesulitah itu ada kemudahan. Di balik kesulitan itu ada kemudahan. (QS: Al-Insyirah 5-6)


(7)

commit to user

vii

HALAMAN PERSEMBAHAN

Kupersemba hkan hasil jerih pa ya h ini untuk :

1. Ora ng tua -ku dan a dik terkasih ya ng sena ntia sa mendukung dan menyema nga ti

(Terima kasih ya ng tiada terkira untuk ka lia n)

2. Kelua rga Besa r di Madiun da n di Sra gen yang tela h ba nya k banya k membantu sela ma ini

(Terima Ka sih da n Semoga Alla h memba la s kebaika nnya )

3. Saha bat-sa ha ba tku sayongs @OGE (feni-zhie-via ni) yang

sela lu da n terus memberika n dukunga n penuh.

(Terima ka sih cinta , terima ka sih a ta s persaha bata n ma nisnya) 4. Tema n-tema n seperjua ngan di D3 TI 2009 ya ng tida k bisa

disebutka n satu per sa tu.

(Terima ka sih a ta s semua semanga t, ba ntua n da n


(8)

commit to user

viii

KATA PENGANTAR

Assa la mu’a laykum Wa rohma tullohi Wa ba roka tuh.

Bismilla hirrohma nirrohim, segala puji dan rasa syukur hanya penulis

panjatkan ke haribaan Alloh subha nahu wa ta’a la, yang telah melimpahkan segala kemudahannya hingga akhirnya penulis mampu menyelesaikan Tugas Akhir dan menulis laporannya tepat waktu.

Dalam pembuatan Tugas Akhir ini termasuk kegiatan pembuatan laporan, penulis banyak mendapat bantuan dari berbagai pihak. Tanpa bantuan Alloh subha nahu wa ta’a la melalui mereka niscaya pembuatan Tugas Akhir ini tidak akan berjalan lancar. Untuk itu sampaikan rasa hormat dan menghaturkan rasa terima kasih kepada:

1. YS. Palgunadi, selaku Ketua Program Diploma III Ilmu Komputer Fakultas

Matematika dan Ilmu Pengetahuan Alam Universitas Sebelas Maret Surakarta

2. Bapak Didiek S. Wiyono, selaku pembimbing, yang telah mengarahkan,

selalu memberikan semangat kepada penulis.

3. Mas Fery Kurniawan dan Mas Yudha S. yang membantu dalam penyediaan

data produk batik ini.

4. Keluarga penulis, yang telah memberikan dorongan dan segala dukungan

kepada penulis.

5. Teman-teman seperjuangan, para OGHE yang selalu menemani dan

mendukung setiap saat.

6. Serta, Teman-teman Teknik Informatika angkatan 2009, yang telah

menyediakan waktu untuk membagi ilmu dan gurauan mereka ketika penulis memiliki permasalahan.

Namun tidak ada hal yang sempurna di dunia ini, oleh sebab itu penulis memohon maaf apabila terdapat kekurangan yang dalam laporan Tugas Akhir ini.

Wa ssa lamu’a la ikum Wa rohmatullohi Wa barokatuh.

Surakarta, 07 Juni 2012


(9)

commit to user

ix

DAFTAR ISI

Halaman

HALAMAN JUDUL ... i

HALAMAN PERSETUJUAN ... ii

HALAMAN PENGESAHAN ... iii

ABSTRACT ... iv

HALAMAN ABSTRAK ... v

HALAMAN MOTTO ... iv

HALAMAN PERSEMBAHAN ... vii

KATA PENGANTAR ...viii

DAFTAR ISI ... ix

DAFTAR TABEL ... xiii

DAFTAR GAMBAR ... xv

BAB I PENDAHULUAN ... 1

1.1 Latar Belakang Masalah ... 1

1.2 Rumusan Masalah... 2

1.3 Batasan Masalah ... 2

1.4 Tujuan Dan Manfaat ... 2

1.5 Metodologi Penelitian ... 2

1.6 Sistematika Penulisan ... 3

BAB II LANDASARAN TEORI ... 4

2.1 E-Commerce ... 4

2.2 M-Commerce ... 4

2.3 Batik ... 5

2.3.1 Sejarah Perkembangan Batik ... 5

2.4 Fra mework CodeIgniter ... 6

2.4.1 Konsep MVC ... 6

2.4.2 Libra ry yang Digunakan ... 6

2.4.3 Helper yang Digunakan ... 7

2.5 UML... 8


(10)

commit to user

x

2.5.2 Activity Diagra m ... 9

2.5.3 Cla ss Dia gra m ... 11

2.5.4 Sequence Dia gra m ... 12

2.6 MySQL ... 14

2.7 CSS ... 14

2.8 XHTML-MP... 16

BAB III DESAIN DAN PERANCANGAN ... 19

3.1 Analisa Kebutuhan Sistem ... 19

3.1.1 Analisa Kebutuhan Software ... 19

3.2 Perancangan Sistem ... 19

3.2.1 SRS ... 19

3.2.2 Activity Diagra m ... 21

3.2.2.1 Activity Dia gram Login ... 21

3.2.2.2 Activity Dia gram Register ... 22

3.2.2.3 Activity Dia gram Insert Da ta ... 22

3.2.2.4 Activity Dia gram Upda te Data ... 23

3.2.2.5 Activity Dia gram Delete Data ... 23

3.2.2.6 Activity Dia gra m Order (Pembelia n)... 24

3.2.3 Use Ca se Diagra m ... 25

3.2.3.1 Definisi Aktor ... 25

3.2.3.2 Use Ca se Diagra m ... 25

3.2.4 Cla ss Dia gra m Ana lysis ... 28

3.2.4.1 Cla ss Dia gra m Ana lysis Customer ... 28

3.2.4.2 Cla ss Dia gra m Ana lysis Admin ... 28

3.2.5 Cla ss Dia gra m Design ... 29

3.2.5.1 Cla ss Dia gra m Design Customer ... 29

3.2.5.2 Cla ss Dia gra m Design Admin ... 37

3.2.6 Sequence Diagra m ... 49

3.2.6.1 Sequence Diagra m Login ... 49

3.2.6.2 Sequence Dia gra m Register ... 50


(11)

commit to user

xi

3.2.6.4 Sequence Diagra m Give Testimonia l ... 50

3.2.6.5 Sequence Dia gra m Add To Cart ... 51

3.2.6.6 Sequence Dia gra m View P roduct ... 51

3.2.6.7 Sequence Dia gra m Update Ca rt ... 51

3.2.6.8 Sequence Dia gra m Ca ncel Order ... 52

3.2.6.9 Sequence Dia gra m Add Product ... 52

3.2.6.10 Sequence Dia gram Add Destina tion ... 52

3.2.6.11 Sequence Dia gra m Check Out ... 53

3.2.6.12 Sequence Dia gra m Delete Product ... 53

3.2.6.13 Sequence Dia gra m Upda te Account ... 54

3.2.6.14 Sequence Dia gra m Update Informa tion... 54

3.2.6.15 Sequence Dia gra m Change Order Status... 55

3.2.6.16 Sequence Dia gra m View Order ... 55

3.2.6.17 Sequence Dia gra m Add Shipping P rice ... 56

3.2.6.18 Sequence Dia gra m Update Shipping ... 56

3.3 Perancangan Database ... 57

3.3.1 Skema Diagram... 57

3.3.2 Definisi Tabel ... 57

3.3.2.1 Tabel User ... 57

3.3.2.2 Tabel Kategori Produk ... 57

3.3.2.3 Tabel Produk ... 58

3.3.2.4 Tabel Gambar Produk ... 58

3.3.2.5 Tabel Member ... 59

3.3.2.6 Tabel Testimonial ... 59

3.3.2.7 Tabel Alamat ... 59

3.3.2.8 Tabel Provinsi ... 60

3.3.2.9 Tabel Kota ... 60

3.3.2.10 Tabel Kurir ... 60

3.3.2.11 Tabel Tarif ... 60

3.3.2.12 Tabel Pesanan ... 61


(12)

commit to user

xii

3.3.2.14 Tabel Infoweb ... 62

3.4 Perancangan Interface ... 62

3.4.1 Perancangan Interface Admin dan Manajer ... 62

3.4.2 Perancangan Interface Customer ... 62

BAB IV IMPLEMENTASI DAN ANALISA ... 63

4.1 Implementasi Sistem ... 63

4.1.1 Halaman Utama ... 63

4.1.2 Halaman Produk Per Kategori ... 64

4.1.3 Halaman Troli/Keranjang/Cart ... 64

4.1.4 Halaman Checkout ... 65

4.1.5 Halaman Setelah Checkout... 66

4.1.6 Halaman Account User ... 69

4.1.7 Halaman Home Admin... 70

4.1.8 Halaman Pengaturan Pesanan Admin ... 70

4.1.9 Halaman Pengaturan Pengiriman Admin ... 70

4.1.9 Halaman Home Manajer ... 71

4.1.9 Halaman Laporan Grafik Transaksi Manajer ... 71

4.2 Analisa ... 75

BAB V PENUTUP... 76

5.1 Kesimpulan ... 76

5.2 Saran ... 76


(13)

commit to user

xiii

DAFTAR TABEL

No

1. Simbol Use Ca se ... 8

2. Simbol Activity Diagra m ... 10

3. Simbol Cla ss Dia gra m ... 11

4. Simbol Sequence Dia gra m ... 12

5. Modul XHTML-MP yang digunakan ... 17

6. MIME dan DOCTYPES... 18

7. SRS Fungsional Customer... 19

8. SRS Fungsional Administrator ... 20

9. SRS Fungsional Manajer ... 20

10. SRS Non Fungsional ... 21

11. Definisi Aktor ... 25

12. Tabel Deskripsi Cla ss Bounda ry MainWra pper... 30

13. Tabel Deskripsi Cla ss Control Account ... 31

14. Tabel Deskripsi Cla ss Entity TMember ... 31

15. Tabel Deskripsi Cla ss Control Testimonia l ... 32

16. Tabel Deskripsi Cla ss Entity TTestimonia l ... 32

17. Tabel Deskripsi Cla ss Control Product ... 33

18. Tabel Deskripsi Cla ss Entity TTroduct ... 34

19. Tabel Deskripsi Cla ss Control Order ... 34

20. Tabel Deskripsi Cla ss Entity TO rder ... 35

21. Tabel Deskripsi Cla ss Entity TOrderDeta il ... 36

22. Tabel Deskripsi Cla ss Entity TShipping ... 36

23. Tabel Deskripsi Cla ss Bounda ry Main ... 38

24. Tabel Deskripsi Cla ss Control Admin ... 39

25. Tabel Deskripsi Cla ss Entity TAdmin ... 39

26. Tabel Deskripsi Cla ss Control Member ... 40


(14)

commit to user

xiv

28. Tabel Deskripsi Cla ss Control Testimonia lControl ... 41

29. Tabel Deskripsi Cla ss Entity TTestimonia l ... 41

30. Tabel Deskripsi Cla ss Control Informa tion ... 42

31. Tabel Deskripsi Cla ss Entity TInforma ion ... 42

32. Tabel Deskripsi Cla ss Control ProductControl ... 43

33. Tabel Deskripsi Cla ss Entity TProduct ... 43

34. Tabel Deskripsi Cla ss Control OrderControl ... 44

35. Tabel Deskripsi Cla ss Entity TOrder ... 45

36. Tabel Deskripsi Cla ss Entity TOrderDeta il ... 46

37. Tabel Deskripsi Cla ss Control ShippingControl ... 46

38. Tabel Deskripsi Cla ss Entity TShipping ... 47

39. Tabel Deskripsi Cla ss Entity TCourier ... 48

40. Tabel Deskripsi Cla ss Entity TDestina tion ... 48

41. Tabel User ... 57

42. Tabel Kategori Produk ... 58

43. Tabel Produk... 58

44. Tabel Gambar Produk ... 58

45. Tabel Member ... 59

46. Tabel Testimonial ... 59

47. Tabel Alamat ... 59

48. Tabel Provinsi ... 60

49. Tabel Kota ... 60

50. Tabel Kurir ... 60

51. Tabel Tarif ... 61

52. Tabel Pesanan ... 61

53. Tabel Detail Pesanan ... 61


(15)

commit to user

xv

DAFTAR GAMBAR

No

1. Alur Teknologi WAP ... 17

2. Alur Halaman Web WAP ... 17

3. Activity Diagra m Login ... 21

4. Activity Diagra m Register ... 22

5. Activity Diagra m Insert ... 22

6. Activity Diagra m Upda te Da ta ... 23

7. Activity Diagra m Delete Da ta ... 23

8. Activity Diagra m Order (Pembelian) ... 24

9. Use Ca se Diagra m User ... 25

10. Use Ca se Diagra m Cu stomer ... 26

11. Use Ca se Diagra m Mana jer ... 26

12. Use Ca se Diagra m Admin ... 27

13. Cla ss Dia gra m Ana lysis Customer ... 28

14. Cla ss Dia gra m Ana lysis Admin ... 28

15. Cla ss Dia gra m Design Customer ... 29

16. Cla ss Dia gra m Design Admin ... 37

17. Sequence Dia gra m Login Customer ... 49

18. Sequence Dia gra m Login Admin ... 49

19. Sequence Dia gra m Register ... 50

20. Sequence Dia gra m Update Account ... 50

21. Sequence Dia gra m Give Testimonia l ... 50

22. Sequence Dia gra m Add To Ca rt ... 51

23. Sequence Dia gram View P roduct ... 51

24. Sequence Dia gra m Update Ca rt ... 51

25. Sequence Dia gra m Ca ncel Order ... 52

26. Sequence Dia gra m Add P roduct... 52


(16)

commit to user

xvi

28. Sequence Dia gra m CheckOut ... 53

29. Sequence Dia gra m Delete Product ... 53

30. Sequence Dia gra m Update Product ... 54

31. Sequence Dia gra m Update Informa tion ... 54

32. Sequence Dia gra m Change Order Status ... 55

33. Sequence Dia gra m View Order ... 55

34. Sequence Dia gra m Add Shipping Price ... 56

35. Sequence Dia gra m Update Shipping ... 56

36. Skema Diagram... 57

37. Perancangan Interface Admin dan Manajer ... 62

38. Perancangan Interface Customer ... 62

39. Tampilan Halaman Utama ... 63

40. Tampilan Halaman Produk per Kategori ... 64

41. Halaman Troli/Keranjang/Cart ... 64

42. Halaman Login ... 65

43. Halaman CheckOut ... 65

44. Halaman Checkut Sukses ... 67

45. Halaman Account... 69

46. Halaman Home Admin... 70

47. Halaman Pengaturan Pesanan Admin ... 70

48. Halaman Pengaturan Pengiriman Admin ... 71

49. Halaman Manajer ... 71

50. Halaman Laporan Grafik Transaksi Manajer ... 72

51. Halaman Detail Order Manajer ... 72


(17)

commit to user

1

BAB I PENDAHULUAN

1.1 Latar Belakang Masalah

Perkembangan bisnis dan teknologi pada saat ini mulai melirik pada

mobile device atau perangkat mobile. Masyarakat Indonesia sudah banyak

memiliki perangkat mobile, dimulai dari perangkat mobile low end hingga sma rt

phone yang kemampuannya hampir menyamai PC. (http://www.teknojurnal.com).

E-commerce kini mulai merambah pada mobile dan lebih dikenal dengan istilah m-commerce. Secara prinsip, m-commerce hampir sama dengan e-commerce yang membedakan hanya perangkat yang digunakan. M-e-commerce sendiri mengalami perkembangan dengan munculnya berbagai jenis aplikasi dengan basis mobile web atau mobile a pps.

Berdasarkan data dari Effective Measure, firma yang memiliki spesialisasi dalam pengukuran statistik web, pada tahun 2011 sebanyak 61,88 persen dari pengguna Internet Indonesia mengakses melalui ponsel. Sementara 38,12 persen lainnya mengakses Internet bukan dari ponsel. Masih menggunakan data dari Effective Measure, pengguna internet di Indonesia di tahun 2011 mencapai 39.100.000 orang (peringkat ke-8 di dunia). Jika mengacu pada data tersebut, maka pengguna internet mobile di Indonesia adalah sekitar 24.195.080 orang. Dengan data tersebut, maka penulis memilih untuk membuat aplikasi m-commerce berbasis mobile web. Selain itu, jangkauan mobile web lebih luas karena bisa diakses oleh berbagai platform ponsel melalui mobile browser.

Produk batik di Solo menjadi favorit baik oleh konsumen domestik maupun luar negeri. Melihat perkembangan bisnis pada sektor mobile seperti yang dijabarkan di atas, maka produk batik ini perlu dipasarkan juga secara mobile. Sehingga bisa meningkatkan kegiatan transaksi untuk produk batik, lebih fleksibel, lebih cepat dan lebih terjangkau. Hal ini sebagai alternatif implementasi teknologi dalam pemasaran produk Batik Solo.


(18)

commit to user

Berdasarkan uraian diatas penulis bermaksud untuk membuat Tugas Akhir dengan judul “Pembuatan Aplikasi Mobile Web M-Commerce untuk Toko Batik Solo” .

1.2 Rumusan Masalah

Bagaimana membuat model dan implementasi m-commerce Toko Batik Solo pada mobile web ?

1.3 Batasan Masalah

1. Aplikasi ini diakses melalui browser untuk mobile.

2. Aplikasi ini ditujukan untuk sisi user/customer dengan prinsip m-commer ce

seperti mengadakan transaksi pembelian batik, pembayaran, pengiriman dan melihat katalog produk

3. Aplikasi web ini dibuat dengan menggunakan framework CodeIgniter,

data base MySQL dan CSS for mobile.

4. Wilayah transaksi berada di Indonesia dan pembayaran secara manual

5. Laporan Pada sisi manajer dalam bentuk grafik

1.4 Tujuan dan Manfaat

Tujuan dari pembuatan Tugas Akhir ini yaitu dapat membuat aplikasi mobile web m-commer ce untuk Toko Batik Solo.

Manfaat dari pembuatan Tugas Akhir ini yaitu memberi kemudahan dalam kegiatan transaksi untuk customer dan juga pemilik.

1.5 Metodologi Penelitian

Adapun tahap-tahap dalam melakukan perancangan dan pembuatan aplikasi m-commerce pada mobile web ini antara lain sebagai berikut :

1. Studi pustaka, pada tahap ini dilakukan studi untuk memahami pemrograman

PHP khususnya fra mework CodeIgniter, CSS untuk mobile, XHTML-MP, UML dan m-commerce itu sendiri.


(19)

commit to user

2. Perencanaan sistem, pada tahap ini dilakukan perancangan sistem yang

meliputi: rancangan desain tampilan aplikasi, rancangan sistem dan rancangan data base-nya.

3. Pembuatan aplikasi yang mencakup user/pengunjung, manajer dan admin.

4. Pengujian system. Pengujian dilakukan dengan browser mobile emulator

untuk menguji apakah aplikasi dapat berjalan dengan baik pada berbagai platform mobile.

5. Penyusunan laporan, pada tahap ini dilakukan penyusunan laporan lengkap

dan detail tentang aplikasi yang dibuat.

1.6 Sistematika Penulisan

Sistematika yang digunakan dalam penulisan ini disusun dalam lima bab meliputi :

BAB I Pendahuluan

Dalam bagian pendahuluan akan dijelaskan tentang latar belakang masalah, batasan masalah, tujuan dan manfaat penelitian, metode penyelesaian masalah, serta sistematika penulisan laporan.

BAB II Landasan Teori

Berisi teori yang mendasari penyusunan dan penulisan tugas akhir.

BAB III Desain dan Perancangan

Berisi tentang perancangan aplikasi meliputi perancangan sistem menggunakan UML (Unified Modeling La ngua ge) dan perancangan data base menggunakan Skema Diagra m.

BAB IV Implementasi dan Analisa

Memuat hasil dari analisis dan perancangan sistem yang ditampilkan dalam bentuk aplikasi yang diharapkan.

BAB V Penutup

Merupakan bab terakhir yang memuat kesimpulan dari aplikasi ini secara keseluruhan untuk diimplementasikan serta saran-saran yang diperlukan dalam pengembangan sistem ini lebih lanjut.


(20)

commit to user

4 BAB II LANDASAN TEORI

2.1E -commerce

Menurut Laudon & Laudon (1998), E-Commerce adalah suatu proses membeli dan menjual produk-produk secara elektronik oleh konsumen dan dari perusahaan ke perusahaan dengan computer sebagai perantara transaksi bisnis.

Tujuan suatu perusahaan menggunakan sistim E-Commerce adalah

dengan menggunakan E-Commerce maka perusahaan dapat lebih

meningkatkan keuntungannya.

Manfaat dalam menggunakan E-Commerce dalam suatu perusahaan sebagai sistem transaksi adalah:

a. Dapat meningkatkan ma rket exposure (pangsa pasar).

b. Melebarkan jangkauan (global reach).

c. Meningkatkan customer loyalty.

d. Meningkatkan supply management.

2.2M-Commerce

M-Commerce merupakan proses transaksi yang dilakukan dengan menggunakan perangkat mobile. M-Commerce merupakan subset dari e-Commerce, yang didefinisikan sebagai proses transaksi yang dilakukan secara elektronik,baik melalui internet, sma rt ca rd maupun perangkat mobile.

Pada umumnya, perangkat end user yang digunakan pada proses m-Commerce adalah sebagai berikut:

Ha ndphone Smart Phone PDA

Ta blet

Setiap perangkat memiliki karakteristik yang berbeda-beda sehingga dapat mempengaruhi tingkat penggunaannya aplikasi/sistem m-commerce.


(21)

commit to user

2.3Batik

Batik merupakan kain bergambar yg pembuatannya secara khusus dengan menuliskan atau menerakan malam pada kain tersebut, kemudian

pengolahannya diproses dengan cara tertentu.

(http://kamusbahasaindonesia.org/batik)

2.3.1Sejarah Pemasaran Batik

Pada mulanya membatik hanya dikerjakan oleh putri-putri keluarga keraton di Jawa. Kegiatan membatik ini pada mulanya dikatakan sebagai kegiatan spiritual yang membutuhkan konsentrasi, kesabaran, dan pembersihan pikiran melalui doa-doa. Dengan demikian, hanya perempuan yang berstatus tinggi yang seharusnya membuat batik itu. Sampai akhir abad ke-19, produksi batik dan penggunaannya telah diberlakukan di kalangan kerajaan sebagai pakaian resmi.

Masyarakat terdekat yang pertama kali memproduksi batik adalah masyarakat Kauman yang bekerja sebagai abdi dalem pamethakan keraton, istri mereka pada umumnya melakukan kegiatan membatik sebagai pekerjaan sambilan di rumah. Hasil dari kerajinan itu ditampung oleh beberapa orang yang dianggap dapat menjualkannya. Ternyata kerajinan batik itu justru mengalami kemajuan yang pesat sehingga muncullah pengusaha batik.

Pada tahun 1900 , pedagang batik di Kauman yang terkenal dan kaya adalah Kyai H. Abubakar dan Nyai H. Saleh. Dari pendapatannya sebagai pedagang kaya itu, mereka dapat menyekolahkan anaknya hingga ke Mekkah. Mulai pada tahun 1910, di Yogyakarta bermunculan pengusaha-pengusaha batik, misalnya seperti “Batik Handel” seperti tersebut di atas. Hingga akhirnya produk batik pun menyebar ke seluruh Indonesia.


(22)

commit to user

2.4Framework CodeIgniter

CodeIgniter merupakan sebuah framework yang digunakan untuk membuat sebuah aplikasi berbasis web yang disusun menggunakan bahasa PHP. Didalamnya terdapat bermacam-macam libra ry dan helper yang mempermudah dalam pengembangan aplikasi. (Riyanto, 2011)

2.4.1 Konsep MVC

Dalam konteks Codeigniter dan aplikasi web, penerapan konsep MVC mengakibatkan kode program dapat dibagi menjadi tiga kategori, yaitu :

a. Model. Kode program (berupa OOP class) yang digunakan untuk

memanipulasi database.

b. View. Berupa template html/xhtml atau php untuk menampilkan data

pada browser.

c. Controller. Kode program (berupa OOP class) yang digunakan untuk

mengontrol aliran aplikasi (sebagai pengontrol Model dan View).

2.4.2 Library CodeIgniter yang digunakan

Library CodeIgniter berisi kumpulan class dengan berbagai method yang biasa dipakai oleh programmer PHP.

Untuk pemanggilan library, format perintahnya :

$this->load->library(‘ , contoh : $this->load->library(‘cart’);

Dan ketika akan digunakan, format perintahnya :

$this-> -> contoh: $this->cart->total()

Dalam pembuatan aplikasi m-commer ce ini, library yang digunakan :

- Autoload : Digunakan untuk me-load secara otomatis class-class

dalam CodeIgniter, bisa library, helper ataupun model.

- Config : library config diinisialisasi secara otomatis oleh sistem.

Digunakan untuk menerima informasi mengenai konfigurasi sistem.

- Database : library database sangat handal, dilengkapi dengan berbagai

method untuk manipulasi database.

- File Uploading : library ini untuk melakukan upload file dengan fitur


(23)

commit to user

- Pagination : digunakan untuk membuat pagination dari hasil query.

Dapat diatur beberapa record yang ingin ditampilkan dalam satu halaman.

- Session : digunakan untuk memaintain state seorang user. Library ini

tidak menggunakan session milik PHP, tetapi menghasilkan data untuk session sendiri.

- User Agent : digunakan untuk mengidentifikasi browser, mobile

device atau robot (misalnya milik serach engine) yang berkunjung ke situs Anda.

- Form Validation : sebuah class yang berguna untuk memvalidasi input

form.

- Cart : library yang mengenai transaksi komersial (e-commerce),

namun hanya bagian keranjang belanja, tidak sampai proses checkout (shipping, pembayaran, dan sebagainya).

2.4.3 Helper yang digunakan

Tidak seperti libraries, helper bukanlah kode program OOP, tetapi kode prosedural. Tiap helper berisi satu atau beberapa fungsi, tiap fungsi fokus untuk mengerjakan tugas tertentu. Fungsi-fungsi tersebut tidak saling tergantung.

Untuk pemanggilan library, format perintahnya :

$this->load->helper(‘ , contoh : $this->load->helper(‘ ’);

Dan ketika akan digunakan langsung memanggil fungsinya, contoh:

Echo form_hidden('nama', 'john’); -> <input type=”hidden” name=”nama” value=”john”>

Helper yang digunakan :

- FusionCharts : helper untuk membuat grafik

- Form : helper yang digunakan untuk membuat form html.

- URL : helper yang menangani URL. Contohnya fungsi base_url() untuk


(24)

commit to user

2.5 UML

Unified Modeling Language (UML) adalah spesifikasi OMG yang paling digunakan, dan cara dunia memodelkan, tidak hanya aplikasi struktur, perilaku, dan arsitektur, tapi juga proses bisnis dan struktur data. (http://uml.org)

2.5.1 Use Case Diagram

Use ca se diagram merupakan pemodelan untuk kelakuan (beha vior ) sistem informasi yang akan dibuat. Use case mendeskripsikan sebuah interaksi antara satu atau lebih aktor dengan sistem informasi yang akan dibuat.

Ada dua hal utama pada use ca se yaitu pendefinisian apa yang disebut aktor dan use case.

1. Aktor merupakan orang, proses, atau sistem lain yang berinteraksi dengan

sistem informasi yang akan dibuat di luar sistem informasi yang akan dibuat itu sendiri, jadi walaupun simbol dari aktor adalah gambar orang, tapi aktor belum tentu merupakan orang.

2. Use ca se merupakan fungsionalitas yang disediakan sistem sebagai

unit-unit yang saling bertukar pesan antarunit-unit atau aktor.

Berikut adalah simbol-simbol yang ada pada diagram use case :

Tabel 2.1 Simbol Use Case

Simbol Nama Keterangan

Nama Aktor

Aktor/Aktor Orang, proses atau sistem lain yang

berinteraksi dengan sistem informasi yang akan dibuat di luar sistem informasi yang akan dibuat itu sendiri, jadi walaupun simbol dari aktor adalah gambar orang, tapi aktor belum tentu merupakan orang; biasanya dinyatakan menggunakan kata benda di awal frase nama aktor.

Use Case Fungsional yang disediakan sistem

sebagai unit-unit yang saling


(25)

commit to user

bertukar pesan antarunit atau aktor; biasanya dinyatakan dengan menggunakan kata kerja di awal frases nama use ca se.

Asosiasi / a ssocia tion

Komunikasi antara aktor dan use ca se atau use case memiliki interaksi dengan aktor.

<< extend >>

Ekstensi / extend Relasi use ca se tambahan ke sebuah use case dimana use case yang ditambahkan dapat berdiri sendiri walau tanpa use case tambahan itu; mirip dengan prinsip inheritance pada pemrograman berorientasi objek; biasanya use ca se tambahan memiliki nama depan yang sama denga use ca se yang ditambahkan. Generalisasi /

genera liza tion

Hubungan generalisasi dn

spesifikasi (umum -khusus) antara dua buah use case dimana fungsi yang satu adalah fungsi yang lebih umum dari lainnya.

<< include >>

Include Relasi use ca se tambahan ke sebuah

use case dimana use case yang ditambahkan memerlukan use ca se ini untuk menjalankan fungsinya atau sebagai syarat dijalankan use ca se ini.

2.5.2 Activity Diagram

Diagram aktivitas atau a ctivity dia gra m menggambarkan workflow atau aktivitas dari sebuah sistem atau proses bisnis. Yang perlu diperhatikan disini bahwa diagram aktivitas menggambarkan aktivitas


(26)

commit to user

sistem bukan apa yang dilakukan actor, jadi aktivitas yang dapat dilakukan sistem.

Diagram aktivitas juga banyak digunakan untuk mendefinisikan hal-hal berikut:

1. Rancangan proses bisnis dimana setiap urutan aktivitas yang

digambarkan merupakan proses bisnis sistem yang didefinisikan.

2. Urutan atau pengelompokkan tampilan dari sistem/user interface

dimana setiap aktivitas dianggap memiliki sebuah rancangan antarmuka tampilan

3. Rancangan pengujian dimana setiap aktivitas dianggap memerlukan

sebuah pengujian yang perlu didefinisikan kasus ujinya. Berikut simbol-simbol yang ada pada diagram aktivitas :

Tabel 2.2 Simbol Activity Diagram

Simbol Nama Keterangan

Status Awal Status awal aktivitas sistem,

sebuah diagram aktivitas memiliki sebuah status awal

Aktivitas Aktivitas yang dilakukan

system, aktivitas biasanya diawali dengan kata kerja Percabangan /

decision

Asosiasi percabangan dimana jika ada pilihan aktivitas lebih dari satu

Penggabungan / join

Asosiasi penggabungan dimana lebih dari satu aktivitas digabungkan menjadi satu

Status akhir Status ahir aktivitas sistem,

sebuah diagram aktivitas memiliki sebuah status akhir Aktivitas


(27)

commit to user

2.5.3 Class Diagram

Cla ss dia gra m atau diagram kelas merupakan suatu diagram yang

menggambarkan struktur sistem dari segi pendefinisian kelas-kelas yang akan dibuat untuk membangun sistem. Kelas meiliki apa yang disebut atribut dan metode atau operasi.

1. Atribut merupakan variable-variabel yang dimiliki oleh suatu kelas.

2. Operasi atau metode adalah fungsi-fungsi yang dimiliki oleh suatu

kelas.

Tabel 2.3 Simbol Class Diagram

Simbol Nama Keterangan

Kelas Merupakan kelas pada struktur

sistem yang terdiri dari atribut dan method.

Antarmuka / interfa ce

Sama dengan konsep interfa ce dalam pemrograman

berorientasi objek Asosiasi /

a ssocia tion

Relasi antar kelas dengan makna umum, asosiasi biasanya juga disertai dengan multiplicity.

Asosiasi berarah / directed a ssocia tion

Relasi antar kelas dengan makna kelas yang satu digunakan oleh kelas yang lain, asosiasi biasanya juga disertai dengan multiplicity. Generalisasi /

genera liza tion

Relasi antar kelas dengan makna generalisasi-spesialisasi (umum-khusus)

Kebergantungan / Dependency

Relasi antar kelas dengan makna kebergantungan antar kelas


(28)

commit to user

aggregation makna semua-bagian

(whole-part)

2.5.4 Sequence Diagram

Diagram sekuen menggambarkan kelakuan objek pada use ca se dengan mendeskripsikan waktu hidup objek dan messa ge yang dikirimkan dan diterima antar objek. Oleh karena itu untuk menggambarkan diagram sekuen maka harus diketahui objek-objek yang terlibat dalam sebuah use

ca se beserta metode-metode yang dimiliki kelas yang diinstansiasi menjadi

objek itu.

Banyaknya diagram sekuen yang harus digambar adalah sebanyak pendefinisian use case yang memiliki proses sendiri atau yang penting semua use case yang telah didefinisikan interaksi jalannya pesan sudah dicakup pada diagram sekuen sehingga semakin banyak use case yang didefinisikan maka diagram sekuen yang harus dibuat juga semakin banyak.

Berikut adalah simbol-simbol yang ada pada diagram sekuen :

Tabel 2.4 Simbol Sequence Diagram

Simbol Nama Keterangan

Nama Aktor

Aktor/Aktor Orang, proses atau sistem lain

yang berinteraksi dengan sistem informasi yang akan dibuat di luar sistem informasi yang akan dibuat itu sendiri, jadi walaupun simbol dari aktor adalah gambar orang, tapi aktor belum tentu merupakan orang; biasanya dinyatakan menggunakan kata benda di awal frase nama aktor Garis hidup /

lifeline

Menyatakan kehidupan suatu objek


(29)

commit to user

Objek Menyatakan objek yang

berinteraksi pesan

Waktu aktif Menyatakan objek dalam

keadaan aktif dan berinteraksi pesan

<<create>>

Pesan tipe create Menyatakan suatu objek membuat objek lain, arah panah mengarah pada objek yang dibuat

1: nama method()

Pesan tipe ca ll Menyatakan suatu objek

memanggil operasi/metode yang ada pada objek yang dibuat

1: masukkan

Pesan tipe send Menyatakan bahwa suatu

objek mengirimkan data masukkan/informasi ke objek lainnya, arah panah mengarah ke objek yang dikirim

1: keluaran

Pesan tipe return Menyatakan bahwa suatu objek yang telah menjalankan suatu operasi yang

menghasilkan suatu kembalian ke objek tertentu, arah panah mengarah pada objek yang menerima kembalian

X Pesan tipe

destroy

Menyatakan akhir hidup suatu objek


(30)

commit to user

2.6 MySQL

MySQL database merupakan data ba se open source dengan performa yang tinggi, realibilitas yang tinggi dan mudah dalam penggunaan. Itu juga merupakan database pilihan untuk generasi baru dari aplikasi yang dibangun pada LAMP (Linux, Apache, MySQL, PHP / Perl / Python.) (sumber : http://mysql.com)

Pada dasarnya, bahasa query SQL secara garis besar dabat dibagi menjadi tiga bagian :

a) DDL (Da ta Definition La ngua ge)

DDL adalah bahasa-bahasa SQL yang digunakan untuk membuat, memanipulasi atau menghapus schema yang ada di dalam data base.

b) DML (Da ta Ma nipula tion La ngua ge)

DML adalah bahasa-bahasa SQL yang digunakan untuk memanipulasi data di dalam data base.

c) DCL (Da ta Control La ngua ge)

DCL adalah bahsa-bahasa SQL yang digunakan untuk mengatur user MySQL.

2.7 CSS

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 bahakan penampilan file gambar.

CSS dikembangkan oleh W3C, organisasi yang mengembangkan teknologi internet. Tujuannya tak lain untuk mempermudah proses penataan web. Perlu diinga, CSS hanyalah berupa kumpulan script yang tujuannya bukan untuk mengantikan HTML, melainkan pelengkap agar dokumen HTML bisa tampil lebih cantik dan dinamis.

Untuk penggunaan CSS pada mobile device, ada beberapa konfigurasi tambahan agar halaman bisa menyesuaikan lebar device. Hal-hal yang ditambahkan yaitu sebagai berikut :


(31)

commit to user

a. Viewport

<metaname="viewport" content="width=device-width, initial-scale=1.0,

maximum-scale=2.0, user-scalable=yes" />

1) Width

Kebanyakan browser di ponsel akan menampilkan gambaran seluruh halaman jika tidak disertakan perintah lebar di bidang konten. Tapi agar lebih baik dan lebih dekat sampai melihat halaman web Anda, Anda perlu mengatur viewport dengan lebar perangkat. Karena saat ini perangkat mobile memiliki lebar yang berbeda-beda. Cukup: lebar = perangkat-lebar.

2) Initial-scale

Secara umum, nilai initial-scale bernilai 1. Ini adalah zoom in / zoom outskala. Pada 1, ukuran font akan menjadi yang paling pas untuk pengguna. Namun jika 2, akan terlihat halaman diperbesar terlalu dekat.

3) Maximun-scale

Pengaturan ini membatasi seberapa jauh sebuah halaman dapat diperbesar masuk saya telah menemukan bahwa membiarkan zoom pengguna dalam minimal 2 kali yang baik kalau-kalau ada sesuatu seperti formulir isian dan mereka salah eja kata dan ingin menempatkan kursor dalam tempat tertentu mengetik ulang.

4) User-scalable

Awalnya nilai untuk user-scalable 0 dan 1 tetapi saat ini lebih

efektif menggunakan yes or no. Juga beberapa website

merekomendasikan memisahkan pilihan dengan semi-colon;, tetapi untuk kompatibilitas dengan perangkat yang paling Anda harus menggunakan koma.

b. Stylesheet

<link me dia="Sc reen" href="style s.c ss" type="te xt/ c ss" re l="style she e t" / >


(32)

commit to user

Diikuti dengan

<link me dia="hand held , o nly sc re e n and (max-width: 480p x), o nly sc re e n a nd (ma x-d evic e -width: 480p x)" href="mo bile .c ss" type ="text/ c ss"

re l="style she e t" / >

Diikuti juga dengan

<!- - [if IEMobile]>

<link re l="style she e t" type="te xt/ c ss" hre f="mo bile .c ss" me dia="sc re e n" / > <![endif]- - >

Baris pertama di atas adalah untuk memuat stylesheet default untuk browser desktop. Sayangnya tanpa melompat melalui banyak rintangan, browser mobile juga akan memuat stylesheet ini seperti yang ditunjukkan pada baris 1 di atas. Jadi kedua stylesheet diload pada mobile tetapi stylesheet untuk browser desktop ditimpa dengan beberapa pengaturan di styles.css sehingga lebar, mengapung dan menu terlihat semua diformat dengan benar untuk perangkat mobile.

1) Handheld

Digunakan untuk meload stylesheet pada handphone lawas.

2) only screen and (max-device-width: 480px)

max-device-width digunakan untuk membatasi nilai lebar perangkat maksimal untuk stylesheet yang digunakan.

2.8XHTML-MP (Mobile Profile)

XHTML-MP adalah bahasa markup yang didefinisikan dalam WAP 2.0. Tujuan pembangunan XHTML-MP adalah menggabungkan teknologi mobile browsing dan WWW. XHTML-MP merupakan superset dari XHTML Basic, yang dibuat lebih sederhana dari XHTML 1.0 (versi XML dari HTML 4.0). XHTML Basic dibangun untuk device yang lebih kecil dan non computer, seperti mobile phone, PDA, pager, dan sejenisnya. (sumber: http://openmobilealliance.org)


(33)

commit to user

Gambar 2.1. Alur Teknologi WAP

Gambar 2.2. Alur Halaman Web WAP Berikut merupakan modul-modul dalam XHTML-MP:

Tabel 2.5. Modul XHTML-MP yang digunakan

Module Element

Structure Body,head,html,title

Text H1,h2,h3,h4,h5,h6,span,strong,div

Hypertext a

list Li,ul,ol

presentation small,i,b

form Button,fieldset,form,input,label,legend,select,option,t

extarea

table Table,tr,td,tr

image img


(34)

commit to user

MIME

Standar MIME dan DOCTYPE-nya dapat dilihat pada tabel di bawah ini: Tabel 2.6. Tabel MIME dan DOCTYPE

Standard Preferred MIME type

DOCTYPE

XHTML MP 1.2 (last version)

Application/ Vnd.wap.xhtml+xml

<!DOCTYPE html PUBLIC “-//WAPFORUM//DTD XHTML

Mobile 1.2//EN”

“http://www.openmobilealliances.org/texh/DTD/xhtml-mobile12.dtd”>

XHTML 1.0

Application/ xhtml+xml

<!DOCTYPE html PUBLIC “-//W3C//DTD XHTML 1.0 Transitional//EN”

“http://www.w3.org/TR/xhtml1/DTD/xhtml-trnsitional.dtd”> HTML 4.0 Text/html <!DOCTYPE html PUBLIC “-//W3C//DTD HTML 4.01

Transitional/./EN” “http://www.w3.org/TR/html4/loose.dtd”> HTML 5.0 Text/html <!DOCTYPE html>

XHTML-MP Syntax Rules

XHTML menggunakan aturan syntax yang sama dengan XML. Berikut beberapa aturan yang harus diperhatikan dalam XML maupun XHTML:

· Case sensitive untuk semua nama elemen, tags, dan attribute. Untuk XHTML-MP menggunakan huruf kecil (lower case)

- Tag harus ditutup dengan benar

- Nilai attribute (value) harus berada diantara “ atau ‘

- Tags harus disarangkan dengan benar. Contoh : <p><i>text</i></p>

- Empty tags harus dalam kondisi “self closing”, contoh: <br/>

Perlu pendefinisian doctype agar dapat dideteksi oleh browser. Pendefinisian ini diletakkan sebelum tag hea d.

<?xml version="1.0"?>

<!DOCTYPE html PUBLIC "-//WAPFORUM//DTD XHTML Mobile 1.0//EN" "http://www.wapforum.org/DTD/xhtml-mobile10.dtd">


(35)

commit to user

19 BAB III

ANALISIS DAN PERANCANGAN SISTEM

3.1 Analisa Kebutuhan Sistem

3.1.1 Analisis Kebutuhan Software

1. Softwa re yang digunakan untuk membuat aplikasi m-commerce ini

sebagai berikut :

a. XAMPP versi 1.7.3 (MySQL versi 3.2.4, PHP versi 5.3.1)

b. Opera Mobile Emulator

c. Notepad++

d. Sistem Operasi Windows 7

e. Browser (Google Chrome, Mozilla)

f. Opera Mobile Emulator

2. Softwa re yang digunakan untuk menjalankan aplikasi m-commerce ini

pada klien yaitu mobile browser.

3.2 Perancangan Sistem

Pengembangan aplikasi berorientasi objek memerlukan beberapa tahapan analisa yang harus dilalui, pada tahap ini dilakukan pemodelan menggunakan UML. Untuk menggunakan UML ada beberapa hal yang dilakukan yaitu membuat Activity Dia gra m, Use Ca se Dia gra m, Cla ss Diag ram dan Sequence Dia gra m.

3.2.1SRS

Kebutuhan fungsional merupakan kebutuhan – kebutuhan yang

berhubungan dengan proses bisnis dari sistem yang dibuat. Dari analisa yang dilakukan, berikut tabel kebutuhan Fungsional untuk tiap aktor :

Tabel 3.1. SRS Fungsional Customer

Kode Deskripsi Kebutuhan Fungsional

SRS-MFP01 Customer mendaftar account


(36)

commit to user

SRS-MFP03 Customer melihat katalog produk

SRS-MFP04 Customer mengelola keranjang belanja

SRS-MFP05 Customer mengelola data account

SRS-MFP06 Customer melihat pesanan

SRS-MFP07 Customer memberi testimonial

Tabel 3.2. SRS Fungsional Administrator

Kode Dekripsi Kebutuhan Fungsional

SRS-MFA01 Admin Login/Logout

SRS-MFA02 Admin mengelola data produk

SRS-MFA03 Admin mengelola data pesanan

SRS-MFA04 Admin mengelola biaya pengiriman

SRS-MFA05 Admin mengelola pesanan

SRS-MFA06 Admin mengelola data member/user

SRS-MFA07 Admin mengelola berita

SRS-MFA08 Admin mengelola pengiriman

Tabel 3.3. SRS Fungsional Manajer

Kode Deskripsi Kebutuhan Fungsional

SRS-MFM01 Manajer Login/Logout SRS-MFM02 Manajer mengelola account

SRS-MFM03 Manajer melihat laporan produk best seller SRS-MFM04 Manajer melihat laporan transaksi per bulan

SRS-MFM06

Manajer melihat laporan pesanan berdasarkan status per bulan

SRS-MFM07 Manajer melihat laporan penjualan per kategori

Kebutuhan non fungsional berhubungan dengan interaksi antar user dengan aplikasi yang dibuat. Dari hasil analisa yang dilakukan, berikut daftar kebutuhan non-fungsional dalam sistem yang dibuat.


(37)

commit to user

Tabel 3.4. SRS Non Fungsional

Kode Deskripsi Kebutuhan Non-fungsional

SRS-MNF01 Tampilan user-friendly (jelas, informatif dan menarik)

SRS-MNF02 Ukuran gambar produk menyesuaikan ukuran layar perangkat

SRS-MNF03 Report/Laporan dalam grafik

3.2.2Acitivity Diagram

Activity Diagram digunakan untuk menjabarkan kegiatan dalam sistem, yang kemudian menjadi acuan kebutuhan sistem (Use Case) dan alur sistem (Sequence Diagram). Berikut daftar Activity Diagram dalam sistem ini :

3.2.2.1Activity Diagram Login

Gambar 3.1. Activity Diagram Login

Penjelasan :

Berikut alur login dari

user. Sistem akan

menampilkan Login Form

kemudian User mengisi.

Sistem mengirim data

tersebut untuk dicocokkan pada database. Jika data cocok, diarahkan ke halaman

account. Jika tidak,

dikembalikan ke Login

Form. Fill Form

View Login Form

Show Account Page Validasi

invalid


(38)

commit to user

3.2.2.2Activity Diagram Register

Gambar 3.2. Activity Diagram Register

Penjelasan :

User mengisi form

registrasi yang ditampilkan. Form divalidasi, jika benar ditampilkan pesan sukses, jika salah ditampilkan pesan error.

3.2.2.3Activity Diagram Insert Data

Gambar 3.3. Activity Diagram Insert

Penjelasan :

User mengisi form penambahan data yang ditampilkan. Form

divalidasi, jika benar

ditampilkan pesan sukses, jika salah ditampilkan pesan error. Choos e

Register Menu

Fill Form View Register

Form

View Suc cess Registration Info

Show Error Validation Validasi

invalid

valid

View List

View Insert Form

Input Dat a on Form Validasi

View Succ ess Insert


(39)

commit to user

3.2.2.4Activity Diagram Update Data

Gambar 3.4. Activity Diagram Update Data

Penjelasan :

User mengisi form

pembaruan data yang

ditampilkan. Form

divalidasi, jika benar

ditampilkan pesan sukses, jika salah ditampilkan pesan error.

3.2.2.5Activity Diagram Delete Data

Gambar 3.5. Activity Diagram Delete Data

Penjelasan :

User mengisi form penghapusan data yang ditampilkan. Form divalidasi, jika benar ditampilkan

pesan sukses, jika salah

ditampilkan pesan error. V i e w L is t

V ie w U p d a t e F o r m In p u t D a t a o n

F o r m V a l id a s i

V i e w S u c c e s s U p d a t e V ie w D e t a il

In fo r m a ti o n

Admin

View List

View Confirmation Delete

View Success Update Choose To Delete

Data deleted no

yes


(40)

commit to user

3.2.2.6Activity Diagram Order (Pembelian)

Gambar 3.6. Activity Diagram Order (Pembelian) Penjelasan :

User melihat produk dan menambahkan ke keranjang jika berminat. Jika selesai menambahkan ke keranjang, user checkout lalu muncul total bayar. User membayar pesanan di luar sistem dan konfirmasi di luar sistem. Admin kemudian mengganti status pesanan hingga pengiriman. Jika user sudah menerima pesanan, user mengganti status pesanan menjadi Diterima. Manajer mendapat laporan.

Browse Product Buy Product

Input Information Get Total

Payment

Show Order

Receive Order Login

Already Login

Get Order Data

Check Us er Payment (Manually)

Cancel Order No Paid? Process Order

Send Order

Get Report No

Yes

M an a g e r A d m i n


(41)

commit to user

3.2.3Use CaseDiagram

3.2.3.1Definisi Aktor

Dalam sistem terdapat 3 aktor yaitu admin, customer, manajer dengan satu aktor generalisasi ketiganya yaitu user. Berikut deskripsinya:

Tabel 3.5. Definisi Aktor

No Aktor Deskripsi

1 User Melakukan kegiatan umum yang dilakukan

oleh ketiga aktor lainnya, seperti melihat katalog produk, mendaftar sebagai pembeli, login/logout dan sebagainya.

2 Admin Melakukan kegiatan pengaturan sistem dan

transaksi penjualan. Contoh kegiatan transaksi CRUD untuk produk, pengaturan order, customer dan testimonial.

3 Customer Melakukan kegiatan pembelian produk, login

setelah mendaftar dan pengaturan account dan order history.

4 Manajer Melihat laporan penjualan untuk waktu tertentu.

3.2.3.2Diagram Use Case

Berikut diagram use case untuk aktor User :

Gambar 3.7. Use Ca se Diagra m User

Update Ac count

Manager

Admin Login

Manage Account <<include>>

View W eb Information Register

View Product Catalog Member

Logout

Search Product <<extend>> User

Logout


(42)

commit to user

Berikut diagram Use Case untuk aktor Customer :

Gambar 3.8. Use Ca se Diagra m Customer

Berikut diagram Use Case untuk aktor Manajer :

Gambar 3.9. Use Ca se Diagra m Mana jer

Update Shopping C Add to Shopping Cart

Cancel Order

View Shopping Cart

Checkout

<<extend>>

Choose Address

Choose Shipping Courier

View Order History <<extend>>

Give Testimonial

Buy Product

<<extend>>

<<include>>

Login <<include>>

Member

<<include>>

<<include>>

<<include>>

View Trans action Report View Testimonial Report Manager

Login

View Mont hly Report

View Daily Report <<ex tend>>


(43)

commit to user

Berikut diagram Use Case untuk aktor Admin :

Gambar 3.10. Use Case Dia gram Admin Update News Information

Update Payment Information

Update Contact Information Update Produc t

Update Courier

Update Destinat ion Area

Update Shipping Price Cancel Order

Delete Product

Change Order Stat us View Account User

View Product <<ex tend>>

<<extend>> Add Produc t

Update Information

<<extend>>

<<extend>> <<extend>>

Add Courier

Add Dest ination Area

View Courier View Order

<<ex tend>>

View Dest ination Area

VIew Shipping Price <<include>>

<<include>> Admin

<<extend>>

Delete Courier

Delet e Dest ination Area <<ex tend>>

<<ex tend>>

Delete Shipping Price <<ex tend>>

<<ex tend>> <<ex tend>>


(44)

commit to user

3.2.4 ClassDiagram Analysis

3.2.4.1Class Diagram Customer

Gambar 3.11. Class Diagram Analysis Customer

3.2.4.2Class Diagram Admin

Gambar 3.12. Class Diagram Analysis Admin

M a inW r a ppe r

Account

TM e m be r Login

Pr oduct

TPr oduct

Or de r

TOr de r

TOr de r De t a il Te st im onia l

TTe st im onia l

TShipping

Main Admin

Member

Product Control

ShippingControl

I nforma tion

Orde rControl

Te stimonialCont rol TAdmin

TMember

TTestimonial

TOrder TShipping

TOrde rDetail

TProduct TInformation

TDestination TCourier


(45)

commit to user

3.2.5Class Diagram Design

3.2.5.1Class Diagram Customer

Gambar 3.13. Class Diagram Design Customer

Berikut ini adalah tabel yang berisi deskripsi dari cla ss-cla ss yang ada pada aplikasi m-commer ce batik solo yang mana telah digambarkan pada class diagram di atas.

M ainWrapp er

< <boundary >> -uiRegister () -uiLogin() -uiManajemenA ccount( ) -uiTest imonial() -uiProduk () -uiCart () -uiCheckout () -uiOrder( ) Account

< <c ontrol> > -ViewAccount ($id_member : Integer) -Updat eAccount($id_member: I nteger ) -c ek_login( email: String, password: St ring): Boolean -logout( )

TM em ber

< <ent it y> > -idMember : Int eger

-TanggalLahir : Dat e -J enisKelamin: String -TanggalDaf tar: Date -Email: St ring -Pas sword: Str ing -get Member( $id_member : Integer)

-s etMember ($id_member: I nteger, $tgl_lhr : Date, $jk: St ring, $tgl_dftr : Dat e, $email: String, $pass : St ring) -get AllMember()

Test im onial

< <cont rol>> -A ddTestimonial($id_member: Int eger ) -ViewTest imonial($id_member: Integer)

TTest imonial

< <ent ity > > -id_tes timonial: Integer

-t gl_testimonial: date -id_member: Int eger -isi_t est imonial: Str ing -s tat us: String

-s etTest imonial( $id_t est i: Integer, $id_member : I nt eger, $t gl_testi: Date, $isi_t est i: Str ing) -get Testimonial( $id_member: Int eger )

Order

< <cont rol>> -A ddtoCar t($id_pr oduk: Int eger , $jml: Integer) -Updat eCart( $id_produk: Integer) -Check out()

-ongkir ($ber at: Integer , $tar if : I nt eger) : Integer -addOrder ()

-c ancelOrder ($id_order : String) -ViewOr derHistory ($id_member: Int eger )

TOrder

< <ent ity > > -idOrder: St ring

-TanggalPesan: Date -Status: Integer -id_member: Int eger -Ongkir : Integer -Kur ir : Str ing -alamat: Str ing

-get MemberOrder ($id_member: I nt eger)

-s etOrder ($id_member: Int eger, $id_order : Integer , $tgl_pesan: Date, $stat us: Integer, $ongkir: I nteger, $alamat : St ring, $kur ir: Str ing) -get Or der( $idOrder: Str ing)

-s etOrder St atus($idOrder : String, $st atus: Integer) -get AllOrder ()

TOrderDet ail

< <ent ity > > -I dOrder: Integer

-idProduk: Integer -J umlah: Integer -Har ga: I nteger -Ber at: Integer

-s etOrder Det ail($idProduk: Integer , $idOrder : Integer , $jml: I nteger , $hr ga: Integer, $br t: I nteger ) -get Or derDet ail( $idOrder: I nt eger)

Product

< <cont rol>> -ViewAllCategor i() -ViewProductByI D($id_pr oduk: I nteger ) -ViewProductByCategory( $id_kat egor i: Int eger)

TPro duct

< <ent ity > > -idProduk: Integer -NamaProduk: String -Har ga: I nteger -Stok: Integer -Ber at: Integer -GambarProduk: St ring -I d_Kategori: I nteger -get Categor y () -get Pr odukBy ID($id_pr oduk: I nt eger) -get AllProdukBy Categor y( $id_kategori: I nt eger) -get AllProduk()

-get Gambar perProduk( $idProduk : I nt eger)

-s etGambarProduk ($idProduk: I nteger , $gbr : String, $id_gbr : Int eger)

TShipping

< <ent it y> > -idShipping: Integer

-idKota: I nteger -idKurir: I nteger -Tar if _kg: Int eger

-get Tarif($idKot a: Int eger , $idKurir : Integer) -get AllShipping()

-get Shipping( $idShipping: Int eger)


(46)

commit to user

1. Class B oun dary MainWrapper

Merupakan kelas yang menangani interfa ce/tampilan untuk Customer. Tabel 3.6. Tabel Deskripsi Cla ss Bounda ry Ma inWrapper

Atribut

Nama Atribut Visibility Type

- - -

Method

Nama Method Fungsi

uiRegister () Digunakan untuk memanggil interface form

registrasi.

uiLogin () Digunakan untuk memanggil interface form

Login Customer.

uiManajemenAccount () Digunakan untuk memanggil interface manajemen account customer yang login.

uiTestimonial() Digunakan untuk memanggil interface

testimonial

uiProduk() Digunakan untuk memanggil interface

produk

uiCart() Digunakan untuk memanggil interface

keranjang

uiCheckout() Digunakan untuk memanggil interface

checkout dari keranjang

uiOrder Digunakan untuk memanggil interface

daftar pesanan sebelumnya.

2. ClassControl Accou nt

Merupakan kelas control yang digunakan untuk mengontrol proses pengelolaan account member pada sisi user, yang menghubungkan kelas boundary MainWrapper dengan kelas entity TMember.


(47)

commit to user

Tabel 3.7. Tabel Deskripsi Cla ss Control Account

Atribut

Nama Atribut Visibility Type

- - -

Method

Nama Method Fungsi

register() Digunakan untuk menambahkan

data anggota baru pada database

ViewAccount($id_member) Digunakan untuk mengambil

informasi account berdasarkan id user yang login

UpdateAccount($id_member) Digunakan untuk memperbarui data

user pada database berdasarkan id user yang login

Cek_login ($email, $password) Digunakan untuk mengecek

username dan password pada

database untuk mengakses halaman account

Logout() Menghapus session yang digunakan

untuk login

3. ClassE ntity TMember

Merupakan kelas entity yang berisi data dari tabel member Tabel 3.8. Tabel Deskripsi Cla ss Entity TMember

Atribut

Nama Atribut Visibilty Type

Id_member Private Integer

TanggalLahir Private Date

JenisKelamin Private String

TanggalDaftar Private Date

Email Private String


(48)

commit to user

Method

Nama Method Fungsi

setMember($id_member,

$tgl_lhr, $jk, $tgl_dftr,

$email, $pass)

Digunakan untuk menyimpan data member dalam database

getMember($id_member) Digunakan untuk mengambil data

member berdasarkan id member

4. Class Control Testimonial

Merupakan kelas control yang digunakan untuk mengelola testimonial pada member pada sisi user, yang menghubungkan kelas boundary MainWrapper dengan kelas entity TTestimonial.

Tabel 3.9. Tabel Deskripsi Cla ss Control Testimonia l

Atribut

Nama Atribut Visibilty Type

- - -

Method

Nama Method Fungsi

AddTestimonial($id_member) Digunakan untuk menambahkan

testimonial berdasarkan id user yang login

ViewTestimonial($id_member) Digunakan untuk menampilkan

testimonial berdasarkan id user yang login

5. Class En tity TTestimonial

Merupakan kelas entity yang berisi data dari tabel testimonial Tabel 3.10. Tabel Deskripsi Cla ss Entity TTestimonial

Atribut

Nama Atribut Visibilty Type


(49)

commit to user

Tgl_Testimonial Private Date

Id_Member Private Integer

Isi_Testimonial Private String

status Private String

Method

Nama Method Fungsi

setTestimonial($id_testi, $tgl_testi, $id_member, $isi)

Digunakan untuk menyimpan data testimonial dalam database

getTestimonial($id_member) Digunakan untuk mengambil data testimonial berdasarkan id member

6. Class Control P roduct

Merupakan kelas control yang digunakan untuk menampilkan daftar produk pada sisi user, yang menghubungkan kelas boundar y MainWrapper dengan kelas entity TProduct.

Tabel 3.11. Tabel Deskripsi Cla ss Control Product

Atribut

Nama Atribut Visibilty Type

- - -

Method

Nama Method Fungsi

ViewAllCategory() Digunakan untuk menampilkan

keseluruhan data kategori

ViewProductByID($id_produk) Digunakan untuk menampilkan

informasi spesifik produk ViewProductByCategory

($id_kategori)

Digunakan untuk menampilkan

produk per kategori

7. Class En tity TProdu ct


(50)

commit to user

Tabel 3.12. Tabel Deskripsi Cla ss Entity TProduct

Atribut

Nama Atribut Visibilty Type

Id_Produk Private Integer

NamaProduk Private String

Harga Private Integer

Stok Private Integer

Berat Private Integer

GambarProduk Private String

Id_Kategori Private Integer

Method

Nama Method Fungsi

getCategory() Digunakan untuk mengambil semua

data kategori dari database

getProdukByID($id_produk) Digunakan untuk mengambil informasi

produk berdasarkan id produk getAllProdukByCategory

($id_kategori)

Digunakan untuk mengambil data produk per kategori

8. Class Control Order

Merupakan kelas control yang digunakan untuk mengontrol proses pemesanan produk pada sisi user, yang menghubungkan kelas boundary MainWrapper dengan kelas entity TOrder, TOrderDetail dan TShipping.

Tabel 3.13. Tabel Deskripsi Cla ss Control Order

Atribut

Nama Atribut Visibilty Type

- - -

Method

Nama Method Fungsi

AddtoCart($id_produk, $jml) Digunakan untuk menambahkan

produk ke keranjang


(51)

commit to user

keranjang

Checkout() Digunakan untuk menampilkan

halaman checkout. Terdapat

pengecekan apakah user telah login atau belum

ongkir($berat, $tarif): Integer Untuk menghitung total ongkos

kirim dan mengembalikan nilai bertipe integer

addOrder() Digunakan untuk menambahkan

pesanan dari form yang diisi user

cancelOrder($id_order) Digunakan untuk membatalkan

pesanan berdasarkan id pesanan

ViewOrderHistory($id_member) Digunakan untuk mengambil

history pemesanan berdasarkan id

user yang login

9. Class En tity TOrder

Merupakan kelas entity yang berisi data dari tabel order Tabel 3.14. Tabel Deskripsi Cla ss Entity TOrder

Atribut

Nama Atribut Visibilty Type

Id_Order Private String

TanggalPesan Private Date

Status Private Integer

Id_Member Private Integer

Ongkir Private Integer

Kurir Private String

Alamat Private String

Method

Nama Method Fungsi

setOrder($id_order, $tgl_psn, $stat, $ id_member ,$ongkir,

Digunakan untuk menyimpan data pesanan dalam database


(52)

commit to user

$kurir, $alamat)

getOrder($id_member) Digunakan untuk mengambil data

pesanan berdasarkan id member

10.Class En tity TOrderDetail

Merupakan kelas entity yang berisi data dari tabel detail_pesanan. Tabel 3.15. Tabel Deskripsi Cla ss Entity TOrderDeta il

Atribut

Nama Atribut Visibilty Type

IdOrder Private Integer

IdProduk Private Integer

Jumlah Private Integer

Harga Private Integer

Berat Private Integer

Method

Nama Method Fungsi

setOrderDetail($idProduk, $idOrder, $jml, $hrga, $brt)

Digunakan untuk menambahkan data

pesanan detail dengan idOrder

tergantung pada Entity TOrder

getOrderDetail($idOrder) Digunakan untuk mengambil data

pesanan detail berdasarkan idOrder

11.Class En tity TShipping

Merupakan kelas entity yang berisi data dari tabel tarif pengiriman Tabel 3.16. Tabel Deskripsi Cla ss Entity TShipping

Atribut

Nama Atribut Visibilty Type

IdShipping Private Integer

IdKota Private Integer

IdKurir Private Integer

Tarif_k Private Integer

Method


(53)

commit to user

getTarif($idKota,$idKurir) Digunakan untuk mengambil data

shipping berdasarkan id kota dan id kurir

3.2.5.2Class Diagram Admin

Gambar 3.14. Class Diagram Design Admin

Main

< <boundary > > -uiManajemenPr oduct() -uiManajemenShipping() -uiManajemenMember () -uiManajemenInfor mation() -uiLogin( ) -uiManajemenAdmin( ) -uiManajemenTest imonial() -uiManajemenOr der() -uiManajemenDestination() Admin

< <cont rol> >

-cek_login($user name: St ring, $pas sword: String, $level: String) : Boolean -logout ()

-updateAdmin($id_user: Integer )

Member

< <cont rol>> -ViewAllMember () -ViewMemberByI D($id_member: Int eger)

ProductContr ol

< <cont rol>> -ViewAllProduct () -ViewPr oduct ByI D($idProduk: Int eger) -UpdateProduct( $idProduk : Integer ) -AddProduct () -DeletePr oduct ($idPr oduk: I nt eger) -AddGambar Produk($idProduk : I nteger ) -DeleteGambar Produk($idGambar : Int eger)

ShippingControl

< <cont rol>> -AddShipping() -ViewShipping() -UpdateShipping($idShipping: Int eger) -DeleteShipping($idShipping: I nteger) -AddDestinat ion() -UpdateDestination($idKot a: I nteger) -DeleteDestinat ion($idKota: Integer ) -AddCour ier () -UpdateCourier ($idKurir: Integer) -DeleteCour ier( $idKurir: Integer )

I nformation

<< control> > -UpdateInfor mation($jenis_info: Str ing) -ViewInformation( $jenis_inf o: St ring)

OrderControl

< <cont rol> > -ViewAllOr der() -UpdateOrder($idOrder : Integer ) -ViewOrderBy ID($idOrder: Int eger) -CancelOrder($idOrder: Integer ) -ongkir( $berat: I nt eger, $tar if : I nteger) : Integer

TestimonialControl

< <cont rol>> -ViewAllTest imonial( ) -v er ifikasi($idTesti: Integer ) -ViewTestimonialBy ID( $idTest i: Integer)

TAdmin

< <ent ity > > -id_user : Int eger -user name: Str ing -password: String -level_user: String

-setAdmin($username: String, $pass: Str ing, $lev el: Str ing) -get Admin()

TMember

<< entity> > -idMember: Integer

-TanggalLahir : Dat e -JenisKelamin: String -TanggalDaft ar: Date -Email: Str ing -Password: String -get Member ($id_member : Int eger)

-setMember($id_member: I nteger, $tgl_lhr: Date, $jk: Str ing, $t gl_df tr: Dat e, $email: Str ing, $pass: St ring) -get AllMember()

TProduct

<< entity> > -idPr oduk: Integer -NamaProduk: String -Harga: Integer -Stok : I nt eger -Berat: Int eger -GambarPr oduk: St ring -I d_Kat egori: Integer -getCategory () -getProdukBy ID( $id_produk: I nteger) -getA llPr odukBy Categor y($id_kat egori: Integer ) -getA llPr oduk()

-getGambarperProduk ($idPr oduk: Integer)

-set GambarProduk ($idPr oduk: Int eger, $gbr: String, $id_gbr: Integer)

TOr derDetail

< <ent ity > > -I dOrder: Int eger

-idPr oduk: Int eger -Jumlah: I nt eger -Harga: Integer -Ber at: Int eger

-setOrderDetail($idProduk: Int eger , $idOr der: I nteger, $jml: Integer , $hrga: I nteger, $br t: Integer ) -get Or der Det ail($idOrder: I nteger)

TTestimonial

< <ent ity >> -id_t est imonial: I nteger

-t gl_tes timonial: date -id_member: Int eger -isi_testimonial: Str ing -st atus: St ring

-set Testimonial($id_t est i: Integer, $id_member : I nteger , $tgl_t est i: Dat e, $isi_testi: St ring) -get Tes timonial( $id_member : I nt eger)

TI nformation

< <entity> > -jenis_info: St ring -isi_infor masi: St ring -gambar: String

-set Inf ormation( $jenis: String, $isi: St ring, $gbr: String) -getI nf ormat ion($jenis: Str ing)

TShipping

< <ent ity >> -idShipping: I nteger

-idKota: Integer -idKurir : Integer -Tar if_kg: Integer

-get Tarif( $idKota: Int eger , $idKurir : Integer ) -get AllShipping( )

-get Shipping($idShipping: Int eger )

-setShipping( $idShipping: Integer, $idKota: Integer, $idKurir : Integer , $Tar if: Integer)

TOr der

< <entity> > -idOrder: String

-TanggalPesan: Date -Status: I nteger -id_member: Int eger -Ongkir: I nteger -Kur ir: String -alamat : St ring

-get Member Order ($id_member: Integer)

-set Order( $id_member: I nteger, $id_order: Integer , $t gl_pesan: Dat e, $stat us: Integer, $ongkir: I nte ger, $alamat: String, $kurir: String) -get Order ($idOrder : Str ing)

-set OrderStatus($idOrder: St ring, $status: I nteger) -get AllOrder( )

TDestination

< <ent ity> > -idKota: Integer -kota: Str ing -provinsi: St ring

-setDestination( $idKota: Integer , $kot a: Str ing, $pr ov: St ring) -get Destinat ion()

TCourier

< <entity> > -nama_kurir: Str ing -gambar_logo: Str ing -idKurir: Integer

-s etCourier( $idKurir: Integer, $logo: St ring, $nama: St ring) -get Courier()


(54)

commit to user

1. Class Boundary Main

Merupakan kelas yang menangani interfa ce/tampilan untuk Admin. Tabel 3.17. Tabel Deskripsi Cla ss Bounda ry Ma in

Atribut

Nama Atribut Visibilty Type

- - -

Method

Nama Method Fungsi

uiManajemenProduct() Digunakan untuk memanggil interface

manajemen produk

uiManajemenShipping() Digunakan untuk memanggil interface

manajemen pengiriman

uiManajemenMember() Digunakan untuk memanggil interface

manajemen member

uiManajemenInformation() Digunakan untuk memanggil interface

manajemen informasi web

uiManajemenAdmin() Digunakan untuk memanggil interface

manajemen admin

uiManajemenTestimonial() Digunakan untuk memanggil interface

manajemen testimonial dari member

uiManajemenOrder() Digunakan untuk memanggil interface

manajemen pesanan

uiManajemenDestination Digunakan untuk memanggil interface

manajemen tujuan pengiriman

uiLogin() Digunakan untuk memanggil interface

login

2. Class Control Admin

Merupakan kelas control yang digunakan untuk menampilkan mengelola data admin, yang menghubungkan kelas bounda ry Main dengan kelas entity TAdmin.


(55)

commit to user

Tabel 3.20. Tabel Deskripsi Cla ss Control Admin

Atribut

Nama Atribut Visibilty Type

- - -

Method

Nama Method Fungsi

Cek_login($username, $pass,$level)

Untuk mengecek username, password dan level pada database apakah telah sesuai atau belum. Nilai kembalian boolean

Logout() Untuk menghapus session yang

digunakan untuk mengakses halaman admin

updateAdmin($id_user) Memperbarui data admin dengan

parameter id User

3. Class En tity TAdmin

Merupakan kelas entity yang berisi data dari tabel user. Tabel 3.21. Tabel Deskripsi Cla ss Entity TAdmin

Atribut

Nama Atribut Visibilty Type

Id_user Private Integer

Username Private String

Password Private String

Level_User Private String

Method

Nama Method Fungsi

setAdmin($username, $pass,

$level)

Digunakan untuk menyimpan data admin

getAdmin() Digunakan untuk memanggil data


(56)

commit to user

4. Class Control Member

Merupakan kelas control yang digunakan untuk menampilkan daftar member pada sisi admin, yang menghubungkan kelas boundar y Main dengan kelas entity TMember.

Tabel 3.22. Tabel Deskripsi Cla ss Control Member

Atribut

Nama Atribut Visibilty Type

- - -

Method

Nama Method Fungsi

ViewAllMember() Digunakan untuk menampilkan

seluruh data member

ViewMemberByID($id_member) Digunakan untuk menampilkan informasi per member

5. Class En tity TMember

Merupakan kelas entity yang berisi data dari tabel member Tabel 3.23. Tabel Deskripsi Cla ss Entity TMember

Atribut

Nama Atribut Visibilty Type

Id_member Private Integer

TanggalLahir Private Date

JenisKelamin Private String

TanggalDaftar Private Date

Email Private String

Password Private String

Method

Nama Method Fungsi

getMember($id_member) Digunakan untuk mengambil data

member dengan parameter id member

getAllMember() Digunakan untuk mengambil seluruh


(57)

commit to user

6. Class Control TestimonialControl

Merupakan kelas control yang digunakan untuk menampilkan daftar produk pada sisi user, yang menghubungkan kelas boundar y Main dengan kelas entity TTestimonial.

Tabel 3.24. Tabel Deskripsi Cla ss Control TestimonialControl

Atribut

Nama Atribut Visibilty Type

- - -

Method

Nama Method Fungsi

ViewAllTestimonial() Digunakan untuk menampilkan

seluruh data testimonial

Verifikasi(idTesti) Digunakan untuk memverifikasi

testimonial per id testimonial

ViewTestimonialByID($idTesti) Digunakan untuk menampilkan

testimonial dengan parameter id testimonial

7. Class En tity TTestimonial

Merupakan kelas entity yang berisi data dari tabel testimonial. Tabel 3.25. Tabel Deskripsi Cla ss Entity TTestimonial

Atribut

Nama Atribut Visibilty Type

- - -

Method

Nama Method Fungsi

AddTestimonial ($id_member)

Digunakan untuk menambahkan

testimonial berdasarkan id user yang login ViewTestimonial

($id_member)

Digunakan untuk menampilkan


(58)

commit to user

8. Class Control Information

Merupakan kelas control yang digunakan untuk mengelola data informasi web pada sisi admin, yang menghubungkan kelas boundar y Main dengan kelas entity TInformation.

Tabel 3.26. Tabel Deskripsi Cla ss Control Informa tion

Atribut

Nama Atribut Visibilty Type

- - -

Method

Nama Method Fungsi

AddTestimonial($id_member) Digunakan untuk menambahkan

testimonial berdasarkan id user yang login

ViewTestimonial($id_member) Digunakan untuk menampilkan

testimonial berdasarkan id user yang login

9. Class En tity TInformation

Merupakan kelas entity yang berisi data dari tabel info_web. Tabel 3.27. Tabel Deskripsi Cla ss Entity TInforma ion

Atribut

Nama Atribut Visibilty Type

Jenis_info Private String

Isi_informasi Private String

Gambar Private String

Method

Nama Method Fungsi

setInformation($jenis, $isi,

$gbr)

Digunakan untuk menyimpan data informasi ke database

getInformation($jenis) Digunakan untuk mengambil data


(59)

commit to user

10.Class Control P roductCon trol

Merupakan kelas control yang digunakan untuk mengelola data produk pada sisi admin, yang menghubungkan kelas boundary Main dengan kelas entity TProduct.

Tabel 3.28. Tabel Deskripsi Cla ss Control ProductControl

Atribut

Nama Atribut Visibilty Type

- - -

Method

Nama Method Fungsi

ViewAllProduct() Digunakan untuk menampilkan

informasi seluruh produk

ViewProductByID($idProduk) Digunakan untuk menampilkan

informasi satu produk

UpdateProduct($idProduk) Digunakan untuk memperbarui

satu data produk

AddProduct() Digunakan untuk menambahkan

data produk baru

DeleteProduct($idProduk) Digunakan untuk menghapus satu

data produk

AddGambarProduk($idProduk) Digunakan untuk menambah

gambar produk per produk

DeleteGambarProduk($idGambar) Digunakan untuk menghapus satu gambar produk

11.Class En tity TP rodu ct

Merupakan kelas entity yang berisi data dari tabel produk Tabel 3.29. Tabel Deskripsi Cla ss Entity TProduct

Atribut

Nama Atribut Visibilty Type


(1)

commit to user

Gambar 4.10. Halaman Pengaturan Pengiriman Admin

4.1.10 Halaman Home Manajer

Halaman Home berisi informasi umum setelah admin login.

Gambar 4.11. Halaman Home Manajer

4.1.11 Halaman Laporan Grafik Transaksi Manajer

Berisi gambar grafik untuk jumlah per status pada bulan ini. Manajer bisa melihat daftar pesanan dengan filter status. Detail pesanan bisa dilihat dengan mengklik id pesanan.


(2)

commit to user

Gambar 4.12. Halaman Laporan Grafik Transaksi Manajer

Halaman detail order menampilkan secara detail isi pesanan tetapi manajer tidak dapat mengubahnya.


(3)

commit to user

Script program untuk menampilkan halaman grafik transaksi per status ( Gambar 4. ) :

- Pada Controller La pora n

function trx() {

Jika Tombol submit pada proses menampilkan data pesanan per status if ($_POST) {

$data=$this->order_m->lap_by_status($this->input->post('status')); if ($data) {

$this->table->set_heading('No Pesanan','Tanggal Pesan','Email User','Total','Status'); foreach ($data as $q) {

$ongkir = $this->hitung_ongkir($q->tot_berat, $q->ongkir); $total=$q->subtotal + $ongkir;

$this->table->add_row(anchor('manajer/laporan/detail_pesanan/'.$q->id_pesanan, $q->id_pesanan), $q->tgl_pesan,$q->email,$total,$q->nama_status); } $this->table->set_template($this->tmpl); $this->data->tabel=$this->table->generate(); } else

$this->data->tabel="Tidak ada Pesanan dengan status yang dimaksud"; }

$this->data->stok = $this->grafik_trx();

$this->data->stat=$this->order_m->get_status(); $this->data->tengah='manajer/tengah/trx';

$this->load->view('manajer/manajer', $this->data); }

Fungsi menampilkan grafik menggunakan library fusion chart

function grafik_trx() {

$graph_swfFile = $this->config->item('base_url').'public/Charts/FCF_Column2D.swf' ; $graph_caption = 'Grafik Transaksi per status Bulan Ini' ;

$graph_title = 'Stok per Kategori Hari ini' ; $graph_width = 450 ;

$graph_height = 250 ; $data=$this->grafik->grafik_status(); $i=0;

foreach ($data as $y) {

$yrrData[$i][1] = $y->nama_status; $yrrData[$i][2] = $y->jml;


(4)

commit to user

$strXML = "<graph caption='".$graph_caption."' formatNumberScale='0' decimalPrecision='0'>";

foreach ($yrrData as $yrSubData) {

$strXML .= "<set name='" . $yrSubData[1] . "' value='" . $yrSubData[2] . "' color='".getFCColor()."' />"; }

$strXML .= "</graph>";

$chart2=renderChart($graph_swfFile, $graph_title, $strXML, "div" , $graph_width, $graph_height);

return $chart2; }

- Pada Model Gra fik dan Order_m

function grafik_status() {

$query=$this->db->query("select *,count(*) as jml from pesanan inner join ket_status on ket_status.id_status = pesanan.status where tgl_pesan Like '%-".date('m')."-%' group by status");

return $query->result(); } function get_status() {

return $this->db->get('ket_status')->result(); }

Query untuk menampilkan daftar pesanan berdasarkan status yang dipilih

function lap_by_status($status) {

$this->db->select('pesanan.id_pesanan, tgl_pesan, email,nama_status, (select sum(jml*harga) as subtotal from detail_pesanan where detail_pesanan.id_pesanan = pesanan.id_pesanan) as subtotal, (select sum(jml*berat) as subtotal from detail_pesanan where detail_pesanan.id_pesanan = pesanan.id_pesanan) as tot_berat, ongkir');

$this->db->from('pesanan');

$this->db->join('member','member.id_member=pesanan.id_member'); $this->db->join('kurir','kurir.id_kurir = pesanan.id_kurir');

$this->db->join('alamat','alamat.id_alamat = pesanan.id_alamat'); $this->db->join('ket_status','ket_status.id_status=pesanan.status');

$this->db->join('detail_pesanan','detail_pesanan.id_pesanan=pesanan.id_pesanan'); $this->db->where('status',$status);


(5)

commit to user

4.2 Analisa

Ketika halaman utama diakses, terdapat pengecekan device. Jika dibuka melalui browser PC, maka diarahkan ke halaman web desktop, namun jika melalui browser mobile, maka diarahkan ke halaman web mobile.

User melihat katalog produk tidak perlu autentikasi login. Tetapi ketika checkout dibutuhkan autentikasi login, hanya yang terdaftar yang bisa checkout. Untuk halaman Admin dan Manajer juga dibutuhkan autentikasi.

Penetapan biaya pengiriman berdasarkan kota dari alamat yang dipilih, jasa pengiriman (kurir) yang dipilih dan berat pesanan secara keseluruhan. Untuk berat pesanan, jika lebih, maka dibulatkan ke atas, contoh: berat 1,5 kg dihitung 2 kg.

Selain itu, terdapat kemungkinan bahwa member yang memesan tidak segera membayar padahal ketika pesanan dikirim ke sistem, stok produk sudah berkurang sesuai jumlah pada pesanan. Untuk mengatasi hal ini, terdapat pengecekan status dengan tanggal pemesanan dan tanggal hari ini. Jika lebih dari 3 hari, maka sistem akan mengubah secara otomatis status pesanan dibatalkan dan stok dikembalikan. Untuk status dibatalkan yang diubah oleh admin, stok juga dikembalikan.

Penambahan validasi form pada inputan ke keranjang agar inputan hanya angka dan bukan huruf, jumlah produk yang dibeli tidak melebihi stok yang tersedia.

Tampilan pada web mobile minimalis, tidak terlalu banyak gambar dan lebar tampilan disesuaikan lebar perangkat.

Dari analisa di atas, telah diterapkan pada aplikasi mobile web dan berjalan dengan baik.


(6)

commit to user

76

BAB V PENUTUP

5.1Kesimpulan

Berdasarkan penelitian dan pembahasan yang telah dipaparkan sebelumnya, maka dapat diambil kesimpulan sebagai berikut :

1. Telah dibangun aplikasi m-commerce mobile web untuk Batik Solo menggunakan fra mewor k CodeIgniter dan data base MySQL.

2. Aplikasi ini digunakan untuk tiga user : customer, admin dan manajer. Aplikasi mobile web digunakan untuk sisi customer, sedang admin dan manajer menggunakan web desktop.

3. Terdapat tiga aktor : customer, admin dan manajer

4. Pada aplikasi m-commer ce ini terdapat 15 tabel dalam database 5. Pada aplikasi m-commer ce ini terdapat 6 status pesanan 6. Terdapat pengecekan status order untuk memperbarui stok

7. Aplikasi ini telah diujicobakan pada opera mobile emula tor dan berjalan lancar

8. Aplikasi ini untuk menangani kegiatan transaksi jual beli produk Batik

5.2 Saran

Berdasarkan kesimpulan di atas, diperoleh beberapa saran untuk pengembangan aplikasi lebih lanjut, yaitu :

1. Customer dapat memberikan komentar atau review mengenai suatu produk 2. Terdapat tambahan atribut dan warna untuk tiap produk

3. Terdapat variasi filter untuk tampilan data pesanan dan produk 4. Update otomatis status dijalankan sistem pada waktu tertentu.