BAB III ANALISIS DAN PERANCANGAN

(1)

BAB III

ANALISIS DAN PERANCANGAN

3.1 DESKRIPSI SISTEM

Aplikasi toko online yang dibangun adalah aplikasi berbasis mobile android yang dapat digunakan di mana saja dan kapan saja. Dengan kata lain aplikasi ini memudahkan bagi pengguna yang memiliki keterbatasan waktu dan kesempatan dalam melakukan aktifitas belanja. Pada aplikasi ini pengguna cukup memilih produk yang tersedia pada server aplikasi.

3.2 ANALISIS SISTEM

Analisis Sistem Penguraian dari suatu sistem informasi yang utuh kedalam bagian-bagian komponennya dengan maksud untuk mengidentifikasikan dan mengevaluasi permasalahan-permasalahnya, kesempatan-kesempatan, hambatan-hambatan yang terjadi dan kebutuhan –kebutuhan yang diharapkan sehingga dapat diusulkan perbaikan-perbaikannya.

3.2.1 Analisis SWOT

Analisis SWOT adalah singkatan dari Strengths, Weaksness, Opportunities, dan Threats. Analasis SWOT sendiri sering digunakan dalam melakukan analisis suatu sistem agar dapat mengetahui kekuatan dan kelemahan serta apa-apa saja peluang yang dimiliki dalam membangun suatu sistem.

3.2.1.1Strength (Kekuatan)

Aplikasi toko online berbasis android memiliki beberapa kekuatan antara lain:

1. Produk yang ditawarkan oleh produsen dapat dengan mudah dipilih oleh konsumen tanpa harus dating ke lokasi produksi. 2. Aplikasi bersifat mobile sehingga lebih praktis untuk

digunakan dimana saja dan kapan saja.

3.2.1.2Weakness (Kelemahan)

(2)

aplikasi ini memiliki kelemahan diantaranya:

1. Aplikasi membutuhkan koneksi internet untuk dapat digunakan.

2. Aplikasi ini terbatas untuk digunakan pada ponsel pintar berbasis Android, sehingga pengguna ponsel pintar berbasis selain Android tidak dapat menggunakan aplikasi toko online ini.

3.2.1.3Opportunities (Peluang)

Aplikasi toko online ini memiliki peluang yang dilihat dari faktor eksternal sistem dan dapat dikembangkan, diantaranya adalah:

1. Meningkatkan efisiensi waktu bagi para pengguna yang sedang ingin mencari suatu produk yang dibutuhkan.

2. Mobilitas yang tinggi juga sangat mempengaruhi perkembangan penggunaan ponsel berbasis android, karena ponsel pintar lebih mudah untuk dibawa dari pada menggunakan laptop atau perangkat lain.

3.2.1.4Threat (Ancaman)

Aplikasi mempunyai ancaman yang dapat mengganggu sistem, ancaman tersebut diantaranya:

1. Pesatnya perkembangan aplikasi android sehingga akan banyak pengembang aplikasi yang membuat aplikasi sejenis dengan fitur yang lebih lengkap.

2. Virus

3.2.2 Analisis Kebutuhan Sistem

Tahap identifikasi dan analisis kebutuhan sistem dilakukan untuk mengetahui kebutuhan pengguna terhadap aplikasi yang akan dikembangkan. Hal ini perlu dilakukan agar aplikasi yang dikembangkan sesuai dengan kebutuhan pengguna

(3)

Berikut ini adalah layanan yang ada dalam aplikasi toko online berbasis Android :

1. Aplikasi menampilkan informasi mengenai produk-produk yang ditampilkan oleh server.

2. Aplikasi dapat menampilkan detail produk yang dicari. 3. Pengguna dapat mengubah item pada keranjang belanja. 4. Aplikasi dapat menampilkan bukti pemesanan.

2. Analisis Kebutuhan Non Fungsional

Kebutuhan non fungsional merupakan kebutuhan yang berisi properti perilaku yang dimiliki oleh sistem. Berikut ini adalah beberapa kebutuhan non fungsional :

