• Save
Prototyping
Upcoming SlideShare
Loading in...5
×
 

Prototyping

on

  • 1,218 views

 

Statistics

Views

Total Views
1,218
Views on SlideShare
1,218
Embed Views
0

Actions

Likes
2
Downloads
0
Comments
0

0 Embeds 0

No embeds

Accessibility

Categories

Upload Details

Uploaded via as Microsoft PowerPoint

Usage Rights

© All Rights Reserved

Report content

Flagged as inappropriate Flag as inappropriate
Flag as inappropriate

Select your reason for flagging this presentation as inappropriate.

Cancel
  • Full Name Full Name Comment goes here.
    Are you sure you want to
    Your message goes here
    Processing…
Post Comment
Edit your comment

Prototyping Prototyping Presentation Transcript

  • DESKRIPSIPengetian : Prototipe merupakan simulasi atauanimasi dari bakal sistem.Fungsi : Untuk membuat suatu program dengancepat & bertahap sehingga segera dapatdievaluasi oleh user.
  • TERMINOLOGI PROTOTYPINGBeberapa istilah-istilah penting dalam prototype :1. Prototype HorisontalSangat luas, mengerjakan atau menunjukkansebagian besar interface, tetapi tidak mendalam.2. Prototype VertikalLebih sedikit aspek atau fitur dari interface yangdisimulasikan, tetapi dilaksanakan dengan rincianyang sangat baik.
  • 3. Early Prototyping (prototipe cepat)4. Late Prototyping (prototipe lambat)5. Low-fidelity Prototyping (prototype dengan tingkatketepatan yang rendah)Contoh (1) Storyboard.Contoh (2) sketsa.Contoh (3) “wizard-of-oz”. (penjelasan selanjutnya)
  • 4. Mid-fidelity prototyping (prototype dengantingkat ketepatan sedang)• Form skematik.• Navigasi dan fungsi yang disimulasikan biasanyaberbasis pada apa yang tampil pada layar atausimulasi layar.Contoh tools yang digunakan: powerpoint,illustrator, dll.
  • 5. High-fidelity prototyping (prototype dengantingkat ketepatan yang tinggi)• Hi-fi prototype seperti sistem akhir.• Menggunakan bahan baku yang sama sepertiproduk akhir.Tools umum yang digunakan: MacromediaDirector, Visual Basic, Flash.
  • JENIS PROTOTYPING• Throw-away : Prototype dibuat dan ditest. Pengalaman yangdiperoleh dari pembuatan prototype tersebut digunakan untukmembuat produk akhir (final),kemudian prototype tersebut dibuang (tak dipakai).Contoh : Visual Basic (VB) seperti Microsoft Access• Model Incremental : Membangun software secara meningkat(increment) berdasarkan kemampuan fungsional.Contoh : Pengembangan microsoft word.Increment 1 : hanya memberi fungsi inti –> hanya bisa mengetiksajaIncrement 2 : bisa word art, spelling, dll
  • • Evolutionary : Pada metode ini, prototypenya tidak dibuangtetapi digunakan untuk iterasi desain berikutnya. Dalam halini, sistem atau produk yang sebenarnya dipandang sebagaievolusi dari versi awal yang sangat terbatas menuju produkfinal atau produk akhir.Contoh : Word 2007=>Word 2010=>Word 2013PES 2010=>PES 2011=>PES 2012=>PES2013
  • TINGKATAN PROTOTYPE• Prototype HorizontalProgram yang hanya menampilkan interface user tapi tidakbisa digunakan (function belum ada yang jalan).Contoh : Orang yang membuat web tapi cuma membuattampilannya saja dari photoshop.• Prototype VertikalProgram yang fungsinya hanya satu yang bisa digunakan tapiditerapkan secara mendalam. Lebih sedikit aspek atau fiturdari interface yang disimulasikan, tetapi dilaksanakan denganrincian yang sangat baik.Contoh : Kayak windows blackcom atau windows 7 beta build7000 yang sekarang jadi windows 7.
  • PROTOTYPING TOOLS• Metode Gambaran UI Program• Metode Simulasi Script• Interface Builder
  • METODE GAMBARAN UI PROGRAM TOOLS• Adobe Photoshop : adalah perangkat lunakeditor citra buatan Adobe Systems yangdikhususkan untuk pengeditan foto/gambardan pembuatan efek.• CorelDraw : editor grafik vektor yangdikembangkan oleh Corel.
  • METODE SIMULASI SCRIPT TOOLS• Hypercard : Merupakan program aplikasi yang bisahypermedia sistem sebelum world wide web. Sebuahbahasa pemrograman untuk memanipulasi data dan userinterface.• Macromedia Director : Merupakan perangkat lunak untukpembuatan aplikasi multimedia.• Adobe Flash : Digunakan untuk membuat gambar vektormaupun animasi gambar tersebut.• Dreamweaver : Aplikasi desain dan pengembangan webyang menyediakan editor WYSIWYG visual (bahasa sehari-hari yang disebut sebagai Design view) dan kode editordengan fitur standar seperti syntax highlighting, codecompletion, dan code collapsing.
  • INTERFACE BUILDER TOOLS• Microsoft Video Studio : Merupakan sebuah perangkatlunak lengkap (suite) yang digunakan untukmelakukan pengembangan aplikasi, baik itu aplikasi bisnis,aplikasi personal, ataupun komponen aplikasinya, dalambentuk aplikasi console, aplikasi Windows, ataupunaplikasi Web.• Jbuilder : Merupakan perangkat lunak untuk pengembanganterintegrasi java untuk pomodelan, pembangunan Interface,pengembangan, Debugging dan sebagainya.• Delphi : Aplikasi pengembangan terpadu (IDE) untukmengembangkan aplikasi konsol, desktop, web, ataupunperangkat mobile.
  • TEKNIK PROTOTYPE• Non Komputer•Sketsa•Story Board•Skenario• Metode Komputer•Gambaran UI Program•Simulasi Script (chauffeured prototyping )•Interface Builder (rapid prototyping)
  • NON-KOMPUTER• Sketsa• Deskripsi : Gambaran antar muka berbasiskankertas.• Menyajikan “tampilan” cepat dari interface,konsep desain, dll.• Baik untuk mengungkapkan pendapat.• Difokuskan pada orang dengan desain tingkattinggi.• Tidak bagus mengilustrasikan alur dan detil.• Cepat dan murah
  • CONTOH SKETSA
  • CONTOH SKETSA (2)
  • • Strory Board (Papan Cerita)• Seperti sketsa, mensimulasikan jalannya tampilanatau fungsionalitas system.• Digunakan di awal desain.• Kumpulan dari sketsa/frame individual.• Menggunakan diagram/gambar sekuensial.• Menunjukkan bagaimana kemungkinan userdapat mengalami peningkatan melalui setiapaktifitas.• Dapat dianimasikan• Cepat dan mudah
  • Contoh Story Board :
  • • Skenario• Deskripsi : Hipotesis atau imajinasi penggunaan.• Biasanya melibatkan beberapa orang, peristiwa,situasi, dan lingkungan• Memberikan konteks operasi• Terkadang dalam bentuk narasi , tetapi juga bisadalam bentuk sketsa atau video• Memungkinkan desainer untuk melihat masalahdari sudut pandang orang lain• Memfasilitasi umpan balik dan opini• Bisa sangat futuristik, kreatif, dan menarik
  • PERBEDAAN SKETSA, STORY BOARD DAN SKENARIO• Sketsa : Gambaran interface programberbasiskan kertas.• Story Board : Hampir seperti sketsa, tetapilebih mensimulasikan jalannya tampilan atausystem.• Skenario : Hipotesis atau imajinasipenggunaan. Terkadang dalam bentuk narasi.
  • METODE KOMPUTER• Gambaran UI ProgramContoh: Photoshop, Coreldraw• Menggambar setiap layar, baik untukdilihat.• Prototype horisontal, tipis.• Adobe Photoshop.
  • CONTOH PHOTOSHOP
  • CONTOH COREL
  • • Simulasi Script•Disebut juga chauffeured prototyping.•Letakkan tampilan seperti storyboarddengan (animasi) perubahan diantaranya.•Dapat memberikan user catatan yangsangat spesifik.•Contoh: Powerpoint, Hypercard,Macromedia Director, HTML.
  • • Interface Builder (Rapid Prototyping)•Prototyping terkomputerisasi denganvisual editing .•Tools untuk menampilkan jendela,kendali, dan lain-lain dari interface.•Contoh tools : Microsoft Visual Studio,Jbuilder, UIMX, Delphi.
  • MICROSOFT VISUAL STUDIO
  • JBUILDER
  • KEUNGGULAN PROTOTYPE• Adanya komunikasi yang baik antara pengembangdan pelanggan• Pengembang dapat bekerja lebih baik dalammenentukan kebutuhan pelanggan• Pelanggan berperan aktif dalam pengembangansistem• Lebih menghemat waktu dalam pengembangansistem• Penerapan menjadi lebih mudah karena pemakaimengetahui apa yang diharapkannya.
  • KELEMAHAN PROTOTYPE• Pelanggan kadang tidak melihat atau menyadari bahwaperangkat lunak yang ada belum mencantumkan kualitasperangkat lunak secara keseluruhan dan juga belummemikirkan kemampuan pemeliharaan untuk jangka waktulama.• Pengembang biasanya ingin cepat menyelesaikan proyek.Sehingga menggunakan algoritma dan bahasa pemrogramanyang sederhana untuk membuat prototyping lebih cepatselesai tanpa memikirkan lebih lanjut bahwa programtersebut hanya merupakan cetak biru sistem .• Hubungan pelanggan dengan komputer yang disediakanmungkin tidak mencerminkan teknik perancangan yang baik