IMK

Definisi UCD
UCD adalah desain user interface yang memfokuskan usability, karakteristik user, lingkungan, tasks, dan desain workflow dari suatu interface. UCD mengikuti rangkaian metode dan teknik analisis, desain, dan evaluasi mainstreamhardware, software, dan interface web.
Proses pada UCD merupakan proses yang berulang (iterative), dimana tahap desain dan evaluasi dibangun daritahap awal proyek hingga tahap implementasi

Tahapan dalam UCD antara lain:

Memahami kebutuhan user.
Mendeskripsikan kebutuhan user.
Merancang prototype sebagai alternatif.
Mengevaluasi perancangan.

Karakteristik dalam proses UCD:

Memahami user dan kebutuhannya.
Fokus pada user pada tahap awal desain dan mengevaluasi hasil
desain.
Mengidentifikasi, membuat dokumentasi dan menyetujui kegunaan
dan tujuan pengalaman user.
Perulangan hampir dapat dipastikan. Para perancang tidak pernah
berhasil hanya dalam satu kali proses.
Dalam bidang yang lain perancangan sebuah prototype biasanya berupa
model dalam skala kecil.
Contoh: Maket Banguna


Alat-alat Input & output
Dalam Perangkat Keras (Hardware) Komputer, terdapat 3 Buah Konsep perangkat keras,yakni:
Alat Input adalah alat-alat yang berfungsi memasukan data atau perintah kedalam komputer.Contoh dari alat input antara lain:
1.Keyboard
2.Mouse
3.Scanner
4.Joystick
5.Camera digital
6.Microphone
7.Digitizer
8.Touch Screen
9.Touch pad
10.Track ball
11.Light Pen
12.Handy cam
Alat Pemproses adalah alat-alat yang berfungsi mengolah data kedalam komputer setelah mengalami proses Input.Contoh dari alat pemproses adalah Processor
Alat Output adalah alat-alat yang berfungsi mengeluarkan data-data yang berbentuk informasi.Contoh dari alat Output adalah:
1.Monitor
2.Printer
3.Speaker
4.Proyektor

Desain grafis
Desain grafis adalah suatu bentuk komunikasi visual yang menggunakan gambar untuk menyampaikan informasi atau pesan seefektif mungkin. Dalam disain grafis, teks juga dianggap gambar karena merupakan hasil abstraksi simbol-simbol yang bisa dibunyikan. disain grafis diterapkan dalam disain komunikasi dan fine art. Seperti jenis disain lainnya, disain grafis dapat merujuk kepada proses pembuatan, metoda merancang, produk yang dihasilkan (rancangan), atau pun disiplin ilmu yang digunakan (disain).
Seni disain grafis mencakup kemampuan kognitif dan keterampilan visual, termasuk di dalamnya tipografi, ilustrasi, fotografi, pengolahan gambar, dan tata letak.
Seorang Desainer harus memiliki minimal 5 (lima) Dimensi Keilmuan yaitu :
1.Wawasan Teknologi
2.Wawasan Sains
3.Wawasan Seni
4.Wawasan Sosial Dan Budaya
5.Wawacan Filsafat Dan Etika
Software dalam Desain Grafis
Banyak sekali software-software yang digunakan dalam dunia Desain Grafis diantaranya adalah: Adobe Photoshop, Corel Draw, Ilustrator dan lainnya, sehingga seorang Desainer Grafis dapat memilih software andalannya dalam mengerjakan project Designnya.
Sedikit Artikel yang berkaitan dengan salah satu software Grafis – Adobe Photoshop…
Adobe Photoshop
Adobe Photoshop adalah software yang dibuat oleh perusahaan Adobe System, yang di khususkan untuk pengeditan foto atau gambar dan pembuatan effect. Perangkat lunak ini banyak digunakan oleh Fotografer Digital dan perusahaan iklan sehingga dianggap sebagai pemimpin pasar (market leader) untuk perangkat lunak pengolah gambar. Meskipun pada awalnya Photoshop dirancang untuk menyunting gambar untuk cetakan berbasis-kertas, Photoshop yang ada saat ini juga dapat digunakan untuk memproduksi gambar untuk World Wide Web. Beberapa versi terakhir juga menyertakan aplikasi tambahan, Adobe ImageReady, untuk keperluan tersebut.
Photoshop juga memiliki hubungan erat dengan beberapa perangkat lunak penyunting media, animasi, dan authoring buatan Adobe lainnya.
Kelebihan Adobe Photoshop
Adobe Photoshop mempunyai banyak fasilitas yang memungkinkan seorang Desainer menciptakan efek-efek tertentu dan bisa menggunakan banyak variasi dari fasilitas yang disediakan oleh Adobe Photoshop, beberapa diantaranya yaitu:
Membuat tulisan dengan effect tertentu.
Photoshop dapat mengubah bentuk tulisan menjadi lebih kreatif dan inovatif dengan tool effect yang ada didalamnya
Membuat tekstur dan material yang beragam.
Dengan langkah-langkah tertentu, seorang Desainer dapat membuat gambar misalnya daun, logam, air, dan bermacam gambar lainnya
Mengedit foto dan gambar yang sudah ada.
Dengan Photoshop kita dapat merubah gambar kita jelek menjadi bagus ataupun sebaliknya. Selain itu juga Photoshop dapat merubah foto seseorang menjadi sebuah gambar kartun. Atau dalam Design Grafis disebut vector and vexel.
Memproses materi Web.
Photoshop juga digunakan untuk keperluan web, misalnya: kompresi file gambar agar ukurannya lebih kecil, memotong gambar kecil-kecil (slice), dan membuat web photo gallery. Dengan Adobe Image Ready, gambar yang sudah ada bisa dibuat untuk keperluan web, misalnya menjadi rollover dan animasi GIF.
Kelemahan Adobe Photoshop
Kelemahan Adobe Photoshop dalam menciptakan Image adalah bahwa Adobe Photoshop hanya bisa digunakan untuk menciptakan Image yang statis, dan juga dengan berkembangnya versi Photoshop sekarang ini spesifikasi Komputer untuk menjalankan program Adobe Photoshop juga harus sudah tinggi dan yang pasti akan diimbangi oleh harga yang tinggi pula.
Daftar Software Desain Grafis
Ada beberapa software yang digunakan dalam desain grafis:
Desktop publishing
Adobe Photoshop
Adobe Illustrator
Adobe Indesign
Page Maker
Coreldraw
GIMP
Inkscape
Adobe Freehand
Adobe image ready
CorelDraw
Webdesign
Macromedia Dreamweaver
Microsoft Frontpage
Notepad
Adobe Photoshop
Audiovisual
Adobe After Effect
Adobe Premier
Final Cut
Adobe Flash, atau sebelumnya Macromedia Flash
Ulead Video Studio
Magic Movie Edit Pro
Power Director
Rendering 3 Dimensi
3D StudioMax
Maya
AutoCad
Google SketchUp
Light Wave
Blender




Terminologi Prototype
1.Prototype Horisontal
Sangat luas, mengerjakan atau menunjukkan sebagian  besar interface, tetapi ini dilakukan dengan cara yang licik.
2.Prototype Vertikal
Lebih sedikit aspek atau fitur dari interface yang disimulasikan, tetapi dilaksanakan dengan rincian yang sangat baik.
3.Early Prototyping
4. Late Prototyping
5.Low-fidelity Prototyping (prototype dengan tingkat ketepatan yang rendah)
Contoh (1) storyboard:
Digunakan di awal desain.
Biasanya digunakan dengan skenario, lebih terinci, dan dapat diputar ulang.
Kumpulan dari sketsa/frame individual.
menyajikan urutan inti cerita.
menunjukkan bagaimana kemungkinan user dapat mengalami peningkatan melalui setiap aktifitas.
Contoh (2) sketsa:
Sketsa sangat penting untuk low-fidelity prototyping.
Jangan takut dengan kemampuan menggambar.
Menyajikan “tampilan” yang kotor dan cepat dari interface, konsep desain, dll.
Contoh (3) “wizard-of-oz”:
User berpikir mereka berinteraksi dengan komputer, tapi developer lebih menanggapi hasilnya daripada sistemnya.
Biasanya dilakukan di awal desain untuk memahami apa yang diharapkan oleh user.

6.Mid-fidelity prototyping (prototype dengan tingkat ketepatan sedang)
Form skematik.
Navigasi dan fungsi yang disimulasikan  biasanya berbasis pada apa yang tampil pada layar atau simulasi layar.
Contoh tools yang digunakan: powerpoint, illustrator, dll.

7.High-fidelity prototyping (prototype dengan tingkat ketepatan yang tinggi)
Hi-fi prototype seperti sistem akhir.
Menggunakan bahan baku yang sama seperti produk akhir.
Tools umum yang digunakan: Macromedia Director, Visual Basic,  Flash, Illustrator.


Sketsa Prototype
1. Storyboard
Digunakan di awal desain, biasanya digunakan dengan skenario, lebih terinci, dan dapat diputar ulang. Kumpulan dari sketsa/frame bersifat individual juga menyajikan urutan inti cerita. Storyboard juga menunjukan bagaimana kemungkinana user dapat mengalami peningkatan melalui setiap aktifitas.





2. Sketsa
Sketsa sangat penting untuk low-fidelity prototipe. Dalam sketsa kita di haruskan untuk tidak takut dengan kemampuan menggambar kita. Sketsa menampilkan "tampilan" cepat dari interface, konsep desain, dll. Sketsa juga penting untuk pengetahuan user akan apa yang dia lihat jelas dalam apa-apa yang terdapat dalam sistem tersebut. Dengan kata lain sketsa merupakan gambar dasar sebelum di implementasikan kedalam bentuk nyata











3. Wizard-of-oz
 Wizard-of-oz berbentukan tampilan maket dan berinteraksi dengan pemakai, baik untuk mensimulasikan sistem yang sulit dibuat. Maket juga adalah suatu bentuk komunikasi kepada user dalam suatu bentuk bangunan yang akan di realisasikan nantinya. Jadi user dapat melihat bentuk awal sebelum melihat bentuk jadi nya nanti.





Referensi :
http://zheira83.files.wordpress.com/2009/04/prototipe.ppt

Prototyping Tools
1.Draw/Paint Program, contoh: Photoshop, Coreldraw
Menggambar setiap layar, baik untuk dilihat.
Prototype horisontal, tipis.
Adobe Photoshop.
2.Scripted Simulations/Slide Show, contoh: Powerpoint, Hypercard,  Macromedia Director, HTML.
Letakkan tampilan seperti storyboard dengan (animasi) perubahan diantaranya.
Dapat memberikan user catatan yang sangat spesifik.
Disebut chauffeured prototyping.
Macromedia Director.
3.Interface Builders, contoh: Visual Basic, Delphi, UIMX.
Tools untuk menampilkan jendela, kendali, dan lain-lain dari  interface.
Fitur yang baik
Mudah dikembangkan dan memodifikasi layar.
Mendukung jenis interface yang dikembangkan.
Mendukung berbagai macam divasi Input/Output.
Mudah untuk memodifikasi dan menghubungkan layar.
Mengijinkan memanggil prosedur eksternal dan program.
Mengijinkan mengimpor teks, grafik, media lain.
Mudah untuk dipelajari dan digunakan.
Dukungan yang baik dari vendor.

Sistem menu dalam windows
Sistem Menu
 
Sistem menu merupakan pilihan yang tepat untuk menunjukkan kemampuan dan fasilitas yang dimiliki oleh sebuah program aplikasi kepada pengguna. Menu adalah daftar  sejumlah pilihan dalam jumlah terbatas, yang biasanya berupa suatu kalimat atau kumpulan beberapa kata.
Ditinjau dari teknik penampilan pilihan-pilihan pada sebuah sistem menu, dikenal dua jenis sistem menu:
Sistem menu datar 
Dalam sistem menu datar, kemampuan dan fasilitas yang dimiliki oleh suatu program aplikasi akan ditampilkan secara lengkap, dan biasanya menggunakan kalimat-kalimat yang cukup panjang.
Contoh sistem menu datar


Sistem menu tarik (pulldown) yang berbasis pada struktur hirarki pilihan (struktur pohon pilihan)
Sebuah menu tarik pada dasarnya adalah sistem menu yang pilihan-pilihannya dikelompokkan menurut kategori tertentu atau menurut cara tertentu sehingga mereka membentuk semacam hirarki pilihan. Pada hirarki paling tinggi, pilihan-pilihan itu disebut dengan pilihan/menu utama. Sebagian atau semua pilihan/menu utama dapat mempunyai salah satu atau lebih subpilihan/submenu. Sebuah subpilihan/submenu dari suatu pilihan/menu utama dapat mempunyai satu atau lebih sub-pilihan dan seterusnya. Struktur ini membentuk semacam struktur pohon.

Contoh sistem menu tarik


Keuntungan dan kerugian penggunaan sistem menu adalah:
Keuntungan
Kerugian
Memerlukan sedikit pengetikan
Seringkali lambat
Beban Memori Rendah
Memakan ruang layar (khususnya untuk menu datar)
Strukturnya terdefinisikan dengan baik
Tidak cocok untuk aktifitas pemasukan data
Tersedia piranti bantu CAD
Tidak cocok untuk dialog terinisisasi pengguna dan campuran

 Single Menu
Binary menus




Multiple selection menus




Multiple-item menus / radio buttons


Pull-down and pop-up menus


Scrolling and two-dimensional menus


Alphasliders



Embedded links


Iconic menus, toolbars, or palettes


Linear Sequences & Multiple Menus


Tree-Structured Menus
Acyclic & Cyclic Menu Networks



Referensi :
http://hciisimk.blogspot.com/2008/11/chapter-6-menu-formulir-dan-kotak.html
http://yusriel.wordpress.com/

WYSIWYG
WYSIWYG (what you see is what you get) merupakan salah satu contoh dari manipulasi langsung / Direct Manipulation. Apa yang user lihat pada layar display pada saat menggunakan word processing misalnya, adalah bukan dokumen sebenarnya yang nantinya dihasilkan pada tahap akhir. Namun merupakan representasi atau rendering dari bagaimana rupa dokumen final nantinya. Implikasi dari WYSIWYG ini adalah perbedaan antara representasi dan hasil akhir adalah minimal, dan user dapat dengan mudah memvisualisasikan hasil akhir dari representasi yang diberikan komputer.
WYSIWYG = what you see is what you get = "apa yang didapat adalah apa yang dilihatnya"
Contoh : apa yang tercetak di printer merupakan informasi yang terkumpul dari data-data yang terlihat di layar monitor pada saat mencari data.
Hal ini juga perlu menjadi perhatian software engineer pada saat membangun antarmuka.
Informasi yang dicari/diinginkan harus sesuai dengan usaha dari user pada saat mencari data dan juga harus sesuai dengan data yang ada pada aplikasi sistem (software).
Jika sistem mempunyai informasi yang lebih dari yang diinginkan user, hendaknya dibuat pilihan (optional) sesuai dengan keinginan user. Bisa jadi yang berlebihan itu justru tidak diinginkan user.
Yang mendasar disini adalah harus sesuai dengan kemauan dan pilihan dari user.



9 . Knowledge User
by VengeancE on Nov.22, 2009, under IMK
User Physchology Characteristic:
Cognitive Style
Verbal/analytic 
Spatial/Intuitive
Attitude
Positive 
Neutral
Negative
Motivation
High
Moderate 
Low

Dari uraian di atas kita dapat mengetahui tujuan akhir dari desain aplikasi adalah easy learning agar mudah digunakan oleh user.
User Knowledge and Experience
Data dan informasi yang terdapat pada aplikasi sangat sederhana, karena disesuaikan dengan pengetahuan dan pengalaman user.
Seperti aplikasi telepon genggam pada umumnya aplikasi ini tidak memerlukan typing skill yang baik, karena disesuaikan dengan keypad telepon genggam.

User Job and Task Characteristic 
Frequency of use - Low 
Task Importance - Low 
System Use

Referensi :
http://kie4nie.blogspot.com/2010/07/knowledge-user.html

10 Guideline Preview
by VengeancE on Nov.22, 2009, under IMK

pedoman pengembangan perangkat lunak yang menawarkan rekomendasi pengembangan suatu aplikasi. Tujuan nya adalah untuk meningkatkan pengalaman bagi para pengguna dengan membuat interface aplikasi yang intuitif, mudah di pelajari, dan konsisten. Kebanyakan dari panduan membatasi diri untuk mendefinisikan tampilan umum dan hanya pada tampilan tertentu.Panduan ini memiliki kebijakan khusus, yang kadang-kadang didasarkan pada studi tentang interaksi manusia-komputer. Namun sebagian besar didasarkan konvensi sewenang-wenang dipilih oleh si pengembang.


Pedoman antarmuka ini akan menentukan seperangkat aturan untuk kegunaan umum. Ini juga sering digunakan untuk menentukan bagaimana masukan dan interaksi pengguna secara mekanisme cara kerjanya. Sebuah guideline kadang-kadang akan mendefinisikan terminologi standar dan semenarik mungkin. Berhubungan dengan unsur-unsur tertentu atau tindakan tertentu. Karena sebagian besar masalah pengguna berasal dari suatu aplikasi, dan ini merupakan suatu kelemahan untuk interface ini.


Versi yang paling penting adalah untuk dilakukan untuk kelompok-kelompok atau aplikasi. Dalam hal ini juga akan membangun suatu interface dengan menambahkan interface untuk berbagai fungsi. Tujuan utamanya adalah untuk menciptakan suatu kebiasaan yang konsisten di semua aspek (umumnya sebuah sistem operasi pada sistem operasi). Ini berarti baik jika menerapkan desain visual yang sama dan konsisten untuk menciptakan akses dan perilaku elemen umum dari suatu interface. Seperti penambahan tombol dan ikon sampai yang lebih komplek seperti kotak dialog.


Guideline Preview di rekomendasi kan untuk membantu pengembangan agar dalam pembuatan suatu aplikasi menjadi lebih baik. Pengembang kadang-kadang sengaja memilih untuk diam jika mereka berpikir bawah pedoman ini tidak sesuai dengan apa yang mereka inginkan.
Referensi :
http://www.kie4nie.blogspot.com/