a. Operasional

1. Aplikasi digunakan pada platform Android

2. Aplikasi berjalan pada versi Android 2.3 (gingerbread) dan

versi diatasnya b. Informasi

1. Manual untuk membantu menggunakan aplikasi 2. Informasi tentang aplikasi.

c. Kinerja

Waktu untuk splash screen dibatasi 5 detik.

3.2.2.1Kebutuhan Perangkat Keras (Hardware)

Perangkat keras yang digunakan untuk perangcangan aplikasi kamus istilah kesehatan ini adalah:

1. Notebook Asus A43S dengan spesifikasi sebagai berikut:

a. Operating System : Windows 7 Ultimate 64-bit.

b. Memory : 5GB

c. Processor : Intel(R) Pentium(R) CPU B940 @

2.00GHz (2 CPUs), ~2.0GHz

d. Card name : NVIDIA GeForce GT 520M

e. Display Memory : 1735 MB f. Harddisk : 250 Gb

(4)

2. ASUS Z007, dengan spesifikasi sebagai berikut : a. 600 MHz ARMv6 CPU b. Adreno 200 GPU c. A-GPS support d. Qualcomm MSM7227 chipset e. 1 GB RAM

3.2.2.2Kebutuhan Perangkat Lunak (Software)

Perangkat lunak yang digunakan dalam melakukan perancangan aplikasi toko online ini adalah:

1. Eclipse Juno version: 4.2 untuk windows 32 bit

2. SDK (Software development Kit) Android minimal versi 8 3. ADT (Android DevelopmentTools)

3.2.2.3Kebutuhan Pengguna

Aplikasi mobile toko online ini hanya memiliki satu pihak yang

akan menggunakan aplikasi, pihak tersebut adalah pengguna, pengguna dalam hal ini adalah pengguna smartphone android. Pengguna dapat

menggunakan aplikasi android toko online setelah mengikuti petunjuk- petunjuk dalam melakukan konfigurasi dan istallasi aplikasi.

3.2.3 Analisis Kelayakan Sistem

Analisis kalayakan sistem merupakan tahapan menjustifikasi apakah kebutuhan sistem yang dibuat layak untuk dilanjutkan menjadi sistem atau tidak.

3.2.3.1Kelayakan Teknologi

Kelayakan aplikasi toko online berbasis android ini ditinjau dari segi teknologi dengan konsep berbasis android yang mendukung untuk aplikasi ini. Teknologi ini memanfaatkan platform android yang sedang marak digunakan.

3.2.3.2 Kelayakan Hukum

(5)

3.2.3.3 Kelayakan Operasional

Analisis kelayakan operasional ditinjau dari kemampuan aplikasi memecahkan permasalahan seperti tujuan dibuatnya aplikasi tersebut. Aplikasi ini dapat memenuhi tujuan pembuatan yaitu mempermudah proses pemasaran pemesanan produk.

3.3 PERANCANGAN SISTEM

Perancangan ini meliputi perancangan Use Case, Activity diagram, sequence diagram, class diagram, perancangan basis data, dan perancangan antar

muka.

3.3.1 Use Case Diagram

Use case merupakan metode berbasis teks untuk menggambarkan dan

mendokumentasikan proses yang kompleks dengan menambahkan detail untuk kebutuhan yang telah didefinisikan. Berikut adalah use case pada aplikasi toko online yang menggambarkan tentang proses-proses apa saja yang dapat dilakukan oleh pengguna.

Gambar 3.1 Use Case Toko Online

Melihat katalog produk Melihat detail produk Tambah/edit item keranjang belanja Mengisi form pemesanan Melihat bukti pemesanan User Login Tambah/Ubah daftar produk Tambah/Ubah daftar propinsi Melihat/mempro es pesanan << include >> << include >> Admin << include >> Tambah/Ubah daftar ongkos kirim << include >> Mobile .. _Web_.

(6)

