Website Design辅导、讲解Java语言、辅导HTML documents、Java程序设计讲解 解析Java程序|辅导R语言编程
- 首页 >> 其他 University of Westminster
Department of Computer Science
Web Design and Development
Assignment Specification (2018/19)
Module leader Anne-Gaelle Colom & Wendy Purdy
Unit Group Coursework – Website Design and Development
Weighting: 50%
Qualifying mark 30%
Description Group Coursework
Learning Outcomes Covered in this Assignment: The coursework rationale is:
LO1 be able to use a text editor to create several linked HTML documents, following certain style guidelines and satisfying a simple specification;
LO2 be able to incorporate and develop JavaScript to create interactive documents;
LO3 be able to work in a group, with each individual having a distinct role and tasks, to produce a common Web site;
LO4 be able to follow a user centred website design approach taking into consideration accessibility and inclusion;
LO5 be aware of the client/server architecture and organisation of a website.
Handed Out: Semester One – Week 8, PART B released 13th February 2019
Due Date Confirm the names of your four group members to your module tutor by 12 November 2018 during your scheduled module tutorial. Please note all group members must be from the same module tutorial group.
CWK Deadline: Tuesday, 19th March 2019 at 1:00 PM
Expected deliverables A single report, and a group presentation (viva)
Method of Submission: A single PDF document, submitted online via Blackboard
Type of Feedback and Due Date:
Written feedback and marks 15 working days (3 weeks) after the submission deadline.
All marks will remain provisional until formally agreed by an Assessment Board.
BCS Criteria Met By This Assignment 2.1.1 Knowledge and understanding of facts, concepts, principles & theories
2.1.2 Use of such knowledge in modelling and design
2.1.3 Problem solving strategies
2.1.6 Recognise legal, social, ethical & professional issues
2.1.7 Knowledge and understanding of commercial and economic issues
2.1.9 Knowledge of information security issues
2.2.1 Specify, design or construct computer-based systems
2.3.1 Work as a member of a development team
2.3.2 Development of general transferable skills
Assessment regulations
Refer to section 4 of the “How you study” guide for undergraduate students for a clarification of how you are assessed, penalties and late submissions, what constitutes plagiarism etc.
Penalty for Late Submission
If you submit your coursework late but within 24 hours or one working day of the specified deadline, 10 marks will be deducted from the final mark, as a penalty for late submission, except for work which obtains a mark in the range 40 – 49%, in which case the mark will be capped at the pass mark (40%). If you submit your coursework more than 24 hours or more than one working day after the specified deadline you will be given a mark of zero for the work in question unless a claim of Mitigating Circumstances has been submitted and accepted as valid.
It is recognised that on occasion, illness or a personal crisis can mean that you fail to submit a piece of work on time. In such cases you must inform the Campus Office in writing on a mitigating circumstances form, giving the reason for your late or non-submission. You must provide relevant documentary evidence with the form. This information will be reported to the relevant Assessment Board that will decide whether the mark of zero shall stand. For more detailed information regarding University Assessment Regulations, please refer to the following website:http://www.westminster.ac.uk/study/current-students/resources/academic-regulations
Coursework Description
Work in groups of 4 students (all group members should be from the same Web Design and Development tutorial group). Prepare a Web site about a subject of your choice (please see at the bottom of the page for a list of possible subjects). You have to ensure that your site complies with the Janet regulations on publications of web pages (see under Blackboard link to Assessment Details).
Part A
This Web site should include:
1.(Student 1) A presentation page with title and the name of everyone in the group. After 4 seconds, a second page will be displayed (Main Web page).
2.(Student 2) Your Main page should be designed so that the user can access several parts of the site. The links on your main page should look like buttons and have a hover effect. This should be created using CSS.
3.(Student 1) Use JavaScript to create the functionality to increase / decrease the font size used on the website. The basic functionality should include two buttons - a button to make the font size smaller and a button to make the font size larger (half allocated marks). Advanced functionality will allow for the font size to increase in steps up and down (full allocated marks).
4.(Student 2) Your site should contain a form to send comments about your web site. This form should include:
oinput fields for users to enter their details (name, email address)
oa field to enter comments
oa way to rate your web site (using radio buttons or select)
oUse JavaScript validation to check that the user has filled-in the compulsory fields - 'name' and 'rating'. Do NOT use HTML5 validation for this part.
oIf the name and ratings are filled-in, the user should get an HTML popup window with the summary including the name, any comments and rating given on the form.?
For example, if the user entered "John" for their name, rated the site as "good" and entered "Very informative website", the popup window should say something like: "Dear John, Thank you very much for your feedback. You have rated our site as?Good?and your comment was?Very informative website."
5.(Student 1) Your site should contain a form to allow people to buy products related to the topic of your web site, i.e. if your topic is football, you could be selling football shirts, accessories, etc. This should include:
opersonal details;
oat least 3 different products to choose from;
onumber of items for each product;
oautomatically provide the total price of the bill.
oUse JavaScript validation to check that the user has filled-in the following compulsory fields - personal details, product and number of items. Do NOT use HTML5 validation for this part.
oIf the compulsory fields are filled-in, when the 'place order' button is clicked, the user should get a popup window with the summary of the order.?For example, the text in the popup window could be something like: "Dear John, you have ordered 2 T-shirts size M at a cost of ￡20 each and a pair of trainers at a cost of ￡50. Your total bill is ￡90."
6.(Student 4) Your site should contain?a?sitemap. ?The?sitemap?should have navigation links to the appropriate part of the group website, and should be developed in SVG.?
7.(Student 3) Your site should contain an interactive multiple choice quiz about the subject you are developing on your Web site. Once the quiz has been completed, it gives the user a mark on how he/she performed. This should be time limited. When the quiz is finished should also display the summary of the user performance (which answers were correct or incorrect, and how long it took to complete the quiz). The user will get 2 marks for each correct answer, and -1 for each wrong answer. The quiz should consist of 10 questions. The background colour of the page should change according to the awarded mark.
8.(Student 4) Create a page that allows the user to view images. This page contains a form, 5 thumbnail images, and 2 pull-down menus (to select the page background colour and the page text colour) and an area to display a larger image and associated description of that image. When the user selects a thumbnail image, the corresponding large image and the description of that image should display in the defined location on the form. You may use onMouseOver or radio buttons to select the thumbnail.?
9.(Student 3) Your main page (or an alternative page) should contain four pictures of the members of the group. When the user moves the mouse over one picture, the details of that member should be displayed in an area on the page (for example, you could use a div below the pictures). The details should include the name and role that that student took for the coursework (e.g. John Smith, Student 1).
10.Consistency of style should be ensured using
a.a unique external style sheet file main page and navigation(Student 2)
b.used throughout the web site (all students)
11.(All students) Your site should contain a link to a CV for each member of your group.
oThis should be a complete CV (written in html) similar to one you would present to a potential employer. Your CV should have your picture at the top right hand-side corner. This page is external to the group website and therefore on this occasion does not need to follow the design of the main website.
12.(All students) Any page longer than the screen size should have links to various parts of the text at the top of the page.
13.(All students) Each page should include your title logo at the top, and a link to the page editor (the person who wrote the page) at the bottom of the page. (E.g., here you could make a link to the CV of the person who created that page).
14.(All students) Feel free to use additional JavaScript to add interactivity and increase ease of navigation.
Part B (Added on 13th February 2019)
As you are preparing a website about a subject of your choice, you will be required to each add at least one page about the subject of your website. For example, if your group is preparing a website about Tourism, each student could prepare a page about a different location.
You will need to apply UX principles in the design and development of these pages (as well as in the development of your pages from Part A). 20 marks are allocated in total for applying good UX principles to the development of your website, and discussing it in your report. (Note: The UX Principles must be implemented and will be marked from the evidence provided in your report).
Information architecture clarity/navigation (2)
Colour balance/composition (appropriateness justified) (2)
Typography (font appropriateness justified) (2)
text colour contrast: text vs background test result (2)
Consistency (2)
Gestalt principles grouping (4)
Error prevention/recovery (2)
Accessibility (forms/images) (2).
Accessibility test (2)
As you can see from the report template, you are required to justify your choices and provide with evidence where appropriate. For example, to justify your choice of text and background colours, etc., use a colour contrast checking tool:
https://snook.ca/technical/colour_contrast/colour.html#fg=33FF33,bg=333333
Demonstration
You will have to give a compulsory live demo of your Web site in your tutorial class (see schedule).
Report
Each student should submit an?individual?report to Blackboard. YOU MUST USE THE REPORT TEMPLATE which can be found on Blackboard.
Important - Each student should only complete the tasks allocated for one student (i.e., either student 1, student 2, student 3 or student 4).?You will not receive marks for completing tasks allocated to another student. The workload for each group?must?be as follows:?
Task Student 1 Student 2 Student 3 Student 4
1 - Presentation Page *
2 - Main Page *
3 - Font Size Change *
4 - Comments Form *
5 - Buy products *
6 – Diagram *
7 – Quiz *
8 - View images *
9 - Student details *
10a - External CSS (created) *
10b - External CSS (10a reused) * * * *
11 – CV * * * *
12 – Anchors * * * *
13 - Logo/Page Editor * * * *
14 - Additional Interactivity * * * *
Part B * * * *
Demo * * * *
Report * * * *
Tutorial work (previously submitted to Blackboard) * * * *
Possible subjects include:
Sports
Music
Tourism
Art
Entertainment
Education
Science
Individual Statement
Student Name: Student Id:
State what tasks you carried out in the project.
State what you enjoyed and did not enjoy about teamwork.
State what you learnt about teamwork.
State what skills you gained/learnt from undertaking the project.
State any strengths about yourself that emerged whilst undertaking the project.
State any weaknesses about yourself that emerged whilst undertaking the project.
State how you would do things better if you were to undertake the project again.
Additional general or project specific comments:
Student Signature: Date:
Department of Computer Science
Web Design and Development
Assignment Specification (2018/19)
Module leader Anne-Gaelle Colom & Wendy Purdy
Unit Group Coursework – Website Design and Development
Weighting: 50%
Qualifying mark 30%
Description Group Coursework
Learning Outcomes Covered in this Assignment: The coursework rationale is:
LO1 be able to use a text editor to create several linked HTML documents, following certain style guidelines and satisfying a simple specification;
LO2 be able to incorporate and develop JavaScript to create interactive documents;
LO3 be able to work in a group, with each individual having a distinct role and tasks, to produce a common Web site;
LO4 be able to follow a user centred website design approach taking into consideration accessibility and inclusion;
LO5 be aware of the client/server architecture and organisation of a website.
Handed Out: Semester One – Week 8, PART B released 13th February 2019
Due Date Confirm the names of your four group members to your module tutor by 12 November 2018 during your scheduled module tutorial. Please note all group members must be from the same module tutorial group.
CWK Deadline: Tuesday, 19th March 2019 at 1:00 PM
Expected deliverables A single report, and a group presentation (viva)
Method of Submission: A single PDF document, submitted online via Blackboard
Type of Feedback and Due Date:
Written feedback and marks 15 working days (3 weeks) after the submission deadline.
All marks will remain provisional until formally agreed by an Assessment Board.
BCS Criteria Met By This Assignment 2.1.1 Knowledge and understanding of facts, concepts, principles & theories
2.1.2 Use of such knowledge in modelling and design
2.1.3 Problem solving strategies
2.1.6 Recognise legal, social, ethical & professional issues
2.1.7 Knowledge and understanding of commercial and economic issues
2.1.9 Knowledge of information security issues
2.2.1 Specify, design or construct computer-based systems
2.3.1 Work as a member of a development team
2.3.2 Development of general transferable skills
Assessment regulations
Refer to section 4 of the “How you study” guide for undergraduate students for a clarification of how you are assessed, penalties and late submissions, what constitutes plagiarism etc.
Penalty for Late Submission
If you submit your coursework late but within 24 hours or one working day of the specified deadline, 10 marks will be deducted from the final mark, as a penalty for late submission, except for work which obtains a mark in the range 40 – 49%, in which case the mark will be capped at the pass mark (40%). If you submit your coursework more than 24 hours or more than one working day after the specified deadline you will be given a mark of zero for the work in question unless a claim of Mitigating Circumstances has been submitted and accepted as valid.
It is recognised that on occasion, illness or a personal crisis can mean that you fail to submit a piece of work on time. In such cases you must inform the Campus Office in writing on a mitigating circumstances form, giving the reason for your late or non-submission. You must provide relevant documentary evidence with the form. This information will be reported to the relevant Assessment Board that will decide whether the mark of zero shall stand. For more detailed information regarding University Assessment Regulations, please refer to the following website:http://www.westminster.ac.uk/study/current-students/resources/academic-regulations
Coursework Description
Work in groups of 4 students (all group members should be from the same Web Design and Development tutorial group). Prepare a Web site about a subject of your choice (please see at the bottom of the page for a list of possible subjects). You have to ensure that your site complies with the Janet regulations on publications of web pages (see under Blackboard link to Assessment Details).
Part A
This Web site should include:
1.(Student 1) A presentation page with title and the name of everyone in the group. After 4 seconds, a second page will be displayed (Main Web page).
2.(Student 2) Your Main page should be designed so that the user can access several parts of the site. The links on your main page should look like buttons and have a hover effect. This should be created using CSS.
3.(Student 1) Use JavaScript to create the functionality to increase / decrease the font size used on the website. The basic functionality should include two buttons - a button to make the font size smaller and a button to make the font size larger (half allocated marks). Advanced functionality will allow for the font size to increase in steps up and down (full allocated marks).
4.(Student 2) Your site should contain a form to send comments about your web site. This form should include:
oinput fields for users to enter their details (name, email address)
oa field to enter comments
oa way to rate your web site (using radio buttons or select)
oUse JavaScript validation to check that the user has filled-in the compulsory fields - 'name' and 'rating'. Do NOT use HTML5 validation for this part.
oIf the name and ratings are filled-in, the user should get an HTML popup window with the summary including the name, any comments and rating given on the form.?
For example, if the user entered "John" for their name, rated the site as "good" and entered "Very informative website", the popup window should say something like: "Dear John, Thank you very much for your feedback. You have rated our site as?Good?and your comment was?Very informative website."
5.(Student 1) Your site should contain a form to allow people to buy products related to the topic of your web site, i.e. if your topic is football, you could be selling football shirts, accessories, etc. This should include:
opersonal details;
oat least 3 different products to choose from;
onumber of items for each product;
oautomatically provide the total price of the bill.
oUse JavaScript validation to check that the user has filled-in the following compulsory fields - personal details, product and number of items. Do NOT use HTML5 validation for this part.
oIf the compulsory fields are filled-in, when the 'place order' button is clicked, the user should get a popup window with the summary of the order.?For example, the text in the popup window could be something like: "Dear John, you have ordered 2 T-shirts size M at a cost of ￡20 each and a pair of trainers at a cost of ￡50. Your total bill is ￡90."
6.(Student 4) Your site should contain?a?sitemap. ?The?sitemap?should have navigation links to the appropriate part of the group website, and should be developed in SVG.?
7.(Student 3) Your site should contain an interactive multiple choice quiz about the subject you are developing on your Web site. Once the quiz has been completed, it gives the user a mark on how he/she performed. This should be time limited. When the quiz is finished should also display the summary of the user performance (which answers were correct or incorrect, and how long it took to complete the quiz). The user will get 2 marks for each correct answer, and -1 for each wrong answer. The quiz should consist of 10 questions. The background colour of the page should change according to the awarded mark.
8.(Student 4) Create a page that allows the user to view images. This page contains a form, 5 thumbnail images, and 2 pull-down menus (to select the page background colour and the page text colour) and an area to display a larger image and associated description of that image. When the user selects a thumbnail image, the corresponding large image and the description of that image should display in the defined location on the form. You may use onMouseOver or radio buttons to select the thumbnail.?
9.(Student 3) Your main page (or an alternative page) should contain four pictures of the members of the group. When the user moves the mouse over one picture, the details of that member should be displayed in an area on the page (for example, you could use a div below the pictures). The details should include the name and role that that student took for the coursework (e.g. John Smith, Student 1).
10.Consistency of style should be ensured using
a.a unique external style sheet file main page and navigation(Student 2)
b.used throughout the web site (all students)
11.(All students) Your site should contain a link to a CV for each member of your group.
oThis should be a complete CV (written in html) similar to one you would present to a potential employer. Your CV should have your picture at the top right hand-side corner. This page is external to the group website and therefore on this occasion does not need to follow the design of the main website.
12.(All students) Any page longer than the screen size should have links to various parts of the text at the top of the page.
13.(All students) Each page should include your title logo at the top, and a link to the page editor (the person who wrote the page) at the bottom of the page. (E.g., here you could make a link to the CV of the person who created that page).
14.(All students) Feel free to use additional JavaScript to add interactivity and increase ease of navigation.
Part B (Added on 13th February 2019)
As you are preparing a website about a subject of your choice, you will be required to each add at least one page about the subject of your website. For example, if your group is preparing a website about Tourism, each student could prepare a page about a different location.
You will need to apply UX principles in the design and development of these pages (as well as in the development of your pages from Part A). 20 marks are allocated in total for applying good UX principles to the development of your website, and discussing it in your report. (Note: The UX Principles must be implemented and will be marked from the evidence provided in your report).
Information architecture clarity/navigation (2)
Colour balance/composition (appropriateness justified) (2)
Typography (font appropriateness justified) (2)
text colour contrast: text vs background test result (2)
Consistency (2)
Gestalt principles grouping (4)
Error prevention/recovery (2)
Accessibility (forms/images) (2).
Accessibility test (2)
As you can see from the report template, you are required to justify your choices and provide with evidence where appropriate. For example, to justify your choice of text and background colours, etc., use a colour contrast checking tool:
https://snook.ca/technical/colour_contrast/colour.html#fg=33FF33,bg=333333
Demonstration
You will have to give a compulsory live demo of your Web site in your tutorial class (see schedule).
Report
Each student should submit an?individual?report to Blackboard. YOU MUST USE THE REPORT TEMPLATE which can be found on Blackboard.
Important - Each student should only complete the tasks allocated for one student (i.e., either student 1, student 2, student 3 or student 4).?You will not receive marks for completing tasks allocated to another student. The workload for each group?must?be as follows:?
Task Student 1 Student 2 Student 3 Student 4
1 - Presentation Page *
2 - Main Page *
3 - Font Size Change *
4 - Comments Form *
5 - Buy products *
6 – Diagram *
7 – Quiz *
8 - View images *
9 - Student details *
10a - External CSS (created) *
10b - External CSS (10a reused) * * * *
11 – CV * * * *
12 – Anchors * * * *
13 - Logo/Page Editor * * * *
14 - Additional Interactivity * * * *
Part B * * * *
Demo * * * *
Report * * * *
Tutorial work (previously submitted to Blackboard) * * * *
Possible subjects include:
Sports
Music
Tourism
Art
Entertainment
Education
Science
Individual Statement
Student Name: Student Id:
State what tasks you carried out in the project.
State what you enjoyed and did not enjoy about teamwork.
State what you learnt about teamwork.
State what skills you gained/learnt from undertaking the project.
State any strengths about yourself that emerged whilst undertaking the project.
State any weaknesses about yourself that emerged whilst undertaking the project.
State how you would do things better if you were to undertake the project again.
Additional general or project specific comments:
Student Signature: Date: