PERTEMUAN 9

Internasionalisasi

Pemahaman dan ingatan dapat ditingkatkan ketika informasi yang disajikan sesuai dengan budaya (Spyridakis dan Fukuoka, 2002).

Pertimbangan internasional

• Lokalisasi

Kapan melakukannya :

1. Ketika pasar mencakup sedikit atau tidak ada penutur bahasa Inggris.
2. Ketika terjemahan diwajibkan oleh hukum atau adat.
3. Ketika pasar yang seluas mungkin diinginkan.

Kapan tidak melakukannya :

• Saat penonton sudah membaca bahasa Inggris.

Hofstede (1980, 1997, 2001) telah menurunkan dan memvalidasi lima dimensi independen di mana budaya bervariasi:

1.  Jarak kekuasaan adalah tingkat penerimaan ketidaksetaraan kekuasaan dan otoritas

2. Individualisme (vs. kolektivisme) mencerminkan seberapa baik seseorang terintegrasi ke dalam kelompok yang lebih besar.

3. Maskulinitas (vs. feminitas) adalah keseimbangan antara ketegasan atau ketangguhan dan dukungan atau kepedulian.

4. Penghindaran ketidakpastian adalah tingkat ketidaknyamanan dengan kondisi yang tidak terstruktur dan berpotensi tidak dapat diprediksi.

5.  Orientasi jangka panjang (vs. jangka pendek) adalah pertukaran antara penghargaan jangka panjang dan pengakuan langsung.

• Menulis teks

– Gunakan bahasa Inggris yang sangat sederhana

– Mematuhi idiom bahasa pengguna lokal dan konteks budaya

– Pertahankan istilah asli untuk kata-kata yang tidak dapat diterjemahkan

• Menggunakan gambar dan simbol

– Gunakan simbol yang diterima secara internasional

– Mematuhi norma budaya dan sosial lokal

– Tinjau gambar grafis yang diusulkan di awal siklus desain

– Warna, Urutan, dan Fungsi

– Penentuan Persyaratan dan Pengujian

 

Pertimbangan aksesibilitas

• Jenis kecacatan

– Visual = mengurangi ketajaman visual menjadi kebutaan total.

– Mendengar = ketidakmampuan untuk mendeteksi suara tertentu hingga        tuli total.

– Gangguan memori = kognitif dan masalah persepsi.

– Gangguan kejang = sensitif terhadap kecepatan kilat visual, tingkat                  tertentu memicu kejang.

• Merancang untuk aksesibilitas

 

Panduan Aksesibilitas Konsorsium WWW :

1. Memberikan alternatif yang setara untuk konten pendengaran atau visual

2. Jangan hanya mengandalkan warna. Gambar harus bisa dimengerti

3. Gunakan markup dan style sheets dan lakukan dengan benar

4. Memperjelas penggunaan bahasa alami

5. Buat tabel yang berubah dengan anggun

6. dll

 

Kegunaan untuk Orang-Orang dengan Keaksaraan Rendah :

– Prioritaskan informasi

– Hindari memindahkan atau mengubah teks

– Sederhanakan desain halaman

– Sederhanakan navigasi

– Optimalkan pencarian

 

PERTEMUAN 10

Create Meaningful Graphics, Icons, and Images & Choose the Proper Color

• Icons

Ikon adalah visualisasi bergambar yang paling sering digunakan untuk mewakili objek dan tindakan yang dapat berinteraksi dengan pengguna atau yang dapat mereka manipulasi.

• Multimedia

Fleksibilitas grafis dari Web memungkinkan dimasukkannya media lain di layar, termasuk gambar, foto, video, diagram, gambar, dan audio lisan

• Graphics

• Gambar: harus menyampaikan pesan yang dimaksudkan

• Peta gambar: untuk menyediakan tautan navigasi ke konten lain

• Foto / Gambar: digunakan bila setiap aspek gambar relevan

• Video: untuk menunjukkan hal-hal yang bergerak / berubah dari waktu ke waktu

• Diagram: untuk menunjukkan struktur / hubungan objek

• Drawings: ketika bagian yang dipilih perlu ditekankan / diwakili

• Animasi: menjelaskan gagasan yang melibatkan perubahan waktu / posisi

• Audisi: sebagai pelengkap teks dan grafi

 

• Color

Warna dapat menarik perhatian pengguna. Sehingga jika digunakan dengan benar, ini dapat menekankan pengaturan logis dari informasi, memfasilitasi diskriminasi komponen layar, menonjolkan perbedaan antar elemen, dan membuat tampilan lebih menarik dan atraktif

• Color Uses

– Gunakan warna untuk membantu menginformasikan

– Gunakan warna sebagai kode visual untuk mengidentifikasi

– Gunakan warna untuk menggambarkan benda-benda alam secara realistis

 

• Possible Problems with Color

– Kapasitas Mendapatkan Perhatian Tinggi

