Aplikasi Pengolah Citra Digital Berbasis Flash pada Perangkat Mobile

Iqbal Adiyat Program Studi Teknik Informatika, Fakultas Teknik, Universitas Tanjungpura iqbaladiyat@gmail.com
Abstract- Mobile phone gets smarter by the time. Nowadays, mobile phone is not all about calling out the phonebook or send a SMS to them. Decent hardware and operating systems make it do many things. For example taking a photo with the camera, open image file, and many others. Sometime users did not satisfied with the image quality they had, thus a simple application to fix image quality was needed. The application was designed for Adobe Flash and Adobe Air supported mobile platform. Built with ActionScript language and Pixel Bender for image processing and filtering, this application could help users to fix their image easily. 2.2 Adobe Flash Adobe Flash adalah program yang didesain khusus oleh Adobe untuk membuat animasi dua dimensi yang handal dan ringan sehingga Flash banyak digunakan untuk keperluan efek animasi web. Pada 3 Desember 2005, Adobe membeli Macromedia dan seluruh produknya, termasuk Flash. Adobe Flash memiliki bahasa pemrograman sendiri, yaitu ActionScript. ActionScript telah dikembangkan hingga versi 3, yang merupakan bahasa pemrograman berorientasi objek. 2.3 ActionScript[1] Dikembangkan oleh Macromedia Inc. and based on ECMAScript. Umumnya dikembangkan untuk pengembangan web dan aplikasi berbasis Flash. ActionScript merupakan bahasa pemrograman open source. 2.4 Adobe AIR[2] Adobe Integrated Runtime adalah runtime environment yang dikembangkan oleh Adobe Systems untuk membuat Rich Internet Applications (RIA) menggunakan Adobe Flash, Adobe Flex, HTML, dan Ajax. Adobe AIR dapat dijalankan sebagai aplikasi desktop atau mobile. Adobe AIR mendukung banyak platform seperti Windows, Mac OS, and Linux. Pengembangan untuk Linux dihentikan sejak versi 2.6. Untuk mobile platform, Adobe AIR mendukung Apple iOS, Google Android, dan QNX. 2.4.1 Android Compiler Ketika kita mem-publish file Flash untuk Android, kode-kode sumber akan dirubah oleh compiler ActionScript menjadi format biner yang bernama ActionScript Byte Code (ABC). ABC ini ter-package di dalam file .swf. File .swf ini dan resource files pendukung lain inilah yang kemudian di-package bersama menjadi Android package (.apk) yang telah siap diinstal ke dalam perangkat Android

!
Keywords- digital image processing, Flash, ActionScript, mobile. 1. Pendahuluan

Telepon seluler saat ini telah memiliki perangkat keras yang mumpuni. Hal ini membuat ponsel dapat melakukan beragam fungsi selain fungsi dasarnya. Berselancar di internet, mengatur berkas, memainkan musik dan video, dan mengambil foto. Seringkali, kualitas foto tidak memenuhi keinginan pengguna. Kadang terlalu gelap, kabur, atau memiliki derau. Oleh karena itu dibutuhkan perangkat lunak untuk memproses citra digital pada perangkat mobile. 2. Teori Dasar

2.1 Citra Digital Secara harafiah, citra (image) adalah gambar pada bidang dwimatra (dua dimensi). Ditinjau dari sudut pandang matematis, citra merupakan fungsi menerus (continue) dari intensitas cahaya pada bidang dua dimensi. Pada citra raster, sebuah citra terdiri atas pikselpiksel. Piksel merupakan akronim dari picture element. Setiap satu buah piksel mengandung satu buah informasi warna. Warna ini dapat berupa kombinasi Red, Green, and Blue (RGB). Setiap warna dipresentasikan oleh bilangan biner sebanyak 8 bit. Pada modus warna RGB, setiap piksel mengandung minimal 3 x 8 bit = 24 bit data. 8 bit untuk merah, 8 bit untuk hijau, dan 8 bit untuk biru.

INTRODUCING FLASH FLASH DEVELOPMENT FOR MOBILE DEVICES CHAPTER 6 6 1 1 INTRODUCING DEVELOPMENT FOR MOBILE DEVICES CHAPTER

Compile Time (Standard) .a

.a .swf ActionScript ActionScript Byte Code ActionScript (ABC)

Compile Time (Standard)

2.7 Median Filter

.swf

.as Files

.as Files
Project Files

Compiler ActionScript Compiler

Byte Code (ABC)

Project Files

Source Files

Source Files FIGURE 1 2

FIGURE 1 2

Median filter merupakan order-statistics filter yang paling dikenal. Median filter mengambil area tertentu pada citra sesuai dengan ukuran mask yang telah ditentukan (umumnya berukuran 3x3), kemudian dilihat setiap nilai piksel pada area tersebut, dan nilai tengah pada area diganti dengan nilai median. Cara memperoleh nilai median yaitu nilai keabuan dari titik-titik pada matriks diurutkan dari nilai terkecil ke terbesar, kemudian ditentukan nilai yang berada di tengah urutan. 2.8 Convolution Filter[4]

Gambar 1. Compile time (standard)

At run time, the le inside of the Android app is processed by the ActionScript Virtual Machine (AVM2),berkas which is part of the AIR for Android run time. The AVM2 loadsmerupakan the ABC leoperasi pengolahan citra yang Di Android, .swf diproses oleh bagian Air for Konvolusi into and decodes it. The bytecodes are then run through mengalikan anby interpreter and executed as citra dengan sebuah mask atau At runmemory time, the le inside of the Android app is processed the ActionScript Virtual Android yaitu ActionScript Virtual Machine (AVM2). matriks sebuah native machine code (see Figure 1-3) by the AIR run time. This process of bytecode compilation by le Machine (AVM2), which is part of the AIR for Android run time. The AVM2 loads the ABC AVM2 mengirim berkas ABC ke memori dan me-decode kernel. Pada aplikasi ini, konvolusi digunakan pada fitur thememory AVM2 isand specic to the Android platform. into decodes it. The are then run through an interpreter executed as berkas tersebut. Kode bita inibytecodes dilewatkan ke sebuah sharpen . Matriks and piksel citra dikalikan dengan matriks [0,

native machine (see Figure 1-3)kode by the AIR alami run time. This-1, process compilation by interpreter dancode dijalankan sebagai mesin oleh 0, -1, of 5, bytecode -1, 0, -1, 0]. Run Time (Standard) the AVM2 is specic to the Android platform. AIR.
.swf ActionScript Byte Code .swf (ABC)

Run Time (Standard)

ActionScript Virtual Machine (AVM2) Native Machine Code

2.9 Histogram Histogram adalah representasi grafis untuk distribusi warna dari citra digital. Sumbu ordinat vertikal merupakan representasi piksel dengan nilai tonal dari tiap-tiap deret bin pada sumbu axis horizontalnya. 2.10 Pixel Bender Adobe Pixel Bender (sebelumnya bernama Hydra)

ActionScript Byte Code FIGURE 13 (ABC)

Gambar

ActionScript Virtual Machine (AVM2) 2. Run time (standard)

Native Machine Code

FIGURE 1 3 for iOS Building

2.5 Android[3]

Building for iOS

Android adalah sistem operasi berbasis Linuxenvironment untuk adalah bahasa pemrograman yang dikembangkan So, while Android apps run on top of an AIR runtime that issebuah installed separately, iOS ponsel cerdas. Awalnya oleh making Android, oleh Adobe Systems untuk apps wrap the runtime code dikembangkan inside of the app itself, it self-contained. Not surprisingly, then, menjalankan algoritma Inc., yang kemudian Google pada 2005. Ponsel pengolahan citra digital. Syntax bahasa program ini the process in which andibeli iOS app is created, is quite distinct. Let me explain. pertama Android dijual pada Oktober 2008. didasarkan pada GSGL. Saat ini Pixel Bender dapat

When you compileapps a Flash project for the ABC code is compiled by the Low Level Machine iOS So, while Android run onsource top ofiPhone, an AIR runtime environment that ispada installed separately, Android bersifat open dan Google merilis digunakan Adobe Flash, Adobe After Effects, dan Compiler (LLVM), which is an open source compiler infrastructure that is used toNot generate machine then, apps wrap the runtime code inside of the app itself, making it self-contained. surprisingly, kode sumbernya di bawah Apache License. Adobe Photoshop. code for iOS. (Apple itself uses the LLVM). However, as shown in Figure 1-4, in its Packager for the process in which an iOS Adobe app is created, is quite distinct. Android mendukung Flash dan Adobe AIR Let me explain. iPhone, Adobe provides an ActionScript front-end to the LLVM for handling Flash les.

