T0 562013009 BAB III

1

BAB III

Perancangan Sistem

Pengumpulan Kebutuhan

Metode perancangan ini mengacu pada pendekatan berorientasi objek menggunakan pemodelan UML (Unified

ModellingLanguage). Berdasarkan komponen proses metode

UML terbagi menjadi 6 fase yaitu (Utomo, 2003): 1. Pemodelan Bisnis

Merupakan langkah untuk mengidentifikasi kemampuan sistem yang diinginkan oleh pengguna. Menganalisa cara kerja sistem informasi yang saat ini digunakan adalah salah satu cara untuk mengetahui Pemodelan Bisnis. Namun ada cara lain juga yang akan lebih detail dengan melakukan wawancara langsung kepada pengguna secara langsung. Informasi yang didapatkan akan lebih rinci dan sesuai dengan yang diinginkan oleh pengguna.

2. Analisis dan Perancangan

Merupakan langkah menguraikan cara untuk merealisasikan sistem yanitu dengan melakukan perancangan aplikasi. Mengumpulkan informasi yang akan disajikan dalam sistem informasi yang akan dibuat. - Menganalisa bahasa pemrograman dari sistem

- Menganalisa software dan struktur database yang digunakan

- Menganalisa hasil cetak laporan pengecheckan laboratorium

- Menganalisa service pesan singkat yang akan digunakan, dalam hal ini digunakan TELEGRAM

3. Requirements (Kebutuhan)

Merupakan langkah untuk mengidentifikasi kebutuhan fungsional dan kebutuhan non fungsional di dalam program. Untuk memenuhi kebutuhan dari pembuatan sistem informasi ini maka beberapa hal dibawah diberikut :

- Komputer Database Server (Microsoft SQL

Server)

- Komputer Web Server (Internet Information Services)

- Koneksi internet dengan kecepatan minimal 1 Mbps

- Komputer pengguna applikasi ini

4. Implementasi

Pemasangan database pada database server, pemasangan scriptwebreport dan webservice pada web

server, instalasi TELEGRAM connector di server

database dan instalasi aplikasi client di masing-masing

komputer staff.

5. Pengujian

Langkah untuk melakukan verifikasi sistem secara keseluruhan. Pengujian berhasil jika Aplikasi pada komputer staff dapat login dan mengakses data yang ada pada database server. Pengujian berhasil jika aplikasi TELEGRAM connector dapat menangani pesan masuk dan keluar. Pengujian berhasil jika Customer dapat mengakses laporan hasil uji laboratorium pada web

report pada server.

6. Penyerahan

Ruang Lingkup Aplikasi

DesktopApplication

Memudahkan Pengguna (Accudi) dalam menggunakan program ini dalam mengolah data-data pelanggan

o Fungi

 Memasukan hasil pengujian laboratorium

 Mengolah data pelanggan  Mengolah data laporan

 Melakukan perubahan konfigurasi auto reply

 Melakukan pengiriman pesan pribadi

dan masal

 Membaca pesan yang diterima  Mengatur hak akses setiap pengguna

o Fitur

 _{User Biasa}

- Mengolah data pelanggan baru maupun lama

- Pengiriman pesan pribadi dan masal

- Pengiriman pesan ucapan selamat ulang tahun

- Membuat dan merubah akses pelanggan ke Web Report

 _{User Admin}

- Pengiriman pesan pribadi dan masal

- Pengiriman pesan ucapan selamat ulang tahun

- Membuat dan merubah akses pelanggan ke WebReport

- Mengatur fitur-fitur yang tersedia

- Mengatur hak akses dari pengguna

WebBasedApplication

Memudahkan pelanggan (Accudi) dalam mengakses secara langsung hasil pengecheckan melalui web

browser dari komputer maupun handphone.

o Fungsi

 Digunakan untuk menampilkan hasil

laporan dari pengecheckan yang akan ditampilkan dalam format HTML

menggunakan web browser

o Fitur :

 Login menggunakan username dan

password yang sudah terdaftar

 Dapat mengakses langsung

menggunakan kode yang sudah diolah oleh server

 Pelanggan dapat melihat hasil

pengecheckan terbaru dan yang sebelumnya.

Konsep Perancangan

Gambaran Umum Aplikasi

WEB SERVER LAYER

USER LAYER DATABASE SERVER LAYER

WEB REPORT

WEB SERVICE

DESKTOP APPLICATION

DATABASE

TELEGRAM

CONNECTOR