– Gangguan dengan Penggunaan Layar Lain

– Memvariasikan Sensitivitas Mata terhadap Warna yang Berbeda

– Kekurangan Tampilan Warna

– Color and Human Vision

 

• Choosing Colors

– Warna harus selalu memiliki tujuan yang jelas

– Gunakan browser palet warna 216

– Gunakan warna default untuk link

– Jangan tampilkan teks non-tautan dalam warna tautan

– Uji semua warna

 

• Using Color to Avoid

– Mengandalkan warna secara eksklusif

– Terlalu banyak warna dalam satu waktu/ halaman

– Warna-warna yang sangat jenuh dan ekstrem secara spektral:Merah dan biru, kuning dan ungu

– Warna kecerahan rendah untuk penggunaan aplikasi yang lama atau user yang lebih tua

– Warna di area kecil, atau untuk detail halus

 

PERTEMUAN 11

Organize and Layout Windows and Pages

Pengaturan/ Pengorganisasian Layout windows dan halaman web yang baik yaitu :

• Mempercepat Pemahaman Informasi
• Mempercepat Proses Eksekusi Task dan fungsi
• Meningkatkan User Acceptance

 

General Guidelines

Jumlah informasi, Flow, Navigasi, Menyenangkan secara visual komposisi, Konsistensi, Penekanan elemen yang tepat

Pedoman Organisasi

General : White Space, Headings, Borders

Panduan Halaman Web

General : Layout Grid, Element, Size

Organization :

FormattingMultiple, Platform, Navigation element, Homepage

Evaluasi Usability

Ada pendekatan yang berbeda untuk mengevaluasi usability, tiga kategori utama (Chandler & Hyatt, 2002):

Metode inspeksi, Metode pengujian lab, Metode survei dan pelaporan pelanggan

 

Evaluasi Heuristik

• Berdasarkan keahlian sekelompok peninjau.
• Ini biasanya berlaku untuk berbagai situasi dan digunakan untuk memprediksi potensi masalah dalam interaksi.
• Keunggulannya karena mudah digunakan dan tidak memerlukan pengaturan laboratorium yang mahal.

Kalbach (2007) mengidentifikasi 3 langkah untuk evaluasi heuristik:

Persiapkan, Jalankan, Konsolidasi

 Nielsen (1994) mengusulkan 10 “Heuristik” umum:

1. Visibilitas status sistem.
2. Pertandingan antara sistem dan dunia nyata.
3. Kontrol dan kebebasan pengguna.
4. Konsistensi dan standar. Pencegahan kesalahan.
5. Pengakuan daripada ingatan / ingatan.
6. Fleksibilitas dan efisiensi penggunaan.
7. Desain yang indah dan sederhana.
8. Membantu pengguna mengidentifikasi,
9. mendiagnosis, dan memulihkan dari kesalahan.
10. Bantuan dan dokumentasi.

Panduan

• Panduan ini mensimulasikan pengalaman pelanggan melalui interaksi.
•  Hasil simulasi dibandingkan dengan tujuan, harapan, dan pengetahuan yang diharapkan, dengan harapan pelanggan memiliki tujuan pertama kali saat mengembangkan aplikasi.

Aksesibilitas Web

Ini terkait dengan pembangunan situs web, aplikasi, dan halaman yang merupakan penghalang ganda bagi penggunaan siapa pun, terlepas dari fungsi dan peralatan yang digunakan untuk mengakses informasi.

Aksesibilitas web harus :

• Mengakomodasi penyandang disabilitas (disabilitas penglihatan, disabilitas pendengaran, disabilitas fisik, dan disabilitas kognitif dan neurologis)
• Menyediakan akses ke pengguna yang menggunakan koneksi lambat dan yang gambarnya biasanya dinonaktifkan, dan meningkatkan interoperabilitas dengan perangkat seluler.

Melakukan pengujian usability

• Hal pertama yang harus dilakukan adalah menguji tes.
• Uji perintis memungkinkan Anda untuk “men-debug” pengujian Anda untuk melihat apakah interaksi yang Anda uji memiliki masalah awal.
•  Pengujian kegunaan dapat dilakukan di Lab Pengujian Kegunaan. Anda juga dapat mengunjungi situs web klien jika lab tidak tersedia.
• Pengguna dapat melakukan wawancara selama bekerja. Pastikan pertanyaannya spesifik sehingga penguji bisa mendapatkan jawaban.

 

PERTEMUAN 12

Web Design Principles

Beberapa atribut yang perlu diperhatikan:

Textual content, Graphic design, Navigation, Structure, Links

 

Textual Content

Konten yang ditampilkan pada website memiliki nilai yang lebih penting daripada desain website itu sendiri.

Hal yang perlu diperhatikan :

• Membaca di monitor lebih lambat daripada membaca di kertas
• Saat membaca narasi panjang di monitor, mata akan relatif cepat lelah

 

Graphic Design

Tampilan grafis harus memperhatikan konsistensi gambar yang ditampilkan, susunan teks dan gambar, kontras, warna dan fungsionalitasnya.

Hal yang perlu diperhatikan :

• Pilih format gambar yang sesuai dan pertimbangkan masalah ukuran file gambar yang mempengaruhi kecepatan akses dan waktu tunggu (delay)

 

Navigasi

Navigasi harus memberikan penjelasan tentang struktur informasi situs web, termasuk: direktori (peta situs), indeks, bilah navigasi, fungsi pencarian

 

Struktur

Perhatikan struktur situs: konektivitas dan kekompakan, faktor percabangan, panjang halaman, jumlah tautan tautan

 

Links

seperti gaya tombol dialog, seharusnya memberikan penjelasan tentang apa yang dapat dilakukan halaman di halaman berikutnya

Link yang baik didasarkan pada:

• Bagaimana pengguna memprediksi penggunaan tautan
• Bagaimana pengguna membedakan tautan dari tautan lain yang memiliki kesamaan

 

DESIGN PROCESS Mobile Device User Interface

Mobile User Interface Principles

Apa yang Berbeda pada Perangkat Mobile?

• One-handed, keypad, camera, pens, soft keyboard
• Digunakan pada tempat berbeda-beda

 

Antarmuka perangkat seluler [1]

• Izinkan pengguna menggunakan pintasan
• Mengurangi jumlah operasi untuk melakukan aktivitas.

 Antarmuka perangkat seluler [2]

• Urutan tindakan dan fungsi sistem harus diatur ke dalam kelompok/kategori.
• Jika pengguna menemukan gaya percakapan yang sama antara penggunaan PC dan perangkat seluler, mereka akan lebih nyaman.

Tindakan pencegahan:

Gaya dialog yang memungkinkan penggunaan layar terbatas, konsistensi aplikasi, tampilan, dan gaya dialog harus sama di seluruh platform dan saat ditampilkan di perangkat seluler yang berbeda. Prinsip desain

Antarmukap perangkat seluler [1]

Beberapa desain konteks dinamis Prinsip-prinsip desain

antarmuka perangkat seluler [2]

Desain interaktif yang dirancang dengan baik & top-down

Prinsip desain antarmuka perangkat seluler [3]

Desain yang dipersonalisasi & desain yang menyenangkan

 

Desain responsif

Browsing dengan perangkat mobile Berikut ini adalah layout halaman website yang ditampilkan melalui web browser.

Gunakan perangkat seluler untuk menjelajah

• Konversi otomatis dari tampilan web ke tampilan di perangkat seluler tidak selalu efektif
• Pengembang situs web perlu bekerja sama dengan desainer untuk mempersiapkan desain ulang.

 

PERTEMUAN 13

Desain antarmuka permainan

“Permainan komputer adalah program perangkat lunak di mana satu atau lebih pemain mengontrol objek dan sumber daya permainan untuk membuat keputusan guna mencapai suatu tujuan.”

Definisi permainan

• Bermain game membuat keputusan

• Permainan komputer adalah program perangkat lunak

manfaat:

1) Waktu nyata,

2) Lebih dalam,

3) Lebih rumit

Mainkan suatu bentuk hiburan partisipatif

• Bandingkan dengan buku, drama, dan film non-interaktif. Lingkaran Sihir Berpura-pura tujuan • Juga dikenal sebagai objek game

 

Jenis antarmuka permainan

Fase aksi

• dilaksanakan

• berniat untuk mengambil tindakan

• Urutan tindakan

• Eksekusi urutan aksi

• Evaluasi

• Interpretasi Penilaian

• Penafsiran

• Status

Fase aksi

• Tujuannya telah ditetapkan

• Model keadaan yang diharapkan

• Hasil yang diharapkan dari tindakan

 

Skala: mekanika pribadi dan “elemen utama”

Desainer dan pemain model

• Sistem dibangun berdasarkan model mental desainer

• Model desain hanya dapat memprediksi gol pemain

Tujuan permainan Kesadaran akan tantangan tingkat yang lebih tinggi menghasilkan harapan. Tantangan, “Permainan paling menarik menyediakan banyak cara untuk menang”-Adams & Rollings, hal. 284

 

Alur menu

-Perencanaan proses menu

-Sketsa

-Desain komponen

-Tombol, penggeser

Prinsip dasar desain

Gunakan harmoni warna

• Organisasi visual

• Buat fokus

• Gunakan teks dengan hati-hati

• Tonton animasinya

• Ikon, ikon, dan ikon

 

Sketsa diagram alur Mockup Mockup

–Mockup-wireframe Beranotasi Mockup-wireframe dengan diagram alur Model-Papan Cerita Prototipe mockup-klik dengan tautan

 

PERTEMUAN 14

