Session 10 – Balancing Function and Fashion

Pada Sesi ke 10 ini kita akan membahas Balancing Function and Fashion yaitu bagaimana menyeimbangkan fungsi dan fashion. Adapun outline untuk sesi 10 ini adalah :

  • Error Messages
  • Non-Anthropomorphic Design
  • Display Design
  • Web Page Design
  • Window Design
  • Color

—————————————————————————————————————–

Error Messages

Kata-kata dalam error message / diagoostic warnings sangatlah kritikal, terutama jika berhadapan dengan para pemula

Hindari:

  • Nada Angkuh yang terkesan memahari pengguna
  • Message yang ada terlalu generic (contohnya  WHAT? atau SYNTAX ERROR)
  • Message yang ada terlalu tidak beraturan (cthnya FAC RJCT 04040405050)

Daripada Syntax Error lebih baik memakai Unmatched Left Parenthesis

Daripada Illegal Entry lebih baik memakai Type First LEtter : Send, Read or Drop

Daripada Invalid Data lebih baik memakai Days Range from 1 to 30

 

Constuctive Guidance and Positive Tone

Message / Pesan haruslah jika memungkinkan menunjukkan ke user apa yang harus dilakukan untuk menyelesaikan masalah

Poor :  Run Time Error -21465345 Method Private Profile Setting of object “system” failed

Better : Virtual Memory Space Consumed. Close some programs and retry

Poor : Resource Conflict Bus: 00 Device: 03 Function : 01

Better : Remove your compact Flash Card and restart

Poor : Network Connection Refused

Better : Your Password was not recognized. Please retype

Poor : Bad Date

Better : Drop off date must come after pick up date

 

User Centered Phrasing

  • Menyarankan user untuk mengontrol antar mukanya, memulainya daripada meresponnya
  • User harus mempunyai kontrol sejumlah informasi yang disediakan sistem

 

Appropriate Physical Format

  • Gunakan huruf kapital pada pesan hanya pada pesan yang serius / kritikal
  • Hindari penggunaan kode angka

Development of Effective Message

  • Pesan harus dievaluasi oleh beberapa orang dan dicoba oleh partisipan yang sesuai
  • Pesan harus ditampilkan pada panduan pengguna dan harus jelas keberadaannya

Rekomendasi

  • tingkatkan perhatian pada desain pesan
  • Terapkan Kontrol pada kualitas
  • Bangunlah suatu guideline
  • Jalankan Usability Test
  • Kumpulkan data performa pengguna

—————————————————————————————————————–

Non-anthropomorphic Design

Concern:

  • Atribut dari intelegensi, autonomy, kebebasan bisa menipu, membingungkan dan menyesatkan pengguna
  • Penting untuk klarifikasi perbedaan antara manusia dan komputer
  • Pengguna dan desainer harus menanggung tanggung jawab terhadap penggunaan yang salah dalam menggunakan komputer
  • Walaupun menarik untuk beberapa orang, desain antar muka anthromorphic bisa menimbulkan kegelisahan bagi yang lain
  • Desain Antarmuka Anthromorphic bisa menggangu pengguna

Guidelines

  • Berhati-hatilah dalam mepresentasikan komputer sebagai manusia
  • Desain antar muka yang komprehensif, dapat diprediksi serta dapat dikontrol
  • Gunakan manusia yang sesuai untuk introduction / guides
  • Gunakan karakter kartun dalam games atau untuk software anak-anak, tidak untuk yang lain
  • Jangan gunakan kata ganti “Saya” ketika Komputer merespon pengguna
  • Gunakan Kata Ganti “Kamu / You” untuk menuntun pengguna / untuk menyatakan facts

—————————————————————————————————————–

Display design

Mullet and Sano’s Categories of Design Principles:

  • Elegance dan kesederhanaan : Unity, Refinement, Fitness
  • Scale, Contrast and Proportion: Clarity, Harmony, Activity dan Restraint
  • Organization dan Visual Structure: Grouping, Hierarchy, Relationship dan Balance
  • Model and Program: Focus, Flexibility and Consistent Application
  • Image and Representation: Immediacy, Generality, Cohesiveness, and Characterization
  • Style: Distinctiveness, Integrity, Comprehensiveness, Appropriateness

Empirical Result

  • Distruktur dari superior ke naratif
  • Meningkatkan Label data, Mengkluster informasi yang berhubungan, Menggunakan identation dan underlining yang sesuai dll, semuanya bisa meningkatkan peforma
  • Performance Time meningkat dengan display yang makin sedikit dan padat untuk pengguna expert
  • Konten dalam layar haruslah hanya berisi informasi yang relevan dengan tugas
  • Lokasi yang konsisten serta struktur dan terminologi sangat penting
  • Sequence dari display haruslah mirip dengan keseluruhan sistem untuk tugas yang sama

