MethodsParticipantsUser 2User 3Computer Science 160: User Interface Design and DevelopmentGroup Three: Low-fi Prototyping and Usability TestingOctober 12, 2001Chris Kirschenman (cs160-ak): computerRichard Hwang (cs160-ax): facilitatorWayne Kao (cs160-al): observerHank C. Wu (cs160-av): greeter, observerhttp://ratbert.bmrc.berkeley.edu/courseware/cs160/fall01/Projects/Group3/IntroductionBiosk is based on the concept of integrating an entire biologist’s desktop into a simple to use andportable medium. We will be serving this content via the web so the user can get a unified experience whether they are adding data through a PDA while they work on an experiment, or adding a research paper to their virtual notebook at home. Once this data is in electronic format the data becomes easy to manipulate, allowing and encouraging sharing between researchers. Our low-fi evaluation is the beginning of many steps of iteration towards shaping this system into one that perfectly complements the user.Mission StatementOur goal is to increase the productivity and communication potential of biologist researchers. We propose to do this by integrating software and hardware solutions individually designed for specific labs. The initial design will be evolved over time based on input from the people whose opinions matter most: the users. A modular approach will be utilized to allow for easy expansion in the future. Ultimately, our users will be freed from having to do and redo tedious work on paper.They will be empowered through our integrated, centralized system, which allows them to achieve their tasks with maximum efficiency. Such centralization allows our users to share their findings easily and quickly. We are confident in our team composition and its eclectic knowledge base, including two members who have extensive knowledge of and experience in the biological research environment, and two who are well versed in communicating technical information to technical and non-technical audiences. Furthermore, all of us have extensive programming backgrounds in the necessary technologies. With these we have the technical expertise, problem solving, and interpersonal skills required to accomplish the Biosk project.Prototype DescriptionOur low-fidelity prototype is included with this report. Each page is numbered, and we will refer to them as figures.We originally started out trying to use DENIM for this project. Unfortunately we ran into several obstacles along the way. First, there are several formatting bugs regarding saving and formattingwhen you enter text manually or use the provided text boxes. Second, our interface will ultimatelyhave a lot of dynamically generated text and widgets like pop-up menus, to realistically portray things in DENIM would have required many more pages than were required for the paper prototype. Of course significant work had been done in DENIM before we discovered these problems. We were able to take what we had done in DENIM to help us better refine our paper prototype, however.The first step for the paper prototype was to rummage around our place for things we could use. The things we relied most heavily on were white computer paper and post-it notes; also computerprintouts were used for some especially long pull down menus. The entry point into our system is the login page so that’s where we started (Figure 15). While we didn’t use it in our scenarios, we created a new user page also. In keeping with our theme of always keeping the user informed we also created a confirmation page.The central part of our interface is our navigation area. We have a series of tabs along the left side of the page (although we may change this to the right page due to different platform screen widths. This was drawn as a separate sheet that other sheets could be overlaid (Figure 11). Thisallowed us to keep this part constant ensuring that the user would never have a problem quickly getting to another area. CS160 Group Three, Low-fidelity Prototyping and Usability Testing2For effect, we also made a browser simulated top section with standard back and forward buttons(Figure 21). Next we designed the experiment page. This is the default page users see when they first log in to Biosk (Figure 2). We had quite a bit of dynamic data on this page so Post-its were used extensively. We split this page into two relevant sections. One contains a textbox of experiments, in which you can select any of the experiments and view or delete them. You can also sort the list by title or date, or add a new experiment. On the right hand side of the page is a journal that logs experiments that were done recently. Post-its were used for the experiment so that they could be moved easily if the user chose delete or sort. We also had extra Post-it’s on hand in case the user created a new experiment. Because the sort featured a pull down menu to select what to sort by, that was also made with Post-its. Several Post-its were folded with the default actions on the outer folds, inside all the options were listed; this very effectively portrayed a selection menu. Finally, Post-its were also used for the dates so that journal entries could be added quickly. A floating Post-it simulated the Delete confirmation box, for this and all other pages with delete options. If the user clicked on the view button the name post-it was moved from this page to the top of the view page to simulate the variable there. The view page is a kind of portal page grouping together the many aspects of an experiment. Post-its were used here also so that the names present in the different areas could be changed easily. In order to allow for the user to get comfortable quickly with the interface we tried to keep a consistent look throughout the pages (besides the sidebar. So, for the sake of brevity I will only point out differences in pages from the above experiments page. The protocol (Figures 3 and 7) and protocol template page has an interesting (optional) grid feature that users could use, if they use that they first set up the row and column labels, then they could enter values into the produced grid. Another feature we added were 1/8th page we cut up one sheet into several pieces so we could simply shift the page down and show a confirmation at the top (Figure 21). The notes page (Figure 12) can be went to from an experiment or through the notes tab, we useda Post-it at the bottom of the page that was folded
View Full Document
Unlocking...