Hello, dear friend, you can consult us at any time if you have any questions, add WeChat: daixieit

COMP1710 Assignment + Report: Semester 1 2023

Summary of submission snapshot deadlines:

· Assignment Part 1: 5pm Friday Wk 5

· Assignment Part 2: 5pm Friday Wk 7 

· Assignment Part 3: 5pm Friday Wk 11 plus presentations Wk 12

· Report : 11:55pm Sunday Week 12

Assignment

The purpose of the overall assignment is to demonstrate what you have learned in this course. You will do this by creating a coherently themed web site using the design ideas and construction techniques you have learnt in the lectures and labs. The assignment is worth a total of 30 marks and will be submitted in three parts. We will mark by looking at the main site via your index.html page. Make sure it is not spelled with a capital 'I' and that you can see the contents via a browser. We may not be able to find parts of your website you need to get marks for so you must make sure that all of the content you want marked is linked via the separate assignment.html page, this is like an "assignment cover sheet" that accompanies your website.

The theme of your assignment will be Me and/or my passion.

What does this mean? Well, here is your chance to build a website introducing yourself or your great interest to the world. Whether your passion is for model aircraft building, haute couture, quantum physics or medieval Hungarian literature — tell (and/or show) us about it.

If you have an alternative topic or subject you are keen to work on you can email me and we may be able to negotiate the alternative (make sure you keep the email in which I agree to your alternative topic).

The tasks listed below set out the minimum requirements for each part of the assignment. You can always do extra things, and we won't ignore them in marking - so they may earn you extra marks to compensate for other things you don't do as well. To make sure we don't miss it, mention these things in the assignment.html page.

Unfortunately, web browsers are still not 100% identical in their behavior, so web pages may behave differently on different browsers. For this course, please use Chrome, Firefox or Safari for development, and please specify in assignment.html what is the best way to view your website (e.g. Do you use Chrome for the browser? Is your screen resolution 1366 x 768?)

Report

The Report task involves COMP1710 students taking part in two or more Human-Computer Interaction research experiments, and then writing a report on their experiences as experiment participants. In this report the students will (i) describe the purpose of each experiment and their personal experience of taking part in the experiment, (ii) compare their experiences across the different experiments and (iii) write what they have learned about the relevance of participant-focused experiments like these to the overall process of designing and building a set of web pages.

For most students, it's easier to write the report after having participated in the experiments. We will use the Research School of Psychology's experiment management software (SONA) for you to participate in experiments.

---

1.0 Part 1 Tasks

1.1 Info and Review

The first step of the assignment is to fill in the assignment topic form. The form does not work well in Internet Explorer! Please review the Fair Use document document to understand what is tolerable to do and what is strictly prohibited in the context of this Assignment.

1.2 Introduce Yourself and/or Your Passion

Introduce yourself and/or your passion, interest or hobby etc. Write a mission statement or list of goals similar to the idea of a brief statement of the mission and list of goals in chapter 1 of the Unusually Useful Web Book. This section should probably take 200-400 words or so.

1.3 Create a CSS

Create an external (separate) CSS file. Use at least 10 CSS rules. Make sure your CSS includes comments that would be useful to someone taking over the maintenance of your site, things like the purpose of each rule, exceptions to its use and the choice you made as to which selector you specified.

If you create more than one CSS make sure they are deployed in a Cascading manner, i.e. there should be at least one default CSS that will be applied to all the pages in your site, with specialised CSS then being applied to specific pages of the web site.

1.4 Build a Site Map

This page should clearly depict the organisation/structure of the web site, possibly using a table or links (or both) or an image map. Make sure you update the site map as you expand your web site in Parts 2 and 3. 

1.5 Provide a Source Log

You will need to keep a log. A typical log describes the list of sources you used for your project and the modifications you applied to them. The origin of the source should be given in enough detail to ensure the marker can access the source whenever it is possible (URL, ISBN etc). Make sure you update the source log as you expand your web site in Parts 2 and 3. 

1.6 Provide an opportunity for feedback

Create a page which takes feedback from visitors to your site via a form.

1.7 Separate assignment page from passion pages

The top page of your website is the usual index.html. You will also include an assignment.html file that will be explained to you in the first lab. Use and modify the assignment.html page which lists all the assignment requirements for this assignment, and make sure it provides direct links to your content. E.g. the source log or feedback page may not be relevant to your passion so you can avoid showing it to normal users coming in via the index.html page, but for marking purposes we need to find this content so it should be linked to from your assignment.html page.

