MK.

Grafik Komputer 1

KONSEP DASAR
GRAFIK KOMPUTER
Karmilasari
Outline
• Grafis berbasis Bitmap dan Vektor
• Grafis dilihat dari pendekatan Pengolahan Citra dan Grafik Komputer
• Perangkat Penampil Gambar : Monitor dan Printer
• Kegiatan yang Terkait Grafik Komputer

2
Grafis
• Grafis adalah gambar yang tersusun dari koordinat-koordinat.
• Sumber gambar yang muncul pada layar monitor komputer terdiri
atas titik-titik yang mempunyai nilai koordinat
• Layar Monitor berfungsi sebagai sumbu koordinat x dan y.
• Desain grafis dikelompokan ke dalam basis :
• Bitmap
• Vektor

3
Grafis berbasis Bitmap
• Grafis desain bitmap dibentuk dengan raster/pixel/dot/titik/point koordinat.
• Semakin banyak jumlah titik yang membentuk suatu grafis bitmap berarti semakin tinggi tingkat
kerapatannya, semakin halus citra grafis, tetapi kapasitas filenya semakin besar
• Bitmap merupakan kategori grafik kaya warna dan tersusun dari pixel-pixel yang
disebut resolusi.
• File gambar dengan resolusi lebih jernih maka memiliki ukuran file yang jauh lebih besar
• Bitmap sudah mendukung 32 bits colours.
• Ketajaman warna dan detail gambar pada tampilan bitmap bergantung pada
banyaknya pixel warna atau resolusi yang membentuk gambar tersebut.
• Hal ini berkaitan erat dengan kemampuan monitor dan VGA ( Video Graphic Adapter ) yang
digunakan.
• Jika gambar tampilan bitmap berresolusi tinggi di tampilkan pada monitor yang berresolusi
rendah akan mengakibatkan gambar terlihat kasar , bahkan terlihat kabur berbentuk kotak-kotak
( juggy ) jika dilakukan pembesaran gambar
• Satuan untuk ukuran grafis jenis bitmap ini adalah dpi (dot per inch) yang berarti
banyaknya titik dalam satu inci
4
 Grafis berbasis Bitmap (lanjutan)
• Contoh :

• Gambar bitmap apabila di zoom atau di besarkan, maka gambarnya pecah.

• Bitmap sangat tergantung dengan besaran resolusi, semakin besar resolusi suatu
gambar maka semakin baik kualitas dan ukuran file nya
• Contoh software yang berbasis bitmap adalah Adobe Photoshop, Paint,
CorelPhotoPaint

5
Grafis berbasis Bitmap (lanjutan)
Format ekstensi grafis berbasis Bitmap
• BMP (Bitmap Image)
Format file grafis yang fleksibel untuk platform Windows sehingga dibaca oleh program grafis manapun.
• JPG/JPEG
Format file ini mampu mengompres objek dengan tingkat kualitas sesuai dengan pilihan yang disediakan.
Format ini sering dimanfaatkan untuk menyimpan gambar yang akan digunakanuntuk keperluan halaman web, multimedia,
dan publikasi elektronik lainnya.
• GIF (Graphic Interchange Format)
Format ini hanya mampu menyimpan dalam 8 bit (hanya mendukung mode warna Grayscale)
• TIFF (Tagged Image Format File)
Format ini mampu menyimpan gambar dengan kualitas hingga 32 bit.
Format ini merupakan salah satu format yang dipilih para pengguna komputer grafis yang berorientasi pada publikasi
(cetak)
• PNG (Portabel Network Graphic)
Berfungsi sebagai alternatif lain dari format GIF. Format file ini digunakan untuk menampilkan objek dalam halaman web.
• PDF (Portabel Document Format)
Format file ini digunakan oleh Adobe Acrobat, dan dapat digunakan oleh grafik berbasis pixel maupun vektor
6
 Grafis berbasis Vektor
