Archive for April 2014

DESAIN

1 Comment »

http://windows8-drivers.com/wp-content/uploads/2012/07/Metro-Windows-8.jpg

PRINSI-PRINSIP DESAIN ANTARMUKA
1. Merefleksikan model mental user : Merefleksikan kombinasi pengalaman dunia riil, pengalaman dari software lain dan penggunaan komputer secara umum.
2. Explicit and Implicit Action : Explicit Action adalah kondisi yang jelas dalam memberikan petunjuk untuk memanipulasi suatu obyek. Implicit Action adalah kondisi yang hanya memberikan kesan visual untuk memanipulasi obyek.
3. Direct Manipulation : User mendapatkan dampaknya dengan segera setelah melakukan suatu aksi.
4. User Control : Mengijinkan user mengontrol dan menginisialisasi aksi.
5. Feedback and Communication : Selalu memberitahukan user apa yang terjadi dari suatu aksi.
6. Consistency : User dapat mentransfer pengetahuan dan kemampuan dari suatu aplikasi ke aplikasi lain.
7. WYSYWIG (What You See Is What You Get) : Tidak ada perbedaan antara yang dilihat di layar dengan hasil outputnya.
8. Aesthetic Integrity : Informasi diorganisasikan dengan baik dan konsisten dengan prinsip desain visual yang baik.

IDE DALAM MEMBUAT DESAIN
Dalam membuat desain baik itu desain logo ataupun desain lainnya, yang sangat penting dalam mengerjakan desain idea tau imajinasi. Meniru suatu desain lebih mudah dari pada membuat suatu ide yang baru. Karena itu seorang didesainer dituntut untuk kreatif dalam membuat suatu desain.
Ide dengan berbagai macam cara kemunculannya, sesungguhnya berasal dari dalam diri kita sendiri. Seluruh hidup kita dipenuhi dengan ide dan potensi lahirnya ide baru. Setiap hari kita ber-imajinasi, bermimpi, berpikir, berumpama, membuat keputusan, melamun, dan banyak aktifitas-aktifitas yang membawa kita untuk menemukan ide tanpa kita sadari.

http://speckycdn.sdm.netdna-cdn.com/wp-content/uploads/2014/04/why_worrying_about_idea_stealing_is_pointless_02.jpg

Salah satu sumber ide adalah imajinasi. Imajinasi, menurut Jack Stoops dan Jerry Samuelson, adalah kekuatan dari dalam diri kita yang memperbolehkan kita untuk mengalami apa yang telah kita alami, apa yang akan kita alami, dan apa yang tidak akan kita alami; imajinasi dapat menembus batasan ruang, waktu dan realitas. Imajinasi dapat membawa kita ke alam fantasi melalui dunia mimpi, yang sebenarnya adalah cermin dari keinginan dan pemikiran kita yang paling dalam. Kita tidak harus tidur dan bermimpi terlebih dahulu untuk dapat memperoleh imajinasi, tetapi kita juga dapat berimajinasi dalam dunia sadar. Imajinasi sangatlah penting bagi seorang seniman, baik seni murni maupun seni terapan, karena imajinasi tidak semata-mata gambaran yang hanya berupa illusi, namun imajinasi dapat membuahkan ide di dalam pikiran kita.

CONTOH DESAIN DALAM KEHIDUPAN SEHARI-HARI
1. Advertising (Periklanan)
Periklanan merupakan salah satu penggunaan yang paling menguntungkan grafis, seniman sering melakukan  pekerjaan  iklan atau  mengambil iklan potensial ke account saat membuat seni, untuk meningkatkan peluang penjualan karya seni. Sebagai contoh : Membuat kartu nama, Desain Kaos (T-Shirt).
2. Business (Bisnis)
Grafis yang umum digunakan dalam  bisnis dan ekonomi untuk membuat diagram keuangan dan tabel. Istilah Usaha Graphics mulai dipakai pada akhir tahun 1970, ketika komputer pribadi menjadi mampu menggambar grafik dibandingkan menggunakan format tabel. Bisnis Grafik dapat digunakan untuk menyoroti perubahan selama jangka waktu tertentu.
3. Political (Politik)
Penggunaan grafis untuk terang-terangan politik (kartun, grafiti, seni poster, desain bendera,dll) adalah praktek berabad-abad lama yang berlangsung hingga hari ini di setiap bagian dunia.  “The mural Irlandia Utara” adalah salah satu contohnya. Seni melukis di dinding atau tembok yang menceritakan konflik sejarah selama 35 tahun terakhir di Irlandia Utara.
4. Education (Pendidikan)
Grafis yang banyak digunakan adalah dalam buku teks , terutama yang menyangkut mata pelajaran seperti geografi, sains, dan matematika untuk menggambarkan teori dan konsep, seperti anatomi manusia . Diagram juga digunakan untuk label foto dan gambar. Dalam rangka edukasi, grafis berfungsi secara efektif sebagai bantuan pendidikan dan pelajar harus mampu menafsirkannya dengan baik.
5. Film and animation (Film dan animasi)
Komputer grafis sering digunakan dalam sebagian besar film berfitur baru, terutama bagi film dengan anggaran yang besar. Film-film yang banyak menggunakan komputer grafis diantaranya ada  Doraemon, Upin -Ipin , Harry Potter, Spider Man dan masih banyak lagi lainnya.

DESAIN GRAFIK
Desain Grafik berasal dari 2 buah kata yaitu Desain dan Grafik, kata Desain berarti proses atau perbuatan dengan mengatur segala sesuatu sebelum bertindak atau merancang. Sedangkan Grafis (dari bahasa Yunani graphikos) adalah titik atau garis yang berhubungan dengan cetak mencetak. visual  pada permukaan, seperti dinding, kanvas, layar komputer, kertas dll. Jadi dapat dikatakan Desain Grafik adalah  kombinasi kompleks antara kata-kata, gambar, angka, grafik, foto dan ilustrasi yang membutuhkan pemikiran khusus dari seorang individu yang bisa menggabungkan elemen-elemen tsb, sehingga dapat menghasilkan/ menginformasikan pesan yang seefektif mungkin dalam bidang seni desain.

Filosofi Desain
Sebuah filosofi desain adalah panduan untuk membantu membuat pilihan saat merancang seperti ergonomi , biaya,, fungsi ekonomi dan metode re-desain. Sebuah contoh dari filosofi desain adalah "perubahan dinamis" untuk mencapai tampilan elegan atau bergaya yang Anda butuhkan.

Prinsip Desain Grafis
Desain grafis memiliki enam buah prinsip yang mendasar. Prinsip-prinsip tersebut adalah sebagai berikut :
1.Metaphor (Metafora)
Metaphor atau metafora adalah aplikasi dari nama atau deskripsi istilah objek lain yang tidak dapat diartikan secara harafiah. Menghubungkan presentasi dan elemen-elemen visual dengan item-item yang berkaitan. Metafora akan membuat para pengunjung seolah-olah berada di tempat yang sebenarnya, atau bisa dikatakan juga bahwa metafora dibuat mirip seperti tempat yang dikunjungi. Contohnya, website suatu toko online yang memiliki metafora, dimana pengunjung dibawa ke tempat seolah-olah mereka benar ada di toko online tersebut.
2.Clarity (Kejelasan)
Harus ada alasan yang kuat/masuk akal dan jelas mengapa menggunakan setiap elemen yang berada dalam suatu interface yang kita buat,contohnya dalam peletakan suatu button,pembuat harus memiliki alasan mengapa diletakkan di tempat tersebut. Penggunaan elemen yang lebih sedikit akan lebih baik.
3.Consistency (Ketetapan)
Konsistensi dalam tampilan, pewarnaan, gambar, ikon, typography (model form yang digunakan pada suatu website), teks, dll. Harus ada konsistensi baik dalam layar maupun antar layar. Dan harus selalu ada metafora dimanapun juga. Setiap platform mungkin memiliki panduannya.
4. Alignment (Perataan)
Untuk perataan dapat digunakan rata kiri, kanan atau tengah. Pada umumnya suatu teks pada website dimulai dari kiri atas (left alignment), dimana left alignment akan mengijinkan mata untuk menguraikan tampilan dengan lebih mudah. Selain itu dengan menggunakan bantuan garis akan membantu dalam hal perataan. Sembunyikan garis horizontal dan vertical untuk membantu mengalokasikan komponen window/jendela. Garis juga membantu menghubungkan hal-hal yang berhubungan dan memudahkan perataannya.
5. Proximity
Item-item yang berkaitan yang ditampilkan bersama pasti memiliki hubungan karena jarak yang jauh mengimplikasikan bahwa tidak ada hubungan antara item-item tersebut.
6. Contrast (Keserasian Tampilan)
Keserasian tampilan yang akan membuat pengunjung web tertarik pada web tsb. Kontras juga dapat memandu mata pengunjung untuk melihat keseluruhan interface. Keuntungan dari keserasian adalah untuk memperkuat fokus atau untuk memperkuat suatu interface. Kontras digunakan untuk membedakan aktifitas kendali. Juga dapat digunakan untuk men-set item yang paling utama. Item yang paling utama diberi highlight. Dengan mempergunakan geometri dapat membantu pengurutan. Kontras juga mendukung skimming secara cepat.

Tipografi (Typography)
berasal dari kata Yunani Typos = bentuk dan graphein = menulis, merupakan suatu ilmu dalam memilih dan menata huruf dengan pengaturan penyebarannya pada ruang-ruang yang tersedia, menggunakan gabungan bentuk huruf cetak, ukuran huruf, ketebalan garis, spasi antar huruf, garis pandu dan jarak antar baris. Sehingga dapat menolong pembaca untuk mendapatkan kenyamanan membaca semaksimal mungkin. Mengapa Tipografi penting untuk dipahami dalam Desain Grapik ? Karena Tipografi (pengaturan huruf) mempengaruhi banyak hal : sebagai contoh estetika dari tampilan penulisan blog, kesan yang di tampilkan blog, hingga yang terpenting keterbacaan blog. Jika Blog yang pengaturan hurufnya baik, kesan yang di tampilkan baik, tingkat keterbacaannya tinggi. Maka, secara tidak langsung  pengunjung akan nyaman dalam membaca konten blog anda dan betah membacanya.


Sumber:


Read more ...

GUI (Graphical User Interface)

1 Comment »

Hai, kali ini saya ingin membahas tentang GUI. Apa sih GUI? Apa saja kelebihan dari GUI tersebut? Dan contoh aplikasi apa saja yang berbasis GUI? Mari kita bahas..

Pengertian GUI
GUI adalah singkatan dari Graphical User Interface. Pada komputer terdapat GUI atau antarmuka pengguna secara grafis. Istilah ini bukan hal yang lumrah pada saat awal kemunculan komputer. Namun setelah komputer generasi keempat mulai diciptakan, munculnya televisi berwarna (yang mendorong pada penciptaan layar monitor berwarna) serta evolusi pada perangkat penampil gambar (graphic adapter atau graphic card atau video card) membuat komputer mulai mendapatkan suatu sistem baru.


Secara sederhana, GUI adalah suatu media virtual yang dapat membuat pengguna memberikan perintah tertentu pada komputer tanpa mengetik perintah tersebut, namun menggunakan gambar yang tersedia. Pengguna tidak mengetikkan perintah seperti pada komputer dengan Shell atau teks. Dengan GUI, perintah dapat dikonversi menjadi ikon dalam layar monitor yang dapat diklik untuk memulai fungsinya. Sebagai contoh, tentu anda paham dengan sebuah ikon berbentuk kertas dengan huruf W diatasnya kan? Itu adalah ikon untuk menjalankan Microsoft Word, sebuah aplikasi yang digunakan untuk mengetik. Atau anda pasti familiar dengan tombol di pojok kiri bawah, yakni tombol bertuliskan Start atau logo Windows itu. Segala sesuatu yang anda lihat di Komputer anda saat ini adalah GUI.

Kelebihan GUI
Dengan adanya perkembangan dari GUI ini, tidak memungkiri bahwa penggunaan GUI ini cukup sempurna. Hal ini dapat diketahui dengan adanya kelebihan dan kekurangan pada GUI, diantaranya sebagai berikut:

Kelebihan dari GUI:

  1. Tampilan GUI memiliki desain yang baik
  2. Kemudahan berinteraksi antara user dengan komputer
  3. Penggunaan GUI lebih mudah bagi user
  4. Resolusi gambar dari GUI yang tinggi
Contoh Aplikasi Berbasis GUI
Aplikasi-aplikasi yang ada saat ini hampir semua sudah berbasis GUI, tidak hanya di komputer saja bahkan mencakup ke piranti-piranti yang sehari-hari kita pakai. Di komputer, aplikasi yang berbasis GUI ada banyak sekali, contohnya adalah Ms Word yang saya pakai untuk mengetik tulisan ini atau bisa juga Windows Media Player, Paint, Notepad, Google Chrome, berbagai jenis game, dan masih banyak lagi.

Windows Media Player
Game OSU!

Aplikasi berbasis GUI pada peralatan sehari-hari misalnya adalah mesin ATM. Mesin ini mempunyai tampilan antarmuka (biasanya warna biru dan banyak perintah-perintah) yang mempermudah penggunanya mengoprasikan mesin ini.

http://stat.ks.kidsklik.com/statics/files/2012/08/134584595918358322_300x225.jpg

Kita bisa membuat aplikasi berbasis GUI sederhana dengan menggunakan aplikasi Delphi atau Visual Basic. Disini saya menggunakan Delphi 7.

Aplikasi dibuat menggunakan Delphi 7 by me



Read more ...

Interface

No Comments »

PENGERTIAN INTERFACE
Dalam berinteraksi dengan komputer, pertama kali user akan berhadapan dengan perangkat keras komputer. Untuk dapat berinteraksi dengan software, user dihadapkan dengan seperangkat alat seperti keyboard, monitor, mouse, joystick, dan lain-lain, dan user harus dapat mengoperasikan alat-alat tersebut. Selanjutnya, user berhadapan dengan macam-macam tampilan menu, perintah, atau macam-macam ikon. Peralatan, perintah, ikon dan lain-lain itu dikenal dengan nama interface (antarmuka). Interface ini merupakan lapisan pertama yang langsung bertatap muka dengan pemakai.

http://www.hcltech.com/sites/default/files/ui1.jpg

TUJUAN INTERFACE
Tujuan sebuah interface adalah mengkomunikasikan fitur-fitur sistem yang tersedia agar user mengerti dan dapat menggunakan sistem tersebut. Dalam hal ini penggunaan bahasa amat efektif untuk membantu pengertian, karena bahasa merupakan alat tertua (barangkali kedua tertua setelah gesture) yang dipakai orang untuk berkomunikasi sehari-harinya. Praktis, semua pengguna komputer dan Internet (kecuali mungkin anak kecil yang memakai komputer untuk belajar membaca) dapat mengerti tulisan.
Meski pada umumnya panduan interface menyarankan agar ikon tidak diberi tulisan supaya tetap mandiri dari bahasa, namun elemen interface lain seperti teks pada tombol, caption window, atau teks-teks singkat di sebelah kotak input dan tombol pilihan semua menggunakan bahasa. Tanpa bahasa pun kadang ikon bisa tidak jelas maknanya, sebab tidak semua lambang ikon bisa bersifat universal.
Meskipun penting, namun sayangnya kadang penggunaan bahasa, seperti pemilihan istilah, sering sekali dianggap kurang begitu penting. Terlebih dari itu dalam dunia desain situs Web yang serba grafis, bahasa sering menjadi sesuatu yang nomor dua ketimbang elemen-elemen interface lainnya.

TIPE-TIPE INTERFACE
Interface merupakan salah satu bagian yang terpenting dari sistem. Interface sendiri adalah sistem yang dirancang untuk mengolah input dan output dari data. Seperti contohnya interface dibuat untuk pembentukan output laporan yang dapat dipreview, diprint, export/import (excel, word, barcode, text dll ).
Interface ada dua jenis, yaitu :
1. Graphical User Interface (GUI) : Menggunakan unsur-unsur multimedia (seperti gambar, suara, video) untuk berinteraksi dengan pengguna.
2.  Text-Based : Menggunakan syntax/rumus yang sudah ditentukan untuk memberikan perintah.

TIPE-TIPE INTERAKSI
1.  Direct manipulation – pengoperasian secara langsung : interaksi langsung dengan objek pada layar. Misalnya delete file dengan memasukkannya ke trash. Contoh: Video games. Kelebihan :  Waktu pembelajaran user sangat singkat, feedback langsung diberikan pada tiap aksi sehingga kesalahan terdeteksi dan diperbaiki dengan cepat. Kekurangan :  Interface tipe ini rumit dan memerlukan banyak fasilitas pada sistem komputer, cocok untuk penggambaran secara visual untuk satu operasi atau objek. 
2.  Command language – perintah tertulis : Menuliskan perintah yang sudah ditentukan pada program. Contoh: operating system. Kelebihan : Perintah diketikan langsung pada system. Misal UNIX, DOS command. Bisa diterapkan pada terminal yang murah.Kombinasi perintah bisa dilakukan. Misal copy file dan rename nama file. Kekurangan : Perintah harus dipelajari dan diingat cara penggunaannya, tidak cocok untuk user biasa. Kesalahan pakai perintah sering terjadi. Perlu ada sistem pemulihan kesalahan.Kemampuan mengetik perlu.
3.  Natural language – perintah dengan bahasa alami : Menggunakan bahasa alami untuk mendapatkan hasil. Contoh: search engine di Internet. Kelebihan: Perintah dalam bentuk bahasa alami, dengan kosa kata yang terbatas (singkat), misalnya kata kunci yang kita tentukan untuk dicari oleh search engine. Ada kebebasan menggunakan kata-kata. Kekurangan: Tidak semua sistem cocok gunakan ini. Jika digunakan maka akan memerlukan banyak pengetikan.

Sumber:
http://heriyanto-annafi.blogspot.com/2013/04/tujuan-interface-user-perbandingan.html
http://saly-enjoy.blogspot.com/2013/04/interface.html
Read more ...

Interaksi Manusia dan Komputer

1 Comment »

PENGERTIAN IMK
IMK atau Interaksi Manusia dan Komputer (human–computer interaction) adalah disiplin ilmu yang mempelajari hubungan antara manusia dan komputer yang meliputi perancangan, evaluasi, dan implementasi antarmuka pengguna komputer agar mudah digunakan oleh manusia. Ilmu ini berusaha menemukan cara yang paling efisien untuk merancang pesan elektronik. Sedangkan interaksi manusia dan komputer sendiri adalah serangkaian proses, dialog dan kegiatan yang dilakukan oleh manusia untuk berinteraksi dengan komputer yang keduanya saling memberikan masukan dan umpan balik melalui sebuah antarmuka untuk memperoleh hasil akhir yang diharapkan. Sistem harus sesuai dengan kebutuhan manusia dan dirancang berorientasi kepada manusia sebagai pemakai. Sistem harus sesuai dengan kebutuhan manusia dan dirancang berorientasi kepada manusia sebagai pemakai.

 asd
https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEi4E3cbGledxNSsRB68q7D5l3KpjqflVssrTbBdJqyvGYTrKAAGUVGTkupnWxywXc8kGyfHEv9hTBFeYjYmyzKsytZI-FCOV0nl8Fke1x65Svqu3xi2q6MiYcvZocX7Mar43ogsdFrA46N8/s1600/interaction.jpg

SIAPA YANG TERLIBAT DALAM IMK?
IMK merupakan subyek multi disiplin yang melibatkan berbagai bidang ilmu. Designer sistem interaktif yang ideal harus memiliki keahlian diberbagai bidang seperti:
  1. Psikologi dan ilmu kognitif yang memberikan dasar pengetahuan mengenai persepsi user,kognitif, kemampuan memecahkan masalah.
  2. Ergonomi yang memberikan dasar pengetahuan mengenai kemampuan/karakteristik fisik user.
  3. Sosiologi yang membantu pemahaman mengenai konsep interaksi secara luas.
  4. Ilmu komputer dan teknik rekayasa untuk membangun teknologi yang dibutuhkan.
  5. Bisnis yang memberikan pengetahuan agar mampu memasarkan hasil.
  6. Desain grafis agar mampu untuk menghasilkan presentasi yang efektif mengenai interface.
  7. Technical writing agar mampu membuat manual.
  8. Dan lain-lain.


APA KONSEP DASAR IMK?
  1. WYSIWYG (What You See is What You Get) : merupakan salah satu prinsip dasar dalam mendesain interaksi antarmuka aplikasi yang ramah pengguna.
  2. Fokus awal pada pengguna dan tugas : Yaitu menetapkan banyaknya pengguna yang dibutuhkan untuk melakukan tugas-tugas dan menentukan siapa pengguna yang tepat untuk melakukannya.
  3. Pengukuran empiris : Menguji antarmuka awal dengan pengguna yang nyata yang selalu kontak dengan antarmuka pada dasar harian.
  4. Desain iteratif (berulang) : Setelah menentukan pengguna, tugas, dan pengukuran empiris, selanjutnya melakukan desain iteratif berikut dengan langkah :
·         Desain antarmuka
·         Pengujian
·         Hasil Analisa
·         Pengulangan


PRINSIP USABILITY
Prinsip Usability pada mata kuliah Interaksi Manusia dan Komputer adalah suatu masalah optimasi penggunaan sistem oleh pengguna. Sistem akan bekerja dengan baik apabila dipergunakan secara maksimal oleh pengguna sehingga semua kemampuan sistem dapat termanfaatkan secara maksimal.


PERBANDINGAN DESAIN YANG BAIK DAN BURUK
Perhatian utama dari desain interaksi adalah untuk menciptakan produk interaktif yang mudah digunakan. Dengan ini umumnya akan mudah di pelajari, efektif dalam penggunaan, and menyediakan pengalaman bagi pengguna. Tempat yang tepat untuk berpikir bagaimana dalam mendesain produk yang interaktif dan mudah digunakan adalah untuk membandingkan contoh dari desain yang baik dan buruk. Disini kita akan mulai dengan contoh yang buruk --pesan suara—yang biasanya digunakan di dalam banyak organisasi. Kemudian dibandingkan dengan sebuah mesin penjawab yang menunjukan desain yang baik.

http://xylem.aegean.gr/~modestos/mo.blog/wp-content/uploads/2010/01/interaction-design.jpg

Bayangkan skenario berikut ini, kamu sedang menginap di hotel selama 1 minggu, kamu lupa membawa hp dan ingin menggunakan fasilitas di hotel. Hotel punya sistem pesan suara untuk masing-masing ruangan. Untuk mengakses pesan, kamu harus membaca perintah selanjutnya. Langkah-langkahnya adalah :
  1. Tekan 491
  2. Tekan *, nomor kamar anda, dan #. Kemuidian akan muncul perintah-perintah selanjutnya.
Masalah yang ada di dalam sistem pesan suara tersebut:
  1. Menjengkelkan
  2. Membosankan
  3. Tidak efisien
  4. Dan masih banyak lagi.
Sementara dapat kita bandingkan dengan apabila kita menggunakan mesin penjawab, yaitu kita akan memperoleh kemudahan sebagai berikut :
  1. Mempunyai desain yang simpel tapi elegan
  2. Hanya butuh satu langkah untuk melakukan perintah
  3. Menyenangkan untuk digunakan
Mesin penjawab kelereng dirancang oleh Durrell Uskup di Royal College of Art London (digambarkan oleh Crampton-Smith, 1995). Salah satu tujuannya adalah untuk merancang sebuah sistem pesan yang mewakili dasar fungsionalitas dalam hal perilaku benda sehari-hari. Namun, penting untuk dicatat bahwa meskipun mesin penjawab kelereng adalah desain yang sangat elegan dan bermanfaat, tidak akan praktis dalam lingkungan hotel.


Sumber:
resume chapter 1-design interaktion.pdf
http://id.wikipedia.org/wiki/Interaksi_manusia-komputer
http://saly-enjoy.blogspot.com/2013/04/imk-interaksi-manusia-dan-komputer.html
http://affandymuradsite.blogspot.com/2013/04/interaksi-manusia-dan-komputer
Read more ...