Pada apikasi ini terdapat 2 user yaitu produsen sebagai user web dan konsumen sebagai user aplikasi mobile. User web dapat melakukan login, penginputan dan mengubah daftar produk, penginputan dan mengubah daftar propinsi, penginputan danmengubah daftar ongkos kirim serta melihat dan mengubah status pemesanan. Untuk user aplikasi mobile dapat melihat katalog produk, melihat detail produk, mengubah jumlah item keranjang belanja, mengisi form pemesanan dan melihat bukti pemesanan.

3.3.2 Activity Diagram

Berikut ini adalah activity diagram yang ada pada aplikasi toko online

berbasis android :

1. Activity Diagram Login Web Aplikasi Server User Admin

Gambar 3.2 Activity Diagram Login Web Aplikasi Server User Admin

Pengguna Web Aplikasi Server

Menampilkan halaman utama

Login berhasil? Input user dan

password Menampilkan halaman login Membuka web aplikasi melalui browser Tidak Ya

(7)

2. Activity Diagram Menambahkan Produk

Gambar 3.3 Activity Diagram Menambahkan Produk

Menampilkan halaman menu

produk Klik tombol tambah

produk Menampilkan halaman menu produk Pilih menu Master > Produk Menampilkan form input produk Input data produk Simpan data produk

(8)

3. Activity Diagram Menambah Daftar Propinsi.

Gambar 3.4 Activity Diagram Menambah Daftar Propinsi

propinsi Klik tombol tambah

Menampilkan halaman menu propinsi Pilih menu Master > Propinsi Menampilkan form input propinsi Input nama propinsi Simpan data propinsi

(9)

4. Activity Diagram Menambah Daftar Ongkos Kirim

Gambar 3.5 Activity Diagram Menambah Daftar Ongkos Kirim

ongkir Klik tombol tambah

ongkir Menampilkan halaman menu ongkir Pilih menu Master > Ongkir Menampilkan form input ongkir

Input data ongkir

Simpan data ongkir

(10)

5. Activity Diagram Melihat Pemesanan

Gambar 3.6 Activity Diagram Melihat Pemesanan

Menampilkan halaman pemesanan Klik tombol edit

Menampilkan halaman pemesanan Pilih menu Transaksi > Pemesanan Menampilkan form edit status

pemesanan Ubah status

pemesanan

Simpan status pemesanan

(11)

6. Activity Diagram Melihat Katalog Produk

Gambar 3.7 Activity Diagram Melihat Katalog Produk

7. Activity Diagram Melihat Detail Produk

Gambar 3.8 Activity Diagram Melihat Detail Produk

Pengguna Aplikasi Mobile

Menampilkan katalog produk Menampilkan splash screen Membuka aplikasi Menampilkan detail produk Menampilkan katalog produk Pilih produk Menampilkan splash screen Membuka aplikasi

(12)

8. Activity Diagram Edit Item Keranjang Belanja

Gambar 3.9 Activity Diagram Edit Item Keranjang Belanja

Menampilkan detail produk Menampilkan katalog produk Pilih produk Menampilkan splash screen Membuka aplikasi Menampilkan keranjang belanja Klik tombol beli

Klik Item yang akan diupdate jumlahnya Menampilkan menu update belanja Ubah jumlah item dan simpan

(13)

9. Activity Diagram Mengisi Form Pemesanan

Gambar 3.10 Activity Diagram Mengisi Form Pemesanan

Menampilkan detail produk Menampilkan katalog produk Pilih produk Menampilkan splash screen Membuka aplikasi Menampilkan keranjang belanja Klik tombol beli

Lanjutkan belanja? Mengisi form pemesanan Menampilkan form pemesanan Kik tombol Simpan Ya Tidak

(14)

10.Activity Diagram Melihat Bukti Pemesanan

Gambar 3.11 Activity Diagram Melihat Bukti Pemesanan

Konfirmasi pembayaran Mengisi form pemesanan Kik tombol Simpan Menampikan bukti pemesanan Menyimpan data pemesanan

(15)

3.3.3 Class Diagram

Berikut ini adalah class diagram aplikasi toko online berbasis android:

