chapt 5. interface design principles

28
1 Pert-5 Interface design principles Ibnu Sani Wijaya, S.Kom, M.S.I Stikom Dinamika Bangsa Jambi

Upload: ibnu-dzakwan

Post on 25-May-2015

1.145 views

Category:

Documents


0 download

TRANSCRIPT

Page 1: Chapt 5. interface design principles

1

Pert-5Interface design principles

Ibnu Sani Wijaya, S.Kom, M.S.I

Stikom Dinamika Bangsa Jambi

Page 2: Chapt 5. interface design principles

Prinsip – prinsip desain antarmuka

• Merefleksikan model mental user Merefleksikan kombinasi pengalaman dunia riil, pengalaman dari software lain, dan penggunaan komputer secara umum

• Explicit and Implied Action Explicit actions adalah kondisi yang jelas dalam memberikan petunjuk untuk manipulasi suatu obyek. Implied actions adalah kondisi yang hanya memberikan kesan visual untuk memanipulasi obyek.

Page 3: Chapt 5. interface design principles

• Direct Manipulation user mendapatkan dampaknya dengan segera setelah

melakukan suatu aksi.• User Control

mengijinkan user mengontrol dan menginisialisasi aksi.

• Feedback and Communication selalu memberitahukan user apa yang terjadi dari suatu aksi.

• Consistency user dapat mentransfer pengetahuan dan kemampuan dari suatu aplikasi ke aplikasi lain.

• WYSIWYG (What You See Is What You Get) tidak ada perbedaan antara yang dilihat di layar dengan hasil outputnya.

• Aesthetic Integrity informasi diorganisasikan dengan baik dan konsisten

dengan prinsip desain visual yang baik.

Page 4: Chapt 5. interface design principles

Konsep Desain

Entity-Relationship

DiagramData

Dictionary

State-TransitionDiagram

Data FlowDiagram

proceduraldesign

interface design

architectural design

data design

Page 5: Chapt 5. interface design principles

Terjemahan Model Analisis (cont.)

• Data design mengubah model informasi (entity relationship diagram dan data dictionary) menjadi struktur data

• Architectural design berisi hubungan antar elemen dalam program

• Interface design menjelaskan bagaimana bagaimana komunikasi di dalam perangkat lunak, dengan sistem, dan dengan manusia yang menggunakannya. Sebuah interface mengandung maksud sebuah aliran informasi.

Page 6: Chapt 5. interface design principles

Terjemahan Model Analisis (cont.)

• Procedural design mengubah elemen struktural dari arsitektur program menjadi deskripsi prosedural dari komponen perangkat lunak

Page 7: Chapt 5. interface design principles

Prinsip Desain

• Proses desain tidak boleh mengalami “tunnel vision”• Desain harus dapat dilacak ke model analisis• Tidak melakukan desain pada hal yang sama berulang-ulang• Desain harus merepresentasikan masalah pada keadaan nyata• Desain harus memperlihatkan keseragaman dan integrasi

Page 8: Chapt 5. interface design principles

Prinsip Desain (cont.)

• Desain harus terstruktur untuk mengatisipasi adanya perubahan

• Desain bukan coding, coding bukan desain• Penilaian kualitas desain harus dilaksanakan pada saat desain

tersebut dibuat• Desain harus di-review untuk meminimasi kesalahan konseptual

Page 9: Chapt 5. interface design principles

Konsep Desain• Abstraksi• Modularitas• Arsitektur software• Hirarki kontrol• Pembagian struktural• Data struktur• Software procedure• Penyembunyian informasi

Page 10: Chapt 5. interface design principles

Dokumentasi DesainI. Lingkup SistemII. Desain DataIII. Desain ArchitecturalIV. Desain AntarmukaV. Desain ProseduralVI. Catatan Khusus

Page 11: Chapt 5. interface design principles

Data Design

• Mengubah objek data yang didefinisikan pada model analisis menjadi struktur data yang ada dalam perangkat lunak

• Atribut yang dimiliki objek data, hubungan di antara objek data, dan penggunaannya dalam program, semuanya mempengaruhi pemilihan struktur data

Page 12: Chapt 5. interface design principles

Architectural Design

• Menggunakan karakteristik aliran informasi dalam model analisis untuk menghasilkan struktur program

• Sebuah data flow diagram dipetakan menjadi struktur program menggunakan dua pendekatan :• Transform mapping• Transaction mapping

• Transform mapping : diterapkan untuk sebuah aliran data yang menunjukkan batas yang jelas antara data yang masuk dan yang keluar

