NASKAH

OBYEK PEMBELAJARAN BERBASIS MULTIMEDIA DAN WEB

Paket Keahlian : Multimedia

Mata Pelajaran : Pengolahan Citra Digital
Kelas/Semester : XI/3
Kompetensi Dasar : 3.1. Memahami anatomi font huruf pada tipografi
4.1. Menyajikan data hasil pengamatan terhadap anatomi font
huruf berbagai media dalam kehidupan sehari-hari
Judul : Anatomi Huruf Tipografi
Keyword : Tipografi, typography, huruf, font, anatomi tipografi, bentuk
huruf
Tujuan/Indikator : Setelah mengikuti program ini diharapkan siswa dapat :
1. Memahami bentuk huruf tipografi
2. Memahami anatomi huruf tipografi
Penulis :
Pengkaji Media :
Pengkaji Materi :

1
Contoh Naskah Obyek Pembelajaran
@Ai Sri N-New Ayuda 25-28 April 2016
 FLOWCHART

Anatomi
Huruf Tipografi

Bentuk Huruf Tipografi Anatomi Huruf Tipografi

2
Contoh Naskah Obyek Pembelajaran
@Ai Sri N-New Ayuda 25-28 April 2016
 NASKAH OBYEK PEMBELAJARAN

MATA PELAJARAN : PENGOLAHAN CITRA DIGITAL NO.HAL :3

JUDUL : ANATOMI HURUF TIPOGRAFI
NAMA FRAME : SINOPSIS

Tampilan:

Sinopsis:

Materi pelajaran ini berisi tentang

..................................................................................................................................................................
..................................................................................................................................................................
..................................................................................................................................................................
..................................................................................................................................................................
(berisi 2-3 kalimat ringkasan tentang isi materi)

(berikan gambar yang mewakili materi sebagai icon/thumbnail)

Keyword: ………,………….,………….,………………….. .

(misal : Tipografi, typography, huruf, font, anatomi tipografi, bentuk huruf )

Materi terkait (dalam satu rumpun peta materi):

………………………………………………,………………………………………………………….

(misal : Klasifikasi huruf font pada Tipografi)

3
Contoh Naskah Obyek Pembelajaran
@Ai Sri N-New Ayuda 25-28 April 2016
 NASKAH OBYEK PEMBELAJARAN

MATA PELAJARAN : PENGOLAHAN CITRA DIGITAL NO.HAL :4

JUDUL : ANATOMI HURUF TIPOGRAFI
NAMA FRAME : PENDAHULUAN NO Frame : 1

Tampilan:

Gambar 1. Jenis-jenis huruf

Jenis huruf apa yang sering Anda gunakan saat membuat tulisan dengan komputer? Saat Anda
membuat tulisan dengan komputer, tentunya Anda dapat memilih berbagai macam jenis huruf sesuai
dengan yang dibutuhkan. Tahukah Anda jika masing-masing huruf memiliki karakteristik tertentu
sehingga setiap jenis huruf yang akan digunakan harus cocok dengan tujuan dari tulisan yang kita
buat? .……………………… (Buat kalimat yang memotivasi siswa, sebagai apersepsi di awal materi
pelajaran)

Tahukah Anda? Langkah awal untuk mempelajari tipografi adalah mengenali atau memahami anatomi
huruf. Gabungan seluruh komponen dari suatu huruf merupakan identifikasi visual yang dapat
membedakan antar huruf yang satu dengan yang lain. Untuk itu mari kita sama – sama mempelajarai
bentuk huruf dan anatomi huruf tipografi pada halaman menu berikut..
………………………………………………………………………………………………….…………………………………………………………
(Buat kalimat materi awal sebagai pengantar umum untuk masuk ke materi inti)

Keterangan: Gambar/photo, Animasi, Simulasi, Audio, Video.

Keterangan gambar:
Gambar 1. Jenis-jenis huruf
Sumber: https://muhuck.wordpress.com/tag/tipografi-2/

4
Contoh Naskah Obyek Pembelajaran
@Ai Sri N-New Ayuda 25-28 April 2016
 NASKAH OBYEK PEMBELAJARAN

MATA PELAJARAN : PENGOLAHAN CITRA DIGITAL NO.HAL :5

JUDUL : ANATOMI HURUF TIPOGRAFI
NAMA FRAME : TUJUAN/INDIKATOR NO Frame :2

Tampilan:

