pengenalan kepada sistem multimedia (wxet 3142)

nazlita@fsktm.um.edu.my 1

PENGENALAN KEPADA SISTEM MULTIMEDIA

(WXET 3142)

BAB 7 : REKABENTUK PRODUK MULTIMEDIA

nazlita@fsktm.um.edu.my 2

Pengenalan

Faktor penting : Bagaimana produk multimedia itu ‘looks’, ‘feels’ dan ‘works’ Rekabentuk produk : untuk memahami pengguna. Untuk membincangkan rekabentuk produk, kita gunakan ‘page’ sebagai perwakilan ‘presentation’.

‘page’ dirujuk sebagai ‘frame’ atau ‘slide’.

nazlita@fsktm.um.edu.my 3

Pembinaan Blok (Building Blocks)

Dalam rekabentuk produk multimedia,

‘page’ : maklumat yang menyokong struktur dan aliran persembahan.

‘Page’ digunakan untuk ‘navigation’persembahan maklumat sokongan kepada pengguna

nazlita@fsktm.um.edu.my 4

‘Page’ dikategorikan kepada :IntroductionSplashMenu Content Help CreditsQuit

nazlita@fsktm.um.edu.my 5

‘Introduction and Splash Page’ : memulakan sesuatu persembahan. ‘Splash pages’ digunakan untuk menyatakan bahawa sesuatu produk sedang ‘loading’,

di mana ia berguna jika kandungan suatu produk multimedia sedang ‘preloaded’ untuk hasil yang lebih baik

nazlita@fsktm.um.edu.my 6

‘Introduction pages’ membekalkan ciri :

Mengenalpasti produkMengenalpasti sumber bagi produkMembekalkan arahan begaimana hendak menggunakan programMembekalkan ciri keselamatan seperti penggunaan katalaluan (password)

nazlita@fsktm.um.edu.my 7

‘Menu and Content Pages’ : untuk menguruskan kandungan produk multimediaIa akan menghubungkan dengan ‘page’ yang lain yang dipanggil ‘branch’‘Branch’ membenarkan produk dilapisi (layered) untuk pencapaian ke kandungan (content) yang lebih baik

nazlita@fsktm.um.edu.my 8

‘Menu pages’ selalunya mengandungi kandungan yang sedikit dengan latar belakang gambar dan audio. ‘Content pages’ mempersembahkan kandungan produk multimedia tersebut

nazlita@fsktm.um.edu.my 9

‘Help, Credit and Quit pages’ membenarkan fungsi sokongan pengguna untuk melicinkan operasi sesuatu produk

nazlita@fsktm.um.edu.my 10

‘Help pages’ membekalkan maklumat bagaimana persembahan diuruskan dan bagaimana kerja dikawal. ‘Help pages’ boleh dicapai dari mana-mana poin di dalam persembahan dan pengguna boleh kembali ke tempat asal selepas mencapai ‘help pages’

nazlita@fsktm.um.edu.my 11

‘Credit pages’ membekalkan maklumat mengenai pembangun (developer) dan maklumat mengenai sumber kandunganIa juga akan menyenaraikan produk dan maklumat terkini‘Quit pages’ pula digunakan untuk menamatkan program

nazlita@fsktm.um.edu.my 12

Pengkelasan Produk

Terdapat 2 strategi asas untuk pengkelasan produk multimedia :

Tidak-interaktif : pengguna hanya mempunyai sedikit kawalan ke atas produkInteraktif : pengguna yang menentukan aliran penghantaran maklumat

nazlita@fsktm.um.edu.my 13

Produk tidak-interaktif : mudah kerana kandungannya dipersembahkan secara linearPengguna akan melihat jujukan ‘pages’ seperti yang telah ditentukanProduk interaktif : sering digunakan untuk membangunkan produk multimediaPengguna boleh mengawal penghantaran maklumat dengan menekan butang, memainkan bunyi atau video.

nazlita@fsktm.um.edu.my 14

Multimedia Tidak-Interaktif

Contoh : animasi dan persembahan ‘standalone’ spt ‘movie’ ataupun video Digunakan untuk mempersembahkan maklumat kepada penonton yang ramai pada skrin besar ataupun pada monitor televisyen. Produk dimainkan dari mula sehingga tamat.

Pengguna mempunyai sedikit kawalan ke atas produk dengan ‘clicking the mouse’ ataupun dengan ‘pressing a key’ untuk ke ‘page’ yang berikutnya.

nazlita@fsktm.um.edu.my 15

Format Persembahan Tidak-Interaktif

Pengenalan

produk

Apakah ituproduk?

Lebih mengenai

produk

Muka Pengenalan Muka mula (kandungan) Muka berikutnya

nazlita@fsktm.um.edu.my 16

Gambarajah merupakan salah satu format yang paling mudah bagi suatu aplikasi multimedia. Persembahan tidak-interaktif selalunya sesuai untuk aplikasi seperti berikut :

Persembahan korporatPersembahan pengajaran dan latihanPersembahan jualan dan pemasaran

nazlita@fsktm.um.edu.my 17

