BAB 2 TINJAUAN REFERENSIlibrary.binus.ac.id/eColls/eThesisdoc/Bab2/RS1_2019_1...13 tim. Contoh API...

30
9 BAB 2 TINJAUAN REFERENSI 2.1 Extreme Programming (XP) Menurut Pressman & Maxim (2015, p. 72), Extreme Programming merupakan salah satu metode pendekatan untuk pengembangan aplikasi pada agile software development. Extreme Programming menggunakan pendekatan berorientasi objek sebagai pilihan paradigma pembangunannya dan mencakup seperangkat aturan dan praktik yang terjadi dalam konteks empat aktivitas framework, yaitu planning (perencanaan), design (desain), coding, dan testing (pengujian). (Pressman & Maxim, 2015, p. 72) Planning. Kegiatan perencanaan ini dimulai dengan tahap listening. Pada tahap ini dilakukan pengumpulan requirement (kebutuhan) yang bisa membantu anggota teknikal dari tim XP untuk memahami konteks bisnis dari perangkat lunak dan memahami secara menyeluruh mengenai output, Gambar 2.1 Proses Extreme Programming

Transcript of BAB 2 TINJAUAN REFERENSIlibrary.binus.ac.id/eColls/eThesisdoc/Bab2/RS1_2019_1...13 tim. Contoh API...

Page 1: BAB 2 TINJAUAN REFERENSIlibrary.binus.ac.id/eColls/eThesisdoc/Bab2/RS1_2019_1...13 tim. Contoh API yang terkenal dan sering digunakan adalah API milik twitter dan facebook (Jacobson,

9

BAB 2

TINJAUAN REFERENSI

2.1 Extreme Programming (XP)

Menurut Pressman & Maxim (2015, p. 72), Extreme Programming

merupakan salah satu metode pendekatan untuk pengembangan aplikasi

pada agile software development. Extreme Programming menggunakan

pendekatan berorientasi objek sebagai pilihan paradigma pembangunannya

dan mencakup seperangkat aturan dan praktik yang terjadi dalam konteks

empat aktivitas framework, yaitu planning (perencanaan), design (desain),

coding, dan testing (pengujian).

(Pressman & Maxim, 2015, p. 72)

Planning. Kegiatan perencanaan ini dimulai dengan tahap listening.

Pada tahap ini dilakukan pengumpulan requirement (kebutuhan) yang bisa

membantu anggota teknikal dari tim XP untuk memahami konteks bisnis

dari perangkat lunak dan memahami secara menyeluruh mengenai output,

Gambar 2.1 Proses Extreme Programming

Page 2: BAB 2 TINJAUAN REFERENSIlibrary.binus.ac.id/eColls/eThesisdoc/Bab2/RS1_2019_1...13 tim. Contoh API yang terkenal dan sering digunakan adalah API milik twitter dan facebook (Jacobson,

10

fitur dan fungsionalitas utama yang dibutuhkan. Dari kegiatan listening,

dihasilkan kumpulan “stories” (disebut juga user stories) yang

mendeskripsikan output, fitur, dan fungsionalitas yang dibutuhkan untuk

membangun perangkat lunak. Selama tahap pengembangan, user bisa

menambahkan stories, mengubah stories yang sudah ada, memisahkan

stories, atau menghapus stories. Kemudian tim XP akan mempertimbangkan

dan menyesuaikan perubahan sesuai rencana.

Iteration Planning. Setiap iterasi diawali dengan iteration planning.

Pada fase ini, pengembang mempersiapkan dari aktivitas mereka untuk

mengimplementasikan fitur yang dibutuhkan pada current release. Seperti

release planning, iteration planning juga memiliki exploration, komitmen,

dan steering phase tetapi customer tidak terlibat dalam tahap ini. Selama

iteration planning, programmer memilih tasks yang akan diimplemen dan

memperkirakan biaya yang dibutuhkan, waktu, dan upaya untuk task yang

dipilih. Tasks bisa diberikan ke programmer lain untuk menyeimbangkan

beban kerja. (Anwer, Aftab, Shah, & Waheed, 2017)

Design. Tahap desain pada extreme programming mengikuti aturan

KIS (keep it simple) yang artinya desain yang sederhana lebih diutamakan

dari pada desain yang rumit. Penggunaan desain dengan fungsi ekstra

(asumsi akan dibutuhkan nantinya) tidak disarankan, karena desain hanya

berbasis pada implementasi user story (tidak kurang, tidak lebih).

Coding. Setelah stories dan desain selesai, pengembang tidak

langsung melakukan code tetapi membuat kumpulan unit tests untuk

menguji setiap stories yang ada. Setelah itu pengembang berfokus pada apa

yang harus diimplementasikan untuk berhasil melalui setiap unit tests yang

telah dibuat. Setelah code selesai dibuat, dapat dilakukan testing untuk

mendapatkan umpan balik ke pengembang. Konsep utama dari aktivitas

coding extreme programming adalah pair programming. XP

merekomendasikan dua orang untuk bekerjasama dalam pengembangan

aplikasi. Hal ini membantu dalam penyelesaian masalah secara langsung

(real-time problem solving) dan memastikan kualitas secara langsung (real-

time quality assurance).

Page 3: BAB 2 TINJAUAN REFERENSIlibrary.binus.ac.id/eColls/eThesisdoc/Bab2/RS1_2019_1...13 tim. Contoh API yang terkenal dan sering digunakan adalah API milik twitter dan facebook (Jacobson,

11

Testing. Perlu dilakukan individual unit tests untuk menvalidasi

sistem. Hal ini dapat membantu pengembang menemukan permasalahan

yang ada secara bertahap dan memperbaikinya. Selanjutnya ada acceptance

testing atau disebut juga customer tests, dimana user berfokus pada fitur dan

fungsionalitas sistem secara keseluruhan.

2.2 Framework

Framework merupakan kumpulan koleksi dari komponen third-party

dengan beragam kerangka kerja yang terikat seperti pengaturan berkas,

service providers, menentukan struktur direktori, dan aplikasi bootstraps.

Keuntungan menggunakan framework secara umum adalah framework

sudah menentukan bagaimana komponen-komponen yang ada bisa saling

berhubungan (Stauffer, 2019, p. 1).

2.3 Model-View-Controller (MVC)

Menurut Galloway, Wilson, Allen, & Matson (2014, p. 2), Model-

View-Controller atau disingkat MVC sudah menjadi pola arsitektur yang

sangat penting diilmu computer selama bertahun-tahun. MVC memiliki cara

yang baik dalam memisahkan masalah dalam suatu aplikasi (misalnya,

memisahkan logika akses data dari logika tampilan) dan menerapkannya

dengan sangat baik pada aplikasi web. MVC memisahkan user interface

(UI) dari sebuah aplikasi menjadi tiga bagian utama:

1. The Model: Kumpulan kelas yang menjelaskan data yang dikerjakan

dan aturan bisnis tentang bagaimana data dapat diubah dan dimanipulasi.

2. The View: Menjelaskan bagaimana UI dari sebuah aplikasi akan

ditampilkan.

3. The Controller: Kumpulan kelas yang mengurus komunikasi dari

pengguna, alur aplikasi secara keseluruhan, dan logika aplikasi.

2.4 ASP .NET MVC

Menurut Galloway, Wilson, Allen, & Matson (2014, p. 1-3), ASP

.NET MVC adalah sebuah framework untuk membuat aplikasi berbasis web

yang menerapkan pola Model-View-Controller (MVC) ke framework ASP

Page 4: BAB 2 TINJAUAN REFERENSIlibrary.binus.ac.id/eColls/eThesisdoc/Bab2/RS1_2019_1...13 tim. Contoh API yang terkenal dan sering digunakan adalah API milik twitter dan facebook (Jacobson,

12

.NET yang sudah ada. ASP .NET selalu mendukung dua lapisan abstak,

yaitu:

1. System.Web.UI: lapisan web forms, mengandung kontrol server,

viewstate, dan yang lain.

2. System.Web: The Plumbing, yang menyediakan web stack dasar,

termasuk modul, penanganan (handlers), HTTP stack, dan yang lain.

MVC sering digunakan pada pemograman apliasi web. Dengan ASP

.NET MVC, dapat dijabarkan sebagai berikut:

1. Models: Kelas yang merepresentasikan domain yang difokuskan. Objek

domain tersebut seringkali mengenkapsulasi data yang disimpan di

database seperti code yang memanipulasi data dan melaksanakan logika

bisnis spesifik domain. Dengan ASP .NET MVC, kemungkinan besar

mirip seperti data access layer, menggunakan entity framework atau

NHibernate dikombinasikan dengan kode khusus yang berisi logika

spesifik domain.

2. View: Merupakan sebuah template untuk menghasilkan HTML secara

dinamis.

3. Controller: Kelas special yang menangani hubungan antara view dengan

model. Merespon input pengguna, berkomunikasi dengan model, dan

memutuskan view mana yang akan ditampilkan.

2.5 Application Programming Interface (API)

Application Programming Interface atau yang lebih awam dikenal

sebagai API menyediakan sarana untuk kolega, mitra, atau pengembang

pihak ketiga untuk mengakses data dan layanan untuk mengembangkan

sebuah aplikasi. Secara teknikal, API merupakan cara agar dua aplikasi

komputer dapat saling berkomunikasi melalui jaringan menggunakan

Bahasa umum yang dimengerti kedua belah pihak. Terdapat beberapa jenis

API, yaitu API yang terbuka untuk umum kepada semua pengembang, API

yang hanya bisa digunakan oleh mitra, dan API yang digunakan secara

internal untuk membantu proses bisnis dan menfasilitasi kolaborasi antar

Page 5: BAB 2 TINJAUAN REFERENSIlibrary.binus.ac.id/eColls/eThesisdoc/Bab2/RS1_2019_1...13 tim. Contoh API yang terkenal dan sering digunakan adalah API milik twitter dan facebook (Jacobson,

13

tim. Contoh API yang terkenal dan sering digunakan adalah API milik

twitter dan facebook (Jacobson, Brail, & Woods, 2012, p. 4).

2.6 C#

Menurut Mueller, Sempf, & Sphar (2017, p. 8), C# (dibaca “C sharp”)

merupakan salah satu bahasa pemograman yang digunakan untuk membuat

program yang bisa dijalankan. C# menggabungkan bahasa pemograman

C++ (dibaca “C plus plus”) yang powerful tetapi rumit dengan visual basic

yang lebih mudah digunakan namun berlarut-larut. C# memiliki ekstensi file

.cs. Berikut beberapa kelebihan C#:

1. Fleksibel: C# dapat mengeksekusi dari mesin yang digunakan saat itu,

atau bisa ditransmisikan melalui website dan dieksekusi melalui

komputer lain yang jauh.

2. Powerful: C# memiliki command penting yang sama seperti C++ tetapi

lebih baik.

3. Lebih mudah digunakan: C# memiliki kemampuan yang lebih baik

dalam mendeteksi eror daripada C++, sehingga waktu yang diperlukan

untuk mencari eror lebih singkat.

4. Visually Oriented: .NET (dibaca “dot net”) code library yang digunakan

oleh C# sudah menyediakan beberapa bantuan untuk membuat display

frame yang sulit dengan drop-down list, tabbed window, grouped button,

scroll bars, gambar latar belakang, dan lain-lain.

5. Internet-friendly: C# memiliki peran yang sangat penting pada .NET

framework, pendekatan Microsoft saat ini untuk pemograman windows,

internet, dan sebagainya.

6. Secure: Setiap bahasa yang akan digunakan di internet harus memiliki

keamanan yang baik untuk melawan hacker.

2.7 Hyper Text Markup Language (HTML)

Hyper Text Markup Language atau yang disingkat HTML merupakan

sebuah bahasa pemograman yang mendeskripsikan bagaimana teks, grafik,

dan file yang memuat informasi lainnya terorganisir dan saling

Page 6: BAB 2 TINJAUAN REFERENSIlibrary.binus.ac.id/eColls/eThesisdoc/Bab2/RS1_2019_1...13 tim. Contoh API yang terkenal dan sering digunakan adalah API milik twitter dan facebook (Jacobson,

14

berhubungan. Kode HTML memberitahu browser bagaimana menampilkan

teks sebagai heading, paragraf, huruf berwarna, dan sebagainya. Beberapa

HTML memberitahu browser untuk menampilkan tidak hanya teks biasa

namun bisa juga berupa gambar atau video (Meloni, 2012 , p. 1).

Gambar 2.2 Contoh kode HTML

(Meloni, 2012 , p. 9)

2.8 Cascading Style Sheets (CSS)

Cascading Style Sheets atau sering disebut CSS merupakan bahasa

pemograman yang mendefinisikan konstruksi gaya (style) seperti jenis

huruf, warna, posisi, yang digunakan untuk mendeskripsikan bagaimana

informasi pada laman web ditampilkan. CSS dapat disimpan di file HTML

atau pada file style sheet terpisah dengan ekstensi file .css. CSS memiliki

konsep sederhana yaitu: membuat dokumen style sheet yang menspesifikan

jenis huruf, warna, spasi, dan karakteristik lainnya yang membentuk

tampilan yang unik untuk sebuah situs web. Lalu setiap laman yang akan

memiliki tampilan tersebut dihubungkan dengan style sheet yang sesuai agar

tidak perlu menspesifikan style tersebut secara berulang disetiap dokumen

terpisah. Karena itu, ketika ada pergantian gaya, situs web dapat

dimodifikasi secara keseluruhan dengan mengganti satu atau dua style sheet

daripada mengganti semua style disetiap file web. Jadi style sheet adalah

grup dari instruksi format yang mengontrol tampilan dari beberapa laman

HTML secara bersamaan (Meloni, 2012 , p. 45).

Page 7: BAB 2 TINJAUAN REFERENSIlibrary.binus.ac.id/eColls/eThesisdoc/Bab2/RS1_2019_1...13 tim. Contoh API yang terkenal dan sering digunakan adalah API milik twitter dan facebook (Jacobson,

15

Gambar 2.3 Contoh kode CSS

(Meloni, 2012 , p. 49)

2.9 Javascript

Menurut Meloni (2012, p. 65), JavaScript merupakan bahasa

pemograman yang dikembangkan oleh Netscape Communication

Corporation, pembuat Netscape web browser. JavaScript adalah web

scripting language pertama yang didukung oleh browser. Berikut adalah

beberapa hal yang bisa dilakukan dengan JavaScript:

1. Menampilkan pesan ke pengguna sebagai bagian laman web, di

baris status browser, ataupun di kotak alert.

2. Validasi konten dari form dan membuat perhitungan.

3. Membuat animasi atau mengganti gambar ketika ketika mouse

diarahkan ke gambar tersebut.

4. Membuat spanduk iklan yang berinteraksi dengan pengguna,

daripada hanya menampilkan grafik.

Page 8: BAB 2 TINJAUAN REFERENSIlibrary.binus.ac.id/eColls/eThesisdoc/Bab2/RS1_2019_1...13 tim. Contoh API yang terkenal dan sering digunakan adalah API milik twitter dan facebook (Jacobson,

16

5. Mendeteksi browser atau fitur yang digunakan dan melakukan

fungsi lanjutan hanya pada browser yang mendukungnya.

6. Mendeteksi plug-in yang terpasang dan memberitahu pengguna

jika plug-in diperlukan.

7. Memodifikasi seluruh bagian laman web tanpa mewajibkan

pengguna untuk memuat ulang laman web tersebut.

8. Menampilkan atau berinteraksi dengan data yang diperoleh dari

remote server.

Gambar 2.4 Contoh penggunaan kode JavaScript untuk

menampilkan tanggal dan waktu

(Meloni, 2012 , p. 73)

2.10 JQuery

Menurut Galloway, Wilson, Allen, & Matson (2014, p. 214), JQuery

merupakan salah satu library popular yang didesain khusus untuk

JavaScript dan menjadi projek open source. JQuery unggul dalam

menemukan, melintasi (transversing), memanipulasi elemen HTML

didalam dokumen HTML. JQuery mempermudah menggunakan event

Page 9: BAB 2 TINJAUAN REFERENSIlibrary.binus.ac.id/eColls/eThesisdoc/Bab2/RS1_2019_1...13 tim. Contoh API yang terkenal dan sering digunakan adalah API milik twitter dan facebook (Jacobson,

17

handler pada elemen, menghidupkan elemen, dan membuat interaksi ajax

disekitar elemen. Berikut contoh code jQuery function:

$(function () { $("#album-list img").mouseover(function () { $(this).animate({ height: '+=25', width: '+=25' })

.animate({ height: '-=25', width: '-=25' }); });

});

Pada baris pertama kode memanggil fungsi jQuery $ yang merupakan

alias pada jQuery function dan memberikan anonymous JavaScript function

sebagai parameter pertama. Ketika parameter pertama yang diberikan

adalah fungsi, maka jQuery berasumsi ada fungsi yang akan dieksekusi

setelah document object model (DOM) dari HTML selesai dibuat, kode akan

dijalankan setelah laman HTML selesai dimuat dari server.

Pada baris kedua string ditafsirkan sebagai selector. Selector

menunjukkan jQuery elemen yang dicari untuk DOM. Elemen dapat dicari

dari nilai atribut, nama kelas, dan posisi relative. Selector pada baris kedua

bermaksud mencari gambar disemua elemen yang memiliki id album-list.

Metode mouseover mengaitkan event handler ke onmouseover event pada

setiap elemen gambar yang sesuai dengan selector.

Pada baris ketiga dan keempat kode akan membuat animasi selama

mouseover event. Pada fungsi jQuery $(this), jQuery menganggap argumen

itu sebagai referensi ke elemen dan mengembalikan set yang terbungkus

dengan elemen. Kode diatas membuat gambar membesar (panjang dan lebar

bertambah 25 pixels), lalu mengecil (panjang dan lebar berukurang 25

pixels) ketika kursor mengenai gambar.

2.11 JavaScript Object Notation (JSON)

JSON merupakan singkatan dari JavaScript Object Notation. JSON

adalah suatu format yang hamper sama dengan XML, untuk menyimpan dan

bertukar data. JSON dapat dilihat di editor atau browser. Biasanya JSON

digunakan untuk mengoper data antar tingkatan (tiers) (Prettyman, 2016, p.

63).

Page 10: BAB 2 TINJAUAN REFERENSIlibrary.binus.ac.id/eColls/eThesisdoc/Bab2/RS1_2019_1...13 tim. Contoh API yang terkenal dan sering digunakan adalah API milik twitter dan facebook (Jacobson,

18

2.12 Asynchronous JavaScript and XML (Ajax)

Asynchronous JavaScript and XML atau lebih dikenal dengan sebutan

ajax merupakan teknik yang digunakan untuk membuat aplikasi situs web

yang responsif dengan user experience yang bagus. Menjadi responsif

membutuhkan komunikasi asynchronous, tetapi tampilan yang responsif

bisa juga berasal dari animasi yang halus dan pergantian warna (Galloway,

Wilson, Allen, & Matson, 2014, p. 213).

2.13 Database

Database merupakan kumpulan data dan deskripsinya yang secara

logis saling berhubungan satu sama lain, didesain untuk memenuhi

kebutuhan informasi dari sebuah organisasi. Database adalah sebuah tempat

penyimpanan (repository) data yang besar yang bisa digunakan oleh banyak

orang dari setiap department secara bersamaan. Database tidak hanya berisi

data tetapi juga ada deskripsi dari data tersebut. Oleh karena itu, database

didefinisikan juga sebagai self-describing collection of integrated records.

Deskripsi dari data disebut sebagai system catalog atau data dictionary atau

metadata (data tentang data) (Connoly & Begg, 2015, p. 63).

2.14 Entity Relationship Diagram (ERD)

Menurut Connoly & Begg (2015, p. 405), Entity Relationship

Diagram (ERD) merupakan pendekatan desain database yang dimulai

dengan identifikasi data yang penting yang disebut entities dan hubungan

antar data yang harus direpresentasikan di model. Proses selanjutnya adalah

menambahkan detil, seperti informasi tentang attributes dan constraints

(aturan) pada entities, relationship, dan attributes.

Page 11: BAB 2 TINJAUAN REFERENSIlibrary.binus.ac.id/eColls/eThesisdoc/Bab2/RS1_2019_1...13 tim. Contoh API yang terkenal dan sering digunakan adalah API milik twitter dan facebook (Jacobson,

19

Gambar 2.5 Contoh Entity Relatioship Diagram

(Connoly & Begg, 2015, p. 407)

Pada ERD juga terdapat multiplicity yang terdiri dari dua constraint

yang terpisah, yaitu cardinality dan participation. Cardinality

mendeskripsikan angka maksimum dari hubungan yang memungkinkan

untuk muncul pada entitas yang ada dalam tipe hubungan yang diberikan.

Participation menentukan semua atau hanya beberapa entitas yang

berpartisipasi di dalam hubungan (Connoly & Begg, 2015, p. 424).

Page 12: BAB 2 TINJAUAN REFERENSIlibrary.binus.ac.id/eColls/eThesisdoc/Bab2/RS1_2019_1...13 tim. Contoh API yang terkenal dan sering digunakan adalah API milik twitter dan facebook (Jacobson,

20

(Connoly & Begg, 2015, p. 425)

2.15 Database Management System (DBMS)

Menurut Connoly & Begg (2015, p. 64), Database Management

System (DBMS) merupakan sistem perangkat lunak yang memungkinkan

pengguna untuk define (menetapkan), create (membuat), maintain

(mengelola), dan mengontrol akses ke database. DBMS merupakan

perangkat lunak yang berinteraksi dengan program aplikasi pengguna dan

database. Berikut fasilitas yang disediakan oleh DBMS:

1. Memungkinkan pengguna untuk mendefinisikan database, biasanya

melalui Data Definition Language (DDL). DDL memungkinkan

pengguna untuk menspesifikasikan tipe data, struktur data dan aturan

(constraint) data untuk disimpan di database.

2. Memungkinkan pengguna untuk insert, create, update, delete, dan

mengembalikan data dari database, biasanya melalui Data Manipulation

Language (DML).

3. Menyediakan kontrol akses ke database seperti, sistem keamanan,

sistem integritas, sistem kontrol konkurensi, sistem kontrol pemulihan,

dan katalog yang bisa diakses pengguna.

Gambar 2.6 Contoh Cardinality dan Participation

Page 13: BAB 2 TINJAUAN REFERENSIlibrary.binus.ac.id/eColls/eThesisdoc/Bab2/RS1_2019_1...13 tim. Contoh API yang terkenal dan sering digunakan adalah API milik twitter dan facebook (Jacobson,

21

2.16 Structured Query Language (SQL)

Menurut Connoly & Begg (2015, p. 191), Structured Query Language

atau yang lebih sering disebut dengan SQL merupakan suatu Bahasa yang

muncul dari pengembangan relational model. SQL adalah contoh dari

transform-oriented language, atau bahasa yang didesain untuk mengubah

input menjadi output yang diinginkan. Berikut dua komponen utama SQL:

1. Data Definition Language (DDL) untuk mendefinisikan stuktur

database dan mengontrol akses ke data.

2. Data Manipulation Language (DML) untuk menghasilkan dan

memperbarui data.

2.17 Store Procedure (SP)

Stored Procedure (SP) merupakan sebuah subprogram yang bisa

mengambil parameter dan dipanggil. SP bisa mengambil kumpulan

parameter yang diberikan dengan memanggil SP tersebut pada program. Sp

bisa memodifikasi dan mengembalikan data sebagai parameter. Pada SP

nilai yang dikembalikan bisa lebih dari satu. SP memiliki kelebihan seperti

menyediakan modularitas (modularity) dan perpanjangan (extensibility),

reusability dan maintainability, dan aid abstraction (Connoly & Begg,

2015, p. 280).

2.18 Unified Modeling Language (UML)

Unified Modeling Language (UML) merupakan standar dari kumpulan

teknik pembuatan diagram. Tujuan dari UML adalah menyediakan kosa kata

umum yang berorientasi objek dan teknik pembuatan diagram yang cukup

banyak untuk memodelkan sistem pengembangan dari analisis hingga

implementasi. Diagram terbagi menjadi dua grup, yaitu pemodelan struktur

suatu sistem, dan pemodelan behavior. Structure diagram mewakili data

dan hubungan statis di sistem informasi. Yang termasuk dalam structure

diagram adalah class, object, package, deployment, component, composite

structure, dan profile diagrams. Behavior diagram menyediakan Analisa

untuk menggambarkan hubungan yang dinamis antar objek yang

Page 14: BAB 2 TINJAUAN REFERENSIlibrary.binus.ac.id/eColls/eThesisdoc/Bab2/RS1_2019_1...13 tim. Contoh API yang terkenal dan sering digunakan adalah API milik twitter dan facebook (Jacobson,

22

merepresentasikan bisnis sistem informasi. Yang termasuk dalam behavior

diagram adalah activity, sequence, communication, interaction overview,

timing, behavior state machine, protocol state machine, dan use-case

diagrams (Dennis, Wixom, & Tegarden, 2015, p. 34).

2.18.1 Use Case Diagram

Menurut Satzinger, Jackson, & Burd (2016, p. 81), Use case

diagram merupakan model Unified Modeling Language (UML) yang

digunakan untuk mengilustrasikan use cases dan hubungannya kepada

pengguna. Pada use case seseorang yang menggunakan sistem disebut

sebagai actor. Terkadang actor pada sebuah use case bukanlah manusia

melainkan sebuah sistem lainnya atau alat yang berhubungan dengan

sistem. Actor direpresentasikan dengan stickman dan diberi nama atau

karakternya dibagian bawah. Use case direpresentasikan dengan bentuk

oval dan di dalamnya diisi dengan nama use case. Association

relationship merupakan garis yang menghubungkan actor dan use case

yang mengindikasikan bahwa actor terlibat dengan use case tersebut.

Automation boundary merupakan batas dari aplikasi yang

terkomputerarisasi dengan orang yang mengoperasikan aplikasi yang

digambarkan dengan kotak yang berisi use case.

Gambar 2.7 Use case sederhana

(Satzinger, Jackson, & Burd, 2016, p. 84)

Page 15: BAB 2 TINJAUAN REFERENSIlibrary.binus.ac.id/eColls/eThesisdoc/Bab2/RS1_2019_1...13 tim. Contoh API yang terkenal dan sering digunakan adalah API milik twitter dan facebook (Jacobson,

23

Terkadang dalam tahap pengembangan dari use case diagram,

sebuah use case mungkin akan membutuhkan atau berhubungan dengan

use case lain yang disebut includes. Berikut contoh relasi includes pada

fill shopping cart.

Gambar 2.8 Use case diagram dengan relasi includes

(Satzinger, Jackson, & Burd, 2016, p. 86)

Untuk mendukung projek yang berkembang, use case baru akan

ditambahkan, adapun yang dieliminasi, adapun yang digabungkan.

Disarankan jika dapat mendeskripsikan beberapa detail untuk setiap use

case dan digambarkan dengan satu kalimat yang disebut Brief Use Case

Description. Brief Use Case Description adalah deskripsi dengan satu

kalimat yang menyediakan gambaran singkat terhadap use case.

Page 16: BAB 2 TINJAUAN REFERENSIlibrary.binus.ac.id/eColls/eThesisdoc/Bab2/RS1_2019_1...13 tim. Contoh API yang terkenal dan sering digunakan adalah API milik twitter dan facebook (Jacobson,

24

Gambar 2.9 Contoh Brief Use Case Description

(Satzinger, Jackson, & Burd, 2016, p. 133)

2.18.2 Activity Diagram

Menurut Satzinger, Jackson, & Burd (2016, p. 60), Activity diagram

mendeskripsikan berbagai aktivitas pengguna ataupun sistem, orang atau

komponen yang menyelesaikan setiap aktivitas, dan urutan alur dari

setiap aktivitas.

Gambar 2.10 Simbol diagram aktivitas

(Satzinger, Jackson, & Burd, 2016, p. 60)

Page 17: BAB 2 TINJAUAN REFERENSIlibrary.binus.ac.id/eColls/eThesisdoc/Bab2/RS1_2019_1...13 tim. Contoh API yang terkenal dan sering digunakan adalah API milik twitter dan facebook (Jacobson,

25

Simbol yang digunakan dalam Activity Diagram adalah sebagai

berikut:

Gambar 2.11 Simbol pada Activity Diagram

Page 18: BAB 2 TINJAUAN REFERENSIlibrary.binus.ac.id/eColls/eThesisdoc/Bab2/RS1_2019_1...13 tim. Contoh API yang terkenal dan sering digunakan adalah API milik twitter dan facebook (Jacobson,

26

Swimlane merepresentasikan orang yang melakukan aktivitas.

Berikut contoh diagram aktivitas sederhana.

Gambar 2.12 diagram aktivitas sederhana

(Satzinger, Jackson, & Burd, 2016, p. 61)

2.18.3 Class Diagram

Menurut Satzinger, Jackson, & Burd (2016, p. 103), Class diagram

digunakan untuk menunjukkan kelas dari suatu objek untuk sebuah

sistem. Pada diagram kelas, persegi panjang/kotak merepresentasikan

Page 19: BAB 2 TINJAUAN REFERENSIlibrary.binus.ac.id/eColls/eThesisdoc/Bab2/RS1_2019_1...13 tim. Contoh API yang terkenal dan sering digunakan adalah API milik twitter dan facebook (Jacobson,

27

kelas, dan garis yang menghubungkan persegi panjang menunjukkan

asosiasi antar kelas. Setiap kotak dibagi menjadi beberapa bagian secara

horizontal. Bagian atas memuat nama dari class, bagian keduanya

memuat daftar attribute dari class dan bagian paling bawah memuat

daftar method dari class. Nama class diawali dengan huruf kapital dan

nama attribute diawali dengan huruf kecil. Class Diagram digambarkan

dengan menunjukkan class dan asosiasi hubungan antara class. Asosiasi

hubungan antara class digambarkan dengan multiplicity.

Gambar 2.13 Contoh diagram kelas sederhana

(Satzinger, Jackson, & Burd, 2016, p. 104)

Dalam UML mempunyai notation khusus yang disebut stereotype

untuk mendesain class dengan tipe yang khusus. Stereotype adalah salah

satu cara untuk mengkategorisasikan model elemen sebagai tipe tertentu.

Stereotype juga merupakan definisi dasar dari model elemen untuk

mengindikaskan jika model mempunyai karakteristik spesial yang ingin

diperlihatkan. Notasi dari nama tipe untuk stereotype adalah seperti

berikut: <<controller>>.

Notasi untuk komponen-komponen pada Class Diagram terdiri dari

tiga bagian. Bagian pertama memuat nama dari class dan stereotype class

dan parent dari class. Bagian kedua memuat detail dari attribute class.

Format yang digunakan pada setiap attribute adalah sebagai berikut:

1. Visibility ditulis sebelum nama. Visibility menjelaskan apakah

object lain bisa langsung mengakses attribute. (Tanda tambah

mengindikasikan attribute bersifat public atau terlihat(visible),

Page 20: BAB 2 TINJAUAN REFERENSIlibrary.binus.ac.id/eColls/eThesisdoc/Bab2/RS1_2019_1...13 tim. Contoh API yang terkenal dan sering digunakan adalah API milik twitter dan facebook (Jacobson,

28

tanda minus mengindikasikan attribute bersifat private atau

tidak terlihat(invisible).

2. Nama attribute.

3. Type-expression dari attribute (karakter, string, integer, date).

4. Initial-value (jika diperlukan).

5. Property (di antara kurung kurawal), seperti {key}, jika

diperlukan.

Bagian ketiga memuat informasi untuk method signature. Method

signature menunjukkan semua informasi yang dibutuhkan untuk

menjalankan atau memanggil method. Format yang digunakan untuk

mendeskripsikan method adalah sebagai berikut:

1. Method visibility

2. Method-name

3. Method-parameter-list (argument yang datang)

4. Return-type-expression (tipe return parameter oleh method)

Gambar 2.14 Contoh diagram kelas dengan domain class dan design

class

(Satzinger, Jackson, & Burd, 2016, p. 372)

Page 21: BAB 2 TINJAUAN REFERENSIlibrary.binus.ac.id/eColls/eThesisdoc/Bab2/RS1_2019_1...13 tim. Contoh API yang terkenal dan sering digunakan adalah API milik twitter dan facebook (Jacobson,

29

2.18.4 Sequence Diagram

Menurut Satzinger, Jackson, & Burd (2016, p. 139-140), Sequence

diagram digunakan untuk mendeskripsikan alur informasi yang masuk

maupun keluar dari sistem. Pada use case diagram, actor menggunakan

sistem, namun yang lebih ditekankan pada sequence diagram adalah

bagaimana actor berinteraksi dengan sistem dengan memasukan data dan

menerima hasil keluaran data.

Gambar 2.15 Bagian dari sequence diagram

(Satzinger, Jackson, & Burd, 2016, p. 140)

Notasi yang digunakan dalam sequence diagram adalah sebagai

berikut:

1. Stick figure merepresentasikan aktor – seseorang atau role yang

berinteraksi dengan sistem. Pada sequence diagram, yang

ditekankan adalah bagaimana aktor berinteraksi dengan sistem

melalui input data dan menerima output data.

2. Kotak dengan label :System pada gambar di atas adalah objek

yang merepresentasikan seluruh sistem. Notasi yang digunakan

Page 22: BAB 2 TINJAUAN REFERENSIlibrary.binus.ac.id/eColls/eThesisdoc/Bab2/RS1_2019_1...13 tim. Contoh API yang terkenal dan sering digunakan adalah API milik twitter dan facebook (Jacobson,

30

adalah persegi panjang dengan nama objek yang digarisbawahi.

Titik dua sebelum nama objek yang digarisbawahi biasanya

sering digunakan, tetapi bersifat opsional, untuk menunjukkan

bahwa objek adalah unnamed object.

3. Lifeline atau object lifeline adalah garis putus-putus vertikal di

bawah aktor dan objek, yang merupakan ekstensi dari suatu

objek atau aktor pada use case. Tujuan dari lifeline adalah untuk

menunjukkan urutan pesan yang dikirim dan diterima oleh aktor

dan objek, yang dibaca dari atas ke bawah dalam sequence

diagram.

4. Panah antara lifeline merepresentasikan pesan yang dikirim oleh

aktor atau objek. Setiap panah memiliki asal dan tujuan.

5. Input message di atas panah dengan garis utuh untuk

mendeskripsikan tujuan pesan dan input data yang dikirim.

Input message adalah aksi yang dipanggil di objek tujuan,

seperti perintah eksekusi. Input data yang dikirim bersama

pesan diletakkan dalam tanda kurung.

6. Returned value di atas panah dengan garis putus-putus

menunjukkan respon atau jawaban dari input message yang

dikirim. Bentuknya adalah respon, tanpa ada pesan yang me-

request sebuah service.

7. Activation lifeline adalah kotak vertikal yang merepresentasikan

periode waktu selama method dari objek dieksekusi.

Menurut Satzinger, Jackson, & Burd (2016, p. 409), Hal terpenting

pada sequence diagram adalah urutan pesan antara actor dan sistem.

Mungkin ada input pesan tunggal ataupun banyak. Pesan yang diinput

mungkin memiliki data parameter atau tidak. Mungkin juga memiliki

loop frames, alt frames, dan opt frames seperti mengulangi input dan

keluaran. Loop frames menunjukkan kumpulan pesan di dalam loop. Alt

frames mirip seperti if-then-else atau switch. Opt frames merupakan

permohonan pilihan dari kumpulan pesan.

Page 23: BAB 2 TINJAUAN REFERENSIlibrary.binus.ac.id/eColls/eThesisdoc/Bab2/RS1_2019_1...13 tim. Contoh API yang terkenal dan sering digunakan adalah API milik twitter dan facebook (Jacobson,

31

Gambar 2.16 Contoh sequence diagram

(Satzinger, Jackson, & Burd, 2016, p. 409)

2.19 Delapan Aturan Emas

Menurut Shneiderman, Plaisant, Cohen, Jacob, & Elmqvist (2018, p.

95-97), Ada delapan prinsip dalam desain antar muka yang disebut delapan

aturan emas (8 golden rules). Berikut adalah delapan aturan emas:

1. Strive for consistency. Urutan yang konsisten harus diterapkan dalam

suatu situasi yang serupa. Terminologi yang serupa harus digunakan

pada menus, help screen, warna yang konsisten, layout, kapitalisasi,

jenis huruf, dan lain-lain, yang seharusnya digunakan secara

menyeluruh.

2. Seek universal usability. Memahami kebutuhan pengguna yang beragam

dan desain untuk plasticity, menfasilitasi perubahan dari konten.

Perbedaan dari permula sampai ahli, rentang umur, kebutuhan khusus,

keberagaman universal, dan perbedaan teknologi yang memperkaya

spektrum kebutuhan yang bisa menjadi pemandu untuk desain.

3. Offer informative feedback. Setiap aksi dari pengguna, seharusnya ada

umpan balik antar muka. Untuk aksi yang kecil dan terus terjadi,

Page 24: BAB 2 TINJAUAN REFERENSIlibrary.binus.ac.id/eColls/eThesisdoc/Bab2/RS1_2019_1...13 tim. Contoh API yang terkenal dan sering digunakan adalah API milik twitter dan facebook (Jacobson,

32

responnya sederhana, sedangkan untuk aksi yang utama dan tidak sering

terjadi, responnya harus lebih substansial.

4. Design dialogs to yield closure. Urutan dari aksi seharusnya

dikelompokan menjadi awal, tengah, dan akhir. Umpan balik yang

informatif dari kumpulan aksi yang selesai dijalankan dapat memberi

pengguna kepuasan, perasaan lega, dan indikasi untuk melakukan

kumpulan aksi berikutnya.

5. Prevent errors. Sebisa mungkin, desain antar muka yang membuat

pengguna tidak bisa membuat eror yang bisa berakibat buruk. Jika

pengguna membuat eror, antar muka harus harus memberikan instruksi

yang spesifik dan mudah dimengerti untuk pengguna bisa mengatasi

eror.

6. Permit easy reversal of actions. Sebisa mungkin, suatu aksi bisa

reversibel. Fitur ini bisa menghilangkan kecemasan karena pengguna

tahu bahwa eror yang terjadi bisa diperbaiki atau diulang, dan

mendorong pengguna untuk mencari pilihan lain.

7. Keep user in control. Pengguna yang sudah berpengalaman

menginginkan perasaan bahwa mereka bisa mengontrol antar muka dan

antar muka akan mengikuti setiap aksi yang dilakukan oleh pengguna.

Pengguna tidak menginginkan perubahan secara tiba-tiba, mereka

merasa terganggu dengan pengisian data yang membosankan, kesulitan

memperoleh informasi, dan ketidakmampuan untuk memperoleh hasil

yang mereka inginkan.

8. Reduce short-term memory load. Keterbatasan kemampuan manusia

untuk memproses informasi dalam ingatan jangka pendek membutuhkan

antar muka yang tidak mengharuskan pengguna untuk mengingat

informasi dari satu tampilan dan menggunakan informasi tersebut

ditampilan yang lain.

2.20 Lima Faktor Manusia Terukur

Menurut Shneiderman, Plaisant, Cohen, Jacob, & Elmqvist (2018, p.

33-34), Interaksi yang dekat dengan komunitas pengguna dapat memperoleh

Page 25: BAB 2 TINJAUAN REFERENSIlibrary.binus.ac.id/eColls/eThesisdoc/Bab2/RS1_2019_1...13 tim. Contoh API yang terkenal dan sering digunakan adalah API milik twitter dan facebook (Jacobson,

33

tolah ukur yang akan menjadi dasar dari sasaran dan ukuran kegunaan.

Ukuran kegunaan berikut, lebih mengarah pada evaluasi yang praktis:

1. Time to learn. Seberapa lama waktu yang dibutuhkan komunitas

pengguna untuk mempelajari bagaimana cara menggunakan suatu

tindakan yang relevan dengan serangkaian tugas?

2. Speed of performance. Seberapa lama waktu yang dibutuhkan untuk

melaksanakan tugas benchmark?

3. Rate of errors by users. Berapa banyak dan apa jenis eror yang dibuat

oleh pengguna dalam menjalankan tugas benchmark? Penanganan eror

merupakan komponen penting dari penggunaan antar muka sehingga

pantas untuk dipelajari.

4. Retention over time. Seberapa baik pengguna mempertahankan

pengetahuannya selama satu jam, satu hari, atau satu minggu? Daya

ingat berhubungan dengan waktu belajar, dan frekuensi memainkan

peran penting.

5. Subjective satisfaction. Seberapa suka pengguna dengan beragam aspek

antar muka? Jawabannya bisa dipastikan dengan wawancara atau survei

yang menyertakan tingkat kepuasan dan komentar bebas.

2.21 Testing

Menurut Pressman & Maxim (2015, p. 499), Setiap produk yang

sudah dikembangkan dapat dites dengan dua cara. Tes yang pertama

membutuhkan pandangan eksternal yang disebut black-box testing. Yang

kedua membutuhkan pandangan internal dan disebut white-box testing.

2.21.1. White Box Testing

Menurut Pressman & Maxim (2015, p. 500), Pada white-box testing

harus memahami cara kerja internal dari suatu produk sehingga tes dapat

dilakukan untuk memastikan seluruh komponen bekerja dengan

semestinya dan sesuai spesifikasi. White-box testing atau bisa disebut

juga glass-box testing atau structural testing, merupakan filosofi desain

test-case yang menggunakan control stucture yang telah digambarkan

Page 26: BAB 2 TINJAUAN REFERENSIlibrary.binus.ac.id/eColls/eThesisdoc/Bab2/RS1_2019_1...13 tim. Contoh API yang terkenal dan sering digunakan adalah API milik twitter dan facebook (Jacobson,

34

sebagai tingkat komponen desain untuk memperoleh test cases. Dengan

white-box testing kita bisa menjalankan beberapa test cases, yaitu:

1. Menjamin semua jalur independent pada sebuah modul dijalankan

setidaknya satu kali.

2. Menjalankan semua kemungkinan baik yang benar ataupun salah.

3. Mengeksekusi semua loops (perulangan) dalam area operasinya.

4. Menjalankan struktur data internal untuk memastikan validitas.

2.21.2. Black Box Testing

Menurut Pressman & Maxim (2015, p. 509), Pada black-box testing

harus memahami fungsi dari suatu produk secara spesifik. Tes bisa

dilakukan dengan mendemonstrasikan setiap fungsi dari produk berjalan

sesuai operasional dan di waktu yang bersamaan dilakukan pencarian

eror disetiap fungsi yang ada. Black-box testing atau bisa disebut juga

behavioral testing atau functional testing, berfokus pada kebutuhan

fungsionalitas dari suatu perangkat lunak. Black-box testing bukan

alternative dari white-box testing karena black-box testing dapat

menemukan eror yang berbeda dari metode white-box testing. Berikut

kategori eror yang bisa ditemukan menggunakan black-box testing:

1. Fungsi yang salah atau hilang.

2. Eror pada bagian antarmuka (interface errors).

3. Eror pada struktur data atau akses database eksternal.

4. Eror pada perilaku atau kinerja.

5. Eror pada Initialization dan termination.

2.22 Gantt Chart

Gantt Chart merupakan sebuah alat yang biasa digunakan untuk

project time management. Project time management digunakan untuk

memastikan kualitas dan kuantitas dari sebuah projek, dan memastikannya

bisa diselesaikan sesuai jadwal. Gantt chart adalah grafik dua dimensi, yang

pada bagian horizontal diisi waktu dari projek, dan bagian vertikal diisi

perkembangan dari projek. Konten dari gantt chart biasanya terdiri dari

Page 27: BAB 2 TINJAUAN REFERENSIlibrary.binus.ac.id/eColls/eThesisdoc/Bab2/RS1_2019_1...13 tim. Contoh API yang terkenal dan sering digunakan adalah API milik twitter dan facebook (Jacobson,

35

kumpulak aktivitas projek, awal dan akhir serta durasi dari projek (Chen,

2014).

Gambar 2.17 Contoh Gantt Chart

(Chen, 2014)

2.23 Flowchart

Menurut (Sprankle & Hubbard (2011), Flowchart merupakan

representasi ilustrasi visual dari algoritma dan pseudocode. Berikut ini

terlampir simbol – simbol pada flowchart:

Page 28: BAB 2 TINJAUAN REFERENSIlibrary.binus.ac.id/eColls/eThesisdoc/Bab2/RS1_2019_1...13 tim. Contoh API yang terkenal dan sering digunakan adalah API milik twitter dan facebook (Jacobson,

36

Gambar 2.18 Simbol-Simbol pada Flowchart

(Sprankle & Hubbard, 2011)

Page 29: BAB 2 TINJAUAN REFERENSIlibrary.binus.ac.id/eColls/eThesisdoc/Bab2/RS1_2019_1...13 tim. Contoh API yang terkenal dan sering digunakan adalah API milik twitter dan facebook (Jacobson,

37

Gambar 2.19 Simbol-Simbol pada Flowchart (Lanjutan Gambar

2.19)

(Sprankle & Hubbard, 2011)

Page 30: BAB 2 TINJAUAN REFERENSIlibrary.binus.ac.id/eColls/eThesisdoc/Bab2/RS1_2019_1...13 tim. Contoh API yang terkenal dan sering digunakan adalah API milik twitter dan facebook (Jacobson,

38