Gambar 3.12 Class Diagram Aplikasi Toko Onlien Berbasis Android Class Diagram Aplikasi Toko Onlien Berbasis Android menggambarkan

keadaan (atribut/properti) suatu sistem, terdapat beberapa class yang ada pada aplikasi ini diantara nya adalah sebagai berikut:

1. SplashAvtivity

,

digunakan untuk menangani activity splash screen.

2. Katalog, class ini menangani penampilan data produk.

3.

DetailProduk, digunakan untuk menampilkan detail produk berdasarkan

id yang dibawa oleh intent yang dikirim dari class Katalog.

4. Keranjang, class ini menampilkan ListView item keranjang belanja dari

sisi server. Di class ini juga menampilkan sub-total dari item yang dipilih, jumlah item yang dibeli dan total berat dari item yang dimasukkan ke keranjang belanja.

5. DetailItemUpdate, digunakan untuk melakukan perubahan pada quantity

item yang terpilih atau bisa juga menghapus item produk yang tidak jadi dipilih atau tidak jadi dibeli.

SplashActivity +run : void +onCreate() : void +getApplicationContex t() Katalog +idproduksi : String +produk : String +harga : String +link_image : String +onCreate() +onOptionsItemSelected() +keluar() DetailProduk +idproduksi : String +onCreate() Keranjang +idproduksi : String +produk : String +harga : String +berat: String +qty : String +total: String +subtotal: String +onCreate() +SetListViewAdapter () DetailItemUpdate +idproduksi : String +textQty : String +onCreate() +onClick() () PelangganTrans +nama : String +alamat : String +telepon : String +propinsi : String +kabupaten : String +onCreate() +onBackPressed() +populatePropinsi() +populateKabupaten() +onItemSelected() +onNothingSelected()

(16)

6. PelangganTrans, digunakan untuk menyimpan data transaksi dan

pembuatan bukti pemesanan.

3.3.4 Sequence Diagram

Berikut ini adalah sequence diagram aplikasi toko online :

1. Sequence Diagram Login

Gambar 3.13 Sequence Diagram Login

2. Sequence DiagramMenuDaftar Produk

Gambar 3.14 Sequence Diagram Daftar Produk

Pengguna

Form Login Dashboard

1: Akses Website 1.2: Menampilkan Form Login

2: Username dan Password benar 2.2: Tampil dashboard

2.3: Isi/Ubah data Produk dan Simpan Pengguna

Menu Produk Form Produk 1: Pilih menu Master > Produk

1.2: Menampilkan Daftar Produk

2: Klik Tambah atau Edit Produk 2.2: Tampil Form Produk

(17)

3. Sequence DiagramDaftar Propinsi

Gambar 3.15 Sequence Diagram Daftar Propinsi

4. Sequence DiagramDaftar Ongkos Kirim

Gambar 3.16 Sequence Diagram Ongkos Kirim

2.3: Isi/Ubah data Propinsi dan Simpan Pengguna

Menu Propinsi Form Propinsi 1: Pilih menu Master > Propinsi

1.2: Menampilkan Daftar Propinsi

2: Klik Tambah atau Edit Propinsi 2.2: Tampil Form Propinsi

2.3: Isi/Ubah data Ongkir dan Simpan Pengguna

Menu Ongkir Form Ongkir 1: Pilih menu Master > Ongkir

1.2: Menampilkan Daftar Ongkir

2: Klik Tambah atau Edit Ongkir 2.2: Tampil Form Ongkir

(18)

5. Sequence DiagramMelihat Status Pemesanan

Gambar 3.17 Sequence Diagram Status Pemesanan

6. Sequence DiagramMelihat Katalog Produk

Gambar 3.18 Squence Diagram Katalog Produk

Squence Diagram ini menjelaskan bagiamana proses interaksi antara menu

utama dengan menu splash screen setelah membuka aplikasi pengguna akan langsung disuguhkan tampilan menu splash screen selama 5 detik kemudian aplikasi menampilkan katalog produk..

Pengguna

Splash Activity Katalog Produk 1: Splash screen

1.2: Menampilkan Splash screen