The choices you make can be briefly explained in your assignment.html page, but don't write too much there, as we are marking your web page for your passion and the assignment.html page is mainly to help us find all the components we want to mark.

The MOOC materials and tasks have significant overlap with the Assignment Part 1. You will need to add some extra components to the MOOC tasks and that is your Assignment Part 1.

1.8 Active Participation

Provide URL links to your two best Piazza posts.  You may wish to use your response to the poll to be posted prior to Wk 5 as your second Piazza post.

---

2.0 Part 2 Tasks

In the second part of your assignment you will add content and possibly enhance your design.

2.1 Provide an Image Map

Create a page which displays one or more image maps. Make sure that there are at least 3 links, with proper labels in your image map.

2.2 Provide a Photo Gallery

Take or select at least 10 relevant photographs. Convert the photographs to *.png format. Use a template or a suitable tool like Galerie to present them with appropriate titles and any comments you wish to make. Your photo gallery should have the same look and feel as the rest of the web site. The easiest way to achieve this is to ensure it uses the same CSS. Or it may be appropriate for you to link to content stored elsewhere on the internet.

2.3 & 2.4 Videos or Javascript

For 2.3 and 2.4, COMP1710 students can choose either to develop a storyboard (2.3a) and a video (2.4a), or write some javascript to add interactivity (2.3b and 2.4b).  Please note that you WILL NOT get extra marks if you do both so please indicate which components you would like us to assess.

COMP8110 students must write some javascript to add interactivity.  (You might like to create a video for your something original in part 3 of the assignment.

2.3a Develop a Storyboard (for your video)

Create a storyboard for your video as a comic (see the relevant lab). The key thing is to present your plan of how you intend your video (see 3.1) to look after editing.

The comic and the video (see next task) should represent the same story. It should be possible to understand the video by reading the comic, and understand the comic by watching the video.

2.4a Make an edited, inline video

Shoot (or collect) and edit a video and present it on the website. The video (i.e. about your subject, its the same video) should contain at least one title and one transition. It will be inlined within a web page. Use your creativity and originality to do something interesting, useful or just funny.

For video cameras and especially digital still cameras with movie mode, don't forget to use a tripod or video stabilisation. Keep in mind that video cameras are not the only source of video. For example, many modern digital cameras in movie mode will produce video recording which are fine for web delivery. Then there is video capture from a running program, and so on.

Last year almost everyone had access to a video camera or digital still camera with movie mode from family / friends / church / work / etc. If you end up unable to find someone with one, please e-mail me and I will try and help.

I suggest 5 minutes absolute max for the final video. You should also provide a few words on your site describing what the video is about and/or trying to achieve.

2.3b Javascript addition （optional INSTEAD of 2.3a）

We will be looking for an excellent JS addition to your website that complements your theme. We expect you to speak with your tutor about your proposed JS element(s) so that you can determine whether your proposed JS addition is ‘right-sized’ for this assignment part.

2.4b Well written Javascript (optional INSTEAD of 2.4a)

The javascript code needs to be functional, well structured, properly commented, and clearly indented.

2.5 More active participation

Links to 1 more Piazza posts go here.

---

3.0 Part 3 Tasks

3.1 Provide a reflective "About my site" page

This should be a couple of paragraphs reflecting on what you have learnt about website design while actually doing it. E.g. are there things which if you had realised earlier you would have done different?

3.2 Provide an alternative CSS page

Create at least one extra CSS page which transforms the appearance of your website, either in an interesting way or into a more printer-friendly format. Please specify how we can view the two different effects (original and alternative) of your css.

3.3 Provide a Social Networking button

Your site could do with more exposure, or at least once you release it into the wild beyond the ANU limited space of partch/liskov. Please provide a working button for a social networking or similar site such as done in the lab or lecture related to this topic. If your theme is such that none of this is relevant then please link to this from your assignment.html file, and of course mention why it was not relevant for you.

3.4 Provide a Social Networking feed(s)

Please provide a working social networking feed you have learnt about in the relevant lab. If your theme is such that none of this is relevant then please email me and we may be able to negotiate the alternative (make sure you keep the email in which I agree to your alternative topic).

3.5 Validate your CSS and your HTML pages

Run your CSS and HTML pages through the W3C validation service. Create a page (or another photo gallery) showing some screenshots (if you're not sure how to take screenshots - google it) of the validation report. If you need to leave some validation errors to achieve the look you want, make a comment in your assignment.html file to explain.

3.6 Provide something original

Get creative and add a component or content which differs from the tasks listed above. It might be an extra page presenting some interesting content you made or wrote yourself, or which provides links to sites you have found useful while making the site, or which are about related or relevant subjects. or it might be something made with a tool you have researched and learnt to use yourself. Don't get stressed - this is meant to allow you to be creative in some way, and get marks for it.

---

4.0 Report (detailed instructions)

In the process of developing an interactive computer system, which includes web development, it is essential to conduct user evaluations of those systems. In the activities for this report task you will be involved as a participant in two or more experiments that add up to approximately 2 hours. All the experiments from Computer Science or from Psychology have strong similarities with the types of user evaluations that you would conduct for your web development. When you take part in these experiments you are expected to treat them as learning exercises for yourself. You will pay attention to the purpose of the experiment, you will observe what it is like to participate in that experiment, you will think critically about the way the experiment is conducted and you will reflect on what you can learn from that experiment that might be relevant to user evaluations of web pages and web sites.

Writing the report will give you practice in formal writing about your observations, experience and reflections of taking part in these experiments. In the report, you will choose two experiments that you have participated in, and write in detail about the two experiments.

4.1 Structure

Your report should contain these components:

A title and your name.

Abstract: This will typically be one paragraph that says what the report is, why it was written and what it is about. Write this abstract last so that it actually matches what is in the report.

Introduction: This will be slightly more detailed than the Abstract. It will explain what the report is about, it will list the experiments in which you took part and it will summarise the contents of the report. Proof-read this introduction when you have finished writing the report to make sure it actually matches what is in the report.

First Experiment*: This has three sub-sections.

· Summarise the experiment. Here you describe the purpose of the experiment and describe what you were asked to do. Refer to the Information Sheet that the experimenters will have given you.

· Describe your experience of taking part in the experiment. Were you asked to do mechanical tasks or were you asked to be an intelligent participant? Did you enjoy taking part in the experiment? Did you find the experiment difficult or easy? Did you understand what you were asked to do?

· Comment on what you thought were the strengths and weaknesses of the experiment. Did you think that the experiment actually met the aims that were stated in the Information Sheet? Was the experiment well-conducted or was it chaotic and confusing? Did you think that the data the experimenters were gathering was reliable?

Second Experiment*: Also three sub-sections, like the first experiment.

Comparison of the two Experiments: Describe in what ways the two experiments (and your participation in them) were similar or different. Compare how you felt about taking part in each of the experiments. Compare how well you thought the two experiments were run.

Relevance of user-participation experiments to web design and development: Discuss what your experience of taking part in these experiments implies for the relevance of user-participation experiments in web design. The broad computer science area of Human-Computer Interaction (HCI) includes web design and user-evaluation experiments (similar to the experiments in which you took part) are really important in the HCI development process. You might like to look for material about user-evaluation in HCI on the web or in text books and include it in this discussion. Be sure to cite any material that you refer to and include that material in your reference list in the last section of your report.

References: In this section you list any documents or web pages that you referred to in the body of the report. Be sure to list every item that you refer to (including the Information Sheets that the experimenters give you) and be sure to refer in your report to every item in this list of references.

4.2 Layout and size of your report

Your report will typically be 3-4 A4 pages, using a 12-point font and approximately 2 centimetre margins. Use headings and sub-headings to give visual structure to the report. Break your text into paragraphs, where each paragraph focuses on a particular item or concept. Put page numbers in the footer of your report.

4.3 Provide a link to your report file

You should upload your report as PDF document to your partch public_html folder, name it u1234567-report1710.pdf (use your UniID instead of u1234567), and put in a link to it from your assignment.html file so we can find it. Do check that link to make sure the file is readable via a web browser.

* If you are unable to participate in experiments (though keep in mind many are able to be done remotely) or don’t wish to, the alternative is to read papers we give you: the Wattle course page will list two papers you can read, for the primary and secondary experiments. You thus write the report by imagining you were participating in the primary experiment, or in the secondary experiment. So, you can:

· report on participation in two experiments,

· or report on participation in an experiment and read a paper for the other kind of experiment (and write up by summarising and imagining what it would have been like),

· or read the papers instead for both kinds of experiments (and summarise and compare the two papers).

Most people find that reporting on experiments is much easier than reading and summarising the papers.

Most important: don't get stressed, its not too hard, we won't mark too hard. But do try and write clearly.

Assessment

Each part will be marked separately and marks will be allocated in the following way:

· Assignment Part 1 is worth 10 marks

· Assignment Part 2 is worth 10 marks

· Assignment Part 3 is worth 10 marks

· The Report is worth 15 marks

What will gain (or lose) you marks in the assignment?

50% of your assignment mark will depend on consistency:

· How thoroughly you deliver the requirements listed above.

50% of your assignment mark will depend on coherence and quality:

· How coherent your site is in terms of its stated theme.

· The quality of your presentation:

o Visually.

o Textually (good english/netlish).

o The design does not interfere with the message, or detract from the meaning.

o The site's readability is good across a wide range of window sizes and screen resolutions.

· The quality of your HTML, CSS and commenting, for eg:

o Content and presentation are clearly separated into HTML and CSS.

o The code is well structured.

o The code complies with W3C standards.

o Indentation and commenting have been used to good effect.

o The structure and names of folders and files are simple, clear and meaningful.

· The creativity of your content and presentation.

· Any additional work or research you put into the site.

What will gain (or lose) you marks in the report?

The report is worth 15 marks towards your course's grade and the report will be marked in units of half a mark.

The Abstract, Introduction and the sections covering the first and second experiment will together be worth 7 marks.

The comparison of the two experiments and your discussion of the relevance of user-participation experiments in web design will together be worth 7 marks.

· Your own reflections and conclusions from participation in experiments.

· The quality of your writing:

o Coherence - do your paragraphs combine to "tell a story" about your experience in experiments? (Or your summarisation of papers.)

o Textually (good english/coherent narrative within sections and between sections).

· The reflection on your experiment participation.

o What was it like?

o Did you learn anything?

o Did you enjoy it or hate it? Why did you feel that way? Does this suggest any conclusions?

· Your conclusion about the relationship of web design and human computer interaction.

· For both the reflection and conclusion:

o There are no right or wrong opinions, there are just well expressed and argued opinions, and badly expressed or unclear opinions.

The overall structure of the report will be worth 1 mark.

· The structure of your report includes:

o Using all the sections a report normally contains such as Abstract, Introduction, and so on.

o Textual quality (good english/citing references).

o Using some visual content, not just words (a picture is worth a thousand words ...).

Any additional work or research you put into the assignment or report may gain you marks to compensate for missed marks in other areas.

---

Late Penalties

Late assessments (assignments and report) will be penalised at the rate of one (1) mark per day, or part thereof, that the assessments is overdue. Assessments more than seven (7) days late will not be accepted. If you have an extension then it’s not late until that extension is over.

If you need to apply for an extension you should contact me and explain your situation before the deadline (e-mail is best). I am quite reasonable about extensions for unforseen or exceptional circumstances. I am not allowed to give extensions for you having too many assignments at the same time, as that is considered *not* unforeseen by the School.

---

Tips

The assignment is not too difficult technically, but you will need to devote some thought to how it will all fit together. This is because your final product has two potentially contradictory goals. On the one hand you must maximise your marks by meeting all the criteria specified above, but on the other hand you must ensure the thematic coherence of your site.

Virtually all the assignment tasks are based on your lab work (and MOOC materials for part 1). If a task seems unclear, check the related lab sheet again - I didn't want to duplicate everything in the lab sheets here so that may be why the description here is short.

Make sure your content is easily accessible - if the marker can't find something - whether one of the mandatory tasks or something special and unique you have made - you won't get marks for it.

Lastly, an assignment checklist —

· I have constructed my website with index.html as a landing page and assignment.html to direct markers’ attention to the elements of the assignments

· I have my own copy of everything I’m handing in.

· My assignment satisfies all the assessment criteria.

· It all works — I’ve checked it in a variety of circumstances.

· I’ve used CSS, not tables, for page layout.

· I’ve made good use of the available HTML tags to clarify the meaning of the content.

· My id and class attributes have simple, meaningful values.

· All my files are in the right folders and have sensible names.

· It’s going to be useful to me later.

The report is also straightforward, but its best if you do not leave it to the last minute. Write a draft, leave it for a day or two, and you will find lots of things to improve as you will see it more like a new piece of text and can read it more objectively. Get friends to read it and give you comments. If they cannot understand what it is about, it is time to rewrite it.