Paradigma dan

Desain Dasar Interaksi

Pertemuan 07

Paradigma adalah seperangkat asumsi,konsep, nilai dan praktik yang di terapkandalam memandang realitas dalam sebuahkomunitas yang sama khususnya dalamdisiplin intelektual.

• Pada tahun 1940-an dan 1950-an, komputer berkembang dengan sangat pesat dalam bidang teknologi perangkat keras.

• Penyiaran ulang mekanika telah digantikan oleh tabung hampa (Vacum Tube).

• Tabung itu digantikan oleh transistor• Transistor terintegrasi oleh chip/IC• Berkembang menjadi LSI (Large Scale

Integrated Circuit) dan sekarang menjadi VLSI (Very Large Scale Integrated Circuit)

Paradigma Paradigma Pada Pada

InteraksiInteraksi

Video Display Units - VDU• Pada pertengahan 1950-an para pene-liti

melakukan uji coba dengan menam-pilkan dan memanipulasi informasi yang mungkin dari komputer dalam sebuah gambar di video display unit.

• Layar peraga ini dapat menyediakan lebih banyak sarana dibandingkan hasil cetakan komputer

• Aplikasi ini pertama kali diperagakan pada aplikasi militer, khususnya di Semi-Automatic Ground Environment (SAGE) proyek dari Angkatan Udara Amerika.

Paradigma Paradigma Pada Pada

InteraksiInteraksi

Personal Computing - PC • Programming toolkits menyedia-kan

alat untuk program menghitu-ng yang baik.

• Dasawarsa tahun 1970-an tenaga komputer mengarah ke banyak kalangan

• Salah satunya alat ini dapat diakses dengan bahasa pemrograman grafis untuk memanggil bahasa LOGO.

Paradigma Paradigma Pada Pada

InteraksiInteraksi

Sistem Window dan Interface WIMP

• Dengan munculnya dan berhasilnya pemasaran PC.

• Penekanan untuk meningkatkan kegunaan teknologi komputing yang memusatkan pada pengguna tunggal dan tersam-bung dalam sebuah dialog dengan komputer untuk menyelesaikan beberapa pekerjaan.

Paradigma Paradigma Pada Pada

InteraksiInteraksi

• Interaksi yang berbasis di windows, ikon-ikon, menu-menu dan petunjuk-petunjuk – tampilan WIMP - ialah hal yang biasa sekarang ini.

• Alat interaksi ini terlebih dulu muncul di commercial marketplace pada April 1981, waktu Xerox Corporation diperkenalkan oleh 8010 Star Information System.

• Tetapi banyak teknik interaksi mendasari sistem window ini yang dipergunakan pada kelompok Engelbart di NLS dan di Xerox PARC.

Paradigma Paradigma Pada Pada

InteraksiInteraksi

Metaphor• Metapora di artikan sebagai kiasan sebuah

objek yang di gambarkan seolah-olah miripdengan benda lain. Secara umum istilahmetaforik dapat diartikan sebagai gambaranvisual (simbol) terhadap sesuatu atributperangkat lunak yang disesuaikan denganfungsi atribut tersebut.

• Misal, ikon berkas pada windows explorermerujuk pada folder yang terdapat dalamsebuah sistem. Atau ikon Tong Sampah yang digunakan sebagai folder atau tempatpembuangan bagi file-file yang di anggap tidakdi butuhkan lagi.

• Metapora juga digunakan untuk mengajarkankonsep baru, dimana konsep tersebut telah dipahami sebelumnya, misalnya spreadsheetadalah metafora dari akuntansi.

Paradigma Paradigma Pada Pada

InteraksiInteraksi

Ikon tong sampah digunakan sebagaimetapora dari folder yang berfungsimenampung file yang di anggap tidakberguna

Ikon berkas digunakan untuk

merujuk folder yang terdapat pada suatu

sistem

Ikon kertas digunakan sebagai

metafora dari file berisi infosmasi

berupa teks

Manipulasi Langsung• Di awal 1980-an, para perancang mulai melihat

bahwa produk mereka mrnjadi populerdengan menggunakan konten visual.

• Ben Shneiderman pada tahun 1982 membandingkan sistem interaktif berbasis grafis seperti Sketchpad dan Xerox Alto & Star. Dia menyoroti fitur berikut yang memanipulasi langsung interface: 1. Visibilitas objek yang menarik2. Meningkatkan aksi di interface dengan umpan balik 3. Membalikkan semua aksi, agar pemakai dianjurkan

menjelajahi tanpa terkena sangsi 4. Keakuratan sintak semua aksi, agar setiap aksi si

pemakai adalah operasi sebuah aturan yang legal 5. Penggantian dari penguasaan bahasa yang kompleks

dengan aksi untuk menggerakkan secara langsung benda yang terlihat (dinamakan manipulasi langsung).

Paradigma Paradigma Pada Pada

InteraksiInteraksi

Bahasa vs Aksi• Interface manipulasi langsung dapat membuat

beberapa tugas menjadi lebih mudah dan melaksanakannya dengan baik itu benar.

• Sebuah tampilan diproyeksikan untuk manipulasi langsung dimana mengganti interface agar user tertarik akan hal itu.

• Paradigma aksi dan bahasa tidak dapat dipisahkan.

• Sebuah kombinasi yang menarik atas dua kejadian di dalam programming dengan contoh kalau seorang pemakai bisa melakukan beberapa tugas rutin di paradigma aksi dan sistem record sebagai prosedur umum.

• Dalam arti, sistem ialah tafsiran dari aksi user sebagai bahasa yang kemudian bisa diikuti.

Paradigma Paradigma Pada Pada

InteraksiInteraksi

The World Wide Web• Mungkin perkembangan baru yang

paling berarti di perkomputeran interaktif ialah the World Wide Web atau WWW.

• WEB dibangun untuk menyempunakan internet, dan menawarkan kemudahan pengguna

• Sebagian besar WWW menggunakan graphical interface

Paradigma Paradigma Pada Pada

InteraksiInteraksi

Ubiquitous Computing• Ada suatu penambahan angka dari

contoh computing devices di skala berbeda ini.

• Komputer laptop adalah tentu ada dimana-mana, tapi komputer tablet atau prototipe penelitian, seperti storybook interaktif mulai bermunculan

• Ada berbagai bentuk layar yang resolusinya tinggi dan masih sebagi-an besar dipergunakan sebagai pre-sentasi pertunjukan alat atau pesan tetap

Paradigma Paradigma Pada Pada

InteraksiInteraksi

Prototipe Penelitian

halaman-skala interactive

PDA

Mobile Phone

Pocked-size elektronic bible

• Kenali para pemakai disain• Siapa saja para pemakai disain• Kemungkinan tidak seperti

kita• Berkomunikasi dengan

pemakai• Memantau para pemakai• Gunakan imajinasi

Fokus Fokus Pemakai / Pemakai /

UserUser

• Skenario adalah cerita untuk disain.

• Skenario memaksa kita untuk memikirkan desain secara detail dan catatan masalah potensial sebelum disain itu dibuat.

• Skenario dapat membantu untuk menjelaskan bahwa disain akan membuat pengguna lebih mengerti.

SkenarioSkenario

• Sebagai tambahan, skenario dapat digunakan untuk : Komunikasi dengan yang lain Komunikasi dengan disainer yang lain,

beberapa klien, atau para pemakai Validasi model lain Sebuah skenario yang detail dapat

meyajikan tampilan yang lebih formal seperti beberapa model tugas atau dialog dan model navigasi Menyampaikan dinamika Gambaran individu untuk memberikan

sebuah pengertian dari yang dilihat seperti apa sebuah sistem, tetapi bukan bagaimana suatu sistem akan bekerja.

SkenarioSkenario

• Ketika kita berfokus pada objek dari disain tidak hanya sebuah sistem komputer atau perangkatnya, tetapi teknikal-sosial intervensi secara keseluruhan harus diperhatikan.

• Bagaimanpun kemajuan disain, dapat dinilai dan disain lebih terukur lagi.

• Ibaratkan diri kita menggunakan sebuah pengolah kata. Kita akan melakukan beberapa kegiatan tertentu dan mengatur sesuai dengan tujuan.

Desain Desain NavigasiNavigasi

• Sekarang kita memfokuskan kedalam sistem komputer saja. Anda dapat berinteraksi pada beberapa tingkatan yaitu :– Widgets, Pilihan yang sesuai dengan

susunan kata dalam tombol dan menu yang akan membantu untuk mengetahui bagaimana cara menggunakan pilihan tersebut.

– Layar atau jendela, Untuk menentukan ke dalam layar, dan pengelompokan tombol yang logis agar dapat digunakan.

Desain Desain NavigasiNavigasi

• Sekarang kita memfokuskan kedalam sistem komputer saja. Anda dapat berinteraksi pada beberapa tingkatan yaitu :– Navigasi dalam aplikasi, Harus

mengerti apa yang akan terjadi ketika suatu tombol ditekan, untuk hal tersebut maka dilakukan interaksi.

– Lingkungan, Mesin pengolah kata telah membaca dokumen dari disk, mungkin beberapa pada pengontrol jaringan, Anda dapat menukar beberapa aplikasi, mungkin memotong, atau melekatkannya.

Desain Desain NavigasiNavigasi

• Disain navigasi adalah gaya atau layar utama di dalam suatu sistem dan bagaimana mereka berinteraksi.

• Untuk mendapat suatu gagasan, langkah awal mempertimbangkan struktur dari suatu aplikasi :– Siapa yang akan menggunakan

aplikasi tersebut?– Bagaimana cara mereka

memikirkan hal itu?– Apa yang akan mereka lakukan

dengan hal itu?.

Desain Desain NavigasiNavigasi

• Pada bagian ini kita akan mempertimbangkan dua macam isu utama:–Struktur lokal

melihat dari satu tampilan atau halaman luar

–Struktur Globalstruktur dari lokasi, bergerak diantara layar

Desain Desain NavigasiNavigasi