CSCW adalah kelompok pengguna yang bertanggung jawab atas bagaimana merancang sistem untuk membantu kerja tim dan bagaimana memahami dampak teknologi pada model kerjanya.

Hasil CSCW biasanya disebut Groupware.

Jadwalkan, instruksikan program email untuk mengirim pesan.

Groupware adalah jenis software yang membantu kelompok kerja (workgroup) yang terhubung ke jaringan untuk mengelola aktivitas mereka.

• Secara teori, dari sisi pengguna, mekanisme pengiriman email tidak harus menjadi masalah, hanya perlu diperhatikan saat menggunakan ponsel.

 

Struktur sistem pesan

• Kelebihan muatan e-mail dan sistem konferensi elektronik telah menjadi masalah umum.
• Dengan memperkenalkan sistem berbasis ISDN, maka ide untuk membuat sistem koneksi dan komunikasi tatap muka dengan media video dapat terwujud.
• ISDN memiliki banyak bandwidth dalam koneksi telepon digital.

 

Alat argumen

• Bagian penting lain dari CSCW adalah kapan menggunakan argumen desain untuk mengkomunikasikan keputusan antara tim desain.

Sistem Informasi .

• ruang rapat

• Ruang konferensi yang dirancang untuk menggunakan peralatan komputer untuk pertemuan tatap muka.

Permukaan kerja bersama

• Ini adalah sistem yang menggunakan efek whiteboard, yaitu sistem yang memungkinkan peserta untuk menulis langsung di layar lebar

PC bersama dan sistem jendela bersama

• Fokus pada pekerjaan yang dilakukan bersama.
• Ide dari sistem ini adalah membuat beberapa komputer terlihat seperti satu unit.

 

Editor bersama

Editor ini bisa dalam bentuk teks atau grafik untuk kerja kolaboratif.

Sistem penulisan bersama

Pengeditan teks bersama adalah aktivitas yang membutuhkan waktu singkat. Co-creation membutuhkan waktu yang lama dan dapat diselesaikan dalam waktu seminggu atau sebulan.

 

Sistem penulisan bersama

• Pengeditan teks bersama adalah aktivitas yang membutuhkan waktu singkat. Co-creation membutuhkan waktu yang lama dan dapat diselesaikan dalam waktu seminggu atau sebulan.

 

Kerangka kerja groupware

Ada beberapa kerangka kerja untuk memahami aturan groupware.

CSCW juga dapat digunakan sebagai salah satu keputusan interaktif yang akan dirancang selama proses desain.

Sistem ini didukung oleh komputer dengan beberapa bagian, seperti:

Komunikasi langsung didukung oleh e-mail, e-meeting, dan koneksi video.

Arsitektur groupware

Ada dua alternatif arsitektur utama untuk groupware, yaitu beberapa varian dari bentuk terpusat dan tereplikasi.

Umpan balik dan lalu lintas jaringan

Sebagaimana dibahas, umpan balik pengguna diperlukan untuk memahami tindakan yang diambil.

Kegagalan stasiun kerja

Kesalahan ini disebabkan oleh kesalahan kode yang disebabkan oleh penggunaan kode yang sangat kompleks, seperti menggunakan program yang menangani interaksi pengguna dan menggunakan toolkit grafis yang kompleks

Urutan kejadian yang tidak terduga

Banyak program terdistribusi memiliki masalah yang disebut deadlock.

 

PERTEMUAN 15

Ikhtisar Metodologi

Definisi metode Prosedur/alat formal yang memandu dan menyusun proses pengumpulan dan analisis informasi Metode yang berbeda dapat melakukan hal yang berbeda.

Nilai manfaatnya:

• Teori, prinsip, dan pedoman yang terbukti
• Bukti yang mendukung/menolak hipotesis/ide/visi

Evaluasi sebagai bagian dari proses desain

1. Fase pra-desain
2. Tahap desain awal
3. Fase desain berulang
4. Tahap desain akhir

Pembuatan evaluasi

• Indikator kegunaan yang dapat diuji
• Tanggapan pengguna akhir
• Verifikasi dan daftar area masalah (kesalahan)
• Praktik kerja/perubahan persyaratan asli

Desain dan evaluasi

• Paling baik dilakukan bersama
• Metode desain dan evaluasi harus memenuhi batasan pengembangan
• Desain sering membutuhkan jawaban perkiraan cepat quick
• Lihat bacaan opsional Don Norman: Menerapkan perilaku, kognisi, dan ilmu sosial pada produk. Definisi metode (Baker, McGrath)
• Mengarahkan dan membangun prosedur/alat formal untuk proses pengumpulan dan analisis informasi

Setiap metode menawarkan peluang potensial yang tidak dimiliki metode lain, dan setiap metode memiliki keterbatasan yang melekat. Semua metode: Diizinkan tetapi dibatasi Dalam beberapa kasus, hal-hal berharga dapat dikumpulkan dan dianalisis, tetapi di area lain, kelemahan memiliki kelemahan yang melekat, dan pembatasan dapat digunakan untuk melengkapi kekuatan dan kelemahan lawan.

