BAB IV ANALISIS DAN PERANCANGAN. informasi yang utuh kedalam bagian-bagian komponennya dengan maksud untuk

Transkripsi

1 BAB IV ANALISIS DAN PERANCANGAN 4.1. Analisis Sistem Analisis sistem dapat didefinisikan sebagai penguraian dari suatu sistem informasi yang utuh kedalam bagian-bagian komponennya dengan maksud untuk mengidentifikasi dan mengevaluasi permasalahan-permasalahan, kesempatankesempatan, hambatan-hambatan yang terjadi dan kebutuhan-kebutuhan yang diharapkan sehingga dapat sesuai dengan kebutuhan Analisis Masalah Kesulitan konsumen untuk memperoleh informasi barang, dan lokasi pada minimarket Alfamart, disebabkan oleh tidak efektif dan efisiennya informasi barang, dan lokasi pada minimarket Alfamart. Informasi barang yang diperoleh konsumen hanya berupa selembaran katalog produk, dan informasi lokasi suatu minimarket Alfamart tidak disampaikan kepada konsumen. Belum lagi dengan masalah perbedaan harga di masing-masing minimarket Alfamart, yang dipengaruhi oleh jumlah konsumen dan jenis barang yang banyak dibeli pada suatu minimarket Alfamart. Sehingga konsumen tidak mendapatkan informasi harga barang pada suatu lokasi minimarket Alfamart secara cepat, tepat dan akurat. Cara yang dapat dilakukan untuk mengatasi itu semua adalah dengan menyampaikan informasi barang, dan lokasi minimarket Alfamart secara cepat, tepat dan akurat. Dalam hal ini menggunakan sistem informasi yang berbasis client-server. 50

2 Analisis Kebutuhan Non Fungsional Analisis kebutuhan non fungsional menggambarkan kebutuhan sistem yang menitikberatkan pada properti prilaku yang dimiliki oleh sistem, diantaranya kebutuhan perangkat keras dan perangkat lunak sebagai bahan analisis kekurangan dan kebutuhan yang harus dipenuhi dalam perancangan sistem yang akan diterapkan Analisis Kebutuhan Perangkat Keras Berikut ini adalah spesifikasi perangkat keras mendukung aplikasi pencarian informasi barang, dan lokasi pada minimarket Alfamart dengan baik, yaitu : 1. Perangkat Keras Server Processor Memori Hardisk VGA : 2.13GHz : 2048MB RAM : 320GB : 1741MB 2. Perangkat Keras Client Processor : 600Mhz Layar : 320 x 480 pixels, 3.2 Jaringan : HSDPA 900 / 2100 Camera : 3.2 megapiksel + Auto Focus

3 Analisis Kebutuhan Perangkat Lunak Analisis perangkat lunak terdiri dari spesifikasi perangkat lunak yang dibutuhkan, berikut ini adalah spesifikasi perangkat lunak yang digunakan dalam membangun dan mengimplementasikan aplikasi fasilitas umum ini. 1. Perangkat Lunak Server Sistem Operasi Windows 7 Ultimate. XAMPP untuk lokal internet dan penyimpanan data base. Adobe Dreamweaver CS3 untuk penulisan kode program PHP dan JSON. Mozilla Firefox 11 sebagai browser. Eclipse Galileo untuk penulisan kode program Android. 2. Perangkat Lunak Client Sistem Operasi Android 2.3 (Gingerbread) Analisis Kebutuhan Fungsional Analisis kebutuhan fungsional menggambarkan proses kegiatan yang akan diterapkan dalam sebuah sistem dan menjelaskan kebutuhan yang diperlukan sistem agar sistem dapat berjalan dengan baik serta sesuai dengan kebutuhan. Analisi kebutuhan fungsional ini meliputi analisi kebutuhan sistem dan pemodelan sistem Analisis Kebutuhan Sistem Analisi kebutuhan sistem yang dilakukan penulis yaitu dengan cara melakukan wawancara terhadap responden. Hal ini dimaksudkan agar dapat mengatasi ketidaksesuaian antara aplikasi yang di rancang dengan kebutuhan pengguna. Adapun kebutuhan sistem yang diperlukan antara lain :

4 53 1. Menampilkan informasi barang maupun harga barang pada minimarket Alfamart. 2. Menampilkan informasi lokasi minimarket Alfamart. 3. Menampilkan informasi barang, dan lokasi pada minimarket Alfamart secara cepat, tepat dan akurat Analisis Pemodelan Sistem Pemodelan sistem dimodelkan dengan menggunakan UML (Unified Modeling Language). Tahap-tahap pemodelan dalam analisis tersebut antara lain Use Case diagram, Activity Diagram, Class Diagram, Sequence Diagram, Collaboration Diagram, Component Diagram dan Deployment Diagram Analisis Arsitektur Sistem Arsitektur fisik sistem yang dibangun terdiri dari aplikasi pencarian informasi barang, dan lokasi pada minimarket Alfamart yang sudah terinstal pada perangkat mobile smartphone atau PC tablet, bagian ini berfungsi sebagai antarnuka penguna dengan sistem. Web Service merupakan web yang bertujuan menghubungkan suatu platform aplikasi dengan platform lainnya sehingga seluruh aplikasi tersebut dapat saling berkomunikasi. Web Service pada penelitian ini dibangun diatas PHP yang dikombinasikan dengan JSON. Data Base digunakan untuk menyimpan data-data yang dibutuhkan oleh aplikasi, pada bagian ini di implementasikan menggunakan MYSQL.

5 54 Akses koneksi jaringan yang digunakan dari aplikasi mobile ke BTS melalui perangkat mobile dapat menggunakan jaringan mobile GPRS/EDGE/UMTS. (Gambar 4.1, Arsitektur Sistem) 4.2. Perancangan Sistem Perancangan sistem bertujuan untuk menspesifikasikan aspek-aspek teknik yang menjadi solusi dalam perencanaan. Pada tahap ini perancangan akan didefinisikan secara detail untuk mengatasi masalah-masalah yang lebih teknis, berkaitan dengan kegiatan implementasi seperti tujuan perancangan, gambaran umum sistem, perancangan system yang di usulkan dan perancangan antarmuka Tujuan Perancangan Adapun tujuan dari perancangan aplikasi pencarian informasi barang dan lokasi pada minimarket Alfamart ialah :

6 55 1. Untuk mengetahui informasi barang, dan lokasi pada suatu minimarket Alfamart disampaikan kepada konsumen. 2. Untuk membuat perancangan aplikasi pencarian informasi barang, dan lokasi pada minimarket Alfamart. 3. Untuk mengetahui implementasi aplikasi pencarian informasi barang, dan lokasi pada minimarket Alfamart. 4. Untuk mengetahui analisis dan pengujian aplikasi pencarian informasi barang, dan lokasi pada minimarket Alfamart Gambaran Umum Sistem Data Data Aplikasi Mobile Web Service Data Base Server (Gambar 4.2, Gambaran Umum Sistem) 1. Aplikasi Mobile Apliaksi Mobile dalam hal ini merupakan analisis fungsional aplikasi untuk mengakses data dari data base server melalui web service. Aplikasi ini dibangun diatas platform Android dan bekerja dengan memparsing data dari web service yang bertipe JSON untuk diolah pada platform Android 2. Web Service Web Service pada penelitian ini berfungsi sebagai jembatan antara aplikasi mobile dengan data base server. Cara kerja web service ini yaitu dengan

7 56 mengambil data dari data base server dan kemudian mengkonversikan data tersebut ke format pertukaran data JSON. 3. Protokol HTTP Protokol HTTP merupakan protokol lapisan jaringan aplikasi yang digunakan untuk sistem informasi terdistribusi, kolaboratif dan menggunakan hypermedia. Dalam penelitian ini protocol HTTP digunakan sebagai protokol yang dapat mendistribusikan data dari data base server Perancangan Prosedur Diusulkan Use Case Diagram System Search Item Market Location Aktor Promo Server Info (Gambar 4.3, Use Case Diagram)

8 57 Skenario Use Case No. Use Case : 01 Nama Use Case : SEARCH ITEM Scenario : Tabel 4.1, SEARCH ITEM Skenario Aksi Aktor Reaksi Aplikasi 1. User Memilih Menu Search Item 2. Menampilkan Form Search Item 3. User Input Nama Barang 4. Meminta Data Barang 5. Server Query ke Data Base 6. Server Mengirim hasil Query 7. Menampilkan List Barang 8. User Memilih Barang 9. Set Lokasi Barang 10. Menampilkan Lokasi Barang No. Use Case : 02 Nama Use Case : MARKET LOCATION Scenario :

9 58 Tabel 4.2, MARKET LOCATION Skenario Aksi Aktor Reaksi Aplikasi 1. User Memilih menu Market Location 2. Meminta Data Market 3. Server Query ke Data Base 4. Server Mengirim hasil Query 5. Menampilkan List Market 6. Memilih Market 7. Set Lokasi Market 8. Menampilkan Lokasi Market No. Use Case : 03 Nama Use Case : PROMO Scenario : Tabel 4.3, PROMO Skenario Aksi Aktor Reaksi Aplikasi 1. User Memilih Menu View Promo 2. Meminta Data Promo 3. Server Query ke Data Base 4. Server Mengirim Data 5. Menampilkan List Promo

10 59 No. Use Case : 04 Nama Use Case : INFO ALFAMART Scenario : Tabel 4.4, INFO ALFAMART Skenario Aksi Aktor Reaksi Aplikasi 1. User Memilih Menu Info 2. Meminta Data Info 3. Sistem melakukan Refresh Data dan Mengambil Data Data Server 4. Server Mengirim Data 5. Menampilkan List Info

11 Activity Diagram 1. Search Item Activity Diagram USER APLICATION SERVER PILIH MENU SEARCH ITEM MENAMPILKAN FORM SEARCH ITEM INPUT NAMA BARANG MEMINTA DATA BARANG QUERY KE DATA BASE MEMILIH BARANG MENAMPILKAN LIST BARANG MENGIRIM HASIL QUERY SET LOKASI BARANG MENAMPILKAN LOKASI BARANG (Gambar 4.4, Search Item Activity Diagram)

12 61 2. Market Activity Diagram USER APLICATION SERVER PILIH MENU MARKET MEMINTA DATA MARKET QUARY KE DATA BASE MEMILIH MARKET MENAMPILKAN LIST MARKET MENGIRIM HASIL QUARY SET LOKASI MARKET MENAMPILKAN LOKASI MARKET (Gambar 4.5, Market Activity Diagram)

13 62 3. Promo Activity Diagram USER APLICATION MEMILIH MENU PROMO MEMINTA DATA PROMO SERVER QUERY KE DATA BASE SERVER MENGIRIM DATA MENAMPILKAN PROMO (Gambar 4.6, Promo Activity Diagram)

14 63 1. Info Alfamart Activity Diagram USER APLICATION MEMILIH MENU INFO MEMINTA DATA INFO MELAKUKAN REFRESH DATA DAN MENGAMBIL DATA DARI SERVER SERVER MENGIRIM DATA SERVER MENAMPILKAN LIST INFO (Gambar 4.7, Info Alfamart Activity Diagram)

15 Class Diagram AndroidDashboardDesignActivity +oncreate() SearchActivity +KEY_TITLE_SEARCH +KEY_PRICE_SEARCH +KEY_DEC_SEARCH +KEY_LAT_SEARCH +KEY_LONG_SEARCH +adapter +con +intent +jsonobj +malistviewperso +menuitem +oncreate() +searchproductbyid() +setlist() ItemMaps +oncreate() +isroutedisplayed() MarketActivity +KEY_TITLE_MARKET +KEY_PRICE_MARKET +KEY_DEC_MARKET +KEY_LAT_MARKET +KEY_LONG_MARKET +adapter +con +intent +jsonobj +malistviewperso +menuitem +oncreate() +searchproductbyid() +setlist() promo +KEY_TITTLE_PROMO +KEY_PRICE_PROMO +KEY_DEC_PROMO +KEY_LAT_PROMO +KEY_LONG_PROMO +con +intent +jsonobj +oncreate() info +username +message +image_url +searchurl +responsebody +jsonobject +parser +obj +arr +j +Tweet() +gettweets() +DefaultHttpClient() +HttpGet() +add() connectserver +api +base_url +getbaseurl() +setapi() +getapi() +getjsonobj() +requesthttp() +writejson() (Gambar 4.8, Class Diagram) Tabel 4.5, Deskripsi Class Diagram Class Jenis Class Deskripsi AndroidDashboardDesignActivity Controler Class yang berisi method-method yang berfungsi mengontrol tampilan Menu SearchActivity Controler Class yang berisi method-method yang

16 65 Class Jenis Class Deskripsi berfungsi mengontrol tampilan Search Item MarketActivity Controler Class yang berisi method-method yang berfungsi mengontrol tampilan Market Location Promo Activity Controler Class yang berisi method-method yang berfungsi mengontrol tampilan Promo InfoActivity Controler Class yang berisi method-method yang berfungsi mengontrol tampilan Info ItemMaps Controler Class yang berisi method-method yang berfungsi mengontrol tampilan Maps connectserver Controler Class yang berisi method-method yang berfungsi koneksi ke

17 66 Class Jenis Class Deskripsi server Sequence Diagram 1. Search Item Sequence Diagram menu : AndroidDashboardDesignActivity SearchItem : SearchActivity Maps : ItemMaps connect : ConnectServer Server : User 1 : oncreate() 2 : Select Search Item 3 : oncreate() 4 : Form Search Item 5 : Nama Barang() 6 : Search Product By ID() <<create>> 7 8 : setapi() 9 : getapi() 10 : getbaseurl() 11 : requesthttp() 12 : Query 13 : hasilquery 14 : writejson() 15 : getjson() 18 : setlist() 16 : data barang <<destroy>> : listbarang 20 : selectbarang 21 : oncreate() 22 : isroutedisplayed() 23 : lokasibarang (Gambar 4.9, Search Item Sequence Diagram)

18 67 2. Market Sequence Diagram menu : AndroidDashboardDesignActivity SearchMarket : SearchActivity Maps : ItemMaps connect : ConnectServer Server : User 1 : oncreate() 2 : Select Search Market 3 : oncreate() 4 : Search Mart By ID() <<create>> 5 6 : setapi() 7 : getapi() 8 : getbaseurl() 9 : requesthttp() 10 : Query 11 : hasilquery 12 : writejson() 13 : getjson() 14 : data Market <<destroy>> : setlist() 17 : listminimarket 18 : selectminimarket 19 : oncreate() 20 : isroutedisplayed() 21 : lokasiminimarket (Gambar 4.10, Market Sequence Diagram)

19 68 3. Promo Sequence Diagram menu : AndroidDashboardDesignActivity promo : promo connect : connectserver Server : Aktor 1 : oncreate() 2 : oncreate() 3 : getpromo() 4 : setapi() 5 : getapi() 6 : getbaseurl() 7 : requesthttp() 8 : Data() 10 : promodata 11 : setpromo() 9 : Data 12 : showpromo (Gambar 4.11, Market Sequence Diagram)

20 69 4. Info Sequence Diagram menu : AndroidDashboardDesignActivity info : info connect : connectserver Server : Aktor 1 : oncreate() 2 : oncreate() 3 : gettweet() 4 : setapi() 5 : getapi() 6 : getbaseurl() 7 : requesthttp() 8 : Data() 10 : infodata 11 : setinfo() 9 : Data 12 : showinfo (Gambar 4.12, Info Sequence Diagram)

21 Component Diagram Search Item Main Market connect Server Promo Info Market (Gambar 4.13, Component Diagram) Deployment Diagram Google Server Google API Android Client XML GUI server Web Server Class MySQL Data Base Resource (Gambar 4.14, Deployment Diagram)

22 Perancangan Antar Muka Untuk memudahkan proses pembuatan aplikasi pencarian informasi barang, dan lokasi pada minimarket Alfamart ini, maka terlebih dahulu membuat rancangan antar muka diantaranya Menu, Search Item, Capture Code, Barcode Scanner, View Promo, Promo Detail, Find Mart dan Maps. 1. Perancangan Antar Muka Menu Perancangan Antar Muka Menu adalah Desain Interface dari konten Menu. Terdiri dari Tab Item, Tab Market dan Tab Info. (Gambar 4.15, Perancangan Antar Muka Menu)

23 72 2. Perancangan Antar Muka Search Item Perancangan Antar Muka Search Item adalah Desain Interface dari konten Search Item yang dapat user gunakan untuk mencari informasi barang berdasarkan nama barang. Terdapat Form Search Item yang Terdiri dari Edit Text, Button Search dan List View. (Gambar 4.16, Perancangan Antar Muka Search Item)

24 73 3. Perancangan Antar Muka Market. Perancangan Antar Muka Market adalah Desain Interface dari konten Maket yang dapat user gunakan untuk mendapatkan informasi lokasi minimarket Alfamart. Terdapat List View yang menunjukan informasi Lokasi minimarket Alfamart. (Gambar 4.17, Perancangan Antar Muka Market)

25 74 4. Perancangan Antar Muka Info Perancangan Antar Muka Info adalah Desain Interface dari konten info yang dapat user gunakan untuk mendapat info seputar Alfamart. (Gambar 4.18, Perancangan Antar Muka Info) 5. Perancangan Antar Muka Maps Perancangan Antar Muka Maps adalah Desain Interface dari konten Maps yang dapat user gunakan untuk melihat lokasi minimarket Alfamart dalam bentuk Street View pada google-maps.

26 (Gambar 4.19, Perancangan Antar Muka Maps) 75