Dokumen tersebut membahas tentang desain informasi dan desain instruksional. Materi yang dibahas meliputi konsep dasar desain informasi dan instruksional, aplikasi desain informasi, prinsip-prinsip efektif desain informasi, dan metode pembelajaran seperti presentasi, demonstrasi, dan diskusi.
1. Basic Concepts of Information &
Instructional Design
Week 01
Course : T0962 - Current Popular IT V
Year : 2010
2. Bina Nusantara
Why Design?
“"Orang-orang perlu masuk ke perangkat lunak Anda
dalam waktu sekitar 20 detik dan mendapatkan
umpan balik yang positif segera dan pahala,
kemudian mereka tersenyum dan memiliki waktu yang
baik dan mereka ingin pergi lebih jauh."
– Trip Hawkins, Electronic Arts Chairman
Outline Materi
•Desain Informasi Dasar
•Desain Instruksional Dasar
3. Information Design
Is also called :
• Arsitektur Informasi
• Desain Komunikasi
Mengacu pada:
• Tipografi
• Desain grafis
• Ilmu bahasa
• Psikologi
• Ergonomi
• Komputasi
• dan bidang lain
Bina Nusantara
5. Desain Informasi yang Efektif
• Membantu orang bernavigasi dan memahami
fakta, angka, arah, dan tuntutan
• Membantu orang menyelesaikan tugas,
memecahkan masalah, atau memenuhi
kebutuhan
• Meminimalkan / menghilangkan frustasi
• Memahami target audiens dan memastikan
bahwa isi itu penyajian dan pengiriman melayani
mereka..
Bina Nusantara
6. Bina Nusantara
Textbook and Materials
• The Practical Guide to Information Design.
– Author : Lipton, R. (2007).
– Publisher : John Wiley & Sons, Inc. New Jersey.
– ISBN : 978-0-471-66295-2.
• The Essentials of Instructional Design : Connecting
Fundamental Principles with Process and Practice.
– Author : Brown, A. H., & Green, D. (2006).
– Publisher : Pearson Prentice Hall. New Jersey.
– ISBN : 978-0-1311-8220-2.
• The Cambridge Handbook of Multimedia Learning.
– Author : Meyer, R. E. (Eds.). (2005)
– Publisher : Cambridge University Press. New York.
– ISBN : 0-521-54751-2.
7. Data
Reading Gaming Sports Arts
Male 8 15 10 9
Female 12 6 8 16
Bina Nusantara
Popular Hobbies
Information
8. Gestalt Principles of Perception
• Similarity (Kesamaan)
• Proximity (kedekatan)
• Figure/Ground (gambar / ruang)
• Pragnanz
• Common Fate
• Closure & Good Continuation (Penutupan & Kelanjutan
Bagus)
Bina Nusantara
10. Information Rank
• Data
– Bahan baku komunikasi
• Informasi
– Data yang terorganisir menjadi bentuk yang berarti
untuk membantu komunikasi
• Pengetahuan
– Dikembangkan melalui pengalaman pengguna
dengan informasi
• Kebijaksanaan
– Metaknowledge - kemampuan untuk pengetahuan
abstrak ke situasi baru
Bina Nusantara
Information
Design
Instructional
Design
12. Instructional Design Definition
Bina Nusantara
Proses yang sistematik and reflektif yang
menerjemahkan prinsip-prinsip pembelajaran dan
instruksi ke dalam rencana untuk bahan pengajaran,
aktivitas, sumber daya informasi, dan evaluasi
– Smith & Ragan. (1999). Instructional design (2nd Ed.). New York : Wiley.
13. Instructional Designer
menciptakan sesuatu yang memungkinkan
seseorang atau sekelompok orang untuk:
• belajar tentang topik tertentu
• mengembangkan atau meningkatkan satu set
keterampilan
• mendorong pelajar untuk melakukan studi
lebih lanjut.
menciptakan suasana pembelajaran yang
efektif dengan memanfaatkan penelitian yang
tersedia di:
• Bagaimana orang berpikir dan belajar
• ketersediaan teknologi untuk komunikasi
• Metode analisisBina Nusantara
Instructional
Designer
14. Bina Nusantara
Outline Materi
• Anatomi Teks
• Menulis Informasi
• Kode Warna
Information Design (Text)
Week 02
Web Design = 95% Typography
Information Design = Typography
Information = kebanyakan Teks
16. 1. Size
• 72 point = 1 inch = 2.54 cm
• Bergantung dari tujuan informatisi dan pembaca
– Kartu nama : 6pt - 8pt
– Website : 9pt - 12pt
Bina Nusantara
2. Typeface
• Typography 90% management ruang + 10%
letterform management
• Serif Kertas print
• Sans Serif Web/slides
• Typeface peringkat terendah kepentingan dalam
Desain teks
17. 3. Line Length
• width of the type line/column
• Books/manuals : 50 - 70 char
• Newsletter : 39 - 52 char/column
• Jangan pernah set agar sesuai dengan kertas / media
• Size dan kompresi dapat mempengaruhi line length
4. Style
• Italic kurang terbaca dari Roman
• Real italic and pseudo italic
• Tidak ada italics pada layar komputer
• Bold untuk kontras / penekanan / penting
• Orang dapat membaca lowercase 5-10% lebih cepat dari
ALL-CAPS
• Hindari underline, shadow, and
18. 5. Alignment
• Left-aligned / ragged-right paling mudah untuk dibaca
Bina Nusantara
Left-aligned
• Approachable
• Accessible
• Friendly
Justified
• Simetris
• Formal
• tepat
• konservatif
19. 6. Spacing
– Antara paragraf
• Tambahkan baris spasi / indent untuk menyuntik
white space
– Antara kalimat
• Satu ruang hanya kata
– Antara baris teks
• terlalu-ketat bisa melakukan line crashing
• yang terlalu longgar bisa menekankan latar
belakang bukan teks
– Antara huruf
• yang terlalu longgar bisa membuat teks terlihat
sulit untuk dibaca
Bina Nusantara
20. 7. Placement
• Gunakan grid untuk merancang tata-letak
– Grid’s elements margins and columns
– Membangun kontinuitas
– Pengorganisasian informasi
• Margin
- Bingkai halaman
- Top margin>margin bawah
• Columns
- Tambahkan struktur
- 1 kolom <3 / 4 halamanBina Nusantara
21. 8. Color
• Tampilkan perbedaan
• Tampilkan kesamaan
• Bantuan pembaca
menemukan hal-hal
• Mendorong pembaca untuk
bergerak melalui informasi
• Bantuan pembaca mengingat
informasi
• Tekankan sesuatu
• Memainkan sesuatu ke
bawah
• Sampaikan artiBina Nusantara
30. Pertimbangan warna
• Budaya pengguna
• Sedikit warna = lebih berkesan (<4 warna)Nameable
• Warna lebih diingat
• Membuat kode warna yang sama kuat
Bina Nusantara
1 2 3 4 5
34. Gambar di Desain Informasi harus:
• Jadilah dalam fokus
• Memiliki fokus
• Berarti sesuatu
• Tunjukkan apa yang Anda mengatakan
• Ceritakan apa yang Anda menunjukkan
• Tampak dekat dengan tempat Anda berbicara tentang
mereka
• Point pembaca ke dalam teks
Bina Nusantara
43. Diagrams
• Biasanya berurusan dengan angka
• Merupakan informasi, yang akan mengambil banyak
kata dan angka untuk menggambarkan, menjadi media
ringkas
• Dapat memberikan gambaran sebelum penjelasan
tekstual
• Meningkatkan informasi pengakuan dan ingat
Bina Nusantara
44. Fungsi Diagrams
• Bandingkan angka
• Plot lokasi
• Memperjelas hubungan
• Tampilkan kecenderungan
• Cepat menjawab pertanyaan bagi pembaca
Bina Nusantara
46. Graphs- Grafik bar
• Tampilkan jumlah
dalam urutan
kronologis
– Grafik Line
• Tekankan tren
– Pie Charts
• Tunjukkan
bagaimana bagian
tersebut
berhubungan
dengan seluruh
Bina Nusantara http://www.skwirk.com/p-c_s-16_u-188_t-632_c-2347/bar-column-line-climatic-and-proportional-graphs/nsw/bar-
column-line-climatic-and-proportional-graphs/geography-skills/tables-graphs-and-diagrams
47. Pertimbangan Diagram Kuantitatif
• garis tebal atau model 3D
dapat mengaburkan titik
data
• Gunakan latar belakang
baris jika diperlukan
• grafik pie Hindari jika Anda
ingin membandingkan
lebih dari 5 - 6 bagian
• Membuat tombol / legenda
singkat dan sederhana
untuk mengingat mudah
Bina Nusantara
Series 2
48. Flow Charts & Process Diagrams Considerations
Bina Nusantara
49. Pertimbangan Flow Charts & Diagrams Proses
• Solid lines = jalan langsung
• Garis putus-putus = sekunder / path opsional
• Mulai dari atas, berakhir di bagian bawah
• Bentuk yang berbeda-beda = layanan yang berbeda
Forms Design
• Membantu navigasi
• Benar mengisi lapangan
• Menghilangkan pengguna frustrasi
Pertimbangan Forms Design
• Apa yang harus kita coba lakukan?
• Siapakah pengguna?
• Apa yang saya harapkan pengguna untuk melakukan?
50. Form’s Elements
• Look
– Jumlah ruang yang
diperlukan
– Kelompok terkait
pertanyaan
– Membuat jelas
pertanyaan orang yang
harus mengisi
• Content
– katakan pertanyaan
untuk memudahkan
pemahaman
Bina Nusantara
*
*
*
51. Form’s Elements
• Task structure
– tentukan informasi yang
diperlukan dari bentuk
– Hindari mengisi ulang
Bina Nusantara
52. Bina Nusantara
Outline Materi
• Learning Process
• Types of Learning
• Learning Domains
• Multimedia Learning
• Cognitive Theory
Instructional Design Principles
Week 04
59. Cognitive Theory
Multimedia
Presentation
Each Course in the study
program contributes to the
graduate competencies that
are divided into employability
and entrepreneurial skills
and study program specific
outcomes, in which students
need to have demonstrated
by the time they complete
their course.
Sensory
Memory
Ears
Eyes
Working Memory
Verbal
Model
Pictorial
Model
Sounds
Images
Long-Term
Memory
Prior
Knowledge
CTML Assumptions
• Dual channels
• Kapasitas terbatas
– 7±2 potongan untuk memori kerja
• Active processing
62. Presentasi
• menggunakan informasi verbal dan / atau simbol
visual untuk menyampaikan materi
• Salah satu cara komunikasi
• Efisien dalam waktu
• Dikendalikan oleh presenter
Bina Nusantara
63. Demonstrasi
• Informasi yang ditampilkan seperti
yang akan digunakan
• Penting untuk mengajarkan
keterampilan psikomotorik
• Dapat mengatur standar kinerja
• Lebih otentik dari presentasi - contoh
dunia nyata
• Lebih efisien dalam waktu dari
pengalaman tangan
• Seringkali tidak efisien sebagai
presentasi (misalnya pesawat terbang
melibatkan biaya yang lebih)
Bina Nusantara
64. Diskusi
• Menerapkan prinsip-prinsip
dan informasi melalui
wacana verbal
• Dapat membantu dalam
pengembangan komunitas
virtual
• Baik untuk pengetahuan
yang tidak tetap atau
terbatas
• Membutuhkan moderasi
dan fasilitas dengan hati-
hati, harus melibatkan
seluruh kelompok
65. Pembelajaran Kooperatif
• Koperatif bukan kompetitif
• Ideal untuk belajar dan
ketrampilan sosial
kolaboratif
• Mengembangkan
komunikasi dan
keterampilan berpikir kritis
• Siswa dapat belajar satu
sama lain
• Bisa mengajarkan tanggung
jawab individu
Bina Nusantara
66. Penemuan
• "Belajar terbaik dengan
melakukan" prinsip
• Trial and error
• Belajar lebih awet /
permanen
• Pembelajaran individual
• Tidak selalu menghasilkan
pendekatan yang paling
efektif untuk masalah
• Tidak efisien
Bina Nusantara
67. Problem Solving
• Gunakan pelajarian konten
dan keterampilan
sebelumnya
• Proses:
– Mendefinisikan masalah
– Memeriksa data
– Hasilkan Solusi
• Relevan dengan dunia nyata
• Membuat masalah sesuai
dengan tingkat keterampilan
mahasiswa
• Ex: Studi Kasus
68. Drill & Practice
• Bermanfaat untuk menghafal atau mengingat informasi
• Ex: kosakata 'flashcard'
• Otomatisitas
• Tidak sangat memotivasi kecuali termasuk elemen
game
• Harus mencakup umpan balik korektif untuk memulihkan
kesalahan
Bina Nusantara
69. Tutorial
• Memiliki tutor
– bisa orang / komputer / barang
cetakan
• Biasanya digunakan untuk
keterampilan dasar
– ex: membaca / aritmatika
• Dapat termasuk elemen
presentasi, demonstrasi dan
latihan dan praktek
• Cocok lebih untuk konten
daripada proses pembelajaran
yang berorientasi
• Efisien untuk menghasilkan
• Khas CBT banyak
70. Permainan
• Memotivasi dan kompetitif
• Ditetapkan aturan dan tujuan yang menantang
• Sering membutuhkan-keterampilan pemecahan masalah
dan penguasaan konten tertentu (ex: matematika fakta /
kosakata)
• Perlu untuk mengakomodasi perbedaan individu
• Sulit untuk merancang dan program
Bina Nusantara
71. Simulasi
• Realistis pendekatan-situasi kehidupan nyata
• Hindari beban atau risiko yang terlibat dalam situasi
nyata
• Mempromosikan kognitif, afektif, dan keterampilan
interpersonal
• Bisa berlatih kerjasama dan kerja sama tim
Bina Nusantara
72. Lain-Lain
• Permainan
• Simulasi
• Virtual Reality
• Augmented Reality
Pertimbangan Metode Instruksional
• Setiap metode memiliki kelebihan / kekurangan
• Tingkat interaktivitas
• Pembelajar jumlah
• Karakteristik Pembelajar
• Hasil pembelajaran
• Metode Gabungan
73. Bina Nusantara
Outline Materi
• Media Pembelajaran
• Proses Produksi
• Desain Model
• Tim Produksi
• Manajemen Produksi
Instructional Design Process
Week 06
74. Instructional Media
Print based
Lembar kerja
Buku teks
Audiovisual
Films
Videos
Slide presentasi
Rekaman suara
Interactive
Software
Bina Nusantara Dapat dikombinasikan
76. Model Desain Instruksional
• Penawaran pedoman menjamin kualitas dan
keseragaman
• ADDIE bukan desain model pembelajaran yang spesifik
• Bisa secara signifikan mengurangi biaya pelatihan dan
pendidikan
• Dua ID model terkenal:
– Sistem Pendekatan Model (oleh Dick dan Carey)
– Desain Instruksional Rencana (oleh Kemp, Morrison, dan Ross)
Bina Nusantara
77. Model Pendekatan Sistem
• Dirancang untuk menekankan pentingnya pemeriksaan dan
pemurnian instruksi dan menyediakan panduan untuk membuat
perbaikan
Bina Nusantara
Identify
instructio
nal goals
Write
performan
ce
objectives
Develop
criterion
standards
Develop
instructio
nal
strategies
Develop
instructio
nal
materials
Design &
conduct
formative
evaluation
Design &
conduct
formative
evaluation
Conduct
instructio
nal
analysis
Identify
entry
behaviors
Revisi instruksi
78. Rencana Desain Instruksional
Bina Nusantara
Masalah
instruksional
Karakteristik
Pembelajar
Analisis
tugas
Tujuan
Instruksional
Konten
sequencing
Strategi
instruksional
Instruksional
pengiriman
Instrumen
evaluasi
Sumber daya
instruksional
Perencanaan
Revisi
Formative evaluation
Project management
79. Tim Produksi
• Manajer Produksi
• Subject Matter Expert
• Penulis
• Art Director
• Graphic Artist
• Sound Designer
• Direktur video
• Video Editor
• Interface Designer
• Programmer
• Bakat
Bina Nusantara
81. Manajemen Produksi
• Tugas dan prosedur yang memfasilitasi
penyelesaian proyek
• Menjaga komunikasi antar peserta proyek
• Kalendar produksi
– Gantt, PERT, and CPM
• Gaya panduan
• Storyboards
– Navigasi layout / peta
• Prototyping
83. Multimedia Principle
• Orang-orang belajar lebih baik dari kata dan gambar
daripada kata-kata sendiri
• Kata-kata dan gambar yang relevan
• Terbaik untuk pelajar pemula
• Image untuk dekorasi hanya dapat mengganggu belajar
• visual animasi VS statis
Bina Nusantara
84. Contiguity
• Kedekatan spasial
– Hadir sesuai kata dan gambar dekat
satu sama lain
– Terlalu banyak teks rollover teknik
• Kedekatan Temporal
– Hadir sesuai animasi / gambar dan
narasi secara bersamaan
Bina Nusantara
1
2
3
85. Spatial Contiguity
• Scrolling screen
• Feedback
• Outer links
• Exercise Directions
• Captions
Bina Nusantara
Temporal Contiguity
• Dipisahkan link untuk audio dan video
• Gambar pertama, setelah itu narasi
86. Modality
• Hadir kata sebagai narasi audio, daripada layar teks
pada
• Kompleks materi dalam kecepatan yang terus menerus
cepat
• Tuntutan Teknis
• Nonnative learners,, persamaan matematika, atau
istilah-istilah teknis
Bina Nusantara
87. Redundancy
• Jelaskan visual dengan kata-kata di audio atau teks,
tidak keduanya
• Jika tidak ada grafis yang disajikan, berlebihan dicetak
dan teks berbicara dapat meningkatkan pembelajaran
• Redundant dicetak dan teks lisan dapat efektif dalam
situasi tertentu
– Tidak ada presentasi bergambar
– Bahasa Belajar
– Cacat pendengaran
Bina Nusantara
88. Coherence
• Menambahkan bahan menarik dapat menyakiti belajar
• Minimalkan jumlah detail yang membingungkan dan
tidak perlu (audio tambahan, gambar, atau kata-kata)
• Stick dengan tujuan instruksional
• Berbeda tingkat pengetahuan sebelumnya pelajar
perbedaan jumlah rincian berkurang
Bina Nusantara
Signaling
• Sertakan isyarat yang menekankan materi inti yang
penting
– Garis Besar / heading
89. Segmenting & Pretraining
• Mengelompokkan
– Hadir materi dalam segmen daripada sebagai unit terus
menerus
– Kebebasan kontrol untuk pelajar?? hanya Pace?hanya Order ?
– Pelajar pengalaman VS pelajar awam
• Pretraining
– Orang belajar lebih baik ketika mereka tahu nama dan
karakteristik konsep utama
Bina Nusantara
Theme Name
Spell Check
Slideshow View Fit to Slide
Zoom
Function
Normal View
Slide Sorter
View
90. Personalization, Voice, and Image
• Personalization
– Conversational style VS formal style beware of coherence
principle
• Voice
– Human standard voice VS machine/foreign-accented human
voice
• Image
– On screen speaker’s image is no better than off screen one
Bina Nusantara