Persyaratan data yang berbeda:

• Korelasi
• Naturalisme
• Relevansi produk

Solusi parsial untuk relevansi produk

• Gunakan pengguna nyata
• Tugas pengguna nyata (desain sistem yang berpusat pada tugas)
• Lingkungan mirip dengan situasi nyata
• Konteks yang mirip dengan situasi nyata

Biaya/manfaat menggunakan metode ini

• Biaya metode harus konsisten dengan manfaat yang diperoleh dari hasil. Terkendala dan pragmatis
• Dapat memaksa Anda untuk memilih metode diskon ketersediaan yang cepat dan kotor

PERTEMUAN 1

INTERAKSI MANUSIA DAN KOMPUTER

Interaksi Manusia dan Komputer adalah Hubungan antara manusia dan komputer dengan karakteristik tertentu guna mencapai suatu tujuan tertentu dengan menjalankan sistem yang disebut Interface atau Antarmuka.

 Istilah “user friendly” berarti :

Kemampuan yang dimiliki oleh sebuah perangkat lunak atau program aplikasi sehingga :

• mudah dioperasikan
• membuat pengguna merasa betah dalam mengoperasikan program tersebut
• Pemula tidak mengalami kesukaran dalam mengoperasikan

Tujuan Rekayasa IMK :

• Fungsionalitas yang semestinya
• Fungsionalitas kurang memadai : mengecewakan pemakai dan sering ditolak atau tidak digunakan.
• Fungsionalitas berlebihan berbahaya bagi implementasi, pemeliharaan, belajar, dan penggunaan sulit
• Kehandalan, ketersediaan, keamanan, integritas data

Lima Faktor Manusia Terukur (measurable human factors) dalam perancangan

1. Waktu belajar
2. Kecepatan kinerja
3. Tingkat kesalahan
4. Daya ingat
5. Kepuasan subjektif

Pengaruh panca indra manusia terhadap perancangan IMK :

• Penglihatan
• Luminans (luminance) = banyaknya cahaya yang dipantulkan oleh permukaan obyek.
• Kontras = hubungan antara cahaya yang dikeluarkan sebuah obyek dengan cahaya latar belakang obyek tersebut
• Brightness = kecerahan
• Pendengaran
• Sentuhan

PERTEMUAN 2

PERSONA

Persona adalah dokumen yang memuat penjelasan tentang karakteristik pengguna yang dipadukan dengan hasil riset pengguna sasaran untuk memperoleh tujuan, kebutuhan dan minat pengguna sasaran.

Menurut Josh Seiden persona dibagi menjadi dua tipe yaitu :

1. persona untuk marketing yaitupemodelan persona untuk mengetahui motivasi user pada saat melakukan sebuah pembelian.
2. persona untuk interactive yaitu persona yang berhubungan dengan perilaku penggunaan barang tertentu.

Saat membuat karakter, tidak banyak perbedaan antara jenis karakter yang digunakan untuk pemasaran dan karakter yang digunakan untuk interaksi, namun metode penelitian yang digunakan untuk mendapatkan informasi yang lebih detail dari pengguna berbeda. Metode-metode tersebut adalah:

1. Dalam penelitian kualitatif, penelitian ini biasanya dilakukan pada kelompok yang terdiri dari 10 sampai 20 orang, dengan tujuan menemukan hal-hal baru dari pengguna.
2. Penelitian kuantitatif, jenis penelitian ini biasanya dilakukan di antara pengguna yang lebih besar, biasanya menggunakan survei pengguna dan kunjungan situs atau metode analisis file log. Metode tersebut bertujuan untuk memastikan bukti dari hipotesis yang ada dan menunjukkan apa yang telah dilakukan pengguna.

Kedua metode tersebut saling melengkapi. Penelitian kualitatif lebih menjelaskan apa yang dikatakan pengguna, sedangkan penelitian kuantitatif menjelaskan lebih banyak tentang perilaku pengguna.

User Persona adalah alat yang berharga untuk menangani proyek pengalaman pengguna. Alat ini menyediakan pengguna dengan produk yang lebih baik, sehingga mereka lebih mungkin untuk membuat proyek berhasil.

terdapat 4 key uses dari persona dalam desain produk, diantaranya sebagai berikut :

1. Gunakan persona untuk memverifikasi keputusan tim desain
2. Ketika ada konflik ide dalam sumber daya atau waktu, gunakan persona untuk menetapkan prioritas.
3. Harus ada persona selama pertemuan konsepsi untuk menjadi sumber inspirasi dan membangun fondasi yang berpusat pada pengguna.
4. Saat mengkritik sebuah ide atau iterasi produk, peran tersebut harus menjadi referensi.

PERTEMUAN 3

TEORI, PRINSIP, DAN PEDOMAN USABILITY, DAN USER CENTERED DESIGN (UCD)

