Upload
leanna
View
94
Download
0
Embed Size (px)
DESCRIPTION
ANTAR MUKA INTERAKTIF. Oleh : Syukriya Al Asyik , S.kom. Strategi Pengembangan Antarmuka. sebuah program aplikasi terdiri atas dua bagian penting . 1. bagian antarmuka 2. bagian aplikasi. pengembangan bagian antarmuka perlu memperhatikan :. - PowerPoint PPT Presentation
Citation preview
ANTAR MUKA INTERAKTIF
Oleh:Syukriya Al Asyik, S.kom
sebuah program aplikasi terdiri atas dua bagian penting.1. bagian antarmuka 2. bagian aplikasi
Strategi Pengembangan Antarmuka
mekanisme fungsi manusia sebagai pengguna komputer
Berbagai informasi yang berhubungan dengan karakteristik dialog yang cukup lebar, seperti ragam dialog, struktur, isi tekstual dan grafis, tanggapan waktu, dan kecepatan tampilan
Penggunaan protitipe yan didasrkan pada spesifikasi dialog formal yang disusun secara bersama-sama antara (calon) pengguna dan perancang sistem, serta peranti yang mungkin dapat digunakan untuk mempercepat proses pembuatan prototipe
pengembangan bagian antarmuka perlu memperhatikan:
Teknik evaluasi yang digunakan untuk mengevaluasi hasil proses prototipe yang telah dilakukan, yaitu secara analitis berdsarkan pada analisis atas transaksi dialog, secara empirik menggunakan uji coba pada sejumlah kasus,umpan balik pengguna yang dapat dikerjakan dengan tanya jawab maupun kuesioner, dan beberapa analisis yang dikerjakan oleh ahli antarmuka.
pengembangan bagian antarmuka perlu memperhatikan (cont):
1. Konsistensi. 2. Buatlah standarisasi yang selalu dipatuhi dalam
segala hal. 3. Jelaskan aturan yang dipakai. 4. Beri dukungan, baik untuk pemula (novice) atau
pemakai mahir (expert). 5. Kemudahan navigasi dari layar ke layar lainnya. 6. Kemudahan navigasi pada suatu layar. 7. Gunakan kata-kata yang jelas pada message dan
label. 8. Gunakan komponen sesuai dengan fungsinya. 9. Pelajari aplikasi lain yang sejenis. 10. Gunakan warna seperlunya.
User Interface Design Tips and Techniques
11. Ikuti aturan kekontrasan warna. 12. Gunakan font seperlunya. 13. Gunakan fasilitas disable untuk fasilitas yang tidak
relevan, jangan dihilangkan. 14. Gunakan tombol default yang tidak berbahaya / fatal. 15. Gunakan field alignment. 16. Justify data seperlunya. 17. Jangan membuat layar yang penuh informasi. 18. Buatlah pengelompokan informasi pada layar. 19. Tampilkan window yang akan diaktifkan dilokasi yang
sesuai. 20. Jangan hanya menggantungkan functionality
aplikasi pada menu pop-up.
User Interface Design Tips and Techniques (Cont..)
Contoh:
Banner/ LogoSebuah banner atau logo merupakan tampilan awal pada sebuah halaman web. Hal ini merupakan suatu identitas khusus bagi situs web sehingga dapat mengingatkan
audiens, sedang berada di situs web manakah mereka berada.
Contoh : WEB Design
Statement of Purpose Sebaris kalimat pada tampilan awal web
dengan maksud untuk menjelaskan pertama kali kepada audiens, untuk apa dan siapa situs web tersebut ditujukan.
WEB DESIGN
Table of Content Merupakan tampilan daftar isi pada sebuah
halaman web yang dimaksudkan sebagai petunjuk informasi apa yang akan dilihat oleh audiens.
Seperti halnya daftar isi pada sebuah buku yang menunjukan letak halaman pada setiap topik yang dimaksud.
WEB DESIGN
Kickers yaitu sebuah kalimat pendek atau sebuah
image yang merupakan gambaran kepada audiens ke arah informasi atau berita yang akan disampaikan. Mereka tinggal meng-klik, selanjutnya akan dihubungkan pada pokok berita yang dimaksud.
WEB DESIGN
Artwork/Photographs Tampilan gambar atau foto yang
menceritakan maksud dari informasi yang disampaikan pada halaman web.
LAYOUT Layout adalah merupakan tampilan gambar
dan teks pada suatu halaman web yang tersusun sehingga enak untuk dilihat dan
dibaca.
WEB DESIGN
DINAMIS / TIDAK STATIS PROSES CEPAT LAY OUT YANG BAGUS MUDAH DIMENGERTI FRIENDLY MENARIK PERHATIAN USEFULLY UPDATE
TIP WEB DESIGN
1. Time-Sharing Satu komputer yang mampu mendukung
(dapat digunakan oleh) multiple user. Meningkatkan keluaran (throughput) dari
sistem.2. Video Display Units (VDU) Dapat memvisualisasikan dan
memanipulasi informasi yang sama dalam representasi yang berbeda.
Mampu memvisualisasikan abstraksi data.
PARADIGMA SISTEM INTERAKTIF
3. Programming Toolkits (Alat Bantu Pemrograman)
Alat Bantu Pemrograman memungkinkan programmer meningkatkan produktivitasnya.
4. Komputer Pribadi (Personal Computing)
Mesin berukuran kecil yang powerful, yang dirancang untuk user tunggal.
PARADIGMA SISTEM INTERAKTIF(2)
5. Sistem Window dan interface WIMP (Windows, Icons, Menus and Pointers)
Sistem window memungkinkan user untuk berdialog / berinteraksi dengan komputer dalam beberapa aktivitas/topik yang berbeda.
6. Metapora (Metaphor) Metapora telah cukup sukses digunakan untuk
mengajari konsep baru, dimana konsep tersebut telah dipahami sebelumnya.
Contoh metapora (dalam domain PC):♦ Spreadsheeet adalah metapora dari Accounting dan Financial Modelling
♦ Keyboard adalah metapora dari Mesin Tik
PARADIGMA SISTEM INTERAKTIF(3)
7. Manipulasi Langsung (Direct Manipulation) Manipulasi Langsung memungkinkan user untuk
mengubah keadaan internal sistem dengan cepat. Contoh Direct Manipulation adalah konsep
WYSIWYG (what you see is what you get).
8. Bahasa vs. Aksi (Language versus Action) Bahasa digunakan oleh user untuk berkomunikasi
dengan interface. Aksi dilakukan interface untuk melaksanakan
perintah user.
PARADIGMA SISTEM INTERAKTIF(4)
9. Hypertext Penyimpanan informasi dalam format non-linear tidak
banyak mendukung pengaksesan informasi secara random dan browsing asosiatif.
Hypertext merupakan metode penyimpanan informasi dalam format non-linear yang memungkinkan akses atau browsing secara nonlinear atau random.
10. Multi-Modality Sistem multi-modal interaktif adalah sistem yang
tergantung pada penggunaan beberapa (multiple) saluran (channel) komunikasi pada manusia.
Contoh channel komunikasi pada manusia: visual(mata), haptic atau peraba (kulit) audio (telinga).
PARADIGMA SISTEM INTERAKTIF(5)
11. Computer-Supported Cooperative Work (CSCW)
Perkembangan jaringan komputer memungkinkan komunikasi antara beberapa mesin (personal komputer) yang terpisah dalam satu kesatuan grup.
Sistem CSCW dirancang untuk memungkinkan interaksi antar manusia melalui komputer dan direpresentasikan dalam satu produk.
Contoh CSCW: e-mail (electronic mail)
PARADIGMA SISTEM INTERAKTIF(6)