• Gambar vektor adalah gambar yang dibuat dari unsur garis dan kurva yang disebut
vector (memiliki nilai dan arah)
• Grafis ini tidak tergantung pada banyaknya pixel penyusunnya dan kondisi monitor
karena tampilan vektor tersusun atas garis-garis. Tampilan akan terlihat jelas meskipun
dilakukan pembesaran (zooming).
• Pemakaian grafis vektor akan lebih irit dari segi volume file, karena tidak perlu
penggunaan titik-titik koordinat dan rumus-rumus tertentu dalam menciptakan
bermacam-macam bentuk grafis, seperti lingkaran, segitiga, bujur sangkar dan poligon
seperti pada grafis bitmap, tetapi dari segi pemakaian prosessor akan memakan
banyak memori
• Program aplikasi grafis yang berbasis vektor antara lain : CorelDraw , Macromedia Free
hand, Adobe Illustrator dan Micrografx Designer.

7
 Grafis berbasis Vektor
• Contoh grafis berbasis vector :

8
Perbedaan Grafis Bitmap dan Vektor

Vektor Bitmap

1. Gambar tetap jelas ketika di 1. Gambar kurang jelas ketika di

perbesar perbesar
2. Tersusun oleh garis dan kurva 2. Tersusun atas titik-titik/dot

3. Ukuran File yang dihasilkan kecil 3. Ukuran File yang dihasilkan

besar
4. Kualitas grafis tidak bergantung 4. Kualitas grafis bergantung dari
dari banyaknya pixel banyaknya pixel

9
Kelebihan dan Kekurangan
Grafis Bitmap dan Vektor
Kelebihan
Vektor Bitmap
Ruang penyimpanan untuk objek gambar Dapat ditambahkan efek khusus tertentu
lebih efisien sehingga dapat membuat objek tampil
sesuai keinginan.
Objek gambar vektor dapat diubah ukuran Dapat menghasilkan objek gambar bitmap
dan bentuknya tanpa menurunkan mutu dari objek gambar vektor dengan cara
tampilannya mudah dan cepat, mutu hasilnya pun dapat
ditentukan
Dapat dicetak pada resolusi tertinggi
printer Anda
Menggambar dan menyunting bentuk
vektor relatif lebih mudah dan
menyenangkan
10
Kelebihan dan Kekurangan
Grafis Bitmap dan Vektor

Kekurangan
Vektor Bitmap
Tidak dapat menghasilkan objek gambar Objek gambar tersebut memiliki
vektor yang prima ketika melakukan permasalahan ketika diubah ukurannya,
konversi objek gambar tersebut dari format khususnya ketika objek gambar diperbesar
bitmap

Efek yang diidapat dari objek berbasis

bitmap yakni akan terlihat pecah atau
berkurang detailnya saat dicetak pada
resolusi yang lebih rendah

11
Grafis Bitmap dan Vektor dilihat dari
Pengolahan Citra vs. Grafik Komputer

12
 Perangkat Penampil : MONITOR
Komponen Utama Monitor :
• Display
• Frame Buffer -> berbentuk matrix
• Display Controller / Display processor

13
Perangkat Penampil : MONITOR

14
Perangkat Penampil : MONITOR (lanjutan)
Dari cara menampilkan gambar :
• Vector Display / Calligraphic Display / Stroke Display (‘60an)
• Raster Display (‘70an)

15
Perangkat Penampil : MONITOR (lanjutan)
• Vector Display

16
Perangkat Penampil : MONITOR (lanjutan)
• Raster Display

17
Perangkat Penampil : MONITOR (lanjutan)
Jenis monitor
• Layar Tabung / CRT (Cathode Ray Tube)
• Layar Tanpa Tabung (LED, LCD, Plasma Display)

18
Perangkat Penampil : MONITOR (lanjutan)
Layar Tabung / CRT (Cathode Ray Tube)
• Membutuhkan pabrikasi dengan tingkat ketelitian geometri yang tinggi
• Menggunakan pola warna fosfor (merah, hijau, biru) :

19
Perangkat Penampil : MONITOR (lanjutan)
Layar Tabung / CRT (Cathode Ray Tube)
• Keuntungan
• Tampilannya solid
• Biayanya relatif murah
• Terang, tampilan mengeluarkan sinar
• Kekurangan
• Ukuran array memori untuk screen cukup besar
• Discrete sampling (pixel)
• Ukurannya terbatas hingga 40”
• Bulky
• Awal teknologi televisi
• Resolusi tinggi
• Membutuhkan sinkronisasi antara signal video dan sinar elektron vertikal sync pulse
• Awal layar computer
• Menghindari sinkronisasi dengan menggunakan algoritma ‘vector’
• flicker dan refresh menjadi problem
20
 Perangkat Penampil : MONITOR (lanjutan)
