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


bin xin
 
rosa ren
 
monica fernandes
 
hong cai
 
   

FIRST INTERACTIVE PROTOTYPE 1 | 2

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

Prototype Overview

The prototype that we implemented is based upon the discussion so far. In this prototype we focused on resolving many of the issues users discovered with the "email list" and the MySFnight page. Our new understanding of the interaction model guided some fundamental design changes in many areas. From the graphic design elements like labels, color, and icons to the more fundamental underlying calendar and email-list concepts, the team explored a number of design solutions to address some of the usability issues discovered during low-fi prototype testing. The limited time to develop the interactive prototype did not allow implementation of all final design solutions, but the ones that are implemented should help give evaluators a sense of the interaction flow we are aiming for.

Tools We Used

Macromedia Dreamweaver 3
Macromedia Fireworks 3

How the tools helped We choose Dreamweaver since a number of elements and design styles have already been created in Dreamweaver for the SFnight prototype. Most team members are also comfortable using the tool. We used Dreamweaver to create wireframe pages. We used Firework to draw icons and create other graphic elements. Interaction is achieved by making mock up HTML pages that demonstrate changes. These mock up pages are linked to the components with which user interacts.

How the tools did not help Dreameweaver does not provide much flexibility to implement user interaction, except for linking up mock up pages.

Problems with the tools When designing using densely nested tables, Dreamweaver can have problems that are difficult to pinpoint and fix.

Prototype Screen Shots

Addendum: Part of design process is benefited from discussion with Kevin Fox. Group members want to voice our gratitude to him while taking the sole responsibility of all the errors that might occur.

How to Run our Interface and The Scenarios

The prototype is implemented using Dreamweaver and HTML. Evaluators need to just pull up the prototype website. Evaluators should review the Experiment Kit for low-fi prototype testing and perform tasks 1 and 3 that participants attempted during low-fi prototype. Evaluators should keep in mind that at this stage, any data pertaining to events and venues are mumble text. This includes search results. The focus should be on interaction flow and general information layout. We have attempted to simply areas of the site not related to user customization or the main focus of this prototype. For example, all buttons/links related to SFnight Network (intended for players) are not activated. The newsletter feedback page is not implemented. In the areas that are meant to be tested, enough working links are provided to complete the task. However we cannot be too explicit since part of the test is to see how well users can get to what they needed easily.
 
 
 
........updated: Mar 22, 2001
Journalism and Business Models in New Media Publishing image from Gettyone.  Please visit their site to get permission