Bagi setiap kes, terdapat ciri yang kerap digunakan untuk persembahan maklumat. Yang paling penting ialah maklumat yang dibina pada maklumat lain.  Sebagai contoh :

Nama syarikat, diikuti denganMisi syarikatSejarah syarikatOrganisasi syarikatProduk

nazlita@fsktm.um.edu.my 18

Pada setiap ‘page’, pengguna akan dibekalkan penerangan mengenai syarikat tersebut. Maklumat diberikan sedikit demi sedikit supaya pengguna mudah untuk memahami.

nazlita@fsktm.um.edu.my 19

Bagi produk latihan, selalunya bergantung kepada jujukan maklumat berdasarkan masa. Contoh, produk yang mengajar bagaimana untuk memasak. Ia akan bermula dengan menyediakan bahan-bahan yang diperlukan kemudian mencampurkan bahan-bahan tersebut, memasak dan akhir sekali cara menghidangkan makanan tersebut.

nazlita@fsktm.um.edu.my 20

Bagi multimedia tidak-interaktif, format linear merupakan kaedah yang paling berkesan untuk mempersembahkan maklumat sebegini. Ini kerana pengguna tidak boleh bergerak ke sebarang ‘page’ dan ini dapat mengurangkan pengguna tertinggal maklumat yang penting

nazlita@fsktm.um.edu.my 21

Persembahan tidak-intertaktif digunakan di dalam media seperti pita video. Sebagai contoh, pita video semasa penganugerahan ijazah kepada siswazah Universiti Malaya. Kandungan pita akan disusun seperti :

Muzik pengenalan UcapanPenyampaian ijazah

nazlita@fsktm.um.edu.my 22

Multimedia Interaktif

Multimedia interaktif : model yang paling sering digunakan oleh pembangun semasa membina produk komersial termasuklah produk hiburan, latihan dan pembelajaran. Multimedia interaktif dikategorikan dengan kebolehannya untuk mengikut laluan yang berbeza melalui maklumat. Gambarajah berikut menunjukkan contoh bagaimana persembahan interaktif bekerja.

nazlita@fsktm.um.edu.my 23

PengenalanMENU

Bahagian 1Bahagian 2Bahagian 3

Bahagian 2

‘Next’

Bahagian 3

‘Next’

MaklumatBerikutnya

‘Next’

Bahagian 1

‘Next’

nazlita@fsktm.um.edu.my 24

Persembahan multimedia interaktif disusun sebagai menu dan ‘content page’ yang membenarkan pengguna membuat keputusan ke mana untuk meneruskan. Antara teknik yang biasa digunakan untuk membenarkan pengguna membuat pilihan ialah :

ButtonsGraphic hot spotsText-based hyperlinksMenu lists

nazlita@fsktm.um.edu.my 25

Persembahan multimedia interaktif mungkin akan menjadi kompleks.

Ia bergantung kepada produk dan kandungan produk tersebut.

Format interaktif sesuai untuk produk-produk seperti berikut :

Alat rujukan (ensiklopedia / kamus)Pembelajaran dan latihanPenghantaran akhbar dan majalah secara elektronik Hiburan

nazlita@fsktm.um.edu.my 26

Alat rujukan perlu disusun agar dapat dicapai dengan pantas kerana ia mempunyai kandungan yang banyak. Produk pembelajaran dan latihan memerlukan capaian interaktif di mana pengguna akan berkomunikasi dengan produk. Akhbar dan majalah elektronik akan dibahagikan mengikut seksyen seperti berita tempatan, luar negara, politik, sukan dan hiburan.

nazlita@fsktm.um.edu.my 27

Produk hiburan pula dibahagikan mengikut jenis permainan, paras kepakaran (skill levels) yang membenarkan pengguna keluar dan kembali ke seksyen tertentu.

nazlita@fsktm.um.edu.my 28

Strategi Interaktif untuk Menguruskan Maklumat

Maklumat boleh disusun dengan pelbagai cara.Ia selalunya bergantung kepada jumlah maklumat yang disimpan dan kekompleksan maklumat yang terdapat di dalam produk tersebut.

nazlita@fsktm.um.edu.my 29

3 kategori asas untuk menyusun maklumat di dalam sesuatu produk iaitu :

LinearMaklumat dipersembahkan secara terus (straightforward) seperti di dalam buku di mana ia dibahagikan mengikut bab, seksyen dan perenggan.

Tree / hierarchicalMaklumat dipecahkan kepada beberapa sub-lapisan berdasarkan struktur logic.

NetworkMaklumat dihubungkan ke bahagian lain produk.

nazlita@fsktm.um.edu.my 30

Strategi Interaktif dan Persembahan

Sistem interaktif dibangunakan dengan pelbagai cara yang berbeza bergantung kepada produk, kandungan produk dan alatan yang digunakan. Tetapi secara keseluruhannya, pengguna mengawal maklumat yang akan dicapai dan terdapat 3 pendekatan asas iaitu :

LinearProgrammed BranchingHypermedia

nazlita@fsktm.um.edu.my 31

LinearMenyerupai strategi tidak-interaktifPersembahan maklumat secara

‘pages’Pengguna boleh ke muka

