F3013/Unit 4/1

Teks dan Imej Grafik

UNIT 4

Objektif am : Mengetahui komponen-komponen asas
(teks dan imej) dalam projek multimedia.
Objektif Khusus : Di akhir unit ini anda akan dapat :-
Menyatakan kegunaan teks dalam projek multimedia.
Menyatakan jenis-jenis fonts dan typeface.
Mengenalpasti model-model warna dan teknik
pemprosesan imej.
Mengenalpasti cara-cara mendapatkan imej.
OBJEKTIF
F3013/Unit 4/2
Teks dan Imej Grafik
4.1 TEKS
Penggunaan teks dan simbol untuk perhubungan di antara manusia telah digunakan
sejak 6000 tahun dahulu. Hari ini, teks menjadi elemen ilmu pengetahuan yang
penting. Di dalam pembinaan projek multimedia, teks merupakan komponen
multimedia yang popular dan paling banyak digunakan. Penggunaannya bersama
komponen multimedia yang lain seperti grafik dan sound menjadikan satu projek
multimedia lebih berjaya.
Pemilihan dan penggunaan perkataan yang sesuai di dalam projek multimedia boleh
memberi kesan yang berbeza kepada pengguna. GO BACK!, sebagai contoh lebih
memberi kesan yang lain dari Previous. Begitu juga perkataan TERRIFIC!, lebih
berkesan dari That Answer Was Correct. Oleh itu pemilihan perkataan yang tepat
menjadi faktor utama dalam penggunaan teks pada menu, isi kandungan dan sistem
navigasi projek multimedia.
4.1.1 Fonts
Terdapat banyak fonts yang telah siap sedia diinstall di dalam komputer multimedia
kita. Font sebenarnya adalah satu set character yang mempunyai saiz dan stail yang
dipunyai oleh satu keluarga typeface. Manakala typeface pula adalah satu keluarga
bagi character grafik yang mempunyai banyak saiz dan stail. Stail bagi sesuatu font
selalunya adalah bold dan italic. Lain-lain stail seperti underline merupakan
penambahan yang di lakukan oleh perisian kita.
Saiz sesuatu font diukur di dalam unit point, iaitu 0.0138 inci atau 1/72 inci. Ia diukur
dari bahagian atas huruf besar fonts hingga ke bahagian bawah huruf (termasuk huruf-
huruf kecil yang mempunyai ekor seperti y dan g). Selalunya satu baris ruang
ditambah apabila kita menggunakan font, ini untuk memberikan ruang yang
berpatutan di antara tulisan. Baris ruang pada fonts ini dipanggil Leading (cara
sebutan, ledding). Ia boleh diubahsuai nilainya di dalam perisian yang kita gunakan.
Rajah 4.1 menunjukkan ukuran-ukuran pada teks.
INPUT
F3013/Unit 4/3
Teks dan Imej Grafik
Rajah 4.1: Ukuran-ukuran pada teks
Selain dari Leading, terdapat satu lagi penggunaan ruang di dalam tulisan iaitu
Kerning. Kerning adalah ruang atau jarak yang memisahkan di antara character.
Rajah 4.2 menunjukkan contoh kerning.

Rajah 4.2: Kerning
Typefaces boleh dikategorikan dalam banyak bentuk. Ada yang dikategorikan sebagai
formal, teknikal, feminin dan lain-lain lagi. Walaubagaimanapun terdapat kategori
yang digunakan oleh semua iaitu serif dan sans serif. Serif dan sans serif adalah satu
cara mengkategorikan typeface, iaitu jenis yang mempunyai serif atau tidak (sans
dalam bahasa Perancis bermaksud tanpa). Serif adalah tambahan pada hujung sesuatu
tulisan.
F3013/Unit 4/4
Teks dan Imej Grafik
Rajah 4.3 menunjukkan font serif.
Rajah 4.3: Menunjukkan serif
Times, New Century Schoolbook dan Palatino adalah contoh bagi serif. Manakala
Helvetica, Arial, Optima dan Avant Garde adalah contoh font sans serif.
Jenis-Jenis Penggunaan Teks
Teks digunakan di dalam banyak tempat dan kegunaan di dalam projek multimedia.
Kegunaannya melebihi dari kegunaan asas yang hanya untuk bacaan sahaja.
Rupabentuk teks dan typeface dapat memberi kesan mood dan emosi kepada
pengguna.
Antara kegunaan teks di dalam projek multimedia ialah:
i. Tajuk
Untuk menulis tajuk, typeface sans serif biasa di gunakan seperti Arial dan Helvetica
dengan saiz point yang besar.
ii. Isi kandungan
Bagi menulis isi kandungan, typeface serif seperti Times Roman di gunakan untuk
memudahkan pembacaan. J ika isi kandungan teks terlalu panjang maka scroll bar
sesuai di gunakan.
iii. Teks sebagai Navigasi
Kita biasa melihat tulisan seperti Next dan Previous di gunakan untuk tujuan navigasi.
Ada dua cara teks di gunakan untuk tujuan navigasi. Pertama penggunaan teks sahaja
dan yang keduanya ialah penggunaan button yang di atasnya terdapat teks.
F3013/Unit 4/5
Teks dan Imej Grafik
Rajah 4.4 menunjukkan penggunaan teks dalam navigasi.
Next Topik 1
Rajah 4.4: Penggunaan teks dalam navigasi
iv. Teks sebagai grafik
Teks juga dapat memberi kesan visual dalam projek multimedia. Perisian seperti
Adobe Photoshop, CorelDraw, Macromedia Fontographer dan FreeHand dapat
menambah keberkesanan sesuatu teks. Penggunaan teks 3D juga dapat memberi mood
yang berbeza kepada sesebuah projek multimedia.
Next
>
F3013/Unit 4/6
Teks dan Imej Grafik
UJIKAN KEFAHAMAN ANDA SEBELUM MENERUSKAN INPUT
SELANJUTNYA
SILA SEMAK JAWAPAN ANDA PADA MAKLUM BALAS DI HALAMAN
BERIKUTNYA
4.1 Apakah yang di maksudkan dengan Typeface?
4.2 Nyatakan DUA contoh Typeface.
4.3 Apakah yang di maksudkan dengan Fonts?
4.4 Nyatakan DUA contoh Fonts.
4.5 Apakah yang di maksudkan dengan Serif?
4.6 Nyatakan DUA contoh bagi Sans Serif.
AKTIVITI 4a
F3013/Unit 4/7
Teks dan Imej Grafik
4.1 Typeface adalah keluarga bagi character grafik (fonts) yang
mempunyai banyak saiz dan stail.
4.2 Dua contohnya adalah seperti typeface Times dan Arial.
4.3 Fonts adalah satu set character yang mempunyai banyak saiz dan stail.
4.4 Times 12-point italic dan Helvatica 14-point bold.
4.5 Serif adalah tambahan pada hujung huruf untuk membantu pembacaan.
4.6 Dua contoh sans serif adalah seperti Helvetica dan Arial.
MAKLUM BALAS 4a
F3013/Unit 4/8
Teks dan Imej Grafik
4.2 MEDIA IMEJAN DAN GRAFIK
Imej dan grafik di gunakan untuk menyampaikan mesej berkesan dalam proses
komunikasi di antara projek multimedia dan pengguna. Satu imej mampu
memberikan seribu penjelasan terhadap suasana tertentu. Penggunaan grafik dan imej
yang terdiri dari berbagai jenis seperti imej digital (still image) dan animasi 2D dan
3D dapat menyampaikan mesej, motif pada mood yang sesuai.
Terdapat beberapa sebab mengapa grafik di perlukan di dalam projek multimedia
iaitu:
i. Grafik di perlukan untuk mencipta latarbelakang yang menarik.
ii. Grafik dapat memberikan kesan ceria dan humor.
iii. Penggunaan grafik pada button menjadikan perhatian pada button lebih fokus.
Jenis-jenis Grafik
Grafik komputer terdiri dari dua kategori iaitu grafik vektor dan grafik bitmap. Dalam
membina grafik untuk projek multimedia, kita mungkin akan menggunakan salah satu
atau kedua-duanya.
i. Grafik Vektor
Grafik vektor terdiri dari garis-garis yang di bina. Ini termasuk line, rectangle, ellipse,
arcs dan curves. Imej yang dibina akan di simpan sebagai set arahan di dalam
komputer. Sebarang perubahan akan menyebabkan pengiraan semula terhadap set
arahan tadi yang akan menukar imej kepada bentuk lain. Perisian-perisian yang boleh
INPUT
F3013/Unit 4/9
Teks dan Imej Grafik
digunakan untuk membina imej grafik vektor adalah seperti Adobe Illustrator dan
Macromedia Freehand.
ii. Grafik Bitmap
Grafik bitmap terdiri dari pixels yang datang dari pengimbas, gambar foto atau imej
yang di tangkap dari video camcoder. Setiap pixels boleh diumpukkan beberapa sifat
seperti lokasi, warna dan kecerahan. Antara perisian yang boleh di gunakan seperti
Adobe Photoshop dan Fractal Design Painter.
4.2.1 Jenis-jenis Format Fail
Terdapat beberapa format fail grafik yang biasa di gunakan. Antaranya adalah seperti,
i. *.bmp
Merupakan fail grafik bitmap Windows.
ii. *.pcd
Merupakan format bagi Photo CD. Satu teknologi dari Kodaks. Imejnya adalah 24
bit color (16 million colors). Kualiti gambar adalah baik.
iii. *.gif
Graphic Interchange Format. Merupakan format dari CompuServe Information
Service yang di gunakan untuk membina imej bitmap mampatan (compressed).
iv. *.jpg
Joint Photographic Experts Group (JPEG). Merupakan format untuk memampatkan
imej bitmap supaya menjadi imej yang bersaiz kecil.
v. *.tif
Tagged Image File Format (TIFF) merupakan imej fail yang besar tetapi dapat
menyimpan banyak informasi warna dengan lebih baik.
F3013/Unit 4/10
Teks dan Imej Grafik
vi. *.pct
Merupakan format fail picture sistem komputer Macintosh yang boleh di baca oleh
Windows. Perisian Macromedia Director boleh menggunakan format ini. Format ini
juga dikatakan sebagai boleh cross platform.
vii. *.pcx
Merupakan format perisian Windows Paintbrush.
4.2.2 Warna dan Grayscale
Warna merupakan elemen yang penting dalam multimedia. Pemilihan warna dalam
projek multimedia boleh di cuba berulang kali sehingga kita berpuas hati. Manusia
umumnya menerima warna dengan jarak gelombang 400 hingga 600 nanometer pada
spektrum elektromagnet.
Bit Depth (Kedalaman Maklumat Warna)
Projek multimedia selalunya di persembahkan pada monitor warna yang
menggunakan 8 bit maklumat warna bagi setiap pixel dalam matrik 640 pixel x 480
pixel. Dengan kedalaman warna sebanyak 8 bit (8 bits of depth) yang boleh
mempunyai 256 warna atau kurang tidak mencukupi untuk menjadikan satu imej
berkualiti foto. Imej dengan warna grayscale mempunyai kedalaman maklumat 4 bit
selalunya. Dengan penggunaan lebih warna, komputer kita semakin bekerja keras
untuk mempamerkan imej di atas skrin. Dengan menetapkan 800 x 600 pixel atau
1024 x 768 pixel yang menampung jutaan warna bagi setiap imej, kita perlu berhati-
hati kerana penggunaan pixel yang tinggi akan menyebabkan banyak peralatan yang
lama tidak dapat melihat hasil multimedia kita dengan baik.
RGB
Pada model warna RGB (Red, Green dan Blue), warna pada pixel diwakilkan dengan
jumlah warna merah, hijau dan biru. Ia akan menyebabkan lebih banyak ingatan
komputer di gunakan dan masa pemprosesan semakin lama. J ika kita menggunakan
24 bit RGB, dengan tentukan setiap nilai warna pada nilai 256 (8 bit diperlukan untuk
jadikan 256 warna). Oleh itu 24 bit di ingatan dapat memaparkan warna sebenar iaitu
256 x 256 x 256 =16,777,216 warna.
F3013/Unit 4/11
Teks dan Imej Grafik
Rajah 4.5 menunjukkan model warna RGB.
Rajah 4.5: RGB
HSB & HSL
Dalam model warna HSB (Hue, Saturation dan Brightness) dan HSL (Hue,
Saturation dan Lightness), kita menetapkan warna sebagai sudut dari pilihan warna
dari 0
o
hingga 360
o
dan Saturation, Brightness dan Lightness sebagai peratusan.
Lightness dan Brightness adalah peratusan dari hitam atau putih yang di campurkan
dengan warna. Lightness 100% akan menghasilkan warna putih. 0% adalah warna
hitam dan 50% akan menunjukkan warna sebenar warna itu. Saturation pula adalah
intensity warna. Pada 100% Saturation, warna adalah asli dan pada 0% pula warna
adalah putih, hitam atau kelabu.
J adual 4.1 menunjukkan sudut pilihan warna bagi model HSB dan HSL.
J adual 4.1: Sudut pilihan warna bagi model HSB dan HSL
Warna Sudut
Merah 0
o
Kuning 60
o
Hijau 120
o
Cyan 180
o
Biru 240
o
Magenta 300
o
F3013/Unit 4/12
Teks dan Imej Grafik
CMYK
Bagi model warna CMYK, ia jarang digunakan pada projek multimedia. Ini kerana
kegunaannya adalah untuk tujuan cetakan di mana cyan, magenta, kuning dan hitam
di gunakan dalam proses cetakan yang menggunakan warna yang berasingan.
Rajah 4.6 menunjukkan model warna CMYK.
Rajah 4.6: CMYK
4.2.3 Memahami Teknik Memproses Imej
Masking
Apabila kita membuat pilihan pada bahagian tertentu imej (selection), kita sebenarnya
membuat juga mask (topeng) iaitu bahagian imej yang kita tidak pilih. Bahagian
mask pada imej tersebut boleh di simpan pada mask channel di dalam perisian grafik
seperti Adobe Photoshop yang mana boleh di gunakan kembali jika perlu. J ika kita
bekerja di dalam mod RGB, Adobe Photoshop akan menggangap channel 1, 2 dan 3
adalah Red(merah), Green(hijau) dan Blue(biru) dan channel 4 dan seterusnya adalah
channel mask.
F3013/Unit 4/13
Teks dan Imej Grafik
Rajah 4.6 menunjukkan teknik masking.

Rajah 4.7: Mask channel
Filter
Cara terbaik untuk mempelajari filter(penapis) adalah dengan menggunakan dan
bermain dengannya. Adobe Photoshop memberi lebih dari 75 filter yang dapat
memberi bermacam-macam kesan khas pada imej. Terdapat juga syarikat-syarikat
lain yang mencipta filter dan menjualnya. Keluaran syarikat-syarikat ini boleh kita
add-on dan gunakan bersama Photoshop. Antara contoh filter yang boleh di gunakan
adalah seperti Blur, Artistic Blur, Brush Strokes, distort, noise, pixelate, render,
sharpen, stylize, texture dan video. Filter keluaran syarikat lain adalah seperti
Digimarc, Extensis, Eye Candy 3.0, KPT6, Ulead Effects dan Ulead Web Plugins.
Resizing
Apabila kita bekerja dengan imej, kerapkali kita akan berhadapan dengan situasi yang
memerlukan saiz imej diubah samada dibesarkan ataupun dikecilkan. Adobe
Photoshop membenarkan pengguna mengubah saiz imej dan juga saiz Canvas
mengikut kehendak pengguna. Untuk menukar saiz imej, pengguna hanya perlu
highlight pada kawasan imej dan menariknya mengikut saiz yang dikehendaki.
F3013/Unit 4/14
Teks dan Imej Grafik
4.2.4 Mengetahui Cara-Cara Mendapatkan Imej
Pengimbas
Pengimbas merupakan perkakasan yang penting untuk di gunakan bagi menghasilkan
projek multimedia. Terdapat dua jenis pengimbas yang biasa di gunakan iaitu jenis
flat-bed dan jenis handheld. Di pasaran terdapat pengimbas grayscale dan warna yang
mempunyai resolusi 300 atau 600 dot setiap inci (dpi). Walaubagaimanapun terdapat
pengimbas yang mempunyai resolusi yang tinggi dan digunakan oleh syarikat-
syarikat yang mempunyai keperluan pada resolusi imej yang lebih tinggi.
Pengimbas handheld boleh digunakan untuk mengimbas gambar yang kecil,
walaubagaimanapun ia di anggap tidak sesuai untuk di gunakan pada projek
multimedia. Apabila mengimbas imej terutama yang berevolusi tinggi, ruang ingatan
yang banyak di perlukan di dalam komputer. Pengimbas dapat menjimatkan masa
kerja dalam mencantumkan sesuatu hasil kerja lain ke dalam kerja kita seperti
memasukkan lukisan orang lain ke dalam kerja penulisan kita.
Kamera Digital
Kamera digital menggunakan teknologi CCD sama seperti kamera video. Ia akan
menangkap gambar atau imej sebanyak pixel tertentu bergantung pada resolusi. Imej
yang telah di tangkap akan disimpan di dalam ingatan pada kamera digital dan akan
dimasukkan kemudian ke komputer. Kamera digital yang menangkap imej pada
resolusi 1280 x 1024 pixel menyimpan maklumat warna sebanyak 1,300,000 pixel
(1.3 Megapixel). Lebih tinggi Megapixel, lebih tinggi resolusi kamera digital tersebut.
Imej yang di masukkan ke komputer boleh menggunakan kabel siri, kabel selari atau
kabel USB, atau menggunakan kad ingatan kamera digital yang di masukkan pada
pembaca kad PCMCIA yang telah siap di sambungkan pada komputer.
F3013/Unit 4/15
Teks dan Imej Grafik
UJIKAN KEFAHAMAN ANDA SEBELUM MENERUSKAN INPUT
SELANJUTNYA
SILA SEMAK JAWAPAN ANDA PADA MAKLUM BALAS DI HALAMAN
BERIKUTNYA
4.7 Nyatakan DUA sebab mengapa grafik di perlukan dalam projek
multimedia.
4.8 Nyatakan DUA jenis/kategori grafik komputer. Berikan juga
penerangan ringkas setiap satunya.
4.9 J ika kita menggunakan 24 bit RGB dengan bit depth (kedalaman
maklumat warna) sebanyak 8 bit. Berapakah jumlah warna yang di
gunakan?
4.10 Nyatakan DUA cara mendapatkan imej digital.
AKTIVITI 4b
F3013/Unit 4/16
Teks dan Imej Grafik
4.7 Grafik di perlukan dalam projek multimedia antara lainnya untuk,
i. Mencipta latarbelakang yang menarik.
ii. Memberikan kesan ceria dan humor.
4.8 i. Grafik Vektor
Terdiri dari garis-garis yang dibina. Imej di simpan sebagai set
arahan dan formula di dalam komputer. Perubahan pada imej
akan menyebabkan kiraan semula pada set arahan tadi.
ii. Grafik Bitmap
Terdiri dari pixel yang datang dari pengimbas, atau imej dari
camcoder. Setiap pixel boleh di umpukkan sifat-sifat seperti
lokasi, wana dan kecerahan.
4.9 Untuk 24 bit RGB dengan bit depth 8 bit jumlah warna yang ada ialah,
256 x 256 x 256 =16,777,216 warna.
4.10
i. Pengimbas terdapat dua jenis di pasaran iaitu flat-bed dan
handheld. Terdapat juga dalam berbagai resolusi, antaranya 300
dan 600 dpi.
ii. Kamera digital Menggunakan teknologi CCD. Lebih tiggi
resolusi kamera lebih bermutu sesuatu gambar. Gambar boleh
diuploadkan ke dalam komputer untuk berbagai tujuan.
MAKLUM BALAS 4b
F3013/Unit 4/17
Teks dan Imej Grafik
PENILAIAN KENDIRI
Anda telah menghampiri kejayaan . Sila cuba semua soalan dalam
penilaian kendiri.
Jika ada masalah yang timbul, sila berbincang dengan pensyarah
anda.
Selamat mencuba semoga berjaya !!!!
SOALAN 1
Dengan menggunakan contoh yang sesuai, lukis dan terangkan maksud Leading dan
Kerning di dalam sesuatu tulisan.
SOALAN 2
Nyatakan EMPAT kegunaan teks yang biasa di gunakan dalam projek multimedia.
SOALAN 3
Senaraikan LIMA format fail grafik yang biasa digunakan dan beri penerangan
ringkas setiap satunya.
SOALAN 4
Terangkan perbezaan bagi model warna berikut,
i. RGB
ii. HSB dan HSL
iii. CMYK
SOALAN 5
Terangkan perbezaan bagi teknik masking dan filter semasa pemprosesan imej digital.