Arsitektur Informasi
• Linear / Sequential -> menceritakan
• Hierarchical -> informasi terorganisasi
• Network / Web -> exploring
Storyboard
Tujuan dari story board adalah untuk memungkinkan Anda untuk mengumpulkan ide-ide Anda, memesan materi, dan membuat revisi sebelum menginvestasikan banyak waktu dan usaha dalam mekanika menciptakan proyek. Ini merupakan langkah penting dalam proses.
Navigasi
• Pertanyaan Kunci
– Where am I? (Di mana aku ?)
– Where have I been? (Dari mana aku?)
– Where can I go to? (Ke mana aku bisa pergi?)
• Teknik Navigasi
– Browsing
– Searching
– Site Map
Navigasi
• Menyediakan indikator – ‘you are here’
– Cascading menus
– Thumbnail maps
– Color coding
• Menyediakan ‘Search facilities’
–Sitemaps
Atribut Usability
• Kecocokan antara sistem dan dunia nyata
• Kendali dan kebebasan -> menyediakan undo dan redo
• Konsistensi dan standarisasi -> “exit” atau “quit” ?
• Pencegahan kesalahan
• Fleksibilitas dan efisiensi penggunaan -> expert/basic mode
• Estetika dan perancangan minimalis
• Bantu user untuk mengenali, mendiagnosa, dan memperbaik
Isu Perancangan Antarmuka
• Hyperlinks, icons dan buttons
• Penempatan (Alignment)
• Text
• Warna
• Ukuran dan resolusi layar
Hyperlinks, Icons, dan Buttons
• Gunakan warna umum untuk mengindikasikan status hyperlinks (selected, rollover, atau clicked)
• Sediakan icons/buttons yang masuk akal
• Jangan paksa user untuk mengenali icon baru/spesial
• Bagaimana buttons diaktifkan/dipilih -> highlight atau perubahan bentuk
Penempatan (Alignment)
• Baik untuk elemen ‘horizontal’ maupun ‘vertical’
• Alignment yang baik membantu komunikasi yang lebih baik / bersih
• Centered text terlihat tidak indah dan menambah waktu membaca
• Keseragaman alignment untuk semua elemen di keseluruhan halaman website
Warna
• Gunakan kombinasi yang sederhana Æ teori warna
• Warna hangat (warm colors) terlihat lebih besar dari warna dingin (cool colors)
• Warna cerah (bright colors) lebih besar dari warna gelap (dark colors)
• Warna kuat (intense), warna primer (saturated) dapat menyebabkan mata lelah jika digunakan dalam jumlah besar, jadi jangan gunakan warna-warna tersebut sebagai latar belakang (background)
Resolusi Layar
• Resolusi semakin lama semakin besar
• Rancang untuk yang terendah dan paling banyak digunakan untuk menjamin keberhasilan
Metafora
• Aplikasi yang kompleks dapat dimengerti dengan lebih mudah jika user interfacenya digambarkan dengan sesuatu yang sudah umum
• Metafor yang tepat memudahkan user untuk belajar/mengingat aturan/prosedur aplikasi sesedikit mungkin
Isu-Isu Metafora
• Digunakan untuk menggambarkan aplikasi, bukan suatu button
• Memungkinkan beberapa metafora dalam satu aplikasi
• Metafora tidak harus selalu ada
• Gunakan metafora yang akan dimengerti oleh lebih banyak user
• Beberapa metafora belum tentu dikenal pada kebudayaan yang berbeda
Eleutheromania 