Stay Updated: Posts | Comments

  • 21st June 2010 - By zoel

    Dalam pembuatan sebuah aplikasi tidak lepas dari apa yang disebut dengan antarmuka, antarmuka sendiri adalah bagian dari sebuah sistem aplikasi yang menjembantani komunikasi antara pengguna dengan aplikasi.

    Menurutu Theresa Neil, ada sekitar 13 standard model antarmuka yang banyak digunakan.  13 model itu adalah :

    1. Master Detail
    2. Column Browse
    3. Search/Results
    4. Filter
    5. Form
    6. Palette/Canvas
    7. Dashboard
    8. Spreadsheet
    9. Wizard
    10. Question & Answers
    11. Parallel
    12. Interactive
    13. Blank

    berikut layout dari ke 13 model antar muka tersebut :

    1. Master/Detail , biasa digunakan untuk aplikasi2 yang banyak mengutamakan isi yang akan ditampilkan, terdiri dari 2 kolom baik secara vertikal maupun herizontal.
    2. Column browse, berbentuk vertikal dan horizontal dengan menambahkan jumlah kolom yang digunakan lebih banyak dari pada model master.
    3. Search, digunakan untuk tampilan yang banyak menggunakan fasilitas pencarian data dan biasanya sangat sederhana tampilannya. Memungkinkan pengguna langsung medapatkan keseluruhan data dari item data yang di temukan baik secara biasa atau dengan pencarain yang lebih spesifik.
    4. Filter, atau refine dataset digunakan untuk oleh tampilan sistem informasi yang bertujuan untuk memfilter data yang akan ditampilkan kedalam bagian bagian tertentu.  Pada panel biasanya didapati satu atau lebih following components seperti text field, slider, checkboxes, listbox, alternate listbox UI dan date range picker. Model ini biasanya digunakan untuk mengelompokkan data yang dicari secara dinamis. Sebagai contoh tampilan eBay
    5. Forms, digunakan untuk keperluan memasukan data kedalam sistem database . Banyak digunakan untuk sistem informasi yang berhubungan dengan pendaftaran dimana ada kegiatan pengisian data. Sebagai contoh tampilan pendaftaran pada Gmail.
    6. Palette/Canvas banyak dijumpai pada tampilan layar sistem informasi yang memuat flow diagrams, linier or non-linier processes, screen layout dan diagram-diagram. Sebagai contoh pada aplikasi Xmind, flowcart, Photoshop.
    7. Dashboard digunakan untuk menampilkan lebih dari satu informasi data yang akan ditampilkan bisa berupa grafik-grafik, tabel dan real time data yang semuanya ditampilkan dalam satu tampilan layar dan dapat dengan mudah dibaca dan dimengerti oleh pengguna dari data yang ditampilkan. Sebagai contoh adalah tampilan FiveRuns, Mint dan FaceOut.
    8. Spreadsheet digunakan oleh sistem informasi yang penggunanya dengan mudah untuk mencari , mengedit, menghapus dan mengisikan data tabel yang tersedia.  Sebagai contoh adalah tampilan dari MS Excel.
    9. Wizard biasanya dijumpai pada sistem informasi yang bertujuan untuk mempermudah pengguna untuk melakukan suatu proses pemasukan data, dengan cara dibantu dengan berupa urutan-urutan langkah yang harus dilakukan pengguna. Sebagai contoh adalah tampilan dari TurboTax dan langkah-langkah instalasi Mac-OS.
    10. Question & Answer dijumpai pada sistem informasi yang berfungsi untuk memberi penjelasan dari pertanyaan penggunanya. Pengguna dimungkinkan untuk mendapat informasi dan solusi dari pertanyaan yang dikemukakannya. Berbeda dengan model search dalam model ini ada semacam petujuk yang dapat dipilih atas permasalah yang ingin diungkapkan dalam bentuk pertanyaan dan solusi permasalahannya. Biasanya permasalahan-permasalahan yang sering dialamai pengguna akan ditampilkan sebagai petunjuk pertanyaan. Contoh sistem informasi ini adalah Quicken.
    11. Parallel panels merupakan model sistem antarmuka yang dapat dijumpai dalam bentuk jendela berukuran kecil dan hanya memuat suatu data informasi yang tunggal. Sebagai contoh info panel dari Mac-OS.
    12. Interactive Model, Model ini memiliki karakteristik yang interaktif dengan banyak elemen yang tersedia dan biasanya dapat menyesuaikan dengan keinginan penggunanya. Elemen berupa grafik, tabel, kalender, peta dan kotak editor dapat disusun menurut keinginan pengguna dalam satu layar dengan cara click dan drag and drop. Sebagai contoh adalah Google calendar.
    13. Blank, Biasanya model ini digunakan untuk menampilkan antarmuka yang memuat sebuah video atau memutar musik secara online, elemennya berupa icon play atau stop layaknya pemutar video dan musik pada umumnya. Sebagai contoh adalah tampilan dari youtube.

    Dalam penggunaanya bisa menggunakan secara tunggal dari model yang ada atau perpaduan dari model-model yang ada. Penggunaan model antarmuka yang tepat adalah dengan mengedepankan keinginan dan kemudahan bagi user dalam menggunakannya. Semoga bermanfaat salam!

    zoelqivlie ;-)

    Related Posts Plugin for WordPress, Blogger...

    Related posts:

    1. Release Candidate 1, WordPress 2.8 Akhirnya sudah mendekati ujung dari penantian panjang buat para pengguna...
    2. Desain footer web Bagian footer web adalah bagian yang biasanya jarang diperhatian oleh...
    3. Membuat headline berita dengan php Kontent yang rapi pada sebuah halaman website sangatlah membuat para...
    4. Mozilla Firefox Plugin untuk Web Designer Browser Mozilla Firefox, sudah tidak asing lagi di telinga kita...
    5. INAICTA 2010 Sebuah acara dalam rangka untuk meningkatkan perkembangan IT di Indonesiea,...
  • Leave a Reply

    *




Copyright @ 2011 - 19fdesign.com | Web Apps Devlopment | Pengembang Sistem Informasi berbasis web

Featuring Recent Posts WordPress Widget development by YD

PHVsPjxsaT48c3Ryb25nPndvb19hZF9mb290ZXI8L3N0cm9uZz4gLSBmYWxzZTwvbGk+PGxpPjxzdHJvbmc+d29vX2FkX2Zvb3Rlcl9hZHNlbnNlPC9zdHJvbmc+IC0gPC9saT48bGk+PHN0cm9uZz53b29fYWRfZm9vdGVyX2ltYWdlPC9zdHJvbmc+IC0gaHR0cDovL3d3dy5iYWNrbGlua3MuY29tL2ltYWdlcy80NjhYNjAuanBnPC9saT48bGk+PHN0cm9uZz53b29fYWRfZm9vdGVyX3VybDwvc3Ryb25nPiAtIGh0dHA6Ly93d3cud2h5bGluay5jb20/YWZmPTU4MjIzPC9saT48bGk+PHN0cm9uZz53b29fYWx0X3N0eWxlc2hlZXQ8L3N0cm9uZz4gLSBydXN0LmNzczwvbGk+PGxpPjxzdHJvbmc+d29vX2F1dG9faW1nPC9zdHJvbmc+IC0gdHJ1ZTwvbGk+PGxpPjxzdHJvbmc+d29vX2NhdF9jb2xvcl8xPC9zdHJvbmc+IC0gPC9saT48bGk+PHN0cm9uZz53b29fY2F0X2NvbG9yXzEwPC9zdHJvbmc+IC0gPC9saT48bGk+PHN0cm9uZz53b29fY2F0X2NvbG9yXzEwMTwvc3Ryb25nPiAtIDwvbGk+PGxpPjxzdHJvbmc+d29vX2NhdF9jb2xvcl8xMTwvc3Ryb25nPiAtIDwvbGk+PGxpPjxzdHJvbmc+d29vX2NhdF9jb2xvcl8xMjwvc3Ryb25nPiAtIDwvbGk+PGxpPjxzdHJvbmc+d29vX2NhdF9jb2xvcl8xNDwvc3Ryb25nPiAtIDwvbGk+PGxpPjxzdHJvbmc+d29vX2NhdF9jb2xvcl8xODY8L3N0cm9uZz4gLSA8L2xpPjxsaT48c3Ryb25nPndvb19jYXRfY29sb3JfMjM8L3N0cm9uZz4gLSA8L2xpPjxsaT48c3Ryb25nPndvb19jYXRfY29sb3JfMzwvc3Ryb25nPiAtIDwvbGk+PGxpPjxzdHJvbmc+d29vX2NhdF9jb2xvcl8zMTI8L3N0cm9uZz4gLSA8L2xpPjxsaT48c3Ryb25nPndvb19jYXRfY29sb3JfMzcxPC9zdHJvbmc+IC0gPC9saT48bGk+PHN0cm9uZz53b29fY2F0X2NvbG9yXzQzNzwvc3Ryb25nPiAtIDwvbGk+PGxpPjxzdHJvbmc+d29vX2NhdF9jb2xvcl80NDM8L3N0cm9uZz4gLSA8L2xpPjxsaT48c3Ryb25nPndvb19jYXRfY29sb3JfNDQ0PC9zdHJvbmc+IC0gPC9saT48bGk+PHN0cm9uZz53b29fY2F0X2NvbG9yXzQ4Mjwvc3Ryb25nPiAtIDwvbGk+PGxpPjxzdHJvbmc+d29vX2NhdF9jb2xvcl85NTwvc3Ryb25nPiAtIDwvbGk+PGxpPjxzdHJvbmc+d29vX2NhdF9uYXZfMTwvc3Ryb25nPiAtIHRydWU8L2xpPjxsaT48c3Ryb25nPndvb19jYXRfbmF2XzEwPC9zdHJvbmc+IC0gdHJ1ZTwvbGk+PGxpPjxzdHJvbmc+d29vX2NhdF9uYXZfMTAxPC9zdHJvbmc+IC0gdHJ1ZTwvbGk+PGxpPjxzdHJvbmc+d29vX2NhdF9uYXZfMTE8L3N0cm9uZz4gLSB0cnVlPC9saT48bGk+PHN0cm9uZz53b29fY2F0X25hdl8xMjwvc3Ryb25nPiAtIHRydWU8L2xpPjxsaT48c3Ryb25nPndvb19jYXRfbmF2XzE0PC9zdHJvbmc+IC0gdHJ1ZTwvbGk+PGxpPjxzdHJvbmc+d29vX2NhdF9uYXZfMTg2PC9zdHJvbmc+IC0gdHJ1ZTwvbGk+PGxpPjxzdHJvbmc+d29vX2NhdF9uYXZfMjM8L3N0cm9uZz4gLSB0cnVlPC9saT48bGk+PHN0cm9uZz53b29fY2F0X25hdl8zPC9zdHJvbmc+IC0gdHJ1ZTwvbGk+PGxpPjxzdHJvbmc+d29vX2NhdF9uYXZfMzEyPC9zdHJvbmc+IC0gZmFsc2U8L2xpPjxsaT48c3Ryb25nPndvb19jYXRfbmF2XzM3MTwvc3Ryb25nPiAtIGZhbHNlPC9saT48bGk+PHN0cm9uZz53b29fY2F0X25hdl80Mzc8L3N0cm9uZz4gLSBmYWxzZTwvbGk+PGxpPjxzdHJvbmc+d29vX2NhdF9uYXZfNDQzPC9zdHJvbmc+IC0gZmFsc2U8L2xpPjxsaT48c3Ryb25nPndvb19jYXRfbmF2XzQ0NDwvc3Ryb25nPiAtIGZhbHNlPC9saT48bGk+PHN0cm9uZz53b29fY2F0X25hdl80ODI8L3N0cm9uZz4gLSBmYWxzZTwvbGk+PGxpPjxzdHJvbmc+d29vX2NhdF9uYXZfOTU8L3N0cm9uZz4gLSB0cnVlPC9saT48bGk+PHN0cm9uZz53b29fY3VzdG9tX2Nzczwvc3Ryb25nPiAtIDwvbGk+PGxpPjxzdHJvbmc+d29vX2N1c3RvbV9mYXZpY29uPC9zdHJvbmc+IC0gPC9saT48bGk+PHN0cm9uZz53b29fZmVlZGJ1cm5lcl91cmw8L3N0cm9uZz4gLSA8L2xpPjxsaT48c3Ryb25nPndvb19nb29nbGVfYW5hbHl0aWNzPC9zdHJvbmc+IC0gPHNjcmlwdCB0eXBlPVwidGV4dC9qYXZhc2NyaXB0XCI+DQp2YXIgZ2FKc0hvc3QgPSAoKFwiaHR0cHM6XCIgPT0gZG9jdW1lbnQubG9jYXRpb24ucHJvdG9jb2wpID8gXCJodHRwczovL3NzbC5cIiA6IFwiaHR0cDovL3d3dy5cIik7DQpkb2N1bWVudC53cml0ZSh1bmVzY2FwZShcIiUzQ3NjcmlwdCBzcmM9XCdcIiArIGdhSnNIb3N0ICsgXCJnb29nbGUtYW5hbHl0aWNzLmNvbS9nYS5qc1wnIHR5cGU9XCd0ZXh0L2phdmFzY3JpcHRcJyUzRSUzQy9zY3JpcHQlM0VcIikpOw0KPC9zY3JpcHQ+DQo8c2NyaXB0IHR5cGU9XCJ0ZXh0L2phdmFzY3JpcHRcIj4NCnRyeSB7DQp2YXIgcGFnZVRyYWNrZXIgPSBfZ2F0Ll9nZXRUcmFja2VyKFwiVUEtMTUzNDUzNjgtMVwiKTsNCnBhZ2VUcmFja2VyLl90cmFja1BhZ2V2aWV3KCk7DQp9IGNhdGNoKGVycikge308L3NjcmlwdD48L2xpPjxsaT48c3Ryb25nPndvb19sb2dvPC9zdHJvbmc+IC0gaHR0cDovL3d3dy4xOWZkZXNpZ24uY29tL3dwLWNvbnRlbnQvd29vX3VwbG9hZHMvMy0xOWZsb2dvLmpwZzwvbGk+PGxpPjxzdHJvbmc+d29vX21hbnVhbDwvc3Ryb25nPiAtIGh0dHA6Ly93d3cud29vdGhlbWVzLmNvbS9zdXBwb3J0L3RoZW1lLWRvY3VtZW50YXRpb24vd29vdGhlbWUvPC9saT48bGk+PHN0cm9uZz53b29fcG9zdF9zaXplPC9zdHJvbmc+IC0gZmFsc2U8L2xpPjxsaT48c3Ryb25nPndvb19yZXNpemU8L3N0cm9uZz4gLSB0cnVlPC9saT48bGk+PHN0cm9uZz53b29fc2hvcnRuYW1lPC9zdHJvbmc+IC0gd29vPC9saT48bGk+PHN0cm9uZz53b29fc2lkZWJhcl9hZF9ocmVmXzE8L3N0cm9uZz4gLSBodHRwOi8vd3d3LmRlc2lnbmRpYXJ5Lm9yZzwvbGk+PGxpPjxzdHJvbmc+d29vX3NpZGViYXJfYWRfaHJlZl8yPC9zdHJvbmc+IC0gaHR0cDovL3JldXBkYXRlYW50aXZpcnVzLmJsb2dzcG90LmNvbS88L2xpPjxsaT48c3Ryb25nPndvb19zaWRlYmFyX2FkX2hyZWZfMzwvc3Ryb25nPiAtIGh0dHA6Ly93d3cuem9lbHFpdmxpZS5jb208L2xpPjxsaT48c3Ryb25nPndvb19zaWRlYmFyX2FkX2hyZWZfNDwvc3Ryb25nPiAtIGh0dHA6Ly96b2VsLmNzc2NyZW1lLmNvbS88L2xpPjxsaT48c3Ryb25nPndvb19zaWRlYmFyX2FkX2ltZ18xPC9zdHJvbmc+IC0gaHR0cDovL3d3dy4xOWZkZXNpZ24uY29tL3dwLWNvbnRlbnQvd29vX3VwbG9hZHMvNC1kZF8xMjV4MTI1X3YyLmpwZzwvbGk+PGxpPjxzdHJvbmc+d29vX3NpZGViYXJfYWRfaW1nXzI8L3N0cm9uZz4gLSBodHRwOi8vd3d3LjE5ZmRlc2lnbi5jb20vd3AtY29udGVudC93b29fdXBsb2Fkcy81LWFudHZfMTI1eDEyNV92Mi5qcGc8L2xpPjxsaT48c3Ryb25nPndvb19zaWRlYmFyX2FkX2ltZ18zPC9zdHJvbmc+IC0gaHR0cDovL3d3dy4xOWZkZXNpZ24uY29tL3dwLWNvbnRlbnQvd29vX3VwbG9hZHMvNi16cV8xMjV4MTI1X3YxLmpwZzwvbGk+PGxpPjxzdHJvbmc+d29vX3NpZGViYXJfYWRfaW1nXzQ8L3N0cm9uZz4gLSBodHRwOi8vd3d3LjE5ZmRlc2lnbi5jb20vd3AtY29udGVudC93b29fdXBsb2Fkcy83LXpxXzEyNXgxMjVfd2ViLmpwZzwvbGk+PGxpPjxzdHJvbmc+d29vX3NpbmdsZV90aHVtYjwvc3Ryb25nPiAtIGZhbHNlPC9saT48bGk+PHN0cm9uZz53b29fdGhlbWVuYW1lPC9zdHJvbmc+IC0gbXl3ZWJsb2c8L2xpPjxsaT48c3Ryb25nPndvb191cGxvYWRzPC9zdHJvbmc+IC0gYTo1OntpOjA7czo2ODoiaHR0cDovL3d3dy4xOWZkZXNpZ24uY29tL3dwLWNvbnRlbnQvd29vX3VwbG9hZHMvNy16cV8xMjV4MTI1X3dlYi5qcGciO2k6MTtzOjY3OiJodHRwOi8vd3d3LjE5ZmRlc2lnbi5jb20vd3AtY29udGVudC93b29fdXBsb2Fkcy82LXpxXzEyNXgxMjVfdjEuanBnIjtpOjI7czo2OToiaHR0cDovL3d3dy4xOWZkZXNpZ24uY29tL3dwLWNvbnRlbnQvd29vX3VwbG9hZHMvNS1hbnR2XzEyNXgxMjVfdjIuanBnIjtpOjM7czo2NzoiaHR0cDovL3d3dy4xOWZkZXNpZ24uY29tL3dwLWNvbnRlbnQvd29vX3VwbG9hZHMvNC1kZF8xMjV4MTI1X3YyLmpwZyI7aTo0O3M6NjE6Imh0dHA6Ly93d3cuMTlmZGVzaWduLmNvbS93cC1jb250ZW50L3dvb191cGxvYWRzLzMtMTlmbG9nby5qcGciO308L2xpPjwvdWw+