Definisi bisnis dan analisis persyaratan

Tujuan dari tahap ini untuk menetapkan kebutuhan akan suatu sistem. Deskripsi produk dikembangkan dan disempurnakan berdasarkan masukan dari pengguna, pemasaran, atau pihak lain yang berkepentingan.

Metode pengumpulan data yang Diperlukan:

• Direct Observation : Teknik penemuan persyaratan di mana desainer HCI berpartisipasi atau melihat seseorang melakukan aktivitas untuk mempelajari tentang interaksi tersebut.

• Questionnaires : Dokumen bertujuan khusus yang memungkinkan perancang interaksi mengumpulkan informasi pendapat dari responden.

• Interview : Teknik penemuan persyaratan di mana perancang interaksi mengumpulkan informasi dari individu melalui interaksi tatap muka.

• Focus Groups and Brainstorming : Proses di mana pertemuan kelompok yang sangat terstruktur dilakukan untuk tujuan menganalisis masalah dan menentukan persyaratan.

Ketentuan Dasar Fungsi Bisnis

Mental Model adalah representasi internal dari konseptualisasi orang saat ini dan pemahaman akan sesuatu.

Mengembangkan Konseptual Model

– Paduan Perancangan Model Konseptual

– Mendefinisikan Objek

– Mengembangkan Metapora

– Penyusunan Grafik

– Modal Mental Baru Pengguna

Task Analysis

Task Analysis adalah serangkaian aktivitas yang mengubah sistem dari keadaan awal menjadi tujuan yang spesifik atau hasil yang diinginkan. Hierarchical Task Analysis (HTA) tool adalah teknik yang paling populer digunakan untuk tipe analisis ini.

Membentuk Standar Desain atau Pedoman Style

Nilai Standar dan Pedoman

• Untuk pengguna: tingkatkan kinerja, kurangi kesalahan, tingkatkan kepuasan, pemanfaatan sistem yang baik, dll.
• Untuk pengembang: tingkatkan visibilitas manusia-mesin, sederhanakan desain, dll.

Standar UI, pedoman Web dan integrasi gaya, pedoman gaya kustom.

Mendirikan Sistem Kegunaan Tujuan Desain

Sistem Training dan Kebutuhan Dokumentasi :

Training : Pelatihan sistem akan didasarkan pada kebutuhan pengguna, desain konseptual sistem, tujuan pembelajaran sistem, dan tujuan kinerja sistem.

Dokumentasi : Titik referensi, bentuk komunikasi, dan desain yang lebih konkret – kata-kata yang dapat dilihat dan dipahami.

MEMAHAMI PRINSIP INTERFACE DAN SCREEN DESAIN YANG BAIK

Interface dan Screen yang Didesain Dengan Baik :

– Mencerminkan kemampuan, kebutuhan, dan tugas penggunanya.

– Memanfaatkan kemampuan perangkat lunak secara efektif

– Mencapai tujuan bisnis dari sistem yang dirancang

Tujuan Desain Antarmuka :

Kurangi Pekerjaan Visual

Kurangi pekerjaan intelektual

Kurangi kerja memori

Kurangi kerja motorik

Menimimalkan beban atau batasan yang diberlakukan oleh teknologi

 

PERTEMUAN 4

PEMILIHAN MENU DAN PENGISIAN FORMULIR

THE USER INTERFACE  (UI)
DESIGN PROCESS

Memahami Prinsip-Prinsip Antarmuka yang Baik dan Desain Layar Antarmuka dan layar yang dirancang dengan baik :

• Merefleksikan kapabilitas, kebutuhan dan tugas penggunanya. Dikembangkan di bawah batasan fisik yang diberlakukan oleh perangkat keras.
• Penggunaan fungsi perangkat lunak kontrol secara efektif.
• Mencapai tujuan bisnis dari sistem yang dirancang.

Tujuan Desain Antarmuka Pengguna :

• Dapat dipahami secara kognitif:
• Bersikaplah konsisten, dapat diprediksi, dan dapat dikontrol
• Diterima secara emosional
• Cakap, puas dan bertanggung jawab

Tiga prinsip desain dasar (Rees, 2001)

1. Konsistensi
2. Kesederhanaan
3. Konteks

Panduan Desain Antarmuka Pengguna

• Banyak pedoman melibatkan layar berbasis karakter, tetapi banyak pedoman GUI disertakan. Pedoman tersebut dapat dibagi menjadi enam bagian, yang masih berlaku hingga saat ini:

1. Entri Data
2. Tampilan data
3. Kontrol urutan
4. Manual
5. Mentransfer data
6. Perlindungan data

Membangun Menu Sistem dan Skema Navigasi

• Menu merupakan bentuk utama dari sistem navigasi, jika didesain dengan benar maka akan membantu pengguna dalam membangun model berfikir sistem.
• Menu ini efektif karena menggunakan kekuatan manusia dalam mengenali, bukan kelemahan dalam ingatan.

