ASSIGNMENT 2 website design- development, Study notes of Technical English

ASSIGNMENT 2 website design- development

Typology: Study notes

2022/2023

Uploaded on 12/18/2022

tran-quang-anh-thuan-fgw-hcm
tran-quang-anh-thuan-fgw-hcm 🇻🇳

3 documents

1 / 27

Toggle sidebar

This page cannot be seen from the preview

Don't miss anything!

bg1
1
Assignment Brief 2 (RQF)
Higher National Certificate/Diploma in Computing
Student Name/ID Number:
Unit Number and Title:
Unit 10: Website Design & Development
Academic Year:
2021 2022
Unit Assessor:
Assignment Title:
Website Design and Implementation
Issue Date:
01 April 2021
Submission Date:
Internal Verifier Name:
Date:
Submission Format:
Format:
1. A report document including below sections
o Section 1: A review of appreciate web design principles, standards and guidelines.
o Section 2: Design document for online shopping website.
o Section 3: Implementation of website design.
o Section 4: Test plan and test evaluation.
2. A compressed file that encapsulates all source code and particular necessary resources including files
of images, style sheets, java script and other files to support to install multipage website such as sql
script and installation guide.
Submission
Students are compulsory to submit the assignment in due date and in a way requested by the
Tutor.
The form of submission will be a soft copy posted on http://cms.greenwich.edu.vn/.
Remember to convert the word file into PDF file before the submission on CMS.
Note:
The individual Assignment must be your own work, and not copied by or from another student.
If you use ideas, quotes or data (such as diagrams) from books, journals or other sources, you
must reference your sources, using the Harvard style.
Make sure that you understand and follow the guidelines to avoid plagiarism. Failure to comply
this requirement will result in a failed assignment.
pf3
pf4
pf5
pf8
pf9
pfa
pfd
pfe
pff
pf12
pf13
pf14
pf15
pf16
pf17
pf18
pf19
pf1a
pf1b

Partial preview of the text

Download ASSIGNMENT 2 website design- development and more Study notes Technical English in PDF only on Docsity!

Assignment Brief 2 (RQF)

Higher National Certificate/Diploma in Computing

Student Name/ID Number:

Unit Number and Title: Unit 10: Website Design & Development

Academic Year: 2021 – 2022

Unit Assessor:

Assignment Title: Website Design and Implementation

Issue Date: 01 April 2021

Submission Date:

Internal Verifier Name:

Date:

Submission Format:

Format:

1. A report document including below sections

o Section 1: A review of appreciate web design principles, standards and guidelines.

o Section 2: Design document for online shopping website.

o Section 3: Implementation of website design.

o Section 4: Test plan and test evaluation.

2. A compressed file that encapsulates all source code and particular necessary resources including files

of images, style sheets, java script and other files to support to install multipage website such as sql

script and installation guide.

Submission

 Students are compulsory to submit the assignment in due date and in a way requested by the

Tutor.

 The form of submission will be a soft copy posted on http://cms.greenwich.edu.vn/.

 Remember to convert the word file into PDF file before the submission on CMS.

Note:

 The individual Assignment must be your own work, and not copied by or from another student.

 If you use ideas, quotes or data (such as diagrams) from books, journals or other sources, you

must reference your sources, using the Harvard style.

 Make sure that you understand and follow the guidelines to avoid plagiarism. Failure to comply

this requirement will result in a failed assignment.

Unit Learning Outcomes:

LO3 Utilise website technologies, tools and techniques with good design principles to create a multipage

website.

LO4 Create and use a Test Plan to review the performance and design of a multipage website.

Assignment Brief and Guidance:

Assignment scenario

You currently work for a software training company that produces courses and topic presentations to

established companies and, importantly, to new start-ups. MWS wishes to pursue a bespoke web-based

e-commerce solution. MWS were impressed with your presentations and wishes to continue with the

design and development of an e-commerce website.

A sister company develops web solutions and you have been tasked with taking the lead on the MWS

solution you outlined previously.

You are now required to design and create an interactive website with the emphasis being on the

production of a set of simple dynamic web pages, which embody good design principles. The site will be

themed around a template which would be most appropriate to MWS, with placeholders for text a nd

content. Images and icons will be used, to give MWS a feel for the proposed website design. You will