2: Masuk katalog produk 2.2: Tampil katalog produk

2.3: Ubah status pemesanan dan Simpan Pengguna

Menu Pemesanan Form Pemesanan 1: Pilih menu Transaksi > Pemesanan

1.2: Menampilkan Daftar Pesanan

2: Klik Edit Penesanan 2.2: Tampil Form Pemesanan

(19)

7. Sequence DiagramMelihat Detail Produk

Gambar 3.19 Squence Diagram Lihat Detail Produk

Squence Diagram ini menggambarkan skenario atau rangkaian

langkah-langkah yang dilakukan setelah pengguna memilih produk dari katalog produk, pengguna akan diarahkan ke tampilan detail produk.

8. Sequence DiagramUbah Item Keranjang Belanja

Gambar 3.20 Squence Diagram Ubah Item Keranjang Belanja

Squence Diagram ini menggambarkan skenario atau rangkaian

langkah-langkah yang dilakukan setelah pengguna memilih produk dari katalog produk, pengguna akan diarahkan ke tampilan detail produk. Kemudian pengguna menekan tombol selesai sehingga barang yang dipilih masuk ke dalam keranjang belanja. Update item dilakukan dengan cara memilih/menekan salah satu item produk pada keranjang belanja.

Pengguna

Katalog Produk Detail Produk 1: Katalog produk

1.2: Menampilkan katalog produk

2: Lihat detail produk 2.2: Tampil detail produk

Keranjang Belanja

4: Ubah/hapus pesanan Pengguna

Katalog Produk Detail Produk 1: Pilih produk

2: Beli produk

(20)

9. Sequence DiagramMengisi Formulir Pemesanan

Gambar 3.21 Squence Diagram Mengisi Formulir Pemesanan

10.Sequence DiagramMelihat Bukti Pemesanan

Gambar 3.22 Squence Diagram Melihat Bukti Pemesanan

Sequence diagram Pemesanan digunakan untuk menggambarkan skenario

atau rangkaian langkah-langkah pemesanan produk. Setelah pengguna memilih 5: Daftar pesanan, keterangan pengiriman dan pembayaran

Keranjang Belanja

2: Beli produk

3: Pilih tombol selesai

Form Pesanan Database

6: Validasi selesai belanja

7: Pesan transaksi disimpan 5: Daftar pesanan, keterangan pengiriman dan pembayaran

Keranjang Belanja

2: Beli produk

3: Pilih tombol selesai

(21)

sehingga selanjutnya diarahkan ke tampilan keranjang belanja. Pada menu keranjang belanja pelanggan bisa mengubah jumlah produk yang akan dibeli atau menghapus produk yang tidak jadi dibeli. Kemudian pelanggan melakukan checkout dan diarahkan ke tampilan form pemesanan untuk mengisi data pengguna yang selanjutnya akan disimpan di database dan menghasilkan bukti pemesanan.

3.4 PERANCANGAN ANTARMUKA

Perancangan antarmuka meliputi desain antarmuka yang akan ditampilkan pada aplikasi toko online berbasis android, perancangan antar muka meliputi perancangan splash screen, katalog produk, detail produk, keranjang belanja, edit item keranjang belanja, form pemesanan, dan bukti pemesanan.

1. Antarmuka Login Web Aplikasi Server

Username [input] Password [input]

Gambar 3.23 Antarmuka Login Web Aplikasi Server Masuk

(22)

2. Antarmuka Menu Produk

XYZHomeIndustry Home Master Transaksi Laporan Logout

Daftar Produk

No Nama Produk Aksi

1 Hanger Jilbab Edit | Hapus

2 Rak Sepatu Gantung Edit | Hapus

3 Rak Sepatu Kantung Edit | Hapus

Gambar 3.24 Antarmuka Menu Produk

3. Antarmuka Menu Input Produk

Tambah Produk

Nama Produk [input]

Deskripsi Produk [input]

Harga Produk [input]

Nama Toko [input]

Gambar Produk [input]

+ Tambah

(23)

4. Antarmuka Menu Propinsi

Data Propinsi