–          Struktur Menu

–          Fungsi Menu

–          Format Menu

–          Menulis Menu

–          Navigasi menggunakan Menu

–          Navigasi dan Link web site

–          Elemen-elemen navigasi web site

–          Memelihara rasa ‘tempat’ pada web site

–          Jenis-jenis Menu

Hasil Fungsi menu

• Navigasikan ke menu baru
• Lakukan tindakan / program
• Menampilkan informasi
• Memasukan data

Isi Menu

Sebuah Menu terdiri atas 4 elemen :

1. Konteks Memberikan informasi agar pengguna tetap berorientasi, Terutama dalam sistem menu yang kompleks / hierarkis
2. Judul
3. Opsi
4. Selesaikan instruksinya Beri tahu pengguna cara memilih

Format Menu (Petunjuk)

1. Konsisten
2. Tampil
3. Presentasi
4. Organisasi
5. Kompleksitas

PERTEMUAN 5

MEMILIH WINDOW YANG TEPAT DAN MEMILIH DEVICE INTERAKSI YANG TEPAT

Windows

Window adalah Suatu area (biasanya persegi panjang) pada layar memiliki pembatas dan memiliki area yang menunjukkan aktivitas komputer atau bagian yang memungkinkan manusia untuk berbicara dengan komputer

Karakteristik Window

• Nama atau judul, sebagai identitas window
• Ukuran (tinggi dan lebar) bisa bervariasi
• Status: aktif / dapat diakses atau pasif / tidak dapat diakses
• Visibilitas – bagian yang dapat dilihat (sebagian atau seluruhnya dapat tersembunyi di balik window lain)
• Lokasi, relatif terhadap batas layar
• Tampilan, yaitu pengelolaan terkait dengan windows lain (tiled, overlap, cascading)
• Kemampuan manajemen, metode manipulasi window pada layar
• Highlight, yaitu bagian yang dipilih
• Fungsi, task, atau aplikasi yang didukung

Komponen-komponen Windows

1. Frame
2. Title bar
3. Title bar icon
4. Window sizing buttons
5. Help button
6. Menu bar
7. Status/ message bar
8. Scroll bars
9. Split box
10. Tool/ command bar
11. Command area
12. Size grip
13. Work area

Gaya Penampilan Windows

• Tiled Windows: Gaya tertua, menampilkan semua jendela Sampai memenuhi layar
• Overlapping Windows: Windows bisa tumpang tindih secara acak
• Cascading Windows: overlap secara teratur

Pemilihan Gaya Tampilan Windows

• Gunakan tiled windows untuk
• Aktivitas single-task
• Data yang perlu dilihat secara simultan
• Tasks yang kurang memerlukan manipulasi window
• Pengguna awam atau kurang pengalaman
• Gunakan overlapping windows untuk
• Berpindah antar tasks
• Tasks yang memerlukan banyak manipulasi window
• Pengguna yang berpengalaman atau pakar
• Isi tampilan yang tidak dapat diprediksi

Tipe-tipe Windows

• Primary windows
• Secondary windows
• Dialog box

Komponen Windows

• Message box

 

 

 

• • • • • • • • • • • • • Palette window

 

• • • • • • • • • • • • • • • • • Pop-up window

 

 

 

 

 

(Mayhew, 1992)

• Penekanan pada kemudahan teknik implementasi daripada analisis mendalam tentang user tasks
• Fokus pada aplikasi, fitur, fungsi, atau tipe data daripada tasks
• Tim desain terbagi sesuai aplikasi, dengan komunikasi antar tim yang rendah
• Terlalu mengikuti petunjuk manual beserta in-efisiensi di dalamnya pada sistem komputer

PERTEMUAN 6

SCREEN BASE CONTROL CLEAR TEXT AND MESSAGE

 

Screen Control

Bisa dikatakan “gadget”. Widget adalah elemen layar yang menyusun badan utama. Ini didefinisikan sebagai objek grafis yang mewakili properti atau operasi objek lain. Digunakan sebagai otoritas untuk memasukkan atau memilih nilai tertentu, mengubah atau mengedit nilai tertentu, menampilkan bagian teks, nilai atau grafik tertentu, dll.

Operable Control

Operable Button

Tombol yang dapat dioperasikan adalah kontrol persegi panjang atau persegi panjang dengan label di dalamnya yang menunjukkan operasi yang harus diselesaikan. Tujuannya adalah untuk memulai operasi, mengubah properti, dan menampilkan menu pop-up. Di jendela, tombol yang dapat dioperasikan digunakan untuk menampilkan jendela lain, menampilkan menu opsi, dan mengatur mode atau nilai atribut. Saat di web, ini digunakan untuk menampilkan informasi dari tautan.

Contoh :

Button Apply : berfungsi untuk melaksanakan aksi langsung