berikutnya atau kembali ke muka asal

nazlita@fsktm.um.edu.my 32

Programmed branchingKaedah yang paling sering digunakan di

dalam multimedia komersialSelalunya digunakan di dalam produk

pembelajaran dan hiburanPengguna mempunyai kawalan yang

terhad terhadap laluanKawalan melalui pilihan dari

antaramuka seperti ‘button’, ikon atau menu

nazlita@fsktm.um.edu.my 33

Setiap muka selalunya mengandungi kandungan dan pilihan

Pilihan membolehkan pengguna ke muka lain atau atau menu ‘help’ atau terus keluar dari produk tersebut

Menjadi pilihan ramai pembangun kerana memberi kebebasan kepada pengguna semasa menggunakan produk

nazlita@fsktm.um.edu.my 34

HypermediaJujukan : secara tidak-linear di mana pengguna

mempunyai kawalan sepenuhnya terhadap kandungan produk

Selalunya digunakan untuk World Wide Web (WWW)

Ia sering digunakan sebagai muka teks ataupun grafik di mana pengguna boleh klik teks atau gambar yang dipaparkan

Formatnya menyerupai ‘programmed branching’ keran memberi kebebasan kepada pengguna untuk mengawal navigasi

nazlita@fsktm.um.edu.my 35

‘Storyboarding’

‘Storyboarding’ merupakan proses yang diambil dari pembangunan media termasuklah pembuatan filem atau animasi kartun. Ia menceritakan produk di atas kertas yang menerangkan keterperincian cerita produk tersebut. Bagi multimedia, ‘storyboarding’ digunakan untuk menghubungkan kandungan supaya dapat diterjemahkan ke produk multimedia yang dibina.

nazlita@fsktm.um.edu.my 36

Terdapat 2 paras ‘storyboarding’ iaitu

‘storyboard page’ ‘product storyboard’

nazlita@fsktm.um.edu.my 37

‘storyboard page’

‘Storyboard page’ digunakan untuk menerangkan ‘frame of time’ tertentu di dalam suatu persembahan multimedia.Ia selalunya bersamaaan dengan muka ataupun ‘page’ yang kita telah bincangkan sebelum ini. Tiada undang-undang khas untuk membuat ‘storyboard’.Ia sering bergantung kepada produk yang hendak dibangunkan.

nazlita@fsktm.um.edu.my 38

‘Storyboard page’ ini dapat digambarkan seperti dalam gambarajah berikutnya menerangkan :mesej suatu muka tersebutkandungan muka termasuklah sumber dan

arahan untuk penformatan muka ‘Layout’ bagi kandungan muka ‘Layout’ bagi kawalan navigasi bagi muka

tersebut interaktiviti bagi muka tersebut

nazlita@fsktm.um.edu.my 39

maklumat pereka termasuklah siapa yang mereka, bila dan di mana

komen atau maklumat lain yang berguna

nazlita@fsktm.um.edu.my 40

‘storyboard page’

Nama Projek: Ketua projek: Pereka:Tarikh: Tarikh kemaskini:

Teks Teks

nazlita@fsktm.um.edu.my 41

‘product storyboard’

Oleh kerana produk multimedia selalunya melebihi dari 1 muka, maka perlulah ia dihubungkan dengan muka yang lain untuk mempersembahkan keseluruhan kandungan produk multimedia tersebut.

‘Product storyboard’ merupakan gambaran keseluruhan yang menerangkan bagaimana muka individu dipersembahkan

nazlita@fsktm.um.edu.my 42

Terdapat beberapa cara untuk menguruskan muka-muka tersebut iaitu : Menggunakan ‘loose-leaf notebook’ untuk

menyimpan ‘pages’. Meletakkan ‘pages’ pada dinding satu demi satu

secara linear. Meletakkan ‘pages’ pada dinding atau kertas

yang besar dengan menunjukkan hubungan di antara ‘pages’ dan navigasi.

Menggunakan kad rujukan yang berkaitan dengan ‘storyboard sheets’ yang disusun pada kad yang besar.

nazlita@fsktm.um.edu.my 43

Aplikasi ‘storyboard’

Storyboard Page

Storyboard Page

Storyboard Page

Storyboard Page

Storyboard Page

Storyboard Page

Storyboard Page

Storyboard Page

nazlita@fsktm.um.edu.my 44

‘Storyboarding’ yang baik penting untuk menghasilkan produk multimedia yang baikTujuan : membantu pereka untuk menguruskan ide dan kandungan. Ia selalu digunakan sebagai ide asas untuk diceritakan kepada pengguna.

nazlita@fsktm.um.edu.my 45

Tutorial Bab 7

1. Apakah perbezaan di antara produk multimedia interaktif dan tidak-interaktif?

2. Jelaskan kategori-kategori asas untuk menyusun maklumat di dalam sesuatu produk.

3. Apakah keburukan penggunaan kaedah ‘linear’ di dalam penyusunan maklumat.

4. Senaraikan paras ‘storyboarding’ yang ada. Bincangkan setiap satu.

5. Terangkan kebaikan ‘storyboarding’ .