Tugas 9 - Pertemuan 13

Apakah kamu tahu Bagaimana Interaksi Manusia dengan Komputer

Apa itu Interaksi Manusia dan Komputer?

Interaksi Manusia dan Komputer (IMK) atau Human-Computer Interaction(HCI) merupakan sebuah disiplin ilmu yang mempelajari perancangan, implementasi, dan evaluasi sistem komputasi interaktif dan berbagai aspek terkait.

IMK pada prinsipnya membuat agar sistem dapat berdialog dengan penggunanya seramah mungkin.

Tahapan Human-Computer Interaction (HCI)
  • Perancangan
    1. Wirefame
    2. Storyboard
    3. Wireflow
    4. Mockup
    5. Prototype
    • Manfaat Perancangan:
      1. Mudah menggambar : Tidak membutuhkan alat khusus
      2. Mudah dimodifikasi : tidak perlu pemrograman untuk memvisualisasikan ide-ide desain baru.
      3. Tidak diperlukan pengkodean : Hanya perlu menggambar bingkai gambar seolah-olah Anda menggunakan alat gambar.
  • Implementasi
  • Evaluasi
Perancangan;

1. Wireframe 

Wireframe adalah sketsa antarmuka pengguna atau user interface (UI).
Hasil gambar untuk wireframe
Kelebihan wirefram;
  1. Menggambarkan layout umum atau tampilan awal dari website atau aplikasi
  2. Membangun kepercayaan dengan user dan stakeholders yang dapat memberikan gambaran yang lebih jelas
  3. Menghemat biaya dan waktu
2. Storyboard

Storyboard adalah penggambaran visual adegan, dialog, aksi dalam urutan berurutan.
Hasil gambar untuk storyboard
kelebihan storyboard;
  1. Adanya komunikasi yang baik antara pengembang dan pelanggan.
  2. Pelanggan dapat berperan aktif dalam pengembangan sistem.
  3. Dapat menggunakan waktu lebih efesien 
  4. Penerapan lebih mudah karena pemakai mengetahui apa yang diharapannya.
3. Wireflow

Wireflow adalah representasi dari aliran layar, dengan mengumpulkan satu set wireframes terkait mengikuti urutan mereka muncul dalam aliran.
Hasil gambar untuk wireflow

4. Mockup

Mockup adalah desain statis menyerupai hasil akhir untuk mewakili suatu produk.
Hasil gambar untuk mockup
Kelebihan mockup;
  1. Dapat mengorganisir detail dari proyek
  2. Dapat menemukan error dengan mudah
  3. Dapat menerjemahkan ide ke dalam bahasa yang dapat dimengerti stakeholders
  4. Dapat menyampaikan ide kepada anggota tim
5. Prototype

Prototype adalah versi konsep produk yang memungkinkan Anda menjelajahi ide-ide Anda dan menunjukkan rencana fitur atau konsep desain keseluruhan kepada pengguna sebelum ke tahapan pengembangan atau implementasi.
Hasil gambar untuk prototype multimedia

Kelebihan prototype;
  1. Adanya komunikasi antara pengembang dengan pelanggannya.
  2. Pengembang dapat bekerja lebih baik.
  3. Pelanggan berperan aktif dalam pengembangan sistem.
  4. Waktu lebih efisien
  5. harapan menjadi lebih baik.
Implementasi;

Implementasi adalah menerapkan hasil rancangan dari Wirefame, Storyboard, Wireflow, Mockup, Prototipe ke dalam bentuk aplikasi nyata.

Jenis-jenis Platform
  1. Aplikasi Mobile
  2. Aplikasi Desktop
  3. Website
1. Implementasi Mobile

Android Studio
Hasil gambar untuk implementasi mobile

2. Implementasi Desktop
Visual basic (VB) & Visual basic Net (VB Net)
Hasil gambar untuk Visual basic (VB) & Visual basic Net (VB Net)

3. Implementasi Website
  • Programming Native
    • HTML
    • CSS
    • PHP
  • Framework
    • CSS (Bootstrap + PHP)
    • PHP (CI,Yii2, Laravel)
  • CMS (Content Management System)
    • WordPress
    • Joomla
    • Drupal
4. Evaluasi
  • Usability
Usability merupakan tingkatan kemampuan antarmuka aplikasi dapat digunakan untuk mempermudah hidup pengguna.
  • User Experience (UX)
User experience sesuai artinya dalam bahasa indonesia “pengalaman pengguna” adalah pengalaman yang diberikan website atau aplikasi kepada penggunanya agar interaksi yang dilakukan menarik dan menyenangkan.

Tahapan-tahapan Evaluasi:
  • Prototype Aplikasi
  • Tugas Untuk User (Task)
  • Kuesioner (Angket)
  • Pengguna (User)

Komentar