Display-Complexity Metrics

Walaupun pengetahuan akan tugas user dan kemampuannya adalah kunci dalam mendesain display layar yang efektif, metric dari kompleksitas layar yang objektif serta automatable juga merupakan bantuan yang atraktif

Tullis(1997) mengembangkan 4 task-independent metric untuk display alphanumeric:

  • Kepadatan Keseluruhan
  • Kepadatan Local
  • Grouping
  • Kompleksitas Layout

—————————————————————————————————————–

Web Page Design

10 kesalahan utama dalam mendesain website:

  1. Bad Search
  2. PDF File untuk Online Reading
  3. Tidak mengubah warna untuk Links yang telah dikunjungi
  4. Non-Scannable Text
  5. Fixed Font Size
  6. Page Title dimana sulit dicari di search engine (tingkat visibilitas yang rendah)
  7. Apapun yang terlihat seperti iklan
  8. Melanggar konvensi desain
  9. Membuka Window Browser yang baru
  10. Tidak menjawab pertanyaan user

Sudah banyak guideline yang tersedia untuk web designer dan bisa dterapkan untuk web design agar bisa cocok dengan standar masa kini

—————————————————————————————————————–

Window Design

Coordinating Multiple Windows

  • Desainer bisa membuat suatu terobosan untuk next generation window manager dengan mengembangkan koordinat windows dimana windows muncul , berganti content dan tutup sebagai hasil langsung dari tindakan user di domain tugas
  • Sekuens semacam itu bisa diterapkan oleh designer / user dengan end-user programming tools
  • Suatu studi atas task pengguna dapat mengantar kita ke task-specific coordinations based on sequence of actions
  • Important Coordination : Synchronized Scrolling, Hierarchical Browsing, Opening/ Closing of Dependent Windows, Saving/Opening of Window State

Image Browsing

  • Berkerja dengan gambar yang besar
  • Overview keseluruhan di satu window, detail di window lainnya
  • Suatu Field of View Box di overview tsb
  • Panning di Detail view, Perubahan di Field of View Box
  • Aspect Ration haruslah sesuai antara field of view box dan detail view

Personal Role Management : Suatu Role-Centered Design yang menekankan task user dibanding dengan aplikansi dan dokumen-dokumen

Requirement untuk Personal Role Management termasuk:

  • Mendukung suatu unified framework untuk organisasi informasi sesuai role pengguna
  • Menyediakan suatu layout yang visual dan spatial yang cocok dengan task
  • Mendukung Akses Informasi dengan pengetahuan yang parsial terhadap nomila,spatial, temporal serta atribut visual dan hubungannya dengan informasi sisanya
  • Memperbolehkan fast switching and resumption pada setiap roles
  • Menggunakan Screen Space secara efisien dan secara produktif untuk task-tasknya

—————————————————————————————————————–

Color

Warna dapat:

  • Menenangkan atau menyerang mata
  • Memberi penekanan pada display yang tidak menarik
  • Memberikan suatu pemisahan pada display yang kompleks
  • Menekankan organisasi yang logik pada informasi
  • Menarik Perhatian untuk warnings
  • Memunculkan suatu reaksi yang emosional seperti kesenangan, kegembiraan, marah, sedih

Beberapa guideline dalam penggunaan warna

  • Gunakan warna secara konservatif
  • Batasi jumlah dan banyaknnya warna
  • Ketahuilah kekuatan warna dalam mempercepat dan memperlambat kerja
  • Warna harus mendukung tugas yang dikerjakan
  • dan masih banyak lagi

 

Advertisements

Posted on January 9, 2014, in Interaksi Manusia dan Komputer and tagged , , , , , , , . Bookmark the permalink. 1 Comment.

  1. Hi! Quick question that’s completely off topic. Do you
    know how to make your site mobile friendly?
    My site looks weird when viewing from my iphone. I’m trying to find
    a theme or plugin that might be able to correct this issue.
    If you have any recommendations, please share. Thank you!

    Like

Leave a Reply

Fill in your details below or click an icon to log in:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out / Change )

Twitter picture

You are commenting using your Twitter account. Log Out / Change )

Facebook photo

You are commenting using your Facebook account. Log Out / Change )

Google+ photo

You are commenting using your Google+ account. Log Out / Change )

Connecting to %s

%d bloggers like this: