Prototyping for the Web

Ooo pretty colors! (which is an interesting way to present the numerous different ways of a web layout) This article gives a nice comparison of a wireframe and prototyping to the floor plan of a house.

A prototype must communicate the website experience and work like a website. Unlike a wireframe that only gives the structure of the site but without the experience. I found this article really helpful because it also gives examples on how differently the look and purpose of a web can look despite being based on the same wireframe.

This article basically fives a simple and easy 4 step instructions to making a wireframe; from sketches to the mockup. It was really helpful as a way to quickly refresh my memory on prototyping because he give easy to read and follow explanations and pictures on how he does it so the reader can visually see the prototyping of a project from the start to the final mockup.

This article talks more about content prototype which is an HTML and CSS based fluid-grid prototype. Which means that when we’re creating the mock ups, the dimensions doesn’t matter as much. It explains on how to use this method of building websites. It wasn’t really useful for me because it was extremely confusing for me to grasp the idea. Although I do understand it a bit, I think that I would need to have a clear understanding of the normal way of building websites for me to understand this method.

Leave a Reply

Fill in your details below or click an icon to log in: Logo

You are commenting using your account. Log Out /  Change )

Google photo

You are commenting using your Google account. Log Out /  Change )

Twitter picture

You are commenting using your Twitter account. Log Out /  Change )

Facebook photo

You are commenting using your Facebook account. Log Out /  Change )

Connecting to %s