sejak versi 2.2 (Frozen Yoghurt). Experimental Results When you compile a Flash project for iPhone, the ABC code is 3. compiled by the Low Level Machine While the AVM2 supports JIT for Web and AIR, LLVM uses Ahead-Of-Time (AOT) compilation to Compiler (LLVM), which is an open source compiler infrastructure that is used to generate machine produce native ARM assembly code wrapped inside of an iPhone executable le. The also con2.6 for Skin Segmentation Perangkat lunak dibangun code iOS. (Apple itself uses the LLVM). However, as shown in Figure 1-4, in its Packager fordengan ActionScript 3.0 tains a containing assets and a conguration le. pada Adobe Flash iPhone, Adobe provides an ActionScript front-end to the LLVM for handling Flash dan les.Pixel Bender toolkit. Perangkat
While the AVM2 JIT for and AIR, LLVM uses Ahead-Of-Time (AOT) compilation to mendukung Adobe merubah modus supports warna RGB keWeb YCbCr. YCbCr akan 1. Dibuat untuk paltform yang produce native citra ARMmenjadi assembly komponen code wrapped inside of an iPhone executable le. The memisahkan luminosity dan Flash dan Adobe AIR. also contains a containing assets and a conguration komponen warna. Keuntungan dari YCbCr le. adalah 2. Memuat citra dari local drive.

Deteksi

warna

kulit

dapat

dilakukan

dengan

lunak ini memiliki spesifikasi dan fitur sebagai berikut:

komponen luminosity dapat dibuang dengan mudah pada saat pengolahan citra. Komponen luminosity berada pada channel Y dan komponen warna pada channel Cb (biru) dan Cr (merah). Berikut adalah cara merubah RGB menjadi YCbCr: Y = 0.257*R + 0.504*G + 0.098*B + 16 (1)

3. 4. 5. 6. 7.

Cb = 0.148*R 0.291*G +0.439*B + 128 (2) Cr = 0.439*R 0.368*G 0.071*B + 128 (3) Nilai threshold maksimum dan minimum diberikan pada Cb dan Cr untuk memisahkan warna kulit dan warna lainnya.

Mengatur kecerahan, kontras, dan saturasi. Memutar citra. Filter black & white dan sephia. Memuat histogram citra. Deteksi warna kulit, memperbaiki tekstur kulit, dan mencerahkan warna kulit (skin refining). 8. Mengurangi derau pada citra. 9. Mempertajam citra. Berikut adalah use case diagram dari perangkat lunak:

Gambar 6. Citra dengan filter black & white Gambar 3. Use case diagram aplikasi Ketika memulai aplikasi, pengguna akan diminta untuk memilih citra yang akan dimuat, kemudian pengguna dapat memanipulasi citra dengan fitur yang disediakan. Berikut ini adalah antarmuka dari aplikasi:

Gambar 7. Citra dengan filter sephia

Gambar 4. Menu muat citra

Gambar 8. Pengaturan kecerahan citra

Gambar 5. Menu utama setelah memuat citra

Gambar 9. Pengurangan derau salt & pepper 4.

Gambar 12. Penajaman citra Kesimpulan

Gambar 10. Histogram citra

Hasil penelitian menunjukkan dapat melakukan beberapa pengolahan citra, seperti pengaturan kecerahan, kontras, dan saturasi, rotasi citra, filter black & white dan sephia, pengurangan derau, skin refining, penajaman citra, memuat histogram citra, dan menyimpan citra. Pada saat reduksi derau, hasil terbaik pada citra dengan tipe derau salt & pepper. Pada beberapa citra, hasilnya akan terlihat sedikit kabur. Pada beberapa perangkat dengan spesifikasi rendah, aplikasi berjalan lebih lambat karena bukan merupakan native application. Berdasarkan kuesioner pada beberapa responden, penelitian dinilai cukup berhasil.. Untuk pengembangan lebih lanjut, aplikasi dapat dikembangkan menjadi native application. Fitur untuk memotong citra, auto level dengan histogram stretching, dan penambahan beberapa filter dapat dipertimbangkan. Referensi [1] Elst, P.; Jacobs, S., and Yard, T. 2007. ObjectOriented ActionScript 3.0. Friends of Ed. http://www.apress.com/ [2] Wagner, Richard. 2011. Professional Flash Mobile Development: Creating Android and iPhone Applications. Wiley Publishing, Inc. http://www.wiley.com/ [3] David, Matthew. 2011. Flash Mobile: Developing Android and iOS Applications. Focal Press. http://www.elsevier.com/ [4] Yard, Todd. 2009. Foundation ActionScript 3.0 Image Effects. Friends of Ed. http://www.apress.com/ Biografi Iqbal Adiyat lahir di Sanggau, Kalimantan Barat, Indonesia pada tanggal 31 Mei 1989. Ia menerima gelar Sarjana Teknik dari Universitas Tanjungpura, Pontianak, Indonesia, pada Januari 2013.

Gambar 11. Skin refining