TUJUAN - univbsi.idunivbsi.id/pdf/2014/100/100-P03.pdf · dengan cara yang sama seperti yang ......
Transcript of TUJUAN - univbsi.idunivbsi.id/pdf/2014/100/100-P03.pdf · dengan cara yang sama seperti yang ......
![Page 1: TUJUAN - univbsi.idunivbsi.id/pdf/2014/100/100-P03.pdf · dengan cara yang sama seperti yang ... tidak peduli seberapa kompleks ... dilakukan untuk mengedit citra bitmap yaitu: a.](https://reader030.fdokumen.com/reader030/viewer/2022041123/5d28ae5288c99392328c435e/html5/thumbnails/1.jpg)
1
![Page 2: TUJUAN - univbsi.idunivbsi.id/pdf/2014/100/100-P03.pdf · dengan cara yang sama seperti yang ... tidak peduli seberapa kompleks ... dilakukan untuk mengedit citra bitmap yaitu: a.](https://reader030.fdokumen.com/reader030/viewer/2022041123/5d28ae5288c99392328c435e/html5/thumbnails/2.jpg)
• TUJUAN
Agar mahasiswa dapat memahami tentang
struktur data dan format citra digital
2
STRUKTUR DATA UNTUK CITRA DIGITAL
![Page 3: TUJUAN - univbsi.idunivbsi.id/pdf/2014/100/100-P03.pdf · dengan cara yang sama seperti yang ... tidak peduli seberapa kompleks ... dilakukan untuk mengedit citra bitmap yaitu: a.](https://reader030.fdokumen.com/reader030/viewer/2022041123/5d28ae5288c99392328c435e/html5/thumbnails/3.jpg)
Sumber Grafik/Citra Digital
• Kertas foto, majalah, koran dll scanned
• Gambar dari kamera digital
• Web sites
• Dibuat oleh program komputer dari suatu data
![Page 4: TUJUAN - univbsi.idunivbsi.id/pdf/2014/100/100-P03.pdf · dengan cara yang sama seperti yang ... tidak peduli seberapa kompleks ... dilakukan untuk mengedit citra bitmap yaitu: a.](https://reader030.fdokumen.com/reader030/viewer/2022041123/5d28ae5288c99392328c435e/html5/thumbnails/4.jpg)
• Pixel: elemen gambar (picture element) pada
citra digital (titik-titik berwarna)
• Image resolution: jumlah piksel dalam sebuah
citra digital
• Bit-map: sebuah representasi data grafis/citra
dengan cara yang sama seperti yang
disimpan dalam memori video
Struktur Data Grafik/Citra
![Page 5: TUJUAN - univbsi.idunivbsi.id/pdf/2014/100/100-P03.pdf · dengan cara yang sama seperti yang ... tidak peduli seberapa kompleks ... dilakukan untuk mengedit citra bitmap yaitu: a.](https://reader030.fdokumen.com/reader030/viewer/2022041123/5d28ae5288c99392328c435e/html5/thumbnails/5.jpg)
Resolusi
• Resolusi adalah pengukuran kemampuan
suatu alat mengaproksimasi citra kontinu
menggunakan piksel yang terbatas
– Scanner, printer dpi (dots per inch)
– Video pixel dimension
– Bitmap ppi (pixels per inch)
![Page 6: TUJUAN - univbsi.idunivbsi.id/pdf/2014/100/100-P03.pdf · dengan cara yang sama seperti yang ... tidak peduli seberapa kompleks ... dilakukan untuk mengedit citra bitmap yaitu: a.](https://reader030.fdokumen.com/reader030/viewer/2022041123/5d28ae5288c99392328c435e/html5/thumbnails/6.jpg)
Bitmap vs Vector graphics
![Page 7: TUJUAN - univbsi.idunivbsi.id/pdf/2014/100/100-P03.pdf · dengan cara yang sama seperti yang ... tidak peduli seberapa kompleks ... dilakukan untuk mengedit citra bitmap yaitu: a.](https://reader030.fdokumen.com/reader030/viewer/2022041123/5d28ae5288c99392328c435e/html5/thumbnails/7.jpg)
• Vector-based: lebih cocok untuk ilustrasi yangmembutuhkan pengukuran yang tepat.
• Bitmap-based: lebih cocok untuk citraphotorealistic yang membutuhkan variasi warnayang kompleks
![Page 8: TUJUAN - univbsi.idunivbsi.id/pdf/2014/100/100-P03.pdf · dengan cara yang sama seperti yang ... tidak peduli seberapa kompleks ... dilakukan untuk mengedit citra bitmap yaitu: a.](https://reader030.fdokumen.com/reader030/viewer/2022041123/5d28ae5288c99392328c435e/html5/thumbnails/8.jpg)
• Vector Graphics
• Citra disimpan sebagai bentuk matematis
• Object-oriented graphics
• Bitmapped Graphic
• Citra dimodelkan dalam suatu senarai darinilai piksel
• Raster graphics
![Page 9: TUJUAN - univbsi.idunivbsi.id/pdf/2014/100/100-P03.pdf · dengan cara yang sama seperti yang ... tidak peduli seberapa kompleks ... dilakukan untuk mengedit citra bitmap yaitu: a.](https://reader030.fdokumen.com/reader030/viewer/2022041123/5d28ae5288c99392328c435e/html5/thumbnails/9.jpg)
Editing Program
• Bitmap
• Painting Programs
• Contoh: Photoshop, Paint
• Textures and continuous tones
• Vector
• Drawing Programs
• Contoh: Flash, Freehand, Illustrator
• Bentuk sederhana dengan warna flat atau
gradasi
![Page 10: TUJUAN - univbsi.idunivbsi.id/pdf/2014/100/100-P03.pdf · dengan cara yang sama seperti yang ... tidak peduli seberapa kompleks ... dilakukan untuk mengedit citra bitmap yaitu: a.](https://reader030.fdokumen.com/reader030/viewer/2022041123/5d28ae5288c99392328c435e/html5/thumbnails/10.jpg)
Ukuran image
• Vector Graphic
• Dipengaruhi isi image
• Menyimpan deskripsi obyek
• Makin kompleks, makin banyak deskripsi
yang dibutuhkan
• Bitmapped Graphic
– Untuk tiap luasan menyimpan jumlah data
yang sama, tidak peduli seberapa kompleks
isinya.
– Jumlah data dipengaruhi juga oleh tingkat
kedalaman warna
![Page 11: TUJUAN - univbsi.idunivbsi.id/pdf/2014/100/100-P03.pdf · dengan cara yang sama seperti yang ... tidak peduli seberapa kompleks ... dilakukan untuk mengedit citra bitmap yaitu: a.](https://reader030.fdokumen.com/reader030/viewer/2022041123/5d28ae5288c99392328c435e/html5/thumbnails/11.jpg)
• Bitmapped
• Vector
![Page 12: TUJUAN - univbsi.idunivbsi.id/pdf/2014/100/100-P03.pdf · dengan cara yang sama seperti yang ... tidak peduli seberapa kompleks ... dilakukan untuk mengedit citra bitmap yaitu: a.](https://reader030.fdokumen.com/reader030/viewer/2022041123/5d28ae5288c99392328c435e/html5/thumbnails/12.jpg)
• Bitmapped
• Menerapkan efek semacam blur sangat mudah
• Gambar akan kabur jika diskala (resized)
• Sukar untuk memilih obyek individual
• Vector
• Untuk menerapkan efek, harus diubah menjadi
bitmap terlebih dahulu
• Image tetap sama pada saat di-scaled/resized
• Mudah untuk memilih obyek secara individu
![Page 13: TUJUAN - univbsi.idunivbsi.id/pdf/2014/100/100-P03.pdf · dengan cara yang sama seperti yang ... tidak peduli seberapa kompleks ... dilakukan untuk mengedit citra bitmap yaitu: a.](https://reader030.fdokumen.com/reader030/viewer/2022041123/5d28ae5288c99392328c435e/html5/thumbnails/13.jpg)
File Format - Bitmapped Graphics
• GIF - Graphics Interchange Format
• 256 warna
• Lossless Compression
• Transparency
• JPEG
• Joint Photographic Experts Group
• Lossy Compression
• PNG
• > 256 warna
• Alpha channel transparencies
![Page 14: TUJUAN - univbsi.idunivbsi.id/pdf/2014/100/100-P03.pdf · dengan cara yang sama seperti yang ... tidak peduli seberapa kompleks ... dilakukan untuk mengedit citra bitmap yaitu: a.](https://reader030.fdokumen.com/reader030/viewer/2022041123/5d28ae5288c99392328c435e/html5/thumbnails/14.jpg)
• TIFF
• Tagged Image File Format
• Extensible format
• Dukungan bervariasi
• BMP
• Windows Bit Map format
• Uncompressed
![Page 15: TUJUAN - univbsi.idunivbsi.id/pdf/2014/100/100-P03.pdf · dengan cara yang sama seperti yang ... tidak peduli seberapa kompleks ... dilakukan untuk mengedit citra bitmap yaitu: a.](https://reader030.fdokumen.com/reader030/viewer/2022041123/5d28ae5288c99392328c435e/html5/thumbnails/15.jpg)
File Format Vector Graphics
• EPS
• Encapsulated PostScript
• Bounding box attribute
• SVG
• XML based language for graphic description
• SWF
• Flash
• CDR, AI
![Page 16: TUJUAN - univbsi.idunivbsi.id/pdf/2014/100/100-P03.pdf · dengan cara yang sama seperti yang ... tidak peduli seberapa kompleks ... dilakukan untuk mengedit citra bitmap yaitu: a.](https://reader030.fdokumen.com/reader030/viewer/2022041123/5d28ae5288c99392328c435e/html5/thumbnails/16.jpg)
Pengubahan Bitmap dan Vector
• Mudah, Vector bitmap
• Proses rasterizing
• Agak susah mengubah bitmap ke vektor
• Proses vectorizing
![Page 17: TUJUAN - univbsi.idunivbsi.id/pdf/2014/100/100-P03.pdf · dengan cara yang sama seperti yang ... tidak peduli seberapa kompleks ... dilakukan untuk mengedit citra bitmap yaitu: a.](https://reader030.fdokumen.com/reader030/viewer/2022041123/5d28ae5288c99392328c435e/html5/thumbnails/17.jpg)
Bitmaps
• Citra Bitmap diperoleh melalui pemindai,kamera digital dan alat lain, dan merupakanformat “alami” untuk layar dan printer
• Citra Bitmap dibangun dari grid warna
• Pada layar, citra adalah grid yang terdiri ataspixel, pada printer adalah grid yang terdiri atastitik-titik
• Bergantung pada kemampuan alat, pixel/dotdapat bervariasi dari dua hingga jutaan warna
![Page 18: TUJUAN - univbsi.idunivbsi.id/pdf/2014/100/100-P03.pdf · dengan cara yang sama seperti yang ... tidak peduli seberapa kompleks ... dilakukan untuk mengedit citra bitmap yaitu: a.](https://reader030.fdokumen.com/reader030/viewer/2022041123/5d28ae5288c99392328c435e/html5/thumbnails/18.jpg)
![Page 19: TUJUAN - univbsi.idunivbsi.id/pdf/2014/100/100-P03.pdf · dengan cara yang sama seperti yang ... tidak peduli seberapa kompleks ... dilakukan untuk mengedit citra bitmap yaitu: a.](https://reader030.fdokumen.com/reader030/viewer/2022041123/5d28ae5288c99392328c435e/html5/thumbnails/19.jpg)
Mengedit Citra Bitmap
• Citra bitmap mudah diedit menggunakan program
interaktif atau batch
• Dapat diterapkan filter, memodifikasi warna,
mengedit bagian-bagian kecil
• Diperlukan adanya layer untuk mempermudah
pengeditan
• Operasi yang umum dilakukan:
– Blur and Sharpen.
– Colour correction.
– Brightness/Contrast adjustment.
– Touch up.
![Page 20: TUJUAN - univbsi.idunivbsi.id/pdf/2014/100/100-P03.pdf · dengan cara yang sama seperti yang ... tidak peduli seberapa kompleks ... dilakukan untuk mengedit citra bitmap yaitu: a.](https://reader030.fdokumen.com/reader030/viewer/2022041123/5d28ae5288c99392328c435e/html5/thumbnails/20.jpg)
Image manipulation
![Page 21: TUJUAN - univbsi.idunivbsi.id/pdf/2014/100/100-P03.pdf · dengan cara yang sama seperti yang ... tidak peduli seberapa kompleks ... dilakukan untuk mengedit citra bitmap yaitu: a.](https://reader030.fdokumen.com/reader030/viewer/2022041123/5d28ae5288c99392328c435e/html5/thumbnails/21.jpg)
Pros & Cons of Bitmap Formats
• Keuntungan
– Mudah direpresentasi sebagai kumpulan byte
– Diproduksi oleh banyak alat masukan
– Mudah diedit
– Dapat disajikan dengan baik pada grid alatkeluaran seperti CRT dan printer.
• Kekurangan
– Ukuran besar
– Tidak dapat diskalakan dengan baik
– Asli diperkecil diperbesar informasihilang
![Page 22: TUJUAN - univbsi.idunivbsi.id/pdf/2014/100/100-P03.pdf · dengan cara yang sama seperti yang ... tidak peduli seberapa kompleks ... dilakukan untuk mengedit citra bitmap yaitu: a.](https://reader030.fdokumen.com/reader030/viewer/2022041123/5d28ae5288c99392328c435e/html5/thumbnails/22.jpg)
![Page 23: TUJUAN - univbsi.idunivbsi.id/pdf/2014/100/100-P03.pdf · dengan cara yang sama seperti yang ... tidak peduli seberapa kompleks ... dilakukan untuk mengedit citra bitmap yaitu: a.](https://reader030.fdokumen.com/reader030/viewer/2022041123/5d28ae5288c99392328c435e/html5/thumbnails/23.jpg)
1. Elemen gambar (picture element) pada citra
digital (titik-titik berwarna) disebut:
a. Piksel
b. Image resolution
c. Bitmap
d. Matriks
e. Vektor
![Page 24: TUJUAN - univbsi.idunivbsi.id/pdf/2014/100/100-P03.pdf · dengan cara yang sama seperti yang ... tidak peduli seberapa kompleks ... dilakukan untuk mengedit citra bitmap yaitu: a.](https://reader030.fdokumen.com/reader030/viewer/2022041123/5d28ae5288c99392328c435e/html5/thumbnails/24.jpg)
2. Jumlah piksel dalam sebuah citra digital
disebut:
a. Piksel
b. Image resolution
c. Bitmap
d. Matriks
e. Vektor
![Page 25: TUJUAN - univbsi.idunivbsi.id/pdf/2014/100/100-P03.pdf · dengan cara yang sama seperti yang ... tidak peduli seberapa kompleks ... dilakukan untuk mengedit citra bitmap yaitu: a.](https://reader030.fdokumen.com/reader030/viewer/2022041123/5d28ae5288c99392328c435e/html5/thumbnails/25.jpg)
3. Sebuah representasi data grafis/citra dengan
cara yang sama seperti yang disimpan
dalam memori video disebut:
a. Piksel
b. Image resolution
c. Bitmap
d. Matriks
e. Vektor
![Page 26: TUJUAN - univbsi.idunivbsi.id/pdf/2014/100/100-P03.pdf · dengan cara yang sama seperti yang ... tidak peduli seberapa kompleks ... dilakukan untuk mengedit citra bitmap yaitu: a.](https://reader030.fdokumen.com/reader030/viewer/2022041123/5d28ae5288c99392328c435e/html5/thumbnails/26.jpg)
4. Yang bukan file format vector graphics,yaitu:
a. EPS
b. SVG
c. SWF
d. CDR
e. JPG
![Page 27: TUJUAN - univbsi.idunivbsi.id/pdf/2014/100/100-P03.pdf · dengan cara yang sama seperti yang ... tidak peduli seberapa kompleks ... dilakukan untuk mengedit citra bitmap yaitu: a.](https://reader030.fdokumen.com/reader030/viewer/2022041123/5d28ae5288c99392328c435e/html5/thumbnails/27.jpg)
5.Yang tidak termasuk operasi yang umum
dilakukan untuk mengedit citra bitmap yaitu:
a. Blur and Sharpen.
b. Colour correction.
c. Brightness/Contrast adjustment.
d. Touch up
e. Memory enhancement