Gambar 3.1 : Gambaran Umum Aplikasi

Sistem informasi yang dibuat ini terpusat pada satu

server database untuk menghubungkan semua module agar dapat

saling berkomunikasi dan sistem dapat berjalan. Telegram

Connector ditempatkan pada layer yang sama dengan database

3.3.1.1. Pengguna aplikasi

A. Administrators

Administrator memiliki hak akses sebagai berikut :

1. Menambah dan menghapus akun user 2. Mengelola hak akses akun user 3. Merubah konfigurasi Auto-Reply

4. Merubah pengaturan TELEGRAM

B. Users

1. Menambah, merubah dan menghapus data pelanggan

2. Menambah dan menghapus hasil dari pengecheckan pelanggan

3. Merubah passwordwebreport milik pelanggan

C. Customers

1. Login ke dalam webreport

Perancangan Antar Muka

Perancangan Antar Muka Aplikasi Berbasis Desktop

Login

USERNAME

PASSWORD

ACCUDI LABORATORIUM

Please Login Here

LOGIN

Gambar 3.2: FormLogin

Laboratorium Accudi

Tanggal : 00/jan/1990 Jam : 00:00:00 Reports Customers

Home Chat Settings Exit

Customers Reports Chat Settings

PANEL

Gambar 3.3: TAB Home

Laboratorium Accudi

Tanggal : 00/jan/1990 Jam : 00:00:00 Reports Customers

Home Chat Settings Exit

PANEL

Add

Customer CustomerUpdate CustomerDelete CustomerFind Show All

Gambar 3.4 : TAB Customers

Gambar 3.4 adalah ruang lingkup kerja dalam mengolah data-data pelanggan, didalamnya terdapat tombol-tombol dan panel

CUSTOMER

DATA GRID

Gambar 3.5 : User Control - Customer

Customer ID Anggota :

Firstname: Lastname : Sex : Birth of Date : Identity Card : Religion :

Age : _

Male Female

CANCEL OK

Gambar 3.6: Form Dialog Customer - Tab Personal

Gambar 3.6 akan muncul ketika pengguna menekan tombol

Add Customer dan Update Customer di Form Utama – Tab

Customer. Yang berfungsi untuk menambah dan memperbaharui

Customer

Enter Text Enter Text

City : Main Address :

Alternate Address:

CANCEL OK

Country : Telegram :

Gambar 3.7 : Form Dialog Customer Tab Contact

Customer

Web Report Contact

Personal

Enter Text Enter Text Username :

Password :

CANCEL OK

Gambar 3.8 : Form Dialog Customer Tab Web Report

Pada Gambar 3.8 berisikan username dan password yang dapat digunakan untuk mengakses hasil laporan medis melalui web

browser.

Search Customer

Enter Text Search

Masukan ID atau Nama Anggota

Gambar 3.9 : Form Dialog Search Customer

Laboratorium Accudi

Tanggal : 00/jan/1990 Jam : 00:00:00 Reports Customers

Home Chat Settings Exit

PANEL

Add

Report Update Report ReportDelete ReportFind Show All ReportsSend Settings

Gambar 3.10 : Tab Reports

REPORTS

DATA GRID

Gambar 3.11 : User Control Isi Dari Panel Reports

Gambar 3.11 akan menampilkan daftar laporan pengujian laboratorium secara menyeluruh maupun sebagian hasil dari pencarian.

Search Laporan

Enter Text Search

Masukan ID laporan

Gambar 3.12 : Form Dialog Search Report

Laboratorium Accudi

Tanggal : 00/jan/1990 Jam : 00:00:00 Send

Message BroadcastSend MessageRefresh Reports Customers

Home Chat Settings Exit

PANEL

Gambar 3.13 : TabChat

Enter Text

MESSAGE

Balas Cepat Tujuan : Pesan :

Kirim 000000000

DATA GRID

Gambar 3.14 : UserControl Dari PanelChat

Gambar 3.14 berisikan sekumpulan catatan pesan keluar dan masuk dari Telegram Connector. Juga disediakan cara cepat untuk menjawab pesan yang masuk dengan hanya memilih pesan yang masuk dan mengetikan pesan balasan pada textbox sebelah kanan, lalu tekan Kirim untuk mengirim pesan.

Private Message

Enter Text

Enter Text Nomor ID Telegram :

KIRIM

Gambar 3.15 muncul setelah pengguna menekan tombol

“Send Private Message”. Pada form dialog ini disediakan satu

