The overall task is divided into two project phases (i.e. two separate, but related projects). It is strongly advised that you read the following project description in conjunction with the description for Project B. You are to complete the following task in the order given: • Carry out user and task analysis. You must have a clear view of the users of this system. Consider that not everyone is comfortable with the technology. For example, you need to deal with user variation such as age or language skills. Perform a user analysis, i.e. characterise the users and identify your potential users. Clearly identify the tasks the potential users perform, and in what order. These are all HCI considerations that you should take into account. • Propose design and system requirements. Consolidate your findings from your user and task analysis with the given specifications into a design and system requirements. For example, the number of items to display, the screen size, what colours, how many different screens to display etc. • Develop a low-fidelity prototype. Based on the requirements, develop a preliminary design of the specified web user interface. Use any combination of HTML5 and CSS3. At this stage, the prototype is basically a medium to support your initial concept and ideas. For example, the prototype should show where the 'basic' button is located; or would it be possible to fit 20 images aesthetically on a single page, etc? The prototype need not be fully functional. At this stage, you only need to demonstrate the initial concept of your interface designs. Remember to indicate which browser (i.e. IE, Firefox, Safari, Chrome, etc.) you are targeting as the main working platform. For the purpose of this project, exclude mobile devices that run on fragmented or closed-system technology, such as Android, Apple iOS and Nook. Do not use Rapid Application Prototyping (RAD) tools or any other type of scripting languages or services, eg. Python, Lua, AJAX, Dreamweaver, etc. You are required to demonstrate your knowledge of HTML5, CSS3 and JavaScript independently and without the assistance of automated development and visual design tools. • Obtain user feedback. Invite 3 – 4 potential users (e.g. friends, family members, classmates, etc.) to provide you with feedback of your prototype (i.e. the initial draft design). These potential users should be a mix of person with computer skills and with little computer skills, so you can get more representative feedback. You should not approach this task haphazardly. Carry out the evaluation according to prescribed methods as in Chapter 4 of your textbook (Shneiderman & Plaisant, 2010) or from other scholarly source. Use appropriate survey techniques. 5 • Recommendation. Analyse the data you have collected from the previous user evaluation and produce a set of recommendation on how you should refine and improve on your initial design. This recommendation will be carried over to the next phase in Project B for implementation. • Write a report. Produce a report to document the tasks and the outcome of your efforts undertaken for Project A. Format of Report For the purpose of this project you are assumed to be a professional. As such, you should attempt at your best to reflect this quality in the preparation of the report. As a minimum, the report should contain the following: (1) Introduction – State the purpose and objectives of the report. (2) Content – This is the main section where you should document the various stages and outcome of your activities. Do not include raw or unprocessed data. You need to analyse, evaluate and summarise the outcome of each of the task. If you really need to include critical or important raw data, then do so by appending them to an appendix at the end of the report. Keep a record of your raw data. If required, your instructor or marker may request that you provide them with a copy. (3) Recommendation. (4) Conclusion – This is basically a summation, consolidating the main points of the report. (5) There is no minimum or maximum limit to the number of words required in this report. However, the length of your report must be within reason and of adequate length to succinctly support the complete account of tasks you have undertaken. (6) Figures or diagrams can be added as required. Page formatting: A4 size paper, 2.5cm margins on all sides, single-sided, Time Romans or New Time Romans font, 12pt font size, DOC or DOCX format. Learning Objective Note that these are not programming project in themselves. The primary purpose of both Project A and Project B is to ensure that students adopt best practice and adhere closely to HCI principles during the process of designing and developing the interactive user interfaces. Full functionality is not expected from either Project A or Project B. For example, knowledge of database backend servers and web servers are not required in this course