No Nama Propinsi Aksi

1 Jawa Tengah Edit | Hapus

2 Jawa Timur Edit | Hapus

3 Jawa Barat Edit | Hapus

Gambar 3.26 Antarmuka Menu Propinsi 5. Antarmuka Menu Input Propinsi

Tambah Data Propinsi

Masukkan Nama Propinsi [input]

Gambar 3.27 Antarmuka Menu Input Propinsi + Tambah

(24)

6. Antarmuka Menu Ongkos Kirim

Data Ongkos Kirim

No Nama Kota/Kabupaten Nama Propinsi Ongkos Kirim Aksi

1 Semarang Jawa Tengah 20000 Edit | Hapus

2 Surabaya Jawa Timur 20000 Edit | Hapus

3 Serang Jawa Barat 30000 Edit | Hapus

Gambar 3.28 Antarmuka Menu Ongkos Kirim

7. Antarmuka Menu Input Ongkos Kirim

Tambah Data Ongkos Kirim

Masukkan Nama Propinsi [drop list]

Pilih Nama Kota [input]

Masukkan Ongkos Kirim [input]

+ Tambah

(25)

8. Antarmuka Menu Pemesanan

Data Pemesanan

ID Order Tanggal Order Jam Order Status Pemesanan Aksi

1 YYYY-MM-DD hh:mm:ss Belum Edit | Hapus

2 YYYY-MM-DD hh:mm:ss Lunas Edit | Hapus

3 YYYY-MM-DD hh:mm:ss Lunas Edit | Hapus

Gambar 3.30 Antarmuka Menu Pemesanan

9. Antarmuka Menu Ubah Status Pemesanan

Edit Status Pembayaran

ID Order [read only]

Status Pemesanan [drop list]

Gambar 3.31 Antarmuka Menu Ubah Status Pemesanan + Tambah

(26)

10. Antarmuka Menu Detail Pesanan

Order Detail

ID Order [read only]

Nama Pemesan [read only]

Alamat [read only]

Nomor Telepon [read only]

Kota Kabupaten [read only]

No Nama Produk Quantity Total

Subtotal Total berat Total ongkos kirim Grand total

Gambar 3.32 Antarmuka Menu Pesanan

11. Antarmuka Menu Laporan

Laporan Pendapatan Periode

Masukkan Tanggal Awal [date picker] Masukkan Tanggal Akhir [date picker]

Laporan Periode

ID Order Tanggal Order Jam Order Total Item Order Subtotal Pendap[atan Grand Total

Gambar 3.33 Antarmuka Menu Laporan

(27)

12. Antarmuka Splash Screen

Gambar 3.34 Antarmuka Splash Screen

13. Antarmuka Katalog Produk

Gambar 3.35 Antarmuka Katalog Produk

LOGO

Gambar Produk 1

XYZ Home Industry

Nama Produk 1 Harga Produk Nama Produk 2 Harga Produk Gambar Produk 2 Nama Produk 3 Harga Produk Gambar Produk 3 Nama Produk 4 Harga Produk Gambar Produk 4

(28)

14. Antarmuka Detail Produk

Gambar 3.36 Antarmuka Detail Produk

15. Antarmuka Keranjang Belanja

Gambar 3.37 Antarmuka Keranjang Belanja

XYZ Home Industry XYZ Home Industry

Nama Produk Gambar Produk Diskripsi Produk Harga Beli Nama Produk 1 Harga Produk Gambar Produk 1 Nama Produk 2 Harga Produk Gambar Produk 2

Subtotal | Jumlah | Berat

(29)

16. Antarmuka Updae Item Keranjang Belanja

Gambar 3.38 Antarmuka Update Item Keranjang Belanja

17. Antarmuka Proses Checkout

Gambar 3.39 Antarmuka Proses Checkout

Nama Alamat Telepon/Handphone Propinsi Kota/Kabupaten Form Pelanggan Edit Text EditText SIMPAN Update Keranjang Nama Produk Gambar Produk Harga Produk Hapus Update Quantity EditText Drop List Drop List

(30)