Button Open : berfungsi untuk membuka cascading dialog

Button Menu : berfungsi untuk membuka menu

Button Option : berfungsi untuk membuka expanding dialog

 

Text Entry / Read Only Control

Input teks adalah keterangan atau label yang berbentuk persegi panjang, digunakan untuk menjelaskan jenis informasi yang terkandung di dalamnya, saat pertama kali ditampilkan, kotak tersebut boleh kosong atau berisi nilai awal. Digunakan untuk memungkinkan tampilan, tampilan atau pengeditan informasi teks, dan untuk menampilkan informasi hanya-baca.

Selection Control

Fungsi kontrol pemilihan dapat menampilkan semua kemungkinan pilihan, kondisi atau pilihan yang mungkin ada untuk entitas, atribut atau nilai. Pilih jenis kontrol sebagai “tombol radio”, “kotak centang”, “palet”, “kotak daftar”, “kontrol tampilan daftar”, “kotak daftar drop-down / pop-up

Menulis Kalimat dan Pesan

Menulis kalimat dan pesan harus singkat dan sederhana,  dibatasi tidak lebih dari 20 kata per kalimat dan tidak lebih dari 6 kalimat per paragraf

Menulis Pesan Teks Box

Tittle Bar : Identifikasi pesan harus jelas, termasuk nama objek dan nama aplikasi yang dirujuknya, tidak termasuk indikasi jenis pesan.

Message Box : Kotak pesan: Berikan deskripsi yang jelas dan ringkas, gunakan kalimat lengkap dengan tanda baca di akhir kalimat, jelaskan masalah atau kemungkinan penyebabnya dan tindakan yang harus diambil pengguna, hanya tampilkan alasan status pesan dalam satu kotak pesan , dan gunakan kata dan frase yang konsisten.

Command Button

Close Box

Menulis Teks Halaman

Gunakan gaya yang mencerminkan kebutuhan situs pengguna. Setiap paragraf harus pendek dan hanya berisi satu ide utama. Untuk meminimalkan tautan sebanyak mungkin, dan menempatkan tautan di awal atau akhir paragraf atau bagian teks.

Judul Halaman

Gunakan kata kunci yang bermakna, kata pertama adalah deskripsi terpenting, pastikan judulnya berbeda dari judul halaman lain, dan jangan sorot kata kunci tersebut.

Pesan eror

Berikan pesan kesalahan yang sesuai untuk data yang tidak lengkap atau salah eja, perintah, atau pesan kesalahan yang tidak ada atau tidak ada, tampilkan dengan cara yang berbeda dan buat terlihat.

PERTEMUAN 7

THE USER INTERFACE  (UI)
DESIGN PROCESS

Memberikan Umpan Balik yang Efektif dan Bimbingan dan Bantuan

1. Memberikan Umpan Balik yang Efektif
2. Waktu Pengunduhan Halaman Web
3.  Menangani Penundaan Waktu
4.  Menangani Penundaan Waktu
5.  Berurusan dengan Penundaan Waktu :

• Persen pesan lengkap: Berfungsi jika indikator kemajuan membutuhkan waktu lumayan lama untuk diperbarui
• Pesan waktu berlalu: Pesan yang menunjukkan jumlah waktu yang sudah berlalu
• Download halaman web

Berkedip untuk Perhatian

Menarik perhatian menggunakan mem-flash indikator saat pelaksanaan nir aktif namun wajib  menampilkan pesan pada pengguna. Untuk menaruh pertanda pesan tambahan, berikan pula frekuwensi auditori (satu atau 2 bip). Tampilkan pesannya

 

Penggunaan Suara

Gunakan selalu beserta menggunakan pertanda visual, gunakan nir lebih menurut enam nada berbeda, jangan gunakan: Jingle atau nada atau frekuwensi keras, gunakan nada secara konsisten.

 

Bimbingan dan Bantuan

Manajemen Masalah

Pemberian Bimbingan dan Asistensi :

• Panduan dapat dijelaskan dalam
• bentuk hard copy sistem,
• Dokumentasi online,
• Pelatihan berbasis komputer,
• Pesan instruksional atau petunjuk, dan
• Pesan sistem,

Masalah dengan Dokumentasi

Faktor-faktor yang berkontribusi pada desain yang buruk: skala waktu, faktor organisasi, sumber daya, alasan teoritis

 

Instruksi atau Anjuran

•     ditempatkan di dalam badan layar

•     Anjuran diberikan untuk membantu seseorang memberikan apa yang diperlukan untuk melengkapi layar

•     Panduan untuk menulis instruksi dan petunjuknya tercakup dalam Langkah 8.

Bantuan Fasilitas

Bantuan Fasilitas Pedoman

•     Jenis:

•     Pelatihan:

•     Ketersediaan:

•     Struktur:

•     Interaksi:

•     Lokasi:

•     Konten:

•     Gaya:

•     Konsistensi: