Jurnal Doro Volume 7 Number 15
RANCANG BANGUN APLIKASI MOBILE PENAMPIL KOMIK STRIP MENGGUNAKAN AUTOMATIC FRAME DETECTION Dwi Vendy Pratama#1, Herman Tolle, Dr. Eng., S.T, M.T*2, Agi Putra Kharisma, S.T, M.T#2 1) Mahasiswa, 2)Dosen Pembimbing Program Studi Informatika/Ilmu Komputer Program Teknologi Informasi dan Ilmu Komputer Universitas Brawijaya, Malang 65145, Indonesia
[email protected] ABSTRAK Di Indonesia 51% penggunaan smartphone ditujukan untuk berselancar di dunia maya, sehingga banyak pengembangan aplikasi mobile yang memanfaatkan pertukaran data realtime untuk menunjang tujuan tersebut. Salah satunya adalah aplikasi yang digunakan untuk menampilkan komik strip. Pada umumnya tampilan komik pada aplikasi tersebut sangat besar dan tidak sesuai dengan ukuran layar smartphone pengguna, sehingga hal tersebut mempersulit pengguna ketika membacanya karena pengguna harus menggeser layar berkali-kali untuk membaca satu halaman komik, terkadang juga harus melakukan zoom-in jika tulisan pada komik tersebut terlalu kecil. Sehingga dibutuhkan suatu aplikasi penampil komik yang dapat memisah bagian-bagian komik strip sehingga pengguna dapat dengan mudah membaca komik sesuai dengan urutannya. Dibutuhkan metode untuk memisahkan bagian-bagian komik strip, yaitu metode automatic frame detection. Langkah-langkah utama penelitian ini terdiri dari analisis kebutuhan, perancangan, implementasi, dan pengujian. Kemudian dilakukan sebuah pengujian fungsional dan didapatkan bahwa semua kebutuhan fungsional telah terpenuhi. Hasil pengujian non-fungsional dengan parameter usabilitas menunjukkan bahwa aplikasi ini sangat memuaskan. Sedangkan berdasarkan hasil pengujian non-fungsional dengan parameter akses data dan waktu proses metode automatic frame detection, menunjukkan bahwa aplikasi dapat berjalan serta mampu menangani akses data dari berbagai kondisi dengan baik. Sehingga dapat dikatakan bahwa aplikasi perangkat bergerak ini dapat digunakan dengan baik sebagaimana mestinya. Kata kunci: automatic frame detection, mobile, penampil komik strip ABSTRACT In Indonesia, the using of smartphone is 51 percent purposed for existing in cyberspace, so that there are many development of mobile application which using the changing of realtime data for supporting it. One of the applications that have been used is for showing “comic strip”. Basicly, the comic display of the application is large and not suitable with the screen in a smartphone, so it gives difficulty for the users when they want to read it because they have to slide the screen for several times just only to read one page of comic. It also made the users to zoom-in it if the transcription of the comic is too small. Because of those difficulties, it is needed an application of comic viewer which can separate each parts of the comic strip and make the users can easily read it in order. It also needs a method for separating each parts of the comic strip, that is automatic frame detection method. This method aims for detecting frame of comic strip separator. The main steps in this research consist of fundamental analysis, designing, implementation, and test. From the result of functional test, it can be concluded that all the functional needs are already fulfilled. The result of non-functional test with the usability parameter shows that the application runs very good. Moreover, from the result of non-functional test with data access parameter and the process time of automatic frame detection method, it is showed that the application is running good. So, it could be said that this mobile application is able to be used in order as well. Keywords : automatic frame detection, mobile, comic strip display dapat menampilkan komik pada layar smartphone pengguna. Banyak aplikasi mobile yang ditujukan untuk pembaca komik yang diproduksi berdasarkan dengan tampilan komik offline [2]. Pada umumnya tampilan komik pada aplikasi tersebut sangat besar dan tidak sesuai dengan ukuran layar smartphone pengguna, sehingga hal tersebut mempersulit pengguna ketika membacanya, pengguna harus menggeser layar berkali-kali untuk membaca satu halaman komik, terkadang juga harus melakukan zoom-in jika tulisan pada komik tersebut terlalu kecil.
1. PENDAHULUAN Penggunaan smartphone untuk membantu kegiatan sehari-hari saat ini sudah tidak asing lagi, baik untuk edukasi, hiburan, maupun telekomunikasi [1]. Di Indonesia 51% penggunaan smartphone ditujukan untuk berselancar di dunia maya, sehingga banyak pengembangan aplikasi mobile yang memanfaatkan pertukaran data realtime untuk menunjang tujuan tersebut [1]. Salah satunya adalah aplikasi yang digunakan untuk menampilkan komik strip. Aplikasi tersebut membutuhkan pertukaran data realtime untuk
1
Jurnal Doro Volume 7 Number 15 Berdasarkan permasalahan tersebut dibutuhkan suatu aplikasi penampil komik yang dapat memisah bagianbagian komik strip sehingga pengguna dapat dengan mudah membaca komik sesuai dengan urutannya. Untuk mengimplementasikan aplikasi komik strip dibutuhkan metode yang dapat memisahkan bagianbagian pada sebuah komik strip. Metode yang digunakan adalah metode automatic frame detection untuk mendeteksi frame pemisah komik strip sehingga dari pendeteksian frame tersebut dapat dilakukan pemisahan (cropping) komik strip. Dalam metode automatic frame detection terdapat algoritma Connected Component Labelling (CCL) yang digunakan untuk deteksi frame. Metode automatic frame detection terdiri dari ekstraksi konten komik strip yang berupa frame-frame pada satu gambar besar. Langkah-langkah yang dibutuhkan yaitu binerisasi gambar, threshold, invert, deteksi blob (deteksi ujung frame), dan ekstraksi blob dari gambal asli. Keberhasilan deteksi frame dipengaruhi oleh flat atau tidaknya gambar, jika menggunakan gambar flat maka tingkat keberhasilan deteksi dapat mencapai 100% [2]. Pada penelitan Arai & Tolle, aplikasi pembaca komik sudah dikembangkan pada desktop dengan menggunakan bahasa pemrograman C#. Sedangkan untuk penelitian ini, aplikasi akan diterapkan pada smartphone guna melanjutkan penelitian sebelumnya. Salah satu sistem operasi smartphone yang mendukung bahasa pemrograman C# adalah windows phone. Sehingga untuk pengembangan aplikasi selanjutnya akan dibangun pada smartphone yang memiliki sistem operasi minimal Windows Phone 8.1. Berdasarkan permasalahan di atas, dibutuhkan aplikasi mobile penampil komik strip pada smartphone windows phone dengan mengimplementasikan metode automatic frame detection yang memudahkan pengguna untuk membaca komik strip. Untuk mengetahui mudah atau tidaknya penggunaan aplikasi tersebut oleh para pembaca komik, maka dibutuhkan pengujian usability. Selain itu, waktu proses metode automatic frame detection dan akses data juga menjadi faktor penting untuk diujikan karena kedua hal tersebut mempengaruhi kenyamanan pengguna dalam mengoperasikan aplikasi penampil komik strip. Sehingga dilakukan penelitian skripsi dengan judul “Rancang Bangun Aplikasi Mobile Penampil Komik Strip Menggunakan Automatic Frame Detection”. Dengan dibuatnya aplikasi mobile penampil komik strip tersebut diharapkan mampu mempermudah pecinta komik strip dalam membaca komik melalui smartphone.
3.
metode automatic frame detection dan Regular Expression untuk pengambilan data dari website gocomics.com? Bagaimana perfomansi dari hasil implementasi dengan parameter usabilitas, akses data, dan waktu proses automatic frame detection?
2. TINJAUAN PUSTAKA 2.1 Kajian Pustaka
Kajian pustaka pada penelitian ini membahas tentang penelitian sebelumnya yang meneliti tentang metode ekstraksi konten Manga. Penelitian yang berkaitan dengan metode tersebut telah dilakukan oleh Herman Tolle dan Kohei Arai (2013) [2][6]. Penelitian yang dilakukan oleh Herman Tolle dan Kohei Arai (2013) pada jurnal yang berjudul “Manga Content Extraction Method for Automatic Mobile Comic Content Creation” menjelaskan tentang metode yang efisien untuk membuat konten mobile komik Manga digital secara otomatis. Manga merupakan sesuatu yang populer di Jepang dan seluruh penjuru dunia. Ratusan Manga dicetak setiap harinya di Jepang dan beberapa didigitalisasi ke dalam konten web agar dapat dibaca melalui internet. Konten yang dipublikasikan di internet membutuhkan translasi ke bahasa tertentu agar semua pembaca dapat mengerti tentang konten Manga tersebut. Dibutuhkan ekstraksi karakter Jepang otomatis untuk dapat kemudian ditranslasi ke bahasa yang diinginkan. Selain itu pembuatan komik Manga digital untuk perangkat bergerak sangat kompleks karena harus memikirkan ukuran layar dan waktu pemrosesan. Pembaca komik melalui perangkat bergerak masih membaca komik dengan ukuran penuh, sehingga pembaca harus menavigasi layar secara manual. Untuk ekstraksi konten komik Manga diperlukan EComic XML untuk merender konten komik pada perangkat bergerak. Prosesnya ekstraksi konten antara lain: 1. Ekstraksi dan pengurutan frame komik 2. Deteksi balon frame komik 3. Deteksi teks balon frame komik
Berdasarkan latar belakang yang dipaparkan maka rumusan masalah yang perlu diperhatikan adalah: 1. Bagaimana rancangan aplikasi penampil komik strip pada perangkat berbasis Windows Phone yang mudah digunakan oleh pengguna? 2. Bagaimana implementasi aplikasi perangkat bergerak penampil komik strip menggunakan
Gambar 2.1 Menunjukkan langkah-langkah dari EComic XML
2
Jurnal Doro Volume 7 Number 15 Penelitian ini memiliki batasan, aplikasi yang dikembangkan nantinya hanya bisa mendeteksi komik Manga yang tidak memiliki balon atau gambar yang melebihi frame atau yang biasa disebut dengan flat comic. Peneliti mengimplementasikan algoritma Connected Component Labeling (CCL) untuk melakukan ekstraksi frame. Langkah-langkah dari algoritma CCL ditunjukkan oleh gambar 2.1.
Usulan
Komik Strip pada Windows Phone menggunakan pattern MVVM
Automatic Frame Detection
Tabel 2.1 Perbedaan Objek dan Metode 2.2 Regular Expression (RegEx)
Regular Expression (RegEx) merupakan salah satu implementasi dari operasi pencocokan pola (Pattern Recognation) untuk sebuah text atau string. Dengan regex kita dapat mencari text yang sesuai dengan sebuah pola atau aturan tertentu, melakukan validasi terhadap input data, dan lain lain [3]. Didalam regular expression terdapat karakter kelas. Character Class adalah cara yang digunakan untuk mendefinikan atau menentukan set karakter. Character class sering digunakan untuk mempersingkat atau menggantikan pola regex untuk kelompok string dengan maksud tertentu 2.3 Arsitektur Model-View-ViewModel
Model View ViewModel (MVVM) merupakan sebuah pola arsitektural dalam pengembangan aplikasi perangkat lunak. MVVM merupakan variasi dari presentation model design pattern milik Martin Fowler [4]. Seperti presentation model dari Fowler, MVVM mengabstraksi sebuah view state dan behavior. Namun, sementara presentation model mengabstraksi sebuah view dengan pendekatan yang tidak bergantung pada sebuah user interface platform yang spesifik. MVVM dikembangkan oleh Microsoft untuk menyederhanakan event-driven programming dari antarmuka pengguna [5].
Gambar 2.2 Langkah-langkah Algoritma CCL Pertama, binarization diaplikasikan untuk merubah warna komik ke hitam putih. Selanjutnya gambar dirubah lagi ke threshold sehingga proses deteksi frame akan mendeteksi setiap pixel yang berhubungan sebagai frame yang berbeda. Proses terakhir adalah pemilihan frame yang akan ditampilkan dengan ukuran [Image.Width/6] x [Image.Height/8]. Metodologi ini telah dievaluasi menggunakan berbagai macam gambar komik. Metode ini memiliki 100% success rate untuk ekstraksi frame komik dari komik flat Doraemon dan Naruto. Mengkombinasi metode ini dengan konten E-comic, akan menghasilkan sistem yang kuat untuk perubahan komik Manga digital secara otomatis dari web portal komik ke konten perangkat bergerak. Sementara pada penelitian yang akan dilakukan penulis, objek yang digunakan adalah komik strip yang diimplementasikan menggunakan automatic frame detection. Pada penelitian yang telah dilakukan sebelumnya, terdapat kesamaan metode tetapi meneliti objek yang berbeda. Perbedaan objek dan metode ditunjukan pada Tabel 2.1.
Penelitian Sebelum
Objek yang digunakan Komik Manga
Model-View-ViewModel dan presentation model keduanya sama-sama berasal dari pola model-viewcontroller (MVC). MVVM mempermudah pemisahan pengembangan dari user interface dari pengembangan business logic dan back-end logic. View Model dari MVVM merupakan sebuah pengubah nilai. Dalam hal ini, view model lebih model dibanding view, dan menangani sebagian besar tampilan logika dari view. View Model juga dapat mengimplementasikan sebuah mediator pattern, mengatur akses ke backend logic diseluruh set use case yang didukung oleh view [5]. MVVM sendiri terdiri dari beberapa komponen antara lain model, view, view model. Relasi antar komponen dapat dilihat pada Gambar 2.3.
Metode yang digunakan Automatic Frame Detection
3
Jurnal Doro Volume 7 Number 15
Studi Literatur
Analisis Kebutuhan
Perancangan Aplikasi Mobile Penampil Komik Strip
Gambar 2.3 Interaksi antar tiga kelas Model View ViewModel Implementasi Aplikasi Mobile Penampil Komik Strip Menggunakan Automatic Frame Detection
Model Pengujian dan Analisis
Model disini merujuk kepada sebuah domain model, dimana merepresentasikan isi dengan kondisi riil, atau data access layer yang merepresentasikan muatan. Biasanya model mengimplementasi fasilitas yang dapat membuat model dengan mudah untuk binding ke view.
Pengambilan Kesimpulan dan Saran
Gambar 3.1. Diagram Blok Metode Penelitian 3.1. Studi Literatur
Studi literatur merupakan tahapan dalam pengumpulan teori-teori dari sumber yang terpercaya yang akan diimplementasikan. Teori-teori tersebut meliputi: 1. Kajian Pustaka 2. Windows Phone 3. Arsitektur MVVM 4. Connected Component Labelling 5. Komik Strip 6. Regular Expression (RegEx) 7. Pengujian Fungsional 8. Pengujian Usabilitas
View
Seperti di dalam pola Model-View-Controller (MVC), view merupakan tampilan di antarmuka pengguna. View disini merupakan elemen visual seperti layar, page, user control atau data template.
ViewModel
View model merupakan abstraksi dari view yang mengekspos property public dan perintah. Bukan seperti MVC menggunakan controller, atau presenter di pola MVP, MVVM mempunyai yang namanya binder. Di dalam view model, binder menjebatani komunikasi antara view dan data binder. View model sendiri telah dideskripsikan sebagai sebuah state dari data yang ada di dalam model.
3.2 Analisis Kebutuhan
Analisis kebutuhan bertujuan untuk mendapatkan semua kebutuhan-kebutuhan yang diperlukan dari aplikasi yang akan dibangun. Metode yang digunakan adalah object-oriented analysis dengan menggunakan bahasa pemodelan UML (Unified Modeling Language), salah satunya adalah Use Case Diagram yang digunakan untuk menggambarkan fungsi-fungsi apa saja yang disediakan oleh aplikasi. Kemudian analisis kebutuhan dilakukan untuk mengidentifikasi kebutuhan aplikasi perangkat bergerak penampil komik strip ini.
Binder
Di dalam Microsoft Solution Stack, bindernya merupakan sebuah bahasa markup yang bernama XAML. Binder ini membebaskan developer dari kewajiban untuk menulis logika boiler-plate untuk mensinkronisasi antara view model dan view.
3.3 Perancangan Aplikasi Mobile Penampil Komik Strip
Perancangan dilakukan setelah tahap analisis kebutuhan dilakukan. Pada tahap perancangan aplikasi ini, dilakukan identifikasi class-class yang dibutuhkan dan kemudian dimodelkan dalam bentuk class diagram. Kemudian membuat perancangan alur kerja atau aktifitas yang dilakukan pengguna dimodelkan dalam activity diagram. Kemudian tahap berikutnya merupakan perancangan antar muka (user interface).
3. METODOLOGI Langkah-langkah dalam penelitian ini meliputi studi literatur, perancangan, implementasi, pengujian, dan pengambilan kesimpulan. Adapun proses kegiatan dalam penelitian ini ditunjukkan pada Gambar 3.1.
4
Jurnal Doro Volume 7 Number 15 3.4 Implementasi Aplikasi Mobile Penampil Komik Strip Menggunakan Automatic Frame Detection
b.
Implementasi perangkat lunak dikerjakan mengacu pada perancangan aplikasi yang telah dilakukan pada tahap sebelumnya. Implementasi aplikasi dengan metode automatic frame detection ini akan diterapkan menggunakan bahasa C#.
Kebutuhan Fungsional
UC01
Aplikasi harus menyediakan fitur untuk menampilkan daftar list kategori komik strip yang tersedia
Melihat Kategori Komik
UC02
Aplikasi harus menyediakan fitur untuk menampilkan komik strip yang telah dipilih
Membaca Komik Strip
UC03
Aplikasi harus menyediakan fitur untuk menampilkan list favorite
Melihat Favorite
UC04
Aplikasi harus menyediakan fitur untuk menyimpan favorite komik strip yang dipilih
Tambah Favorite
UC05
Aplikasi harus menyediakan fitur untuk menghapus favorite komik strip yang dipilih
Hapus Favorite
UC06
Aplikasi harus menyediakan fitur untuk membaca komik menggunakan metode automatic frame detection
Membaca Komik Dengan AFD (Automatic Frame Detection)
3.5 Pengujian dan Analisis
Pengujian dilakukan agar mengetahui bahwa perangkat lunak mampu bekerja sesuai dengan spesifikasi dan kebutuhan pengguna dan performa aplikasi dengan parameter usabilitas. Pada pengujian fungsional menggunakan teknik blackbox testing, pengujian usabilitas menggunakan metode kuesioner. Tahap akhir pada penelitian ini merupakan tahapan untu pengambilan kesimpulan dan saran. Dimana kesimpulan dapat diambil berdasarkan hasil pengujian dan analisis terhadap rancang sistem yang dibangun.
Kebutuhan Fungsional
Id
4. PERANCANGAN Sebelum masuk kedalam perancangan pada penelitian ini dibutuhkan data kebutuhan (Requirement), kebutuhan tersebut dibagi menjadi 2 bagian, yaitu kebutuhan fungsional dan kebutuhan nonfungsional. a.
Use Case
Gambaran Umum Aplikasi
Gambar 3.2 Gambar Umum Aplikasi Pada Gambar 4.2 merupakan gambar umum aplikasi penampil komik strip berbasis windows phone ini merupakan aplikasi yang dirancang untuk membantu pengguna membaca komik strip melalui smartphone. Ketika aplikasi ini berjalan pengguna akan langsung dihadapkan oleh list dari komik-komik yang tersedia di dalam aplikasi yang kemudian dapat dipilih oleh pengguna untuk membaca komik tersebut. Setelah itu terdapat fitur favorite untuk menyimpan pilihan komik strip yang disukai oleh pengguna, serta fitur membaca menggunakan metode automatic frame detection.
Gambar 3.1 Diagram Use Case c.
Kebutuhan Non-Fungsional
Analisis kebutuhan non-fungsional merupakan analisis kebutuhan yang tidak diminta oleh pengguna namun dibutuhkan oleh pengguna. Kebutuhan nonfungsional pada aplikasi ini dijelaskan pada
5
Jurnal Doro Volume 7 Number 15 Tabel 4.1 berikut.
6
Jurnal Doro Volume 7 Number 15 Tabel 4.1 Spefikasi Kebutuhan Non-Fungsional Parameter
Deskripsi
Usability
Rancangan antarmuka mudah digunakan oleh pengguna biasa dengan kaidah usability seperti learnability, efficiency, memorability, errors dan satisfaction dengan target tingkat usability minimal 80%
Akses Data
Pada hasil implementasi pengguna dapat melakukan akses data dan berjalan sebagaimana mestinya menggunakan wifi maupun mobile data.
Waktu Proses Automatic Frame Detection
Pada hasil implementasi pengguna dapat mengetahui berapa lama waktu proses automatic frame detection.
b.
4.1 Perancangan dan Implementasi
Pada tahapan ini menjelaskan tentang perancangan dan implementasi pada aplikasi penampil komik strip berbasis sistem operasi windows phone 8.1.
c.
Gambar 4.1 Diagram Alir Perancangan dan Implementasi 1. Pada Perancangan Aplikasi Penampil Komik strip Setelah berhasil mengidentifikasi kebutuhan pada penginisialisasi kebutuhan yang telah dilakukan sebelumnya dibuat perancangan lebih mendetail meliputi. a. Perancangan activity diagram Perancangan activity diagram merupakan pemodelan aktivitas pengguna dengan aplikasi yang berjalan berdasarkan pada skenario use case serta respon yang diberikan antara aktor dengan aplikasi. Pada activity diagram alur kerja berupa langkah dan aksi dari kebutuhan fungsional yang telah dijabarkan sebelumnya dikerjakan dalam bentuk grafis
d.
e.
7
Perancangan Arsitektur Aplikasi Perancangan arsitektur aplikasi dapat digambarkan seperti pada gambar 4.2 Pertamatama pengguna mengakses aplikasi comicstrip reader melalui perangkat bergerak.
Gambar 4.2 Arsitektur Aplikasi Sistem operasi windows phone menjadi kerangka kerja utama dalam aplikasi yang menjalankan fungsionaltias dasar seperti akses ke basis data. Ketika pertama kali pengguna menjalankan aplikasi langsung dihadirkan halaman utama. Dihalaman utama pengguna di hadirkan list kategori komik yang tersedia dan yang dapat di akses. Pengguna dapat memilih kategori komik mana yang dingin dibaca, serta memasukan tanggal, bulan, dan tahun komik tersebut. Serta pengguna dapat membaca menggunakan metode automatic frame detection. Semua akses data eksternal ditanganin oleh fungsional GetComicstripService yang ada didalam aplikasi langsung mengakses www.gocomics.com/.+ nama komik. Dengan fungsi ini akses data dapat dilakukan dengan cepat dan akurat. Perancangan Data Eksternal Pada perancangan akses data eksternal ini membahas bagaimana melakukan request data untuk mendapatkan output dari www.gocomics.com. Pada gambar 4.3 dapat dijelaskan saat pengguna memilih pilihan komik dan sudah memasukan data inputan tanggal, bulan, dan tahun. Pada fungsi GetComicstripService akan mengola masukan pengguna menjadi sebuah url, yang kemudian mengakses url tersebut dan mengambil html content url tersebut. Dari html content tersebut akan di kelola untuk mendapatkan url gambar dari komik yang diinginkan sesuai dengan masukan pengguna.
Gambar 4.3 Rancangan Akses Data Perancangan Interaksi Antar Objek Menjelaskan sequence diagram aplikasi penampil komik strip Perancangan Class Diagram
Jurnal Doro Volume 7 Number 15
f.
g.
Class Diagram adalah diagram yang digunakan untuk menampilkan beberapa kelas yang ada didalam sistem perangkat lunak yang akan dikembangkan. Class diagram menunjukkan hubungan antara kelas dalam aplikasi yang sedang dikembangkan dan bagaimana mereka saling berhubungan satu sama lain. Perancangan Basis Data Perancangan basis data digunakan untuk menyimpan data-data kategori komik strip. Peracangan basis data direpresentasikan dalam bentuk diagram logical. Diagram logical menyediakan tampilan grafis dari struktur aplikasi yang bertujuan untuk menganalisa struktur melalui entitas dan relasi Perancangan Navigasi dan Antarmuka Pada bagian ini menjelaskan mengenai bagaimana rancangan dari antarmuka tiap-tiap halaman di dalam aplikasi perangkat bergerak penamil komik strip dan alur navigasi antar halaman.
f.
detection. Ditampilkan salah satu fungsi FrameExtraction dari kelas AutomaticFrameDetectionHelper yang berisi kode implementasi proses pengekstrasian gambar komik. Implementasi Antarmuka Pada implementasi antarmuka pengguna ini akan ditampilkan hasil implementasi rancangan antarmuka pengguna aplikasi perangkat bergerak penampil komik strip
5. HASIL DAN PEMBAHASAN Proses pengujian pada aplikasi “aplikasi penampil komik strip menggunakan automatic frame detection” terdiri dari pengujian fungsional, dan pengujian nonfungsional. 5.1
Pengujian Fungsional
Tujuan dilakukan pengujian fungsional untuk mengetahui apakah sistem yang dibangun sesuai dengan kebutuhan. Acuan pengujian fungsional berdasarkan daftar kebutuhan fungsional yang telah dirumuskan sebelumnya. Pengujian fungsional menggunakan pengujian black box.
2. Pada tahap implementasi aplikasi Setelah melakukan rancangan mendetail pada tahap perancangan. Barulah dilakukan tahap implementasi aplikasi perangkat bergerak penampil komik strip. a. Spesifikasi Sistem ekayasa kebutuhan serta perancangan aplikasi perangkat bergerak penampil komik strip akan menjadi acuan dalam implementasi section ini. Spesifikasi sistem diimplementasikan pada spesifikasi perangkat keras dan perangkat lunak b. Batasan-Batasan Implementasi Mengatur segala batasan batasan agar pada tahap implementasi tidak meluas. c. Implementasi Basis Data Implementasi penyimpanan data pada aplikasi perangkat bergerak penampil komik strip menggunakan basis data untuk menyimpan favorite komik strip pengguna. Implementasi dari basis data pada aplikasi menggunakan SQLite. d. Implementasi Class dan Assets Setiap class dan assets yang telah dirancanga pada proses perancangan direalisasikan pada package program. Berkas .xaml berfungsi sebagai layout view sekaligus disertain dengan berkas .cs dengan nama yang sama sebagai logic code. e. Implementasi Kode Aplikasi 1. Implementasi Prosedur Pengambilan Data Gambar Komik Implementasi pengambilan data menggunakan regular expression 2. Implementasi Prosedur Automatc Frame Detection. Implementasi yang digunakan untuk mengekstraksi gambar komik strip menggunakan metode automatic frame
Nomor Kasus Uji FUN_01
FUN_02
FUN_03
FUN_04
FUN_05
FUN_06
5.2
Hasil yang Didapatkan
Status
Pengguna dapat melihat kategori komik apa saja yang berada di halaman utama. Pengguna dapat membaca komik yang telah di pilih dan sesuai dengan tanggal yang di masukkan pada halaman membaca. Pengguna dapat melihat favorite komik apa saja yang berada di halaman utama bagian favorite. Pengguna dapat menambah favorite komik apa saja yang tersedia. Pengguna dapat meghapus favorite komik yang berada pada aplikasi. Pengguna dapat membaca komik sesuai dengan pilihan menggunakan metode automatic frame detection.
Valid
Valid
Valid
Valid
Valid
Valid
Pengujian Non-Fungsional
Selain pengujian fungsional, terdapat pengujian nonfungsional. Terdapat pengujian usability pada
8
Jurnal Doro Volume 7 Number 15 pengujian non-fungsional. Pengujian non-fungsional dilakukan untuk menguji aspek kebutuhan nonfungsional pada aplikasi berjalan dengan baik. 1. Pengujian Usability Pengujian usability bertujuan untuk memastikan aplikasi dapat diterima oleh pengguna. Pengukuran usability menggunakan kuisioner. Jenis kuisioner yang dilakukan adalah USE. Terdapat 30 pertanyaan kuisioner yang diberikan kepada 5 orang responder. Dari 5 orang responder tersebut berasal dari latar belakang yang berbedabeda. 2. Analisis Hasil Pengujian Usability Analisis hasil pengujian usability dilakukan menggunakan skala Likert. Urutan skala Likert terdiri dari lima angka penilaian yaitu: (1) sangat tidak setuju, (2) tidak setuju, (3) netral, (4) setuju, (5) sangat setuju. Aspek
Rata-
Persen-
Penilaian
Rata
tase
Skor
(%)
20.62
82.5
Usefulness
Calvin and Hobbes Garfield
17 Desember 458400 9639 2015 17 Desember 412800 6620 2015 Classic 17 Desember 456000 7012 Doonesbury 2015 Peanuts 17 Desember 292800 4653 2015 4. Hasil Pengujian Waktu Proses Dari hasil pengujian waktu proses ekstrasi menggunakan metode automatic frame detection didapatkan perbedaan waktu lama proses dengan berbeda besar file gambar komik
Waktu Proses (ms) 20000
Status
10000 0 292800 412800 456000 4584400 1012800
Sangat
Waktu Proses (ms)
memuaskan Ease of use
21
84
Gambar Grafik Waktu Proses
Sangat memuaskan
Ease
of
22.5
90
learning Satisfaction
6. PENUTUP
Sangat
6.1 Kesimpulan
Berdasarkan hasil analisis dari perancangan, implementasi, dan pengujian yang telah dilakukan dapat diambil kesimpulan sebagai berikut: 1. Rancangan aplikasi perangkat bergerak penampil komik strip telah sesuai dengan spesifikasi kebutuhan yang telah dianalisa 2. Implementasi menggunakan pattern viewmodel-viewmodel dan metode automatic frame detection pada aplikasi telah berhasil diterapkan. Sehingga data gambar komik yang didapatkan dari website www.gocomics.com berhasil ditampilkan. 3. Berdasarkan hasil pengujian fungsional dengan metode pengujian blackbox menunjukkan bahwa semua fitur atau kebutuhan fungsional telah sesuai dengan yang dibutuhkan. Selain itu, tingkat usabilitas dari aplikasi berdasarkan aspek pengujian usabilitas yang meliputi aspek learnability, efficiency, memorability, errors, dan satisfaction menunjukkan rata-rata sebesar 85.27% dengan status sangat memuaskan. Sedangkan berdasarkan hasil pengujian nonfungsional yang terdiri dari pengujian akses data dan waktu proses metode automatic
memuaskan 21.14
84.57
Sangat memuaskan
Rata-rata
21.31
85.26
Sangat memuaskan
Hasil dari pengujian usability yang telah dilakukan ditunjukkan pada tabel diatas. Pada diatas menunjukkan rata-rata skor Likert 21.31 dan presentase sebesar 85.26%, sehingga dapat disimpulkan aplikasi “rancang bangun aplikasi penampil komik strip menggunakan automatic frame detection” memuaskan pengguna. 3. Pengujian Waktu Proses Pada pengujian waktu proses ekstraksi menggunakan metode automatic frame detection dilakukan dengan melakukan percobaan kepada 5 kasus uji file gambar komik strip pada kategori komik yang berbeda-beda. Nama Data Komik File Size Waktu Komik Proses (ms) Garfield 13 Desember 1012800 15446 2015
9
Jurnal Doro Volume 7 Number 15 frame detection, menunjukkan bahwa aplikasi dapat berjalan serta mampu menangani akses data dari berbagai kondisi dengan baik dan memastikan alur proses fungsional dalam aplikasi berjalan dengan normal dimana waktu proses metode naik secara linear pada saat data gambar file komik juga bertambah besar. Berdasarkan beberapa hasil pengujian tersebut dapat dikatakan bahwa performansi aplikasi dengan parameter usabilitas, akses data, dan waktu proses metode automatic frame detection, adalah baik dan aplikasi dapat digunakan dengan semestinya.
DAFTAR PUSTAKA [1] admin, 2014. SWAOnline. [Online] Available at: http://swa.co.id/business-research/survei-idctren-penggunaan-smartphone-dan-tablet-di-asiapasifik [Accessed 12 10 2015] [2] Arai, K. & Tolle, H., Automatic E-Comic Content Adaptation, International Journal of Ubiquitous Computing (IJUC), 1(1). [3] Yunmar, R. A., 2012. Elearning Amikom. [Online] Available at: http://elearning.amikom.ac.id/index.php/downlo ad/materi/555149-st084 30/2012/05/20120504_10.regular_expression.pra ktikum.pdf [Accessed 12 12 2015].
5.2 Saran
Saran untuk mengembangkan lebih lanjut aplikasi penampil komik strip antara lain : 1. Dapat diimplementasikan pada sistem operasi perangkat bergerak lainnya yaitu android, dan iOS. 2. Adanya pengembangan metode automatic frame detection untuk masalah performansi waktu proses pada aplikasi. 3. Peningkatan metode automatic frame detection untuk dapat mendeteksi frame kotak, contoh : pada komik Calvin and Hobbes untuk 17 Desember 2015 4. Semua kategori komik strip yang berada di www.gocomics.com memiliki pola yang sama seperti contohnya Garfield, Doonesbury agar dapat diimplementasikan metode automatic frame detection.
[4] Wikipedia, 2015. Wikipedia. [Online] Available at:https://en.wikipedia.org/wiki/Model_View_Vi ewModel [Accessed 13 November 2015] [5] Smith, J., 2009. MSDN Microsoft. [Online] Available at: https://msdn.microsoft.com/enus/magazine/dd419663.aspx [Accessed 13 November 2015] [6] Tolle, H. & Arai, K., 2013. Manga Content Extraction Method for Automatic Mobile Comic Content Creation. ICACSIS 2013.
10