Setelah mempelajari materi ini, peserta didik diharapkan dapat :

1. Memahami bentuk huruf tipografi

2. Memahami anatomi huruf tipografi

Keterangan Tampilan :

Tampilkan teks indikator/tujuan

5
Contoh Naskah Obyek Pembelajaran
@Ai Sri N-New Ayuda 25-28 April 2016
 NASKAH OBYEK PEMBELAJARAN

MATA PELAJARAN : PENGOLAHAN CITRA DIGITAL NO.HAL : 6

JUDUL : ANATOMI HURUF TIPOGRAFI
NAMA FRAME : Bentuk Huruf Tipografi NO Frame : 3

Tampilan:

Masih ingatkah Anda apa yang dimaksud dengan tipografi? Untuk mengingatkan Anda, yang dimaksud
dengan tipografi yaitu seni tentang aturan atau tata cara penggunaan huruf, kata, paragraf pada
ruang–ruang yang tersedia untuk menciptakan kesan – kesan tertentu sehingga dapat menolong para
pembaca agar lebih nyaman dan maksimal dalam membaca.

………………………………………………………………………………………………………………………………………………………
………………………………………………………………………………………………………………………………………………………

(uraian materi tentang bentuk huruf tipografi)

Setiap bentuk huruf dalam sebuah alphabet memiliki keunikan fisik yang menyebabkan mata dapat
membedakan antara huruf ‘m’, dengan ‘p’ atau ‘C’ dengan ‘Q’. Keunikan ini disebabkan oleh cara mata
melihat korelasi antara komponen visual yang satu dengan yang lain.

Salah satu hukum dari teori Gestalt membuktikan bahwa untuk mengenal atau membaca sebuah
gambar diperlukan adanya kontras antara ruang positif yang disebut dengan figure dan ruang negatif
yang disebut dengan ground.

Coba Anda perhatikan gambar animasi berikut ini! Arahkan kursor pada masing-masing panah, maka
nama-nama bentuk huruf akan muncul!

Gambar 3. Bentuk Huruf

……………………………………………………………………………………………………………………………………………………………………………

6
Contoh Naskah Obyek Pembelajaran
@Ai Sri N-New Ayuda 25-28 April 2016
 NASKAH OBYEK PEMBELAJARAN

MATA PELAJARAN : PENGOLAHAN CITRA DIGITAL NO.HAL : 7

JUDUL : ANATOMI HURUF TIPOGRAFI
NAMA FRAME : Bentuk Huruf Tipografi
(LANJUTAN)

……………………………………………………………………………………………………………………………………………………………………………
……………………………………………………………………………………………………………………………………………………………………………
……………………………………………………………………………………………………………………………………………………………………………

Keterangan: Gambar/photo, Animasi, Simulasi, Audio, Video.

Keterangan Animasi:
1. Tampilkan gambar bentuk huruf seperti pada gambar tampilan, tapi belum dengan teks/tulisan
nama bagiannya.
2. Beri panah pada masing-masing nama bagian, agar siswa dapat meletakkan/menyorotkan kursor
pada panah tersebut.
3. Munculkan nama-nama bagian (figure, ground), ketika siswa meletakkan/menyorotkan kursor pada
masing-masing gambar bagian huruf.

7
Contoh Naskah Obyek Pembelajaran
@Ai Sri N-New Ayuda 25-28 April 2016
 NASKAH OBYEK PEMBELAJARAN

MATA PELAJAJARAN : PENGOLAHAN CITRA DIGITAL NO.HAL :8

JUDUL : ANATOMI HURUF TIPOGRAFI
NAMA FRAME : Anatomi Huruf Tipografi NO Frame :4

Tampilan:
Langkah awal untuk mempelajari huruf adalah dengan mengenali atau memahami anatomi huruf.
Gabungan seluruh komponen dari suatu huruf merupakan identifikasi visual yang dapat membedakan
antar huruf yang satu dengan yang lain.

Setiap individu huruf, angka, dan tanda baca dalam tipografi disebut sebagai character. Seluruh
character secara optis rata dengan baseline. Tinggi dari badan huruf kecil secara optis rata dengan x-
height. Setiap character apakah huruf besar atau kecil memiliki batang (stem) yang pada bagian ujung-
ujungnya dapat ditemukan beberapa garis akhir sebagai penutup yang disebut terminal.

Pada dasarnya setiap huruf terdiri dari kombinasi berbagai guratan garis (strokes) yang terbagi
menjadi dua, yaitu guratan garis dasar (basic stroke) dan guratan garis sekunder (secondary stroke).

Ada dua aspek dasar dalam anatomi huruf yang berkaitan dengan cara kita memanfaatkannya. Aspek
pertama berkaitan dengan bentuk fisik huruf dan merupakan metode mengenai bagaimana huruf itu
dibentuk. Demikian juga cara mengukurnya, baik secara horizontal maupun vertical.

Aspek kedua menyangkut bentuk, konstruksi, dan tampilan secara visual masing-masing huruf secara
individu.

Secara umum huruf mempunyai bentuk anatomi seperti berikut. Coba Anda perhatikan gambar
animasi berikut ini! Arahkan kursor pada masing-masing panah, maka bagian-bagian anatomi huruf
akan muncul!

Gambar Animasi 4. Anatomi huruf

8
Contoh Naskah Obyek Pembelajaran
@Ai Sri N-New Ayuda 25-28 April 2016
 NASKAH OBYEK PEMBELAJARAN

MATA PELAJAJARAN : PENGOLAHAN CITRA DIGITAL NO.HAL :9

JUDUL : ANATOMI HURUF TIPOGRAFI
NAMA FRAME : Anatomi Huruf Tipografi NO Frame :4
(LANJUTAN)

Setiap huruf mempunyai anatomi atau keuinikan fisik yang membedakan satu huruf dengan huruf
yang lain. Dari Anatomi-anatomi huruf membantu kita dalam memahami sifat atau karakteristik dari
setiap jenis huruf.

Berikut ini ada beberapa istilah umum yang digunakan dalam penamaan setiap komponen visual yang
terstruktur dalam fisik huruf.

Gambar 5. Komponen visual terstruktur huruf

Setelah Anda mengetahui bagian-bagian dari anatomi huruf tersebut, Apakah Anda dapat
menjelaskan dari masing-masing bagian anatomi huruf tersebut?

Terminologi umum yang digunakan dalam penamaan setiap komponen visual yang
terstruktur dalam fisik huruf adalah :

1. Capline : garis maya lurus horisontal yang menjadi batas bagian teratas dari setiap
huruf besar
2. Meanline : garis maya lurus horisontal yang menjadi batas bagian teratas dari badan
setiap huruf kecil
3. Baseline : garis maya lurus horisontal yang menjadi batas bagian terbawah dari setiap
huruf besar
4. Descender : bagian dari huruf kecil yang posisinya tepat berada di bawah baseline
5. Ascender : bagian dari huruf kecil yang posisinya tepat berada diantara meanline dan
capline
6. X-Height : jarak ketinggian dari baseline ke meanline

9
Contoh Naskah Obyek Pembelajaran
@Ai Sri N-New Ayuda 25-28 April 2016
 NASKAH OBYEK PEMBELAJARAN

MATA PELAJAJARAN : PENGOLAHAN CITRA DIGITAL NO.HAL : 10

JUDUL : ANATOMI HURUF TIPOGRAFI
NAMA FRAME : Anatomi Huruf Tipografi
(LANJUTAN)

……………………………………………………………………………………………………………………………………………………………
……………………………………………………………………………………………………………………………………………………………
……………………………………………………………………………………………………………………………………………………………
……………………………………………………………………………………………………………………………………………………………
……………………………………………………………………………………………………………………………………………………………
……………………………………………………………………………………………………………………………………………………………

Keterangan: Gambar/photo, Animasi, Simulasi, Audio, Video.

Keterangan Gambar Animasi 4 :

1. Tampilkan gambar bentuk huruf seperti pada gambar tampilan, tapi belum dengan teks/tulisan
nama bagiannya.
2. Beri panah pada masing-masing nama bagian, agar siswa dapat meletakkan/menyorotkan kursor
pada panah tersebut.
3. Munculkan nama-nama bagian anatomi huruf (terminal, tangkai, body, serif), ketika siswa
meletakkan/menyorotkan kursor pada masing-masing gambar bagian huruf.

Keterangan Gambar 5:
Tampilkan gambar dan teks sesuai dengan tampilan

10
Contoh Naskah Obyek Pembelajaran
@Ai Sri N-New Ayuda 25-28 April 2016
 NASKAH OBYEK PEMBELAJARAN

MATA PELAJAJARAN : PENGOLAHAN CITRA DIGITAL NO.HAL : 11

