CP1406/CP5638 Assignment 2 – Full Website Project
Assignment weighting: 40% for CP1406 and 35% for CP5638.
Overview:
This assignment involves improving your existing AutoKing Car Repairs website by making it more responsive, performing usability testing, and adding web form functionalities using JavaScript for user data validation. You are required to use HTML, CSS, and JavaScript for this assignment.
Since you already have a basic site and will be receiving feedback from Assignment 1, you should be able to improve your website accordingly. You should document the feedback provided in Assessment 1 and explain how you have incorporated it into your website. You should discuss this with your lecturer or tutor by Week 9.
You have two milestones to complete but will be submitting both your website and documentation as one project. The milestones are summarised below with additional details provided later in this document
Milestone 1 - Response to Feedback:
For this milestone, you will need to revise your project plan, which should include a goal and audience analysis, flowchart, text, and images. This plan will serve as the foundation for developing the finished site. You must document any changes that you have made to the site in response to feedback received during Assignment 1 in a Word document named “Report.docx based on the provided template”. You can show these changes to your tutor or lecturer during the practical or online session for an opportunity to receive feedback.
It is important to complete this milestone by week 9, to allow sufficient time to make any necessary changes to your site before moving on to Milestone 2, which involves usability testing.
Milestone 2 - Finished Website and Usability Testing
This milestone involves completing the website design and development process using the outputs from Milestone 1 to create a fully functional and responsive finished website. The finished or almost finished website will then undergo usability testing in week 10 to assess its functionality and usability.
Important Note: The requirements listed for this website are not page-specific, but rather refer to features and functionalities that should be present on the website. The information architecture of the website is at your discretion and should be determined based on careful consideration during the planning phase of the project.
You may search for and use code for some parts of your site, but the core functionality must be written by you. You cannot use any existing content management systems or templates. The work you submit must be substantially your own.
If you are unsure about what is considered acceptable, please ask on Slack. You must reference any code that you use and did not create in your report. |
All content provided by the client (see Email from the client.docx)
Images: You may only use some or all the images provided for the site. Do not use unless you create something yourself from the given images.
Online Booking Form:
. Create an online booking form that is suitable for the site/client and demonstrates several different kinds of form fields as appropriate.
. JavaScript Validation: Use JavaScript to validate your form data, ensuring that users cannot submit the form if required fields are blank or contain incorrect input.
Responsive Design: Use CSS media queries to ensure that your website is responsive and displays well on mobile phones, tablets, and desktop browsers in both large and small windows.
Usability Planning and Testing (during week 10 prac): Your website should be almost complete by the start of Week 10 to be ready for usability testing with 2 testers. During week 10 practicals, your website should be mostly complete and ready for usability testing. You will need to create a testing plan for usability testing, organise users to participate in the testing session, and follow a prescribed usability testing process. Afterwards, you will document the results and feedback from users in your report.docx. As a result, your report should include the response to feedback, usability plan, usability testing results and feedback, and any changes made to your website based on the usability testing results and feedback.
Upload your Assignment 2 to the SiteGround web server:
- Name your assignment folder “a2” .
- Upload the folder “a2” to “public_html” folder on the SiteGround web server.
- When you have done the above steps correctly, the link to your website homepage should look something likehttps://username.sgedu.site/a2
- You must provide the URL when submitting the assignment.
Due: Milestone 1 gives you an opportunity to present to your lecturer or tutor before Week 10 to obtain feedback for improvements, while Milestone 2 (the complete website and report) is due by 11.59 pm on Week 10: Jan 9 2024. The website must be uploaded to the SiteGround web server and all files (html,js, css, images files, and report) should be compressed into a single zip file before submitting via LearnJCU for assessment together with the link address to the website that has been uploaded to the SiteGround web server.
Submission: please make sure to submit the following items via LearnJCU:
A single zip file containing all files and folders (html, js, css,images files, and report.docx).
In the submission text area, provide the link address (URL) of the completed website that has been uploaded to the Siteground web server. The URL should be in the format of https://username.sgedu.site/a2.
Criteria |
Exemplary (9, 10) |
Good (7, 8) |
Satisfactory (5, 6) |
Limited (2, 3, 4) |
Very Limited (0, 1) |
Weighting |
||
Report |
All suggested changes from feedback have been documented and excellent response to the feedback is provided. |
Exhibits aspectsof exemplary (left) |
Most suggested changes from feedback have been documented and reasonable response to the feedback is provided. |
Exhibits aspects of exemplary (left) and satisfactory (right) |
Few or no suggested changes from feedback have been documented and noor poor response to the feedback is provided. |
5% |
||
Published website |
The finished website is uploaded to the SiteGround web server and the link address (URL) of the completed website is provided. |
N/A |
The finished website is not uploaded to the SiteGround web server and/or the link address (URL) of the completed website is provided. |
5% |
||||
Content |
No missing content. |
N/A |
Missing some content |
5% |
||||
Interface and Information Design |
Design is professional, consistent, and suitable for site goals and audience. The text has been reformatted to be suitable for scanning and for this site’s goals, images enhance the meaning of text. |
The design is fairly good, but not as suitable for site goals and audience as it should be, with minor inconsistencies across different pages. Most content is well-formatted, but some text needs to be made more scannable, images mostly help |
Poor quality, not suitable for site goals and audience. Text appears just copied from client content. Lack of images to enhance the meaning of text. |
20% |
||||
and |
satisfactory (right) |
|||||||
Exhibits aspectsof exemplary (left) |
||||||||
Information Architecture |
Content has been thoughtfully organised to be suitable for site goals. Calls-to-action are clearly used. |
The content is mostly well-organised and somewhat aligned with the site goals. Calls-to-action are used. |
Content placement seems illogical and/or not aligned with the site goals. Missing calls-to- action. |
10% |
||||
and |
satisfactory (right) |
|||||||
HTML and CSS |
Content and design elements are all present, HTML & CSS used appropriately |
Content and design elements are mostly present, HTML & CSS mostly used appropriately |
Content and design are mostly missing, CSS problems |
elements HTML & |
25% |
|||
JavaScript |
JavaScript is used appropriately to validate form data entry or other uses. No errors are evident in running the code. |
JavaScript is attempted to validate form data entry or other uses. A few errors are evident in running the code. |
No or little JavaScript has been attempted. |
5% |
||||
Responsiveness |
Website works well at any resolution (mobile phones, tablets, and desktop browsers in large and small windows). Breakpoints used for 3 different screen sizes. |
Website works well for only two (2) of the following resolutions: mobile phones, tablets, and desktop browsers in large and small windows. |
Website is not responsive. |
10% |
||||
Usability Testing Plan and Results |
The usability testing plan and usability testing results are submitted, and some efforts at changing the site in response to this feedback have been made and documented. |
The usability testing plan and usability testing results are submitted, but little of the feedback has been implemented and documented. |
The usability testing plan and usability testing are not submitted and/or none of the feedback has been implemented and documented. |
15% |