362 ISM, 1st Semester 2021 /2022

Activity-1: 1st Phase: Building Functional Requirements with HTML

Activity Mode: Teamwork
Marks: 5
Covered labs (HTML Lab sessions)
Posted Date: Week 4 (19/09/2021)
Due Date: Week7 (10 October 2021, Time 11:59 PM (Mid-night)

Assessment Description:

This assessment is well-designed to cover most topics of HTML5 Lab sessions. It represents the 1 st
phase of a website project which aims to use HTML5 to properly structure and organise web content of
a business website according to some specific functional requirements. Students will learn how to
gather the required content from some free online resources and then organise it into blocks. They also
will build these bocks with suitable HTML tags. The project in all tries to enrich students in terms of
knowledge and skills. Working in teams will improve the students’ personal skills such as
communication, time-management, problem-solving and decision-making. In addition, the project will
motivate students to visit many websites to analysis and learn their design and to improve their
creativity. The expected outcome of this phase is a completely structured and organised website.
General Instructions

1. Read the given case study carefully and attempt all tasks.
2. You must strictly follow what has been mentioned on the website. This is to save your time and to
avoid any issues that may come up during your work.
3. Using only front-end web development tools (HTMl5, CSS3 JavaScript and XML) to design and
build your website.
4. This activity should be done by a team of 3 members only if applicable. Your collaboration has
been facilitated via allocating a group for each team on Blackboard.
NOTES:
● If any student decided to work alone, he/she will lose 2 marks from the final total mark
● If the student did not join a group and did not submit the activity will get zero marks.
5. As a team, all members must have equal contributions to the activity.
6. If you have any doubt, you can ask the lab instructor during lab sessions, email, or via the forum of
the activity.
Assessment Criteria

1. You must implement the activity yourself. Any attempt of cheating or using any ready-made
website template will result in your failure in the course.
2. Activity evaluation:
2.1.1. Full make > if you meet all the correction stranders [see the excel file]
2.1.2. Otherwise, your work will be assessed according to your effort and contributions to the
activity.
2.1.3. Zero marks > late submission
2.1.4. Zero marks + failure > cheating.
Submission:

1. Please double check your website with the excel sheet file that contains Correction Standard Check
List.
2. You must upload your work at the specified place on the blackboard before or on the due date at
11:59 PM.
3. The leader of each team must submit the group work a zipped folder that contain the website file
Case Study: Designing A Website for Fresh Juice Store
 
XYZ is a famous company located in Abha city.  It has a fresh juice store.  This
company needs a simple business website to educate its target customers about the
business activity of the store and its products.
Now the company wants to hire a creative team of web developers who can design
and build the website according to some specific requirements and they can submit
the website in 4 different phases.
1st Phase: Building Functional Requirements with HTML (5 Marks)
1. The website must have a simple attractive landing (Banner) home page.
2. The website must show a logo with navigation links which are shown at the
top.
3. The website must show a copyright statement and social media icons which
are shown at the bottom. The social media accounts: Twitter, Instagram,
WhatsApp, and Snapchat. Also, the developers’ names must be added there.
4. The website must have brief information about the business activity (making
fresh Juice) of the store.
5. The website must show the top 4 juices that are always ordered by customers.
6. The website must have some information about the store's physical address
with its opening hours and telephone number.
7. The website must have a contact form through which customers can send their
suggestions, inquiries, complaints, and other issues to the email of the
company (freshJuice@gamil.com)
The content of the website must be structured and organized by using HTML5
only. It is optional for the web developers to organize the above functional
requirements either as a single-page website or a multi-page website.
These requirements represent the 1st phase of the project. So that they must be
completed and submitted on time to allow you to move to the second phase.
 
Good Luck!