combo box yang berisikan daftar pelanggan yang memiliki ID

Telegram. Hanya dengan mengetikan nama pelanggan, id telegram dapat dengan mudah diketahui.

Broadcast Message

Column 1

Enter Text

Text Text Text Penerima :

CANCEL Pesan :

SEND

Gambar 3.16 : Form Dialog Kirim Pesan Masal

Gambar 3.16 muncul setelah pengguna menekan tombol

“Send Broadcast Message”. Pada form dialog ini disediakan satu

checklist box yang berisikan daftar pelanggan yang memiliki ID

Laboratorium Accudi

Tanggal : 00/jan/1990 Jam : 00:00:00 Reports Customers

Home Chat Settings Exit

PANEL

Users

Settings Telegram Settings SettingsFeature

Gambar 3.17: Tab Settings

Gambar 3.17 adalah ruang lingkup yang disediakan untuk pengguna dalam mengatur konfigurasi hak akses, Telegram

Connector dan fitur yang tersedia pada aplikasi sistem informasi

Enter Text

Add Edit Delete

Nama Depan

Gambar 3.18 : User Control User Setting Isi Dari Panel Settings

Gambar 3.18 muncul bersamaan pada saat Tab Setting ditekan atau tombol “Users Setting” ditekan. User control ini disediakan untuk mengolah user dan hak akses yang digunakan untuk menggunakan Aplikasi Sistem informasi Laboratorium ACCUDI.

Gambar 3.19 muncul saat tombol TELEGRAM Setting pada

tab Setting ditekan. User Control ini disediakan untuk mengatur

program TELEGRAM Connector supaya dapat terhubung dengan

server TELEGRAM dan untuk mengaktifkan dan mematikan fitur

ini.

FEATURE SETTING

Save Change Config

Auto Reply

Auto Reply

DATA GRID

(editable)

Gambar 3.20 : User Control Feature Setting Isi Dari Panel Settings

Gambar 3.20 muncul ketika pengguna menekan tombol

FeatureSetting pada TabSetting. User Control ini disediakan untuk

Laboratorium Accudi

Tanggal : 00/jan/1990 Jam : 00:00:00 Logout User _ApplicationClose

Reports Customers

Home Chat Settings Exit

PANEL

Gambar 3.21: TAB Exit

Jaringan Semantik Aplikasi Desktop

Report Update

Customer Form

Utama – Tab Report

Gambar 3.22 : Jaringan Semantik Aplikasi Desktop

Perancangan Antar Muka WebReport

Default.aspx

Please sign in

Logo

Tampilan pertama saat mengakses webreport. Diperlukan

username dan password untuk dapat masuk dan melihat hasil

pengujian laboratorium.

MasterPage.master

Nav Bar

Side Bar Sideframe

Content Placeholder

logout

Welcome, <username>

Nav Brand

ACCUDI WEB REPORT Nav Item

Report List

Welcome <username> (Full Name)

Gambar 3.24 : MasterPage.master (layout halaman)

Gambar 3.24 adalah halaman yang akan menjadi layout

tampilan setelah login. Semua halaman yang ditampilkan akan memiliki layout yang sama karena mewarisi dari halaman

MasterPage.master ini. Halaman yang mewarisi dari layout ini akan

ReportDashboard.aspx

Gambar 3.25 : ReportDashboard.aspx (Page Content Reportl list) Gambar 3.25 adalah halaman yang berisikan daftar laporan hasil pengujian laboratorium yang sebelumnya sudah dimasukan melalui aplikasi berbasis desktop. Setiap idlaporan memiliki tombol bertuliskan “Lihat” yang akan merujuk ke halaman Report.aspx.

Report.aspx

Medical Check Up Report

Kembali

ID Pengecheckan : 00000000-0000-0000-0000-00000000000000 Nama Pasien : Nama Lengkap Pasien

Tanggal Periksa : 13/04/2016 13:29:42

Pengecheckan Hasil Satuan Nilai Rujukan Keterangan

Kimia Klinik Fungsi Ginjal Ureum 20 mg/dL < 48 Keratinin 0.30 < 0.47 Urine Urine Rutin Makroskopis Warna Kuning

Gambar 3.26 : Report.aspx (detail isi laporan)

Gambar 3.26 adalah halaman yang muncul setelah pelanggan menekan tombol lihat pada daftar di halaman

secara detail hasil pengujian laboratorium berdasarkan idLaporan yang dipilih.

