DINAMIKA TEKNOLOGI April 2017 Vol. 9; No. 1; Hal. 27-31
WEBSITE PERANCANGAN SCRAPBOOK DENGAN PEMOTONGAN GAMBAR OTOMATIS C. Pickerling Teknik Informatika,Sekolah Tinggi Teknik Surabaya e-mail:
[email protected]
ABSTRAK Scrapbook merupakan salah satu kegemaran yang saat ini sedang diminati oleh kalangan masyarakat. Namun seringkali tidak semua orang dapat membayangkan untuk membuat suatu karya sesuai dengan keinginannya tanpa melihat contoh atau membuat sendiri. Sering kali seseorang harus membeli bahanbahan scrap terlebih dahulu dan kemudian mencobanya, jika tidak sesuai dengan seleranya maka barang yang sebelumnya telah dibeli tidak akan digunakan lagi dan mengakibatkan seseorang harus mengeluarkan biaya yang cukup besar untuk membelanjakan barang-barang yang seharusnya tidak diperlukan. Selain untuk menyediakan layanan penjualan barang-barang scrapbook, aplikasi ini juga digunakan untuk mendesain scrapbook sesuai keinginan customer dengan menggunakan barang-barang yang telah dibeli sebelumnya. Penerapan Algoritma Segmentasi Image digunakan untuk proses pemotongan sebuah image menjadi beberapa objek sehingga dapat mendukung pembuatan aplikasi ini dalam mendesain scrapbook secara custom. Kata kunci: image segmentation, grayscale, noise reduction, bilevel, noise removal
PENDAHULUAN Seiring dengan berkembangnya kebiasaan seseorang dalam mengumpulkan dan menyimpan foto, data atau barang-barang yang berkesan untuk menjadi suatu kenang-kenangan, maka muncul seni scrapbook. Seni scrapbook merupakan seni menempel foto, atau gambar dimedia kertas dan menghiasnya hingga menjadi suatu karya kreatif. Selain itu seni scrapbook juga merupakan perpaduan warna, motif, dan bentuk untuk menghasilkan karya-karya yang indah, sehingga diperlukan suatu keahlian untuk membuatnya dan tidak semua orang dapat menikmati kegemaran dalam membuat dan mendesain scrapbook. Saat ini telah banyak tersedia online shop yang menyediakan layanan penjualan bahan-bahan scrap dan scrapbook yang telah siap digunakan. Sering kali seseorang harus membeli bahan-bahan scrap terlebih dahulu dan kemudian mencobanya, jika tidak sesuai dengan seleranya maka bahan-bahan yang sebelumnya telah dibeli tidak akan digunakan lagi dan mengakibatkan seseorang harus mengeluarkan biaya yang cukup besar untuk membelanjakan bahan-bahan yang seharusnya tidak diperlukan.
Dengan adanya fitur untuk mendesain secara custom, maka mempermudah seseorang dalam mengimajinasikan hasil karya scrapbook seperti yang diinginkannya. Hingga saat ini aplikasi yang dapat mendesain scrapbook saatlah minimal. Oleh karena itu, penulis memanfaatkan kesempatan tersebut untuk membuat aplikasi yang mudah digunakan untuk mendesain scrapbook secara custom dan juga sebagai jasa untuk membuatkan scrapbook. Untuk mendesain scrapbook secara custom maka diperlukan penerapan algoritma segmentasi image. Segmentasi Image digunakan untuk proses pemotongan sebuah image menjadi beberapa objek sehingga dapat mendukung pembuatan aplikasi ini dalam mendesain scrapbook secara custom.
DESAIN SISTEM Pada bagian ini akan dijelaskan mengenai cara kerja sistem perancangan scrapbook ini. User dibagi menjadi 2 macam, yaitu admin dan customer. Admin bertugas untuk melakukan upload berbagai bahan untuk menunjang perancangan scrapbook, sedangkan Customer merupakan pengunjung website yang akan melakukan pembelian barang pada umumnya.
Dinamika Teknologi Jurnal Ilmiah Teknologi dan Rekayasa, ISSN: 1907-7327
27
DINAMIKA TEKNOLOGI April 2017 Vol. 9; No. 1; Hal. 27-31
material yang terdapat pada shopping cart akan disimpan untuk proses layout scrap. Seluruh material yang dibeli akan dikategorikan berdasarkan jenis materialnya sehingga memudahkan customer untuk merancang scrapbook yang diinginkan. Customer dapat melakukan peletakkan setiap gambar berdasarkan posisi layer seperti gambar di bawah ini.
Gambar 1. Arsitektur Sistem Pertama-tama admin akan melakukan upload barang-barang yang ready stock. Material atau bahan yang dijual dapat berupa card stock, kertas bermotif, stiker, frame, pita, font dies, kancing dan lain-lain. Selain upload gambar material yang akan dijual, pada website ini juga terdapat proses untuk melakukan pemotongan image pada kertas bermotif ataupun stiker seperti gambar berikut ini. Gambar 3. Penataan Layout Scrapbook Setelah perancangan scrapbook selesai, maka customer dapat lanjut ketahap berikutnya, yaitu melihat view dari scrapbook yang telah dirancang. Jika layout tersebut sudah sesuai maka akan masuk pada proses pembayaran. Pada proses pembayaran akan diperhitungkan seluruh material yang telah dibeli, ongkos kirim serta ongkos jasa pembuatan scrapbook. Konfirmasi email akan dikirimkan ke customer saat pembayaran telah dilakukan dan barang (scrapbook yang telah jadi) akan siap dikirimkan.
Gambar 2. Proses Pemotongan Gambar
PEMOTONGAN IMAGE MENGGUNAKAN ALGORITMA SEGMENTASI IMAGE
Pemotongan image dimaksudkan agar customer yang memilih kertas bermotif tersebut dapat menghias sesuai dengan keinginannya. Seluruh potongan yang telah diproses akan disimpan secara terpisah dalam database sehingga mempermudah customer untuk menghias scrapbooknya. Dari sisi customer, pertama kali customer dapat mengunjungi website scrapbook ini terlebih dahulu. Customer memilih seluruh material yang diinginkan untuk dimasukkan ke shopping cart. Setelah melakukan pembelian material, maka
Pada bagian ini dijelaskan mengenai cara pemotongan image dimana tujuannya adalah memisahkan sebuah image utuh yang berisikan banyak objek scrapbook menjadi sebuah image untuk masing-masing objek. Misal seperti pada gambar 2, terdapat sebuah image dengan 17 objek didalamnya (9 kucing dan 8 hati) maka akan dipisahkan dimana per objeknya akan menjadi sebuah image tersendiri dan terdapat 17 image.
28
Dinamika Teknologi Jurnal Ilmiah Teknologi dan Rekayasa, ISSN: 1907-7327
DINAMIKA TEKNOLOGI April 2017 Vol. 9; No. 1; Hal. 27-31
posisi pixel pada image input sedangkan W melambangkan pixel yang bertetangga dengan pixel i dan j. Hasil dari algoritma ini adalah sebuah image grayscale yang telah dikurangi noisenya dan memiliki ukuran N x M x 1 depth. Gambar 4. Arsitektur Segmentasi Image
KONVERSI KE BILEVEL
INPUT (1-IMAGE)
Hasil dari proses sebelumnya (image grayscale yang telah dikurangi noisenya) diubah menjadi sebuah image bilevel (image yang hanya terdiri dari pixel 0 dan 1) dengan tujuan pixel yang berdekatan dapat menjadi 1 warna yaitu pixel 1 sedangkan background dari image dapat menjadi 1 warna juga yaitu pixel 0. Algoritma bilevel yang digunakan pada sistem ini adalah adalah algoritma Otsu dengan harapan image apapun yang diinputkan dapat diproses tanpa harus melakukan modifikasi nilai threshold secara manual.
Input yang diberikan merupakan suatu image (1-Image) dengan ukuran N x M x 3 depth yang terdiri dari banyak objek dengan batasan antar objek tidak boleh saling tumpang tindih (overlap).
PROSES Pada proses terdapat beberapa tahapan untuk melakukan pengolahan data berupa image, yaitu: konversi ke grayscale, noise reduction, konversi ke bilevel, noise removal dan connected component labeling.
KONVERSI KE GRAYSCALE Koversi ke grayscale dilakukan untuk mengubah image yang sebelumnya memiliki 3 depth warna (Red, Green, dan Blue) menjadi hanya 1 depth warna saja (range warna antara 0 – 255). Konversi ini dilakukan dengan menggunakan rumus berikut ini: = 0.21
+ 0.72
+ 0.07
Dimana G melambangkan pixel grayscale sedangkan R, G, dan B melambangkan pixel Red, Green, dan Blue pada image input. Perhitungan ini dilakukan pada seluruh pixel yang terdapat pada image sehingga mampu mengubah ukuran image menjadi N x M x 1 depth.
NOISE REDUCTION Image grayscale yang diperoleh pada proses sebelumnya, dilakukan pengurangan noise dengan menggunakan algoritma median filtering yang bertujuan agar image tersebut tidak mengandung terlalu banyak noise sehingga mengganggu proses segmentasi pada akhirnya. Rumus median filtering yang digunakan adalah sebagai berikut: [ , ]=
{ [ , ], ( , ) ∈
}
Dimana Y melambangkan image hasil noise reduction, i dan j adalah posisi pixel dari image hasil yang hendak diperoleh, X melambangkan image input (image hasil grayscale), a dan b adalah
Algoritma Otsu 01: Hitung histogram dan probabilitas dari masing-masing intensitas 02: Tentukan nilai awal wi(0) dan µi(0) 03: Untuk seluruh t = 1 sampai maksimum intensitas 04: Update wi dan µi 05: Hitung ( ) 06: Pilih threshold yang memiliki nilai ( ) paling besar
Hasil dari algoritma ini adalah sebuah image bilevel yang memiliki ukuran N x M x 1 depth.
NOISE REMOVAL Image bilevel yang telah diperoleh pada proses sebelumnya, diproses lebih lanjut untuk menghilangkan noise yang dimiliki dengan lebih akurat. Algoritma yang digunakan untuk proses ini adalah Algoritma Morphology Opening dan Closing. Proses ini dilakukan dengan tujuan agar image bilevel yang diproses pada proses segmentasi image dapat lebih berkualitas. ° = ( ⊖ )⨁ Rumus diatas merupakan rumus Morphology Opening dimana o proses Morphology Opening, proses erosi, dan proses delasi. Sedangkan rumus untuk Morphology Closing adalah sebagai berikut: ⋅ =( ⨁ )⊖ Dimana merupakan proses Morphology Closing, proses erosi, dan proses delasi. Setelah melalui 2
Dinamika Teknologi Jurnal Ilmiah Teknologi dan Rekayasa, ISSN: 1907-7327
29
DINAMIKA TEKNOLOGI April 2017 Vol. 9; No. 1; Hal. 27-31
proses tersebut maka image hasil yang diperoleh adalah sebuah image bilevel yang dapat dikatakan tidak memiliki noise atau sedikit noise dengan ukuran N x M x 1 depth.
CONNECTED COMPONENT LABELING Sesuai dengan namanya, connected component labeling bertujuan untuk melakukan pelabelan pada image bilevel (hasil dari proses noise removal) yang pixel-pixelnya saling terhubung1. Seperti pada gambar 2 maka hasil dari connected component labeling dari image tersebut adalah 17 label dimana masing-masing label menandakan objek sendiri-sendiri. Algortma yang digunakan pada proses ini adalah Algoritma Two Pass dan menghasilkan output berupa region dari masingmasing label. Algoritma Two Pass 01: Pass Pertama 02: Lakukan Raster Scanning 03: Jika pixel bukan merupakan background 04: Ambil pixel tetangga dan pixel saat ini 05: Jika tidak memiliki tetangga, labelkan pixel tersebut tersendiri dan lanjutkan proses 06: Sebaliknya, jika memiliki tetangga, cari tetangga dengan label terkecil dan catatkan pada pixel saat ini 07: Simpan ekuivalensi antar label yang bertetangga 08: Pass Kedua 09: Lakukan Raster Scanning 10: Jika pikses bukan background 11: Labelkan ulang pixel tersebut berdasarkan piksel terkecil dari tabel ekuivalensi
Hasil region dari proses ini bukan berupa kotak saja karena dalam pengambilan image hasil jika image input terlalu berdekatan dapat memotong image lain yang tidak selabel. Oleh karena itu pada penelitian ini, region yang dihasilkan berupa kotak dan image yang terdiri dari pixel hitam putih yang merupakan perwakilan dari image untuk label itu secara keseluruhan.
OUTPUT (N-IMAGE)
Output yang dihasilkan adalah image input (3 depth) yang dipotong berdasarkan region yang dihasilkan oleh connected component labeling dan diproses menggunakan operator AND dengan image hitam putih yang dihasilkan oleh connected component labeling yang merupakan representasi dari masing-masing label, sehingga output yang dihasilkan adalah image sejumlah label yang telah terpisah satu dengan yang lain (gambar 2 sebelah kanan).
UJI COBA Pada bagian ini akan dijabarkan mengenai uji coba yang telah dilakukan. Uji coba yang dilakukan terdiri dari fungsionalitas aplikasi penjualan scrapbook dan layout scrapbook secara custom serta uji coba output yang dihasilkan apakan mampu untuk direalisasikan. Ujicoba ini dilakukan untuk memastikan apakan setiap fungsifungsi yang dibuat dapat berfungsi dengan baik. Berikut ini merupakan hasil pengujian melalui kuesioner. Tabel 1. Hasil Uji Coba Kelayakan PERTANYAAN Bagaimana menurut Anda tampilan dari website ini? Apakah desain untuk fitur layout memudahkan Anda untuk mendesain scrapbook sesuai keinginan Anda? Bagaimana kecepatan menampilkan image pada fitur layout? Bagaimana kecepatan proses penyimpanan hasil desain scrapbook yang telah Anda buat? Apakah Anda tertarik menggunakan aplikasi ini untuk mendesain scrapbook?
B 20%
K 5%
SK -
95%
5%
-
-
100%
-
-
-
85%
15%
-
-
95%
5%
-
-
KESIMPULAN Adapun beberapa kesimpulan yang diperoleh adalah sebagai berikut: 1. Penerapan algoritma segmentasi image sangat berguna untuk pemotongan image menjadi beberapa objek sehingga mempermudah user untuk mendesain scrapbook secara custom. 2. Dengan adanya fitur untuk melakukan layout secara custom maka dapat mempermudah user untuk mencoba-coba dan mengimajinasikan desain yang dibuat.
1 Bertetangga satu dengan yang lain. Model piksel tetangga yang digunakan adalah 4-tetangga atau 8-tetangga.
30
SB 75%
Dinamika Teknologi Jurnal Ilmiah Teknologi dan Rekayasa, ISSN: 1907-7327
DINAMIKA TEKNOLOGI April 2017 Vol. 9; No. 1; Hal. 27-31
DAFTAR PUSTAKA 1. Richard Szeliski. 2010. Computer Vision: Algorithms and Applications.Springer Science & Business Media.
Dinamika Teknologi Jurnal Ilmiah Teknologi dan Rekayasa, ISSN: 1907-7327
31