CS226 Assignment 2 - Build a Prototype
Schedule
Handout Time
Hand-in Time
Overview and Objectives
This assignment requires the application of usability engineering techniques to the development of a website for members
attending a science fiction convention.
By the end of this assignment students should be able to demonstrate that they are able to:
1. analyse the interface requirements of a website.
2. realise this analysis in a prototype which could demonstrate use of the site to the clients commissioning it.
The submission is a short report plus a PDF prototype.
Background Scenario
Traditionally attendees at a science fiction convention would be issued with a small paper booklet called a “Read Me”
when they arrive (along with their membership badge etc). The Read Me would contain useful information about the
convention that weekend such as
• a map of the hotel
• details of when and where food would be served in the hotel
• details of the convention bar
• list of nearby cash machines, eateries
• information and rules for the convention
• what is happening in the convention (“the programme”)
The last bit was the most important piece of information - it informed the members what panels, quizzes, games, talks,
special presentations etc that are happening over the weekend, where in the hotel the items would be, the time the
item would be at, who is involved in the item etc. The members would use this information decide what bits they wish
to attend, and when to just chill in the bar(s).
You can see some example ReadMes here:
• https://fanac.org/conpubs/Eastercon/Evolution/Evolution%20Readme.pdf
• https://fanac.org/conpubs/Eastercon/Mancunicon/Eastercon%202016%20ReadMe.pdf
Users
All users will be using desktop or laptops to access the site, with a maximum screen resolution of 1280x1024. They
will be using a “fine” pointer.
All users are ordinary members of the general population who have typical experience of using the web.
Task
You are to design a web site that will allow an attending member to decide and record what items at a convention they
wish to go to.
The site should allow the user to browse the programme of items (possibly using different criteria such as time,
participants, type, topic, etc) and record what items they would like to go to. They should be able to see what items
they have selected and remove any from their list if they no longer wish to go to. The site should allow people to record
items that clash in time as the user might wish to decide between the two (or more) items at a later date.
Convention members will have already been issued with accounts to use the system. Programme item participants (ie.
those on the discussion panel, giving a book reading, giving a presentation, etc.) will already have those items in their
list of things to attend.
Things to create
You are provided with an outline requirements specification for a new website (see Background) that you must take
through to a prototype implementation. You should therefore produce
1. A user-centred design analysis. This should include:
1
a) a use case diagram identifying the types of user and their associated cases;
b) a task analysis for each type of user. The diagram should be accompanied with plans (see lectures). For
each user, the top-level task can be “Use website”.
2. Clear documentation of any proposed clarifications and extensions of the requirements specification. This would
be a reflection of discussion which might have occurred with the client during the early development of the project
when the original specification was seen as lacking in detail or precision. For this assignment, you do not have the
opportunity for such discussions, but you may provide your own answers to the questions you would have put.
3. A prototype implementation, created using Google slides, of the interface showing at least the wire-frame design
of pages, navigation, and example content. You will need to export this slide deck as a PDF in order to test it
and submit it.
Submission
You should submit to Blackboard:
1. a single report (in PDF format) comprising of:
• the analysis (use-case diagram, HTA);
• requirement specification updates/changes/clarifications;
2. a clickable PDF prototype:
• The PDF prototype must be able to work stand alone (i.e. not make links to external web or other resources).
• The prototype site should be navigable (i.e. clicking on parts of a “slide” should take you to another “slide”).
Where a component has several alternative behaviours (for example success and failure of an action), indicate
in the documentation how these are realised in the prototype.
• The prototype should mimic interactive behaviour that would feature on developed system e.g. menus, forms
etc. For text fields where users are expected to simply type in text this can be faked by “filling” the textbox
when clicked on - multiple text boxes would follow the natural order a user would take.
• If you develop your prototype as more than a single set of PDF pages (for example to show operation for
different user types or different circumstances), these should be combined into a single PDF with a “table of
contents” page(s) at the start of the file with links to each of the other.
• Google Slides must be used for producing the navigable prototype in PDF. No format other than PDF will
be accepted.
Marks
This assignment is worth 25% of the final module mark.
• Report 10 marks
– use case diagram
– hierarchical task analysis
– formatting
• Prototype in PDF 15 marks
– functionality/scope implemented
– aesthetics
– usability
2