Learning Outcomes. Pada akhir pertemuan ini, diharapkan mahasiswa akan mampu : Menunjukkan Penggunaan Teks dan Hypertext pada Aplikasi Multimedia

Learning Outcomes

Pada akhir pertemuan ini, diharapkan

mahasiswa akan

mampu :



Menunjukkan Penggunaan Teks dan

Outline Materi



Definisi Text



Teknologi Text



Fonts



Text Data File



Menggunakan Text

Apakah Text Itu ?



Media dasar untuk banyak sistem multimedia



Text dalam bentuk kata, kalimat, paragraf

digunakan untuk mengkomunikasikan pikiran,

ide, fakta dalam hampir setiap aspek

kehidupan.



Produk Multimedia bergantung pada text

dalam banyak hal :

 Menjelaskan bagaimana aplikasi berjalan

 Membimbing user ber-navigasi dalam aplikasi  Menyampaikan informasi sebagai tujuan

Teknologi Text



Didasarkan pada pembuatan huruf, angka dan

special karakter.



Text element dapat dikategorikan dalam :

 Karakter Alphabet : A - Z  Angka : 0 - 9

 Karakter Special : Punctuation [. , ; ‘ …] , Tanda

atau Simbol [* & ^ % $ £ ! /\ ~ # @ .…]

 Juga dikenal sebagai Character Sets



Termasuk juga spesial icon atau simbol

Typeface, Font dan Point



Typefaces

 Representasi grafik dari alfabet, angka dan spesial

karakter

 Biasanya beragam tergantung ukuran dan style



Fonts

 Ukuran tertentu suatu typeface

 Ragam ditentukan dengan ukuran dan style  Ukuran diukur dalam point

 Satu point adalah 1/72” atau 0.0138 inc”

 Ukuran diukur dari ujung atas huruf kapital (mis : ‘A’

atau ‘P’) ke ujung bawah dari descenders (mis : ‘y’, ‘p’, ‘q’)

Efek Font



Beberapa efek yang berguna untuk menarik

perhatian pembaca pada suatu content :



Case: UPPER dan lower letter



Bold, Italic, Underline,

superscript

atau

_subscript



Embossed

atau Shadow

Tipe-Tipe Font



Font terbagi dalam 2 kelas : Serif atau Sans

Serif



Font bertipe Serif menggunakan tips atau flag

dekoratif pada bagian akhir ujung sebuah huruf



Font bertipe Sans Serif tidak memiliki tips atau

flag ini



Font bertipe Serif biasanya digunakan untuk

dokumen atau layar yang mengandung banyak

text

 Hal ini disebabkan serif membantu membimbing mata

pembaca selama membaca text



Untuk tampilan komputer, font bertipe Sans Serif

dianggap lebih baik karena mempunyai kontrast

yang lebih tajam

Anatomi Font

I

Baseline

D xhp

Serif Shoulder Counter Mean line Ascender Descender Set width X-height Cap height Point size

Tracking, Kerning dan Leading

Av

A

v

Tracking, Kerning dan Leading

Reading Line One

Reading Line One

Leading

 Ascender : garis di atas rata-rata untuk lower case karakter  Descender : garis di bawah rata-rata untuk lower case karakter  Leading : spasi antar baris

 Tracking : spasi antar karakter

 Kerning : spasi antara sepasang karakter, biasanya sebagai

Jaggies dan Antialiasing

 Jaggies merupakan batas kasar / patah-patah pada bitmapped image

biasanya terlihat jika image diperbesar

 Merupakan konsekuensi dari array of pixel yang merupakan dasar

dari suatu image

 Antialiasing merupakan teknik untuk mengeliminasi batas kasar

tersebut

 Teknik untuk menggantikan pixel dengan warna lain sehingga batas

kasar terlihat seperti garis yang berkesinambungan

 Teknik ini digunakan untuk menyatukan font dengan background nya

dengan memberikan warna transisi dari font dengan background nya

 Teknik ini meminimalisasi batas patah-patah dan membuat tampilan

Text Data Files



Format data encoding yang umum untuk text

adalah :



Plain text (ASCII) merupakan text dalam format

elektronik yang dapat dibaca dan

dinterpretasikan oleh manusia



Rich text mirip dengan Plain text tapi juga

mengandung karakter pengendali spesial untuk

feature tambahan



Hypertext merupakan advance rich text yang

memungkinkan pembaca untuk melompat ke

bagian berbeda dalam dokumen atau juga ke

dokumen baru

Text Data Files

Plain text

This is plain text. It is readable by humans. It can contains numbers (01234) and punctuation (.,#@*&) since it uses the ASCII character set.

Rich text

This is <bold>rich text</bold>.<br><center>It is also readable by humans but contains additional tags which control the presentation of the text.</center>

Hypertext

This is <a href=“http://www.w3c.org/”>hypertext</a>. It uses the rich text format shown above but adds the ability to hyperlink to other

Working With

Text



Yang perlu diperhatikan dan guidelines

saat menggunakan text :



Singkat dan jelas (Concise)



Gunakan typeface dan font yang tepat



Mudah dibaca



Perhatikan type style dan warna

Mudah Terbaca

Can you read me?

Mudah Terbaca



The buzzword being splashed around

is Convergence and by it we mean

the convergence of multimedia

technology with the

telecommunications industry



The buzzword being splashed around

is Convergence and by it we mean

the convergence of multimedia

technology with the

Working With Text



Text dalam jumlah besar



Pertimbangkan alternatif lain

-animasi, video, narasi.



Tampilkan preview dan mungkinkan

user untuk mendapatkan lebih



Hyper linking



Pop-up messages, scroll bars,

Menggunakan Text Secara Efektif



Mengkomunikasikan data



Nama dan alamat pelanggan



Informasi harga produk



Menjelaskan konsep dan ide



Pernyataan misi perusahaan



Perbandingan prosedur medis



Menjelaskan media lain



Label pada button, icon dan screen



Captions dan callouts untuk graphics

Keuntungan dan Kerugian Penggunaan Text



Keuntungan

 Relative murah dalam produksi

 Mempresentasikan ide secara efektif  Menjelaskan media lain

 Menjaga kerahasiaan / privacy  Mudah dirubah dan diperbaharui



Kerugian

 Mudah dilupakan daripada media visual yang lain  Membutuhkan perhatian lebih dari user daripada

media lain

Hypertext dan Hypermedia



Hypertext

 Dokumen berbasis text dengan tambah data

statis, misal : gambar dan tabel

 Referensi Silang (cross referencing) antar bagian

melalui kata kunci (keyword) yang berfungsi sebagai penghubung ke bagian lain

 Terdiri dari jaringan node yang terhubung melalui

link yang dapat dikunjungi oleh user



Hypermedia

 Data Multimedia yang tersimpan dalam struktur

hypertext terhubung

 Setiap node adalah presentasi. User dapat

A F E D C B

A Small Hypertext Structure

Definisi Hypertext

 Sebuah link menghubungkan dua node dan

biasanya terarah

 Source node

 Destination node

 Biasanya terhubung dengan bagian tertentu dari source

node

 Anchor

 Kadang destination adalah bagian dari sebuah node

 Source anchor

 Destination anchor

 Kebanyakan fasilitas hypertext memiliki fasilitas

backtrack

 Memungkinkan terjadinya lingkaran pengulangan

(loop)

 Beberapa sistem hypertext memberikan indikasi jika

sebuah link akan membawa ke node yang sudah pernah dikunjungi

Definisi



Nodes + Links = Hyperdocument



Konten Informasi



Hypertext system



Piranti Lunak (Software) yang digunakan

untuk membaca dan menulis

hyperdocument



Hypertext



Sistem hypertext yang berisi sebuah

Navigasi Hypertext

 User harus bisa mengikuti link dan bisa mengetahui

mana informasi yang sudah dibaca dan mana yang belum

 Users dari hypertext bisa menjadi bingung

 Mudah tersesat

 Walaupun dalam dokumen kecil, user mengalami

fenomena ‘lost in hyperspace’

 Navigasi user dalam hyperdocument dipengaruhi oleh

 Struktur Hyperdocument

 Bantuan navigasi yang disediakan oleh sistem

hypertext

Navigasi Hypertext

 Lost in hyperspace

 Sebuah node yang menarik mungkin susah untuk

ditemukan lagi di masa datang

 Bookmarks

 Ketika browsing, user dapat menjadi bingung tentang

posisi

 Tidak ada petunjuk arah dalam hyperspace

 Tampilan Fish-eye

 Menampilkan hanya bagian tertentu dari sebuah

hyperdocument secara detil

 Tampilan Birds-eye

 Peta yang detil

 Mungkin terlalu besar untuk ditampilkan secara