27
TEXT

Title Goes Hereteguh-cahyono.blog.unsoed.ac.id/files/2010/10/text.pdfFont terbagi dalam 2 kelas : Serif atau Sans Serif Font bertipe Serif menggunakan tips atau flag dekoratif pada

Embed Size (px)

Citation preview

Page 1: Title Goes Hereteguh-cahyono.blog.unsoed.ac.id/files/2010/10/text.pdfFont terbagi dalam 2 kelas : Serif atau Sans Serif Font bertipe Serif menggunakan tips atau flag dekoratif pada

TEXT

Page 2: Title Goes Hereteguh-cahyono.blog.unsoed.ac.id/files/2010/10/text.pdfFont terbagi dalam 2 kelas : Serif atau Sans Serif Font bertipe Serif menggunakan tips atau flag dekoratif pada

Learning Outcomes

Pada akhir pertemuan ini, diharapkan

mahasiswa akan

mampu :

Menunjukkan Penggunaan Teks dan

Hypertext pada Aplikasi Multimedia

Page 3: Title Goes Hereteguh-cahyono.blog.unsoed.ac.id/files/2010/10/text.pdfFont terbagi dalam 2 kelas : Serif atau Sans Serif Font bertipe Serif menggunakan tips atau flag dekoratif pada

Outline Materi

Definisi Text

Teknologi Text

Fonts

Text Data File

Menggunakan Text

Hypertext dan Hypermedia

Page 4: Title Goes Hereteguh-cahyono.blog.unsoed.ac.id/files/2010/10/text.pdfFont terbagi dalam 2 kelas : Serif atau Sans Serif Font bertipe Serif menggunakan tips atau flag dekoratif pada

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

rancangan aplikasi

Page 5: Title Goes Hereteguh-cahyono.blog.unsoed.ac.id/files/2010/10/text.pdfFont terbagi dalam 2 kelas : Serif atau Sans Serif Font bertipe Serif menggunakan tips atau flag dekoratif pada

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

gambar, simbol matematika, huruf Yunani dll.

Page 6: Title Goes Hereteguh-cahyono.blog.unsoed.ac.id/files/2010/10/text.pdfFont terbagi dalam 2 kelas : Serif atau Sans Serif Font bertipe Serif menggunakan tips atau flag dekoratif pada

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’)

Page 7: Title Goes Hereteguh-cahyono.blog.unsoed.ac.id/files/2010/10/text.pdfFont terbagi dalam 2 kelas : Serif atau Sans Serif Font bertipe Serif menggunakan tips atau flag dekoratif pada

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

Colours

Page 8: Title Goes Hereteguh-cahyono.blog.unsoed.ac.id/files/2010/10/text.pdfFont terbagi dalam 2 kelas : Serif atau Sans Serif Font bertipe Serif menggunakan tips atau flag dekoratif pada

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

Page 9: Title Goes Hereteguh-cahyono.blog.unsoed.ac.id/files/2010/10/text.pdfFont terbagi dalam 2 kelas : Serif atau Sans Serif Font bertipe Serif menggunakan tips atau flag dekoratif pada

Anatomi Font

I D xhpBaseline

Serif

Shoulder

Counter

Mean line

Ascender

DescenderSet

width

X-height

Cap

heightPoint

size

Page 10: Title Goes Hereteguh-cahyono.blog.unsoed.ac.id/files/2010/10/text.pdfFont terbagi dalam 2 kelas : Serif atau Sans Serif Font bertipe Serif menggunakan tips atau flag dekoratif pada

Tracking, Kerning dan Leading

Av vAUnkerned Kerned

Page 11: Title Goes Hereteguh-cahyono.blog.unsoed.ac.id/files/2010/10/text.pdfFont terbagi dalam 2 kelas : Serif atau Sans Serif Font bertipe Serif menggunakan tips atau flag dekoratif pada

Tracking, Kerning dan Leading

Reading Line One

Reading Line OneLeading

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 overlap untuk memperbaiki tampilan

Page 12: Title Goes Hereteguh-cahyono.blog.unsoed.ac.id/files/2010/10/text.pdfFont terbagi dalam 2 kelas : Serif atau Sans Serif Font bertipe Serif menggunakan tips atau flag dekoratif pada

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

yang lebih halus secara keseluruhan

Page 13: Title Goes Hereteguh-cahyono.blog.unsoed.ac.id/files/2010/10/text.pdfFont terbagi dalam 2 kelas : Serif atau Sans Serif Font bertipe Serif menggunakan tips atau flag dekoratif pada

Jaggies dan Antialiasing

Page 14: Title Goes Hereteguh-cahyono.blog.unsoed.ac.id/files/2010/10/text.pdfFont terbagi dalam 2 kelas : Serif atau Sans Serif Font bertipe Serif menggunakan tips atau flag dekoratif pada

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

Page 15: Title Goes Hereteguh-cahyono.blog.unsoed.ac.id/files/2010/10/text.pdfFont terbagi dalam 2 kelas : Serif atau Sans Serif Font bertipe Serif menggunakan tips atau flag dekoratif pada

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 documents.<hr><img src=“logo.gif”>

Page 16: Title Goes Hereteguh-cahyono.blog.unsoed.ac.id/files/2010/10/text.pdfFont terbagi dalam 2 kelas : Serif atau Sans Serif Font bertipe Serif menggunakan tips atau flag dekoratif pada

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

Batasi dan konsisten

Page 17: Title Goes Hereteguh-cahyono.blog.unsoed.ac.id/files/2010/10/text.pdfFont terbagi dalam 2 kelas : Serif atau Sans Serif Font bertipe Serif menggunakan tips atau flag dekoratif pada

Mudah Terbaca

Can you read me?

Can you read me?

Page 18: Title Goes Hereteguh-cahyono.blog.unsoed.ac.id/files/2010/10/text.pdfFont terbagi dalam 2 kelas : Serif atau Sans Serif Font bertipe Serif menggunakan tips atau flag dekoratif pada

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

telecommunications industry.

Page 19: Title Goes Hereteguh-cahyono.blog.unsoed.ac.id/files/2010/10/text.pdfFont terbagi dalam 2 kelas : Serif atau Sans Serif Font bertipe Serif menggunakan tips atau flag dekoratif pada

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, drop-

down menus

Page 20: Title Goes Hereteguh-cahyono.blog.unsoed.ac.id/files/2010/10/text.pdfFont terbagi dalam 2 kelas : Serif atau Sans Serif Font bertipe Serif menggunakan tips atau flag dekoratif pada

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

Page 21: Title Goes Hereteguh-cahyono.blog.unsoed.ac.id/files/2010/10/text.pdfFont terbagi dalam 2 kelas : Serif atau Sans Serif Font bertipe Serif menggunakan tips atau flag dekoratif pada

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

Tidak teratur

Page 22: Title Goes Hereteguh-cahyono.blog.unsoed.ac.id/files/2010/10/text.pdfFont terbagi dalam 2 kelas : Serif atau Sans Serif Font bertipe Serif menggunakan tips atau flag dekoratif pada

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 melompat dari satu presentasi ke presentasi lain

Page 23: Title Goes Hereteguh-cahyono.blog.unsoed.ac.id/files/2010/10/text.pdfFont terbagi dalam 2 kelas : Serif atau Sans Serif Font bertipe Serif menggunakan tips atau flag dekoratif pada

A

FED

CB

A Small Hypertext Structure(having six nodes and nine links)

Page 24: Title Goes Hereteguh-cahyono.blog.unsoed.ac.id/files/2010/10/text.pdfFont terbagi dalam 2 kelas : Serif atau Sans Serif Font bertipe Serif menggunakan tips atau flag dekoratif pada

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

Page 25: Title Goes Hereteguh-cahyono.blog.unsoed.ac.id/files/2010/10/text.pdfFont terbagi dalam 2 kelas : Serif atau Sans Serif Font bertipe Serif menggunakan tips atau flag dekoratif pada

Definisi

Nodes + Links = Hyperdocument

Konten Informasi

Hypertext system

Piranti Lunak (Software) yang digunakan untuk membaca dan menulis hyperdocument

Hypertext

Sistem hypertext yang berisi sebuah hyperdocument

Page 26: Title Goes Hereteguh-cahyono.blog.unsoed.ac.id/files/2010/10/text.pdfFont terbagi dalam 2 kelas : Serif atau Sans Serif Font bertipe Serif menggunakan tips atau flag dekoratif pada

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

Strategi browsing yang diterapkan oleh user

Page 27: Title Goes Hereteguh-cahyono.blog.unsoed.ac.id/files/2010/10/text.pdfFont terbagi dalam 2 kelas : Serif atau Sans Serif Font bertipe Serif menggunakan tips atau flag dekoratif pada

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 keseluruhan sekaligus