JUDUL : ANATOMI HURUF TIPOGRAFI
NAMA FRAME : LATIHAN NO Frame :5

Tampilan:

I. Pasangkan bagian-bagian anatomi huruf di sebelah kanan ke gambar huruf yang tepat di sebelah
kiri, dengan cara klik and drag.

1 Nama organ :
Terminal

2 Tangakai

Body

Serif

3 4

II. Untuk mengetahui sejauhmana Anda memahami materi ini coba kerjakan latihan berikut dengan
cara pilih salah satu jawaban yang menurut Anda benar. Selamat Mengerjakan!

1. Kelompok huruf yang mempunyai kait disebut....

a. Sans serif
b. Serif
c. Hand writing
d. Monospace
e. Decoratif

11
Contoh Naskah Obyek Pembelajaran
@Ai Sri N-New Ayuda 25-28 April 2016
 NASKAH OBYEK PEMBELAJARAN

MATA PELAJAJARAN : IPA NO.HAL : 12

JUDUL : PERNAPASAN PADA MANUSIA
NAMA FRAME : LATIHAN (lanjutan)

2. Sedangkan kelompok huruf yang tanpa kait disebut...

a. Sans serif
b. Serif
c. Hand writing
d. Monospace
e. Decoratif

3. Bagian Huruf yang ditunjukkan pada gambar berikut adalah...

a.Baseline
b. Capeline
c. Meanline
d. Asscender
e. Descender

4. Bagian Huruf yang ditunjukkan pada gambar berikut adalah...

a. Baseline
b. Capeline
c. Meanline
d. Asscender
e. Descender

5. dst…………

Keterangan Tampilan :

Kuncijawaban:
I. 1. Tangkai
2. …..
3. …..
4. ….

12
Contoh Naskah Obyek Pembelajaran
@Ai Sri N-New Ayuda 25-28 April 2016
 NASKAH OBYEK PEMBELAJARAN

MATA PELAJAJARAN : IPA NO.HAL : 13

JUDUL : PERNAPASAN PADA MANUSIA
NAMA FRAME : LATIHAN (lanjutan)

II. 1. B
2. A
3. D
4. E
5. …

Keterangan latihan:

 Pada Latihan I : Siswa menjawab semua soal dengan mengklik dan drag pilihan jawaban ke
kotak yang tepat di samping gambar. Setelah menjawab semua, munculkan tombol PERIKSA,
jika jawaban benar diberi tanda centang V (benar) dan jika salah diberi tanda silang X (salah).
Siswa diberi satu kali kesempatan untuk menjawab kembali dengan memberi tombol ULANG
untuk memilih jawaban. Jika pada kesempatan kedua siswa masih menjawab salah, maka
muncul tombol “Kunci Jawaban”, dan munculkan jawaban yang benar.
 Pada LATIHAN II : Jika pada pilihan pertama, siswa menjawab benar maka muncul tanda
centang (√) benar di samping opsi jawaban, dan jika jawaban salah di beri tanda silang X (salah)
di samping opsi jawaban. Siswa diberi satu kali kesempatan untuk menjawab kembali dengan
tombol COBA LAGI. Jika pada kesempatan kedua siswa masih menjawab salah, maka muncul
jawaban yang benar. Dan tombol “Selanjutnya” untuk mengerjakan soal ke 2 dan seterusnya.

13
Contoh Naskah Obyek Pembelajaran
@Ai Sri N-New Ayuda 25-28 April 2016
 NASKAH OBYEK PEMBELAJARAN

MATA PELAJAJARAN : PENGOLAHAN CITRA DIGITAL NO.HAL : 14

JUDUL : ANATOMI HURUF TIPOGRAFI
NAMA FRAME : REFERENSI NO Frame : 6

Tampilan:

Daftar Pustaka

Danton Sihombing, (2003). Tipografi Dalam Desain Grafis. Jakarta: PT. Gramedia Pustaka
Utama.
Sadjiman Ebdi Sanyoto, (2009). Nirmana. Yogyakarta: Jalasutera.
Edi S. Mulyanta, (2009). 212 Tip Menguasai Adobe Photoshop 4. Yogyakarta: CV. Andi Offset.

Dst

LINK :
………………………………………………………………………………………………………………………………………
………………………………………………………………………………………………………………………………………….

14
Contoh Naskah Obyek Pembelajaran
@Ai Sri N-New Ayuda 25-28 April 2016