Catatan Minggu 7 : Windows Navigation Diagram + Review HCI

Catatan ini ditulis untuk kepentingan mata kuliah ADBO yang diampu oleh Bapak Eric Sugiarto S.SI., M.Kom.

Pada minggu 7 ini, Bapak Eric menjelaskan mengenai 2 hal Windows Navigation Diagram + HCI. Ini adalah hal menarik karena 2 hal ini saling berhubungan. Di semester 3, saya sudah mengambil HCI. HCI ini di jurusan SIB iSTTS berada pada 1 mata kuliah sendiri. Jika di flashback, banyak hal yang diajarkan, seperti konsep psikologi manusia terhadap sesuatu, bagaimana manusia berinteraksi dengan UI komputer dll. Yang jadi pertanyaan, apa hubungan antara Windows Navigation Diagram dengan HCI? Sebelum masuk ke hal itu, kita bahas dulu Windows Navigation Diagram itu apa. WND atau Windows Navigation Diagram adalah sebuah diagram yang menggambarkan perpindahan atau transisi dari sebuah window ke window yang lainnya, berserta interface dasarnya dan tombol apa atau event apa yang menyebabkan perpindahan dari 1 window ke window yang lain1. Lalu hubungannya apa dengan HCI? Windows Navigation Diagram yang baik, bergantung pada IMK atau HCI ini. Jika navigasinya buruk, susah untuk user melakukan penggunaan aplikasi yang dibuat. Sebelum itu saya rasa lebih baik membahas Windows Navigation Diagram Terlebih dahulu.

image

Berikut diatas adalah contoh Windows Navigation Diagram Sederhana tanpa menampilkan Interface. Saya membaca di beberapa buku juga, selain dari yang diajarkan oleh Bapak Eric di depan, lebih mengarahkan pada gambar simple seperti ini. Tetapi di waktu di kelas, Bapak Eric menjelaskan berbeda dimana juga di gambarkan pula isi windownya secara sederhana. Bisa dilihat di bawah ini gambarnya.

IMG_20171106_100649

Bapak Eric menjelaskan menggunakan Buku terbitan Wiley mengenai UML. Saya lupa dengan judulnya, tetapi yang diajarkan oleh Bapak Eric cukup simple, yaitu dalam WND, ada 2 perbedaan, pertama kita menggunakan <<form>> atau menggunakan <<page>>. Jika Web menggunakan <<page>>, tetapi jika desktop menggunakan <<form>>. Isinya setiap window seperti menggambar mock up biasa, jadi tinggal digambar saja garis besarnya. Untuk komponen lain seperti <<button>> ya ditulis seperti itu. Sisanya seperti yang ada di gambar sebelumnya, yaitu yang perlu kita lakukan adalah melakukan penghubungan dari 1 form ke form yang lain sesuai dengan kenyataan file yang ada. Contohnya seperti diatas. Sisanya mengenai HCI hanya mengulang saja dan di review mengenai sebuah web seperti BlueNile.com

Sekian catatan minggu 7.

Leave a Reply

This site uses Akismet to reduce spam. Learn how your comment data is processed.