Perancangan Perancangan TampilanTampilan
Disusun Oleh : Disusun Oleh : Kelompok IXKelompok IX
• SamsuriadiSamsuriadi• Arfi Mesrach HapaidukaArfi Mesrach Hapaiduka• Firdayanti BakriFirdayanti Bakri• Rahmat HidayatRahmat Hidayat• Nimma ErvianaNimma Erviana
Salah satu kriteria penting dari sebuah Salah satu kriteria penting dari sebuah antarmuka adalah tampilan yang menarikantarmuka adalah tampilan yang menarik
Seorang perancang tampilan selain harus Seorang perancang tampilan selain harus mempunyai jiwa seni yang memadai, ia mempunyai jiwa seni yang memadai, ia pun juga harus mengerti selera pengguna pun juga harus mengerti selera pengguna secara umumsecara umum
harus bisa meyakinkan pemrogramnya, harus bisa meyakinkan pemrogramnya, bahwa apa yang dibayangkan dapat bahwa apa yang dibayangkan dapat diwujudkan (diimplementasikan) dengan diwujudkan (diimplementasikan) dengan peranti bantu (peranti bantu (tooltool) yang tersedia) yang tersedia
Perancangan TampilanPerancangan Tampilan
Dokumentasi Rancangan Dokumentasi Rancangan
Membuat sketsa pada kertasMembuat sketsa pada kertas Menggunakan peranti prototype GUIMenggunakan peranti prototype GUI Menuliskan tekstual yang Menuliskan tekstual yang
menjelaskan tentang kaitan antara menjelaskan tentang kaitan antara satu jendela dengan jendela yang satu jendela dengan jendela yang lainlain
Menggunakan peranti baru yang Menggunakan peranti baru yang disebut CASE (disebut CASE (Computer-Aided Computer-Aided Software EngineeringSoftware Engineering))
Cara PendekatanCara Pendekatan
Pertama: Special Purpose Software, Pertama: Special Purpose Software, pendekatan yang biasa digunakan pendekatan yang biasa digunakan adalah user-centered design adalah user-centered design approachapproach
Kedua: General purpose software Kedua: General purpose software (public software)(public software)
4 Komponen Antarmuka4 Komponen Antarmuka
Model PenggunaModel Pengguna Bahasa PerintahBahasa Perintah UmpanbalikUmpanbalik Penampilan InformasiPenampilan Informasi
TahapanTahapan
Pemilihan ragam dialogPemilihan ragam dialog Perancangan struktur dialogPerancangan struktur dialog Perancangan format pesanPerancangan format pesan Perancangan penanganan Perancangan penanganan
kesalahankesalahan Perancangan Struktur DataPerancangan Struktur Data Perancangan Tampilan Berbasis Perancangan Tampilan Berbasis
GrafisGrafis
Pemilihan ragam dialogPemilihan ragam dialog
Pilihlah ragam dialog yang menurut Pilihlah ragam dialog yang menurut perkiraan cocok. Pemilihan ragam perkiraan cocok. Pemilihan ragam dialog dipengaruhi oleh karakteristik dialog dipengaruhi oleh karakteristik populasi pengguna, tipe dialog yang populasi pengguna, tipe dialog yang diperlukan, kendala teknologi yang ada diperlukan, kendala teknologi yang ada untuk mengimplementasikan ragam untuk mengimplementasikan ragam dialog tersebut. Ragam dialog yang dialog tersebut. Ragam dialog yang terpilih dapat berupa sebuah ragam terpilih dapat berupa sebuah ragam tunggal, atau sekumpulan ragan dialog tunggal, atau sekumpulan ragan dialog yang satusama lain saling mendukung yang satusama lain saling mendukung
Perancangan struktur Perancangan struktur dialogdialog
Analisis tugas dan menentukan Analisis tugas dan menentukan model untuk membentuk struktur model untuk membentuk struktur dialog yang sesuai. Sebaiknya harus dialog yang sesuai. Sebaiknya harus mendapatkan umpanbalik yang mendapatkan umpanbalik yang berupa diskusi informal maupun berupa diskusi informal maupun prototype dari dialog yang nantinya prototype dari dialog yang nantinya digunakan digunakan
Perancangan format Perancangan format pesanpesan
Pada tahap ini tata letak tampilan dan Pada tahap ini tata letak tampilan dan keterangan tekstual secara terinci harus keterangan tekstual secara terinci harus mendapat perhatian lebih. Selain itu, mendapat perhatian lebih. Selain itu, kebutuhan data masukan yang kebutuhan data masukan yang mengharuskan pengguna untuk mengharuskan pengguna untuk memasukkan data ke dalam komputer memasukkan data ke dalam komputer juga harus dipertimbangkan dari segi juga harus dipertimbangkan dari segi efisiensinya. Salah satu contohnya adalah efisiensinya. Salah satu contohnya adalah dengan mengurangi pengetikan yang dengan mengurangi pengetikan yang tidak perlu dengan cara mengefektifkan tidak perlu dengan cara mengefektifkan penggunaan tombol.penggunaan tombol.
Perancangan penanganan Perancangan penanganan kesalahankesalahan
Untuk menghindari adanya kondisi Untuk menghindari adanya kondisi abnormal abnormal termination,termination, yaitu eksekusi program berhenti yaitu eksekusi program berhenti karena terjadi kesalahan, maka bentuk-bentuk karena terjadi kesalahan, maka bentuk-bentuk penanganan kesalahan perlu dilakukan penanganan kesalahan perlu dilakukan
Validasi pemasukan data Validasi pemasukan data Proteksi pengguna Proteksi pengguna Pemulihan dari kesalahan Pemulihan dari kesalahan Penampilan pesan salah yang tepat dan Penampilan pesan salah yang tepat dan
sesuai dengan kesalahan yang terjadi pada sesuai dengan kesalahan yang terjadi pada waktu itu waktu itu
Perancangan Struktur Perancangan Struktur DataData
Menentukan struktur data yang Menentukan struktur data yang dapat digunakan untuk menyajikan dapat digunakan untuk menyajikan dan mendukung fungsionalitas dan mendukung fungsionalitas komponen-koponen antarmuka yang komponen-koponen antarmuka yang diperlukan. Struktur ini harus diperlukan. Struktur ini harus dipetakan langsung ke dalam model dipetakan langsung ke dalam model pengguna yang telah dibuat pengguna yang telah dibuat
Perancangan Tampilan Perancangan Tampilan Berbasis GrafisBerbasis Grafis
pengguna tidak harus mengingat perintah-pengguna tidak harus mengingat perintah-perintah yang sering kali cukup panjang, perintah yang sering kali cukup panjang, tetapi cukup dikerjakan dengan melihat tetapi cukup dikerjakan dengan melihat dan kemudian menunjuk ke suatu gambar dan kemudian menunjuk ke suatu gambar yang mewakili suatu aktifitas (yang yang mewakili suatu aktifitas (yang seterusnya disebut seterusnya disebut ikonikon) )
penggunaan borang penggunaan borang propertyproperty atau atau optionoption untuk mengatur kenampakan (wajah) untuk mengatur kenampakan (wajah) desktopdesktop
kemampuan WYSIWYG kemampuan WYSIWYG (what you see is (what you see is what you get) what you get) yang kemudian menjadi yang kemudian menjadi sangat terkenalsangat terkenal
LanjutanLanjutan
Ilusi pada obyek-obyek yang Ilusi pada obyek-obyek yang dapat dimanipulasidapat dimanipulasi
Urutan Visual dan fokus Urutan Visual dan fokus pengggunapenggguna
Struktur internalStruktur internal Kosakata grafis yang konsisten Kosakata grafis yang konsisten
dan sesuaidan sesuai Kesesuaian dengan mediaKesesuaian dengan media
SEKIAN DAN TERIMA KASIHSEKIAN DAN TERIMA KASIH