WEB PROTOTYPING

FIRST SITUATION

1) What is a web prototyping?

• Prototyping involves the creation of an interactive experience that effectively communicates the structure, information and functionality of a website in a way that enables the remaining steps in the process, specifically design and development, to proceed without the possibility of emerging on the other side with contradictory results. Essentially, prototyping means building a model of the website before you build the actual website. From a developmental standpoint, a prototype isn’t actually built in the same way that a sophisticated website would be. A simple prototype might be a collection of clickable HTML pages that describe more complex, database-driven functionality for example, by depicting the results of a search rather than actually receiving and processing queries without being concerned with design-related issues of look and feel, colors, typography, images and the like.

2) Why do we need to prototype?

• Website prototypes are typically interactive demos of a website early in the project lifecycle. They are used to gain agreement and gather opinion from the various project stakeholders, including the end users. Typically a website prototype will go through a couple of rounds of usability testing to ensure everything is working before the project moves into development. Although it can take some time to choose the right tool and learn it, this time is far outweighed by the costs involved in launching an untested website which doesn't work.

3) What are the advantages and disadvantages of using low-fidelity prototype and high-fidelity prototype?

Advantages

i) Low-fidelity prototype

• Takes only a few hours
 No expensive equipment needed
• Can test multiple alternatives
 Fast iterations
 Number of iterations is tied to final quality
• Almost all interaction can be faked

ii)High-fidelity prototype

• Permit test and exploration
• Aid with customer / user buy-in
• Produces useful user evaluation results
• Look and feel of final product
• Can be used as marketing / sales tool
• Can be easily converted to a real system


Disadvantages

Low-fidelity prototype

• Users might judge a low-fidelity prototype as unprofessional.
• While Low-fidelity prototypes allow spontaneous changes for exploring interactions, they also sacrifice some realism.
• Limitations in navigation and flow while a control person has to “make the interaction”

High-fidelity prototype

• User frustration as product appears to be finished when really it was only a prototype
• Expensive and time consuming to develop
• Inefficient for proof of concept designs
• Not effective for requirements gathering
• Very difficult to actually discard and start again
• Users can be reluctant to change design

SECOND SITUATION

To solve this problem, Chong Wei need to sketch the storyboard for easy explain the function web page.
Then, Chong Wei need to follow te flow which web page must be appear first.
Chong Wei also need to explore the elements of web design which is whether to use hierarchical,
linear and random of website organization. Chong Wei must explore the colour of interface which is compatible to attract user.

LAB HTML

LAB Coding : home.html

Coding : yurts.html

Lab 2

1.APPEALING WEBSITE

http://www.cadbury.com.my/

Cadbury official website

2.UNAPPEALING WEBSITE

http://www.bigappledonuts.com/

Big Apple official website

Header

Code:

Unordered list

Code:

Order letter

Code:

Black Quote

Code:

Resipi Nasi Ayam

Bahan-bahan ( 2 orang )

• 2 cawan beras
• 1/4 bawang besar
• 2 sudu mentega
• sehelai daun pandan
• 2 kiub ayam
• madu
• kicap pekat
• 1/2 ekor ayam
• 1 sup bunjut adabi
• sos tiram
• 1/2 sudu serbuk lada putih
• 1/2 inci halia
• 3 ulas bawang putih
• [hiasan]
• daun bawang
• daun sup
• bawang goreng
• daun salad/timun

Cara-cara

1. Bersih ayam. Potong ikut suka
2. Tumbuk bawang putih dan halia. Tumis dengan sedikit minyak sehingga bawang jadi perang
3. Masukkan air, ayam, sup bunjut dan kiub ayam. Masaklah sehingga ayam masak
4. Untuk masak nasi, bersihkan beras. Ambik 2 cawan sup ayam tadi untuk masak nasi. Masukkan daun pandan. Masak seperti biasa.
5. Keluarkan ayam. Perapkan dengan madu, sos tiram dan kicap. Goreng dengan minyak penuh
6. Untuk sos kicap. Mayang bawang putih. Tumiskan sehingga naik bau. Masukkan kicap dan sedikit sup ayam tadi

Resipi Cheese Tart

Bahan-bahan ( ~ 60 - 70 biji bergantung pada saiz tart )

• Sugar Dough (asas buat tart)
• 250g butter
• 1 cawan gula kastor
• secubit garam(Jika guna majerin tak payah bubuh)
• 600g tepung gandum
• 2 biji telur (apa2 gred tapi biasa guna gred B)
• Cheese filing tart
• 250g cream cheese
• 70g gula kastor
• 1 biji telur
• sedikit coffe @ coklat emalco( ikut suka utk lorekan)
• 2 - 3 sudu besar susu cair

Cara-cara

1. Untuk sugar dough. - Putar butter dengan gula hingga kembang kemudian baru masukkan telur sebiji sebiji pukul lagi hingga kembang dan ringan.
2. Masukkan tepung dan gaul rata hingga jadi doh. Ketika mencanai pastikan baki doh di tutup dengan kain @ plastik coz cepat keras bila kena angin.
3. Terapkan dan bentukkan dalam bekas tart berbentuk macam kat kedai tu..(lanser dengan sikit marjerin dasar bekas tart agar tak melekat...
4. Tekan sikit dasarnya agar berbentuk cantik.
5. Bakar dalam oven hingga sedikit kekuningan jangan sampai garing. ~ 20 minit.( Boleh buat awal dan simpan dalam bekas kedap udara)
6. Cara buat Cheese filing tart.( Ketika menunggu pastery cup masak bolehlah buat cheese filing ni)
7. Putar cheese, gula, susu cair dan telur hingga licin.
8. Masukkan @ paipkan dalam pasteri cup dan bubuh sedikit coffe flavour @ apa2 yg disukai..lorekkan ikut kreativiti..Bakar semula kira-kira 10 ~ 15 minit..hingga cheese tu tak melekat.

Website Pilihan Kami

Untuk menjadikan blog ini lebih menarik, kami telah meletakkan unsur-unsur widget di dalam blog ini. sebagai contoh animasi Selamat Datang dan juga unsur Muzik supaya pengunjung tidak berasa bosan atau jemu dengan blog kami ini. Link untuk halaman blog widget--> http://widgetindex.blogspot.com/

web yang menyediakan widget

Selain daripada itu, kami juga amat menggemari website yang bercorakkan gosip artis. website pilihan kami adalah Beautifulnara.com. Abang Nara yang merupakan admin blog ini bijak memainkan peranannya melalui berita-berita gosip artis yang disampaikan dengan cara teratur.  Link untuk halaman blog gosip artis -->http://beautifulnara.com/

Beautifulnara.com

Ha, apa lagi! Cepat-cepatlah melawat web pilihan kami ini. pastinya anda tidak akan menyesal dan berputih mata bila melawat website-website ini.

Welcome To Our Blog..

Selamat datang ke Blog Resipi Memasak kami..

Kami baru sahaja membina blog ini untuk subjek Rekabentuk Web...
Harapan kami adalah semoga anda dapat menimba ilmu masakan di sini....
Berikut adalah soalan-soalan yang perlu kami jawab.

Visit a website that interests you.  Print screen the home page or other pertinent page from the site.  Write a one-page summary and your reaction to the site.  Address the following topics :

•     What is the purpose of the site?

The purpose of this site to inform and share with the audience about the cooking recipe.

• Who is the intended audience?

Women.

• Do you think that the site reaches its intended audience ? Why or why not?

Yes. Because the title about this website is related to the creativity or the skills in the cooking field.

• Is the site useful to you? Why or why not?

This site is useful for us due to this issue, we also may try to do the new recipe.

• List one interesting fact or issue that this site addresses.

The interesting fact that content on this website is it is related to the cooking recipe. Moreover, it also has the image of every recipe.

• Would you encourage others to visit the site?

Yes. By share it through the Facebook.

• How could this site be improved?

It may be improved by do some decoration widget for this website.