......uc berkeley ........is 213 course project... ... school of information management and systems


bin xin
 
rosa ren
 
monica fernandes
 
hong cai
 
   

Prototype

..................................................................................................................................

Our low-fi prototype is made out of paper clippings based on the existing SFnight prototype. During low-fi design process, user interface components are drawn in several Microsoft Word pages with tables. Each table cell is populated with mockup data, instructions, mockup content, images and icons with font, color and styles according to initial design ideas. Our low-fi prototype is not a functional prototype. It is designed to provide some screen designs that can be used to prompt user discussion. 

The low-fi designs are then printed out on paper using laser printer. Each page has several copies. Each component in the interface is then cut into individual pieces. These components are to be used to assemble alternative page organizations. 

The title image and navigation bar are the same across the website. They form the main frame that contains interface components. Several copies of SFnight prototype main page are printed out on paper as the base layer for interface components assembly. Contents other than title image and navigation bar are cut off to make room for component assembly. The remaining frame is then inserted into clear, plastic sheet protectors. Components are attached to the base layer with tape. Each page represents one interface screen that will be displayed to testers. 

Interface components are taped onto the plastic sheet protector in positions predefined in our initial design. These components can be relocated and manipulated according to the needs of team members when reconsidering design decisions. Various screens for interactions we want to test are assembled in this manner. These paper mockups are then ordered according to interaction diagram.

In the testing session, the mockup page for main page is attached onto the screen of a computer monitor. The use of a computer monitor to physically support the low-fi prototype gives tester the same eye position of a real interface. The subject is seated in front of the computer and interacts with paper mockup. When he/she makes a decision to follow a link in the mockup, she just need to point to a link with a pen signifying pointing and clicking using mouse. 

One of the team members plays computer. During the test session, he observes actions of the subject. When the subject "clicks" a link in the mockup, the team member changes mockup accordingly. In some occasions, the subject may click a link that has no correspondent mockup ready for display. In such occasions, the team member orally describes what the system does and what will be displayed in computer screen. When the subject finishes a task, a different team member playing the facilitator role will inform the participant and direct he/she to the next step. 
 



 
 

 
........updated: Mar 6 , 2001
Journalism and Business Models in New Media Publishing image from Gettyone.  Please visit their site to get permission