BAB 3: INTERAKSI MANUSIA DAN KOMPUTER

3.1 Reka Bentuk Interaksi

NOTA RINGKAS

Merupakan satu aspek penting dan perlu dititikberatkan

semasa membangunkan produk atau aplikasi.

Reka bentuk yang menarik dan mudah digunakan akan

membuatkan pengguna selesa dan seronok menggunakan
produk tersebut.

REKA BENTUK – susun atur teks, gambar, butang dan

REKA BENTUK menu dalam sesuatu produk.

INTERAKSI – tindakan manusia semasa menggunakan

produk tersebut.

REKA BENTUK INTERAKSI – membenarkan pengguna

untuk berkomunikasi dan berinteraksi dengan produk
atau aplikasi.

PRINSIP REKA BENTUK INTERAKSI

PRINSIP KETERANGAN
• Semua elemen perlu kekal pada kedudukan yang sama supaya pengguna akan
berasa selesa semasa menggunakan aplikasi.
KONSISTENSI
(Consistency)
• Jika dialihkan – fokus pengguna terganggu.
• Reka bentuk perlu konsisten dari segi persembahan dan fungsi pada semua antara
muka.

KEBOLEHAN • Penunjuk atau butang interaksi perlulah mudah dikenal pasti.

MEMBUAT • Pengalaman pengguna terbaik adalah apabila pengguna boleh menggunakan
PEMERHATIAN aplikasi dengan selesa dan tanpa ragu-ragu.
(Perceivability)

BOLEH • Reka bentuk interaksi sepatutnya mudah dipelajari dan diingati.

DIPELAJARI • Pengguna akan mengingati cara untuk menggunakan sesuatu dengan hanya
(Learnability) sekali menggunakan aplikasi tersebut.

KEBOLEHAN • Reka bentuk interaksi yang baik dan berkesan dapatmembuatkan pengguna
UNTUK membuat jangkaan perkara yang akan berlaku dalam aliran proses aplikasi
MENJANGKA tersebut sebelum pengguna menggunakan aplikasi tersebut.
(Predictability)
• Maklum balas boleh memberikan gambaran sebenar reka bentuk interaksi
dan maklumat mengenai hasil reka bentuk interkasi tersebut.
• Pereka bentuk menggunakan maklum balas untuk melakukan
penambahbaikan pada reka bentuk interaksi yang telah dihasilkan.
MAKLUM BALAS • Sediakan maklum balas sekiranya pengguna memerlukannya.
(Feedback) • Kegagalan untuk memberikan maklum balas yang dikehendaki boleh
menyebabkan proses pengulangan yang tidak sepatutnya terhadap sebarang
tindakan, kesalahan dan ralat.
LATIHAN PENGUKUHAN

1. Padankan istilah berikut berdasarkan penyataan yang betul.

ISTILAH PENYATAAN

Reka bentuk Membenarkan pengguna untuk berinteraksi dan

berkomunikasi dengan produk atau aplikasi.

Susun atur teks, gambar, butang dan menu dalam

Interaksi
sesuatu produk.

Reka bentuk interaksi Tindakan manusia semasa menggunakan produk.

2. “Serangkaian proses, dialog dan kegiatan yang dilakukan oleh manusia untuk berinteraksi
dengan komputer secara interaktif untuk melaksanakan dan menyelesaikan tugas yang
diinginkan.”

Penyataan ini merujuk kepada;

___________________________________________________________________________________________________________

3. “Ciri utama yang ditawarkan ialah ikon-ikon dan penunjuk-penunjuk yang bersifat visual.
Pengguna boleh melakukan tindakan dengan memanipulasikan atau mengolah unsur-unsur
grafik ini”

Penyataan ini merujuk kepada;

___________________________________________________________________________________________________________

4. Lengakapkan rajah berikut dengan prinsip reka bentuk interaksi.

Boleh
dipelajari

PRINSIP
REKA
BENTUK
INTERAKSI
5. Berdasarkan pandangan anda, berikan tiga kepentingan prinsip asas reka bentuk dalam
setiap produk atau aplikasi yang dibangunkan.

i. _________________________________________________________________________________________________________

ii. ________________________________________________________________________________________________________

iii.________________________________________________________________________________________________________

6. Tuliskan prinsip reka bentuk yang betul berdasarkan penyataan yang diberi.
PENYATAAN PRINSIP
Menggunakan sesuatu aplikasi tanpa sebarang kekeliruan

Mudah untuk dipelajari dan mudah untuk diingati

Semua elemen kekal pada kedudukan yang sama

Bertujuan untuk melakukan penambahbaikan pada reka

bentuk interaksi yang telah dihasilkan

Membuat pengguna dapat membuat jangkaan atau anggapan

perkara yang akan berlaku

7. Berdasarkan aplikasi interaksi manusia dan komputer di bawah, buat penilaian dari segi
prinsip asas reka bentuk interaktif yang digunakan dalam aplikasi tersebut.

Aplikasi Instagram

Prinsip Penjelasan pemerhatian yang dibuat pada aplikasi

Instagram

Butang navigasi dan icon yang digunakan sentiasa kekal

Konsistensi berada pada tempat yang sama untuk memudahkan
pengguna.
 Kebolehan membuat
pemerhatian

Boleh dipelajari

Kebolehan untuk menjangka

Maklum balas

8. Simbol di bawah menunjukkan imej yang sering digunakan dalam aplikasi WhatsApp.
Pengguna memahami maksud imej tersebut apabila menggunakan aplikasi WhatsApp.
Berdasarkan imej tersebut, terangkan prinsip “kebolehan untuk menjangka ” sebagai prinsip
reka bentuk interaktif.

______________________________________________________________________________

______________________________________________________________________________

9. Prinsip ________________________________ menekankan keselesaan kepada pengguna

semasa menggunakan sesuatu aplikasi. Sebarang perubahan yang berlaku pada
paparan akan menarik perhatian pengguna atau mengganggu pengalaman pengguna.

10. “Media sosial seperti WhatsApp menyediakan antara muka interaktif yang mudah
untuk dipelajari.” Jelaskan prinsip tersebut dengan menyatakan perbandingan
dengan media sosial yang lain seperti Telegram.

Prinsip WhatsApp Telegram

Mudah untuk
dipelajari
11. Rajah di bawah menunjukkan simbol aplikasi WhatsApp setiap kali anda menghantar mesej
atau menerima mesej. Simbol ini merupakan maklum balas yang disediakan oleh aplikasi
WhatsApp. Jelaskan prinsip maklum balas dalam reka bentuk interaktif.

______________________________________________________________________________________________________________

______________________________________________________________________________________________________________