also include a membership area, where users can register to have access to restricted areas.

You will base on MWS-CaseStudy.docx for more information.

Table of Contents

  • Chapter 1 – Design Plan
    • 1.1. Users’ Requirements
    • 1.2. Review accessibility standards and guidelines
    • 1.3. Use cases diagram
    • 1.4. Wireframes
    • 1.5. Sitemap
  • Chapter 2 – Implementation
    • 2.1. Source code Samples of the Website
    • 2.2 Screenshots of Final website with explanation..................................................................................
    • 2.3 Compare the website to the original designs and draw conclusions
  • Chapter 3 – Testing
    • 3.1 Test cases
  • REFERENCES.............................................................................................................................................................
  • Figure 1 Standard and guidelines........................................................................................... Table of Figures
  • Figure 2 Use case
  • Figure 3 Register wireframe
  • Figure 4 Home wireframe
  • Figure 5 Login wireframe
  • Figure 6 Detail wireframe
  • Figure 7 Site map
  • Figure 8 Register page
  • Figure 9 Home page
  • Figure 10 Login page
  • Figure 11 Admin dashboard
  • Figure 12 Compare home page
  • Figure 13 Compare register page.........................................................................................

ASSIGNMENT 2’S ANSWERS Chapter 1 – Design Plan 1.1. Users’ Requirements

To create an online retail mall, a website will be developed with a variety of users, such

as:

 The mall owner is the person who designs the layout, controls the property, and

provides basic services to the store owners.

 The store owner, also known as a vendor, is the person who wishes to open an

online store to sell their goods.

 The end user who will visit the online mall to shop for products is referred to as

the customer.

As a Customer , I want to:

 Own hardwoods

 Receive discount

 Contact with store owner, mall owner

 Save the products will be bought in future

So that the design will be made for

 consult and buy some products

 Sign up to receive discount

 Show store and mall owner’s information

 Show detail of products

 Store products of customers in orders

As a Store Owner , I want to:

 Sell my products on shop

 Receive many orders from Customer

So that the design will be made for

Figure 1 Standard and guidelines

  • WCAG

Web Content Accessibility Guidelines (WCAG) addresses web content, and is used by

developers, authoring tools, and accessibility evaluation tools. Something that is neat

about WCAG standards is that it is backwards compatible, meaning something that is

compliant with the latest version (2.1) would also pass (2.0).

WCAG is one of the most common standards for UX and Product designers as it applies

to all the content.

  • ATAG

Authoring Tool Accessibility Guidelines (ATAG) addresses authoring tools - software and

services that “authors” (web developers, designers, writers, etc.) use to produce web

content (static web pages, dynamic web applications, etc.). Some good example of these

are popular social media sites, forums and wikis.

ATAG is split into two parts that make the authoring tools themselves accessible, so that

people with disabilities can create web content, and help authors create more

accessible web content — specifically: enable, support, and promote the production of

content that conforms to WCAG.

  • UAAG

User Agent Accessibility Guidelines (UAAG) addresses web browsers and media players,

including some aspects of assistive technologies.

UAAG documents explain how to make user agents accessible to people with

disabilities. User agents include browsers, browser extensions, media players, readers

and other applications that render web content.

Some accessibility needs are better met in the browser than in the web content, such as

text customization, preferences, and user interface accessibility. A user agent that

follows UAAG 2.0 will improve accessibility through its own user interface and its ability

to communicate with other technologies, including assistive technologies.

This is a wireframe I created for my website, and the purpose of the wireframe are

about our website.

For color, I choose the main color is white and light green, so that the picture of wood

can be outstanding in the website.

Figure 3 Register wireframe

Figure 4 Home wireframe

Figure 6 Detail wireframe

1.5. Sitemap Figure 7 Site map

Home Admin

Dashboard Profile

Logout

Login Register

{{!-- --}}

{{{body}}}

Services

Web design Development Hosting

About

Company Team Careers

Company Name

Praesent sed lobortis mi. Suspendisse vel placerat ligula. Vivamus ac sem lacus. Ut vehicula rhoncus elementum. Etiam quis tristique lectus. Aliquam in arcu eget velit pulvinar dictum vel in justo.

Figure 9 Home page

Figure 10 Login page