• Untuk mencapai suatu keberhasilan, tiap bagian dari sistem atau tiap tampilan yang dibutuhkan untuk memberikan pemakai pengetahuan yang cukup dari apa yang dilakukan untuk meraih suatu keberhasilan.

• Untuk mendapatkan sesuatu yang telah dimulai, pada bagian ini ada empat hal yang dibutuhkan ketika memperhatikan suatu halaman web tunggal, bagian atau tampilan dari suatu perangkat.– Ketahui Dimana kamu berada– Ketahui Apa yang kamu dapat lakukan– Ketahui kemana kamu pergi – atau apa yang

akan terjadi– Ketahui dimana telah terjadi – atau apa yang

telah terjadi

Struktur Struktur LokalLokal

• Tampilan, halaman web atau tampilan perangkat yang membuat jelas dimana Anda berada atau bagian dari sistem.

• Selain itu penting juga untuk mengetahui apa yang dapat Anda lakukan – apa yang dapat diklik untuk ke suatu tempat.

• Untuk mengetahui kemana Anda pergi ketika Anda mengklik sebuah tombol atau apa yang akan terjadi.

• Dalam sebuah sistem informasi, ada suatu keterkaitan untuk mengetahui dimana telah terjadi. Ini membantu Anda untuk mengerti navigasi dari sistem informasi Anda.

Struktur Struktur LokalLokal

• Secara keseluruhan struktur dari sebuah aplikasi merupakan tampilan, halaman atau bagian perangkat link ke halaman yang lainnya.

• Untuk mengorganisir sebuah sistem dengan menggunakan beberapa format dari hierarki.

• Dalam Interaksi Manusia dan Komputer kata ‘dialog’ digunakan untuk mengacu kepada pola tujuan dari interaksi antara pemakai dan sebuah sistem.

• Interaksi/dialog manusia dengan komputer secara keseluruhan merupakan pola dari pergerakan antara bagian utama dari sebuah perangkat atau jendela dalam sebuah aplikasi PC, tapi secara detail berbeda pada saat proses berlangsung.

Struktur Struktur GlobalGlobal

Ada beberapa implikasi:

Isu gaya, Kita sebaiknya secara normal menyesuaikan terhadap standar tempat, seperti posisi untuk menu dalam sebuah aplikasi PC, untuk memastikan konsistensi antar aplikasi. Contohnya, dalam diri para pemain film kita usulkan sebaiknya menggunakan standar yang sesuai dengan jadwal, bermain dan berhenti sementara.

Isu fungsional, Dalam sebuah aplikasi PC kita membutuhkan ketersediaan untuk berinteraksi dengan file-file, membaca standar format dan ketersediaan untuk mengatur potongan adegan (cut) dan melanjutkannya kembali (paste).

Isu navigasi Kita mungkin membutuhkan dorongan hubungan antar aplikasi.

Ketenangan Ketenangan Yang Lebih Yang Lebih

LuasLuas

Prinsip dasar pada tingkatan layar tanggapan pengguna dalam area yang berbeda dari disain interaksi:Pertanyaan Apakah yang pengguna lakukan?

PemikiranApakah informasi yang dihasilkan?Apakah perbandingan yang mungkindibutuhkan pemakai untuk membuatsebuah sistem infotmasi?

Disain Format mengikuti fungsi: interaksi yang diperlukan untuk mengendalikan tampilan.

Desain Desain Layar dan Layar dan TampilanTampilan

1. Peralatan untuk tampilan

Kita mempunyai sebuah peralatan visual yang tersedia untuk membantu kita menyarankan kepada pemakai desain untuk membaca dan berinteraksi dengan layar atau peralatan.Pengelompokan dan strukturPesananan dari kelompok dan materinyaDekorasiPerataanJarak antar ruang

2. Tindakan pemakai dan kontrol•Memasukan informasi•Mengetahui apa yang dilakukan•Mengusahakan suatu hal

Desain Desain Layar dan Layar dan TampilanTampilan

3. Penampilan yang sesuai •Mempresentasikan informasi•Estetika dan kegunaan•Membuat sebuah media dengan warna & 3 dimensi•Lokalisasi/internasionalisasi

Desain Desain Layar dan Layar dan TampilanTampilan

Iterasi dan pembuatan prototipe

Iterasi dan pembuatan prototipe adalah diterima universal melalui pendekatan ‘praktek terbaik’ untuk disain intraksi.

Bagaimanapun, ada beberapa kesukaran utama dari pembuatan prototipe, jarang dinyatakan dalam literatur.

Pembuatan prototipe adalah sebuah contoh dari apa yang dikenal sebagai pendekatan

Jika Anda memulai disain dengan konsep disain yang buruk Anda mungkin berakhir pada sesuatu ide buruk

Dari permasalahan tersebut kita dapat melihat dua hal dalam urutan untuk membuat metode pembuatan prototipe :1.Memahami apa yang salah dan bagaimana

meningkatkannya.

2.Memulai dengan awal yang baik

Seorang perancang yang baik mungkin mengira suatu disain awal yang baik berdasarkan pada pertimbangan dan pengalaman.