Page 13: Chapt 5. interface design principles

Architectural Design (cont.)

• DFD dipetakan menjadi sebuah struktur yang mengalokasikan kontrol menjadi input, pemorsesan, dan output bersama dengan hirarki modul

• Transaction mapping : diterapkan jika sebuah item informasi menyebabkan percabangan

• DFD dipetakan menjadi sebuah struktur yang mengalokasikan kontrol menjadi sebuah substruktur yang mendapatkan dan mengevaluasi sebuah transaksi

Page 14: Chapt 5. interface design principles

Interface Design

• Meliputi antarmuka program internal dan eksternal serta desain untuk antarmuka pengguna

• Desain antarmuka internal dan eksternal diarahkan oleh informasi yang diperoleh dari model analisis

Page 15: Chapt 5. interface design principles

Mengembangkan software yang baik.• High Performance

software yang dibuat mempunyai performance yang tinggi, walaupun digunakan oleh beberapa user.

• Mudah digunakansoftware yang dibuat mempunyai sifat easy to use (mudah digunakan) sehingga tidak membutuhkan proses yang lama untuk mempelajarinya

• Penampilan yang baiksoftware mempunyai antarmuka (interface) yang baik, sehingga user tidak merasa jenuh.

• Reliabilitykehandalan, sejauh mana suatu software dapat diharapkan untuk melakukan fungsinya sesuai dengan ketelitian yang diperlukan.

• Mampu beradaptasisejauh mana software yang dibuat mampu beradaptasi dengan perubahan-perubahan teknologi yang ada.

Page 16: Chapt 5. interface design principles

Mengembangkan software yang baik.

• Interoperabilitysoftware yang dibuat haruslah mampu berinteraksi dengan aplikasi lain. Biasanya dapat dilihat dari adanya fasilitas untuk eksport dan import data dari aplikasi lain.

• Mobilitysoftware yang dibuat dapat berjalan pada bermacam-macam sistem operasi.

Page 17: Chapt 5. interface design principles

Mengambil Keputusan Dalam Desain

• Aplikasi semakin membesar, dan menjadi semakin lambat.

• User Interface pada aplikasi semakin kompleks.• Waktu yang diperlukan untuk mengembangkan

fitur baru menjadi lebih lama.• Dokumentasi aplikasi dan dokumen help menjadi

lebih melebar.• Resiko adanya efek pada fitur yang sudah ada.• Meningkatkan waktu yang diperlukan untuk

memvalidasi aplikasi

Page 18: Chapt 5. interface design principles

Mendesain LayoutModel Aplikasi Ada 3 Model Aplikasi:

1. Berbasis DokumenAplikasi ini menghasilkan sebuah dokumen berupa file-file yang nantinya bisa dibuka dan dirubah kembali jika perlu. Aplikasi yang berbasis dokumen misalnya: Microsoft Word, Microsoft Excel, Open Office, Corel Draw, Photoshop, dll.

2. Berbasis Non DokumenAplikasi ini sifatnya tidak menghasilkan dokumen yang bisa dibuka dan dirubah kembali. Contoh dari aplikasi berbasis non dokumen ini adalah: Microsoft Outlook, MySQL, MYOB, dll

Page 19: Chapt 5. interface design principles

Mendesain Layout

3. UtilitasAplikasi ini sifatnya adalah untuk penunjang saja (sifatnya hanya tambahan). Ada kecenderungan aplikasi seperti ini menekankan pula pada style disamping fitur aplikasi. Contoh dari aplikasi ini adalah seperti aplikasi untuk mendengarkan musik atau menonton video (Winamp, Media Player, PowerDVD), aplikasi untuk anti virus (Kaspersky, Norton, F-Secure)

Page 20: Chapt 5. interface design principles

1. Layout Berbasis DokumenMicrosoft Word 2003

HeaderMenubarToolbar

pane

Lembar kerja

Page 21: Chapt 5. interface design principles

Macromedia Flash MX 2004

Page 22: Chapt 5. interface design principles

2. Layout Berbasis Non DokumenMicrosoft Outlook 2003

Page 23: Chapt 5. interface design principles

My SQL

Page 24: Chapt 5. interface design principles

M.Y.O.B

Page 25: Chapt 5. interface design principles

3. Layout Utilitas

Power DVD XP

Ada kecenderungan aplikasi seperti ini menekankan pula pada style disamping fitur aplikasi

Page 26: Chapt 5. interface design principles

Kaspersky Anti Virus

Page 27: Chapt 5. interface design principles

Control Center Pada Linux

Page 28: Chapt 5. interface design principles

30