Site Map Web Report

reports.domain .com

Default.aspx ReportDashboard.aspx

Report.aspx

Gambar 3.27 : SitemapWebReport

Susunan sitemap pada halaman webreport hanya terdiri dari 3 halaman yang saling terkait. Sebelum customer masuk kehalaman

ReportDashboard.aspx maka diperlukan login pada halaman

Default.aspx terlebih dulu dan untuk dapat masuk ke Report.aspx

Perancangan Antar Muka TELEGRAM Connector

Telegram Connector

0 0

Bot id : 000000000 Bot Name : xxxxxxxx

Pesan dikrim Pesan diterima

Connected

Gambar 3.28 : Tampilan TELEGRAM Connector

Perancangan Model Bisnis

Rancangan Use Case Diagram Model

USE CASE ACCUDI

Admin

User

Client Setting Telegram API

Setting User Access

Setting Report Parameters

Check Report

Chatting Create Customers

Create Reports

Sent Reports

Update Telegram ID

<<extend>>

Gambar 3.29 : Rancangan Use Case Diagram

Dalam peranannya dibagi menjadi 3 yaitu Admin, Staff dan

Client (Pelanggan) dengan masing-masing memiliki hak akses dari

Rancangan Activity Diagram 3.5.2.1. Login Activity Diagram

Applikasi Desktop Web Service Database

Function Function Function

Ph

Login Validasi login Mencari data _{user login}

Mengembalikan hasil pencarian Ada?_ya

Request detail informasi user

Tidak

Mengambil detail informasi

user Mengembalikan

hasil pencarian informasi detail

user Respond detail

informasi user Menampilkan

Menu Utama

Gambar 3.30: LoginActivity Diagram

Pada saat aplikasi berjalan diperlukan login untuk dapat menggunakan aplikasi ini. Webservice berfungsi untuk memvalidasi

username dan password yang dikirimkan oleh aplikasi dan

3.5.2.2. Memuat data customer

Gambar 3.31 : Activity Diagram Data Customer

Setelah proses login selesai dan dinyatakan valid maka aplikasi akan melakukan request pengambilan data pelangan ketika masuk di menuCustomer. Web service akan mengembalikan request

3.5.2.3. Memuat data laporan

Gambar 3.32 : Activity Diagram Laporan

Setelah proses login selesai dan dinyatakan valid maka aplikasi akan melakukan request pengambilan data pelangan ketika masuk di menuReports. Web service akan mengembalikan request

3.5.2.4. Menampilkan Daftar Pesan

Gambar 3.33 : Activity Diagram Daftar Pesan

Setelah proses login selesai dan dinyatakan valid maka aplikasi akan melakukan request pengambilan data pelangan ketika masuk di menu Chat. Web service akan mengembalikan request

3.5.2.5. Mengirim dan menerima pesan

Ph

as

e

Ph

as

e

Ph

as

e

Ph

as

e

Dalam proses kirim dan terima pesan diperlukan masukan dari aplikasi berupa kode token yang didapat dari aplikasi Telegram supaya dapat terhubung dengan server. Token tersebut diterima oleh

web service lalu disimpan dalam database. Ketika program

Telegram konektor berjalan akan melakukan pengecheckan kode token yang ada di database yang akan digunakan untuk terhubung

ke server Telegram dan mengambil pesan yang ada dan mengirim

pesan yang ada di database untuk dikirim. Rancangan ClassDiagram

3.5.3.1. Editable Class

ClassCustomer

Gambar 3.2 : EditableClass

3.5.3.2. ReadOnly Class

Gambar 3.3 : ReadOnly Class

3.5.3.3. Class List of Object

Gambar 3.4 : Class List Of Object (Class Daftar)

Pemodelan Penyimpanan Data

a. tblCustomer

Berisikan tentang semua data pribadi customer

Column Name Data Type Allow _Null idCustomer uniqueidentifier FALSE tanggalPendaftaran date FALSE idAnggota varchar(12) FALSE typeIdentitas varchar(10) TRUE nomorIdentitas varchar(50) TRUE namaDepan varchar(50) FALSE namaBelakang varchar(100) TRUE tanggalLahir date FALSE agama varchar(50) FALSE jenisKelamin int FALSE alamat1 varchar(300) FALSE alamat2 varchar(300) TRUE kota varchar(50) FALSE propinsi varchar(50) FALSE kodePos varchar(10) FALSE negara varchar(50) FALSE nomorTelepon varchar(50) TRUE nomorHandphone varchar(50) TRUE nomorWhatsapp varchar(50) TRUE email varchar(100) TRUE username varchar(20) FALSE password varchar(20) FALSE isDeleted bit FALSE

Tabel 3.2 : Tabel Customer b. tblUser

Berisikan tentang data-data user staff maupun admin

idUser int FALSE idRole int FALSE title varchar(50) TRUE namaDepan varchar(50) FALSE namaBelakang varchar(100) TRUE idJabatan int TRUE username varchar(8) FALSE password varchar(8) FALSE msgFooter varchar(100) TRUE isDeleted bit TRUE

Tabel 3.3 : Tabel User c. tblJabatan

Berisikan jabatan dari masing-masing staff

Column Name Data Type Allow _Null idJabatan int FALSE NamaJabatan varchar(50) FALSE

Tabel 3.4 : Tabel Jabatan d. tblRole

Berisikan hak akses dari tiap-tiap tingkatan

getReport bit FALSE setReport bit FALSE addCustomer bit FALSE updCustomer bit FALSE delCustomer bit FALSE getCustomer bit FALSE modConfig bit FALSE chat bit FALSE privateChat bit FALSE broadcastChat bit FALSE

Tabel 3.5 : Tabel Role e. tblLaporanPengecheckan

Berisikan nilai-nilai parameter kesehatan dari hasil uji laboratorium

Column Name Data Type Allow _Null idPengecheckan uniqueidentifier FALSE idChildCategory int FALSE hasil varchar(50) FALSE keterangan varchar(100) TRUE idUser int FALSE idCustomer uniqueidentifier FALSE

hide bit TRUE

Tabel 3.6 : Tabel Laporan Pengecheckan f. tblWebReport

berisikan daftar laporan kesehatan yang sudah selesai di proses dan diterbitkan, atau yang disembunyikan

hide bit FALSE

Tabel 3.7 : Tabel WebReport

g. tblChildCategory

berisikan parameter-parameter uji kesehatan yang lebih detail

Column Name Data Type Allow _Null idChildCategory int FALSE nama varchar(50) FALSE satuan varchar(50) TRUE nilaiRujukan varchar(50) TRUE idParentCategory int FALSE

Tabel 3.8 : Tabel ChildCategory

h. tblParentCategory

berisikan sub kategori dari parameter uji kesehatan

Column Name Data Type Allow _Null idParentCategory int FALSE nama varchar(50) FALSE idGeneralCategory int FALSE

Tabel 3.9 : Tabel ParentCategory

i. tblGeneralCategory

berisikan kategori umum dari sekumpulan parameter uji kesehatan

Column Name Data Type Allow _Null idGeneralCategory int FALSE nama varchar(50) FALSE

j. tblMessage

Column Name Data Type Allow _Null idMessage uniqueidentifier FALSE idTelegram varchar(50) TRUE pesan varchar(3000) TRUE keyword varchar(50) TRUE idUserSender int TRUE status int TRUE waktu datetime TRUE

Tabel 3.10 : Tabel Message

k. tblAutoAnswer

berisikan keyword dan pesan balasan otomatis yang sudah disiapkan untuk melayani pelanggan secara otomatis

Column Name Data Type Allow _Null keyword varchar(50) FALSE pesanOtomatis varchar(1000) FALSE isActive bit FALSE

Tabel 3.11 : Tabel AutoAnswer

l. tblConfigTelegram

berisikan data-data dari aplikasi TELEGRAM supaya dapat terhubung dengan aplikasi TELEGRAM dan mengatur jalan atau tidaknya layanan tersebut.

Column Name Data Type Allow _Null telegramAPI varchar(50) FALSE isOnline bit FALSE

Tabel 3.12 : Tabel Config Telegram

berisikan konfigurasi yang dapat digunakan untuk menjalankan fitur yang dibuat

Column Name Data Type Allow _Null autoAnswer bit FALSE autoBirthdayGreeting bit FALSE

Tabel 3.13 : Tabel Config App

Pemodelan Distribusi Aplikasi

PELANGGAN USER 1 USER 2

PELANGGAN Communicator

Communicator

Web Server

Web Service

Desktop App Desktop App Database Server

Gambar 3.35 : Konsep Perancangan

Aplikasi komputer staff mengakses ke server Web Service

connector dan webserver untuk menyimpan dan mendapatkan data yang dibutuhkan staff maupun Customer yang ada pada server