LCD (Liquid Crystal Display)
• LCDs: molekul organik, organic molecules, berbentuk kristal, yang
mencair pada keadaan panas
• Anyaman kristal mempolarisasi cahaya pada 90º
• LCD bereaksi sebagai katup cahaya, tidak mengeluarkan cahaya dan
tergantung pada cahaya eksternal. source.
• Laptop screen
• Backlit
• transmissive display
• Palm Pilot/Game Boy
• reflective display

21
Perangkat Penampil : MONITOR (lanjutan)
Plasma
• Memiliki prinsip yang kurang lebih sama dengan lampu neon
• Kapsul berisi gas yang digerakkan oleh medan listrik menghasilkan sinar UV
• UV menggerakkan phosphor
• Phosphor menghasilkan beberapa warna
• Keuntungan
• Sudut pandangnya lebar
• Baik untuk format tampilan besar
• Tingkat terangnya cukup baik
• Kerugiannya
• Mahal
• Pixelnya lebar (~1 mm vs. ~0.2 mm)
• Fosfor berangsur-angsur berkurang
• Dibandingkan dengan CRT kurang terang, membutuhkan lebih banyak listrik.
22
Perangkat Penampil : PRINTER/PLOTTER
• Printer -> Raster Technology
• Plotter -> Vector Technology

23
Kegiatan yang Terkait Grafik Komputer
• Pemodelan geometris: menciptakan model matematika dari objek-
objek 2D dan 3D
• Rendering: memproduksi citra yang lebih solid dari model yang telah
dibentuk
• Animasi: Menetapkan/menampilkan kembali tingkah laku/behavior
objek bergantung waktu .

24
Kerangka Grafik Komputer Interaktif

• Graphics library/package (contoh: OpenGL) adalah perantara aplikasi dan

display hardware (Graphics System)
• Application program memetakan objek aplikasi ke tampilan/citra dengan
memanggil graphics library
• Hasil dari interaksi user menghasilkan/modifikasi citra
• Citra merupakan hasil akhir dari sintesa, disain, manufaktur, visualisasi dll.

25
Pemodelan Geometris
• Transformasi dari suatu konsep (atau suatu benda nyata) ke suatu model
geometris yang bisa ditampilkan pada suatu komputer :
• Shape/bentuk
• Posisi
• Orientasi (cara pandang)
• Surface Properties / Ciri-ciri Permukaan (warna, tekstur)
• Volumetric Properties / Ciri-ciri volumetric (ketebalan/pejal, penyebaran cahaya)
• Lights/cahaya (tingkat terang, jenis warna)
• Dan lain-lain …

26
Pemodelan Geometris (lanjutan)
• Pemodelan Geometris yang lebih rumit :
• Jala-Jala segi banyak: suatu koleksi yang besar dari segi bersudut banyak,
dihubungkan satu sama lain.
• Bentuk permukaan bebas: menggunakan fungsi polynomial tingkat rendah.
• CSG: membangun suatu bentuk dengan menerapkan operasi boolean pada
bentuk yang primitif.

27
Elemen Pembentuk Grafik Komputer

28
Pemrosesan Citra untuk Ditampilkan di Layar

29
Hardware Display Grafik : Vektor
• Vetor (calligraphic, stroke, random-scan)

• Arsitektur Vektor

30
Hardware Display Grafik : Raster
• Raster (TV, bitmap, pixmap), digunakan dalam layar dan laser printer

• Arsitektur Raster

31
Koordinat Sistem
• Koordinat sistem Jendela / Layar Monitor

• Koordinat sistem Framebuffer OpenGL

32
Dasar Matematika yang Diperlukan dalam
Grafik Komputer
• Geometry (2D, 3D)
• Trigonometry
• Vector spaces
• Points, vectors, dan koordinat
• Dot dan cross products

33
Pertanyaan
&
Diskusi

34