Prototyping adalah proses pembuatan model atau representasi awal dari sebuah produk, sistem, atau aplikasi yang akan dikembangkan. Tujuannya adalah untuk menguji, mendemonstrasikan, dan mengklarifikasi konsep atau desain sebelum produk akhir dibuat. Prototyping juga memungkinkan pengembang dan pengguna untuk berinteraksi selama proses pembuatan, sehingga menghasilkan produk yang sesuai dengan kebutuhan. Pengertian Prototyping: Prototyping adalah metode pengembangan yang melibatkan pembuatan model atau representasi awal dari produk, sistem, atau aplikasi. Model ini digunakan untuk menguji, mengevaluasi, dan menyempurnakan konsep atau desain sebelum produk akhir dikembangkan. Prototyping dapat berupa model fisik, model digital, atau bahkan model berbasis kertas. Tujuan Prototyping: Menguji konsep: Memastikan ide atau konsep produk berfungsi seperti yang diharapkan. Mendemonstrasikan fungsionalitas: Memperlihatkan bagaimana produk akan bekerja kepada pemangku kepentingan. Mengumpulkan umpan balik: Mendapatkan masukan dari pengguna untuk perbaikan dan penyempurnaan. Mengurangi risiko: Mengidentifikasi masalah potensial sejak dini sebelum produk diluncurkan secara luas. Mempercepat pengembangan: Membantu mempercepat proses pengembangan produk dengan menguji dan memperbaiki ide lebih awal. Jenis-jenis Prototyping: Paper Prototyping: Pembuatan prototipe sederhana menggunakan kertas dan alat tulis, efektif untuk menguji alur pengguna. Digital Prototyping: Pembuatan prototipe menggunakan perangkat lunak desain untuk membuat model visual yang interaktif. HTML Prototyping: Pembuatan prototipe menggunakan kode HTML untuk mensimulasikan tampilan dan fungsionalitas produk. Prototype Kerja: Prototipe yang dibuat untuk menguji fungsionalitas dan kinerja produk secara langsung. Contoh Penggunaan Prototyping: Pengembangan Perangkat Lunak: Pembuatan prototipe antarmuka pengguna (UI) dan alur pengguna (UX) untuk aplikasi dan situs web. Desain Produk: Pembuatan prototipe model fisik atau digital untuk produk baru, seperti alat, perabotan, atau kendaraan. Kewirausahaan: Pembuatan prototipe untuk menguji konsep bisnis atau produk baru sebelum diluncurkan secara komersial. Dengan melakukan prototyping, pengembang dan desainer dapat memastikan bahwa produk yang mereka buat memenuhi kebutuhan pengguna dan berfungsi dengan baik sebelum diimplementasikan secara penuh. Prototyping adalah proses yang ditujukan untuk menkonversi berbagai sifat abstrak dari sebuah ide menjadi lebih berwujud / terlihat menyerupai hasil sebenarnya. Dalam proses ini tidak hanya berupa visualisasi ide tetapi juga proses membangun ide. Prototype adalah alat yang membantu untuk mengklasifikasikan langkah yang akan diambil terutama yang berkaitan dengan model bisnis. Secara umum prototype dibagi menjadi dua kategori, yaitu : Low-fidelity – Dalam low-fidelity prototype, user menggunakan ini sebagai interaksi dengan orang yang bertanggung jawab dalam membuat gambar lalu memilih sistem

1. PROTOTYPING
INTERAKSI MANUSIA
KOMPUTER

2. Pendahuluan
 Prototipe adalah bentuk awal sebuah produk.
 Prototipe merupakan simulasi atau contoh dari sebuah
sistem.
 Prototipe merupakan suatu metode dlm pengembangan
sistem yg menggunakan pendekatan utk membuat
sesuatu program dg cepat & bertahap shg segera dpt
dievaluasi oleh pemakai
 Prototipe ini memang benar-benar cocok utk user yg
awam IT.
 Dalam pembuatan prototipe kita dpt menerapkan UCD
(User Centered Design).

3. Tahapan Prototipe
Membuat Prototipe
Identifikasi
Kebutuhan
Pemakai
Menguji Prototipe
Mengembangkan
Versi Produksi
Memperbaiki
Prototipe
Pengembang mulai membuat prototipe
Pemakai menguji prototipe & memberikan
kritikan/saran
Pengembang melakukan modifikasi
sesuai dg masukan pemakai
Pengembang merampungkan sistem
sesuai dg masukan terakhir dari pemakai
- Pengembang & pemakai bertemu
- Pemakai menjelaskan kebutuhan sistem

4. 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.

5. Keunggulan Prototipe
1. Adanya komunikasi yang baik antara pengembang
dan pelanggan
2. Pengembang dapat bekerja lebih baik dalam
menentukan kebutuhan pelanggan
3. Pelanggan berperan aktif dalam pengembangan
sistem
4. Lebih menghemat waktu dalam pengembangan
sistem
5. Penerapan menjadi lebih mudah karena pemakai
mengetahui apa yang diharapkannya.

6. Kelemahan Prototipe
1. Pelanggan kadang tidak melihat atau menyadari bahwa
perangkat lunak yang ada belum mencantumkan
kualitas perangkat lunak secara keseluruhan dan juga
belum memikirkan kemampuan pemeliharaan untuk
jangka waktu lama
2. Pengembang biasanya ingin cepat menyelesaikan
proyek. Sehingga menggunakan algoritma dan bahasa
pemrograman yang sederhana untuk membuat
prototyping lebih cepat selesai tanpa memikirkan
lebih lanjut bahwa program tersebut hanya merupakan
cetak biru sistem .
3. Hubungan pelanggan dengan komputer yang
disediakan mungkin tidak mencerminkan teknik
perancangan yang baik

7. Mengapa menggunakan Prototipe ?

8.  Evaluasi dan feedback pada rancangan interaktif.
 Stakeholder (dalam hal ini user) dapat melihat,
menyentuh, berinteraksi dengan prototype.
 Anggota tim dapat berkomunikasi secara efektif.
 Para perancang dapat mengeluarkan ide-idenya.
 Memunculkan ide-ide secara visual dan
mengembangkannya.
 Dapat menjawab pertanyaan membantu
pemilihan di antara alternatif-alternatif.

9. Dimensi Prototype
1. Penyajian
Bagaimana desain dilukiskan atau diwakili?
Dapat berupa uraian tekstual atau dapat visual dan
diagram.
2. Lingkup
Apakah hanya interface atau apakah mencakup
komponen komputasi?

10. Dimensi Prototype
3. Executability (Dapat dijalankan)
Dapatkah prototype tersebut dijalankan?
Jika dikodekan, akan ada periode saat prototype
tidak dapat dijalankan.
4. Maturation (Pematangan)
Apakah tahapan-tahapan produk ini mengikuti?
- Revolusioner: mengganti yang lama.
- Evolusioner : terus melakukan perubahan pada
perancangan yang sebelumnya.

11. Metode Pembuatan Prototyping Dengan Cepat
Non-Computer
(biasanya dikerjakan lebih awal dalam proses
pembuatan)
vs
Computer-Based
(biasanya dikerjakan kemudian)

12. Metode Non-Computer (Manual)
Tujuan
Ingin menyatakan gagasan desain dan mendapatkan
dengan mudah dan cepat pendapat atas sistem.
Deskripsi Desain
Dapat berupa deskripsi tekstual dari suatu desain sistem.
- Kelemahan yang nyata adalah seberapa jauh dari sistem
yang sebenarnya.
- Tidak dapat melakukan suatu pekerjaan yang mewakili
aspek dari interface.

13. Metode Non-Computer (Manual)
Sketsa, Mock-ups
- Paper-Based “menggambarkan” interface.
- Baik untuk mengungkapkan pendapat.
- Difokuskan pada orang dengan desain tingkat tinggi.
- Tidak terlalu baik untuk menggambarkan alur dan
rinciannya.
- Murah dan cepat umpan balik sangat menolong.

14. Metode Non-Computer (Manual)
Storyboarding
Pensil dan simulasi catatan atau walkthrough dari
kemampuan dan tampilan sistem.
- Menggunakan urutan diagram/gambar.
- Menunjukkan kunci snap shots.
- Cepat dan mudah.
Contoh :

15. Metode Non-Computer (Manual)
Skenario
Hipotesis atau imajinasi penggunaan.
- Biasanya menyertakan beberapa orang, peristiwa,
lingkungan dan situasi.
- Menyediakan konteks operasi.
- Terkadang dalam format naratif, tetapi juga dapat
berupa sketsa atau bahkan video.

16. Metode Non-Computer (Manual)
Utilitas Skenario
- Menjanjikan dan menarik.
- Mengijinkan perancang untuk melihat masalah dari
pandangan orang lain.
- Memudahkan umpan balik dan pendapat.
- Dapat sangat kreatif dan modern.

17. Metode Non-Computer (Manual)
Teknik Lain
Tutorial dan Manual
- Mungkin menuliskannya lebih berguna daripada
disimpan dalam kepala.
- Memaksa perancang untuk membuat keputusan
dengan tegas.
- Menulis/meletakkannya di atas kertas jauh lebih
berharga.

18. Metode Komputer
Menirukan lebih banyak kemampuan sistem.
- Pada umumnya hanya baru beberapa aspek atau
fitur
- Dapat berpusat pada lebih banyak detail
- Bahaya: Para pemakai jadi lebih segan untuk
menyarankan perubahan sekali ketika mereka
melihat prototype yang lebih realistis.

19. Terminologi Prototipe
1. Prototype Horisontal
Sangat luas, mengerjakan atau menunjukkan
sebagian besar interface, tetapi tidak mendalam.
2. Prototype Vertikal
Lebih sedikit aspek atau fitur dari interface yang
disimulasikan, tetapi dilaksanakan dengan rincian
yang sangat baik.

20. Terminologi Prototipe
3. Early Prototyping (prototipe cepat)
4. Late Prototyping (prototipe lambat)
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.

21. Terminologi Prototipe
Contoh (2) sketsa:
- Sketsa sangat penting untuk low-fidelity prototyping.
- Jangan takut dengan kemampuan menggambar.
- Menyajikan “tampilan” cepat dari interface, konsep
desain, dll.
Contoh (3) “wizard-of-oz”:
- Digunakan tampilan maket dan berinteraksi dengan
pemakai
- Baik untuk mensimulasikan sistem yang sulit dibuat

22. Terminologi Prototipe
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.

23. Terminologi Prototipe
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.

24. Prototyping Tools
1. Draw/Paint Program
contoh: Photoshop, Coreldraw
- Menggambar setiap layar, baik untuk dilihat.
- Prototype horisontal, tipis.
- Adobe Photoshop.

25. Contoh

26. Prototyping Tools
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.
- Macromedia Director.

27. Contoh

28. Prototyping Tools
3. Interface Builders
contoh: Visual Basic, Delphi.
- Tools untuk menampilkan jendela, kendali, dan
lain-lain dari interface.

29. Contoh

30. Kelebihan
 Mudah dikembangkan dan memodifikasi layar.
 Mendukung jenis interface yang dikembangkan.
 Mendukung berbagai macam device 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.

31. Pemodelan
Low-fidelity
Medium-fidelity
High-fidelity
Sketches,
mock-ups
Slide shows
Simulations
Scenarios
Storyboards

32. Daftar Pustaka
 Surbakti, Irfan; Interaksi Manusia Dan Komputer,
Edisi Jurusan Teknik Informatika-ITS, 2006