CP1406 - Web Design and Development

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.

The following are the required features and functionalities that should be present on the AutoKing Car Repairs 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.

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%

发表评论

电子邮件地址不会被公开。 必填项已用*标注