BS in Information Technology - Introduction to Computing

ITEINC – INTRODUCTION TO COMPUTING

Final Project
Deadline: please wait for the announcement per section
In this activity, you will be able to:
1. Develop a creative and unique website.
2. Application of HTML tags such as table, image, hr, anchor (link within a page=top and
bottom), <a href=> (hyperlink to other pages, video, etc. and integration of Cascading
Style Sheet to the proposed website.
3. Apply the concepts of design in business applications and develop creativity among
students.
4. Present in class the concepts of design and explain every part of the developed web
pages.
Instructions:
1. Group yourselves and select a maximum of 5 members or less.
2. Choose a concept among business (product/services) or informational online
system/website that you will include in your HTML and CSS project i.e., hotel services,
beauty products, spa and wellness, travel, coffee shops, boutiques online, and other
business applications.
3. Discuss or make an overview of your desired company (give a website’s name,
description, make a logo/brand, specific missions, visions and goals of your company’s
system/website application)
4. A minimum of ten (10) web pages that consist of interconnected navigation menu such
as Home, Gallery, Profile, Contact us, etc.
5. You can use other sources as a reference or visit www.w3schools.com for additional inputs
in your content and design, but you are limited to use design in CSS and in HTML only.
[Simple Java Script is acceptable but CSS TEMPLATES ARE NOT ALLOWED]
6. Be Creative in developing your concepts. Include pictures that you are the one designing
your project; also, you can ask your classmates to help you but also provide a picture of
your activity with your classmate for collaboration. Include these pictures on your
webpage in the “about us” link as developers and add some descriptions of your activities.
7. Create a folder that contains all of your images, videos, and your HTML and CSS file. Name
your folder as “SECTION_GROUPNAME_FinalProject” and submit your
softcopy(Documentation, video presentation, and Website File) @ the shared google drive
link in our canvas LMS link./ also print a hard copy of your project and submit on or before
the deadline.
8. Other REQUIREMENT for Documentation:
a) USE LONG SIZE BOND PAPER
b) FONT SHOULD BE CENTURY GOTHIC, FONT SIZE=12, and LINE SPACING SHOULD BE
1.5(NO line SPACING BEFORE AND AFTER A PARAGRAPH), MARGINS (TOP, BOTTOM,
RIGHT=.8, LEFT=1.2)
c) ALIGNMENT IS JUSTIFIED and Page number should be at the bottom (center).
d) YOUR DOCUMENTATION SHOULD BE IN COLORED.
e) The front cover should include your WEBSITE/ONLINE SYSTEM’S NAME and your GROUP
members’ names(see example below)
f) Name your documentation as SECTION_GROUPNAME_ProjectDocumentation and
save it as .pdf format for final compilation and uploading to your group google drive
folder[SECTION_GROUPNAME_FinalProject] folder.
g) Send your output in the assigned google drive folder with a prescribed filename for
grading.
9. present your activity in not more than 8 minutes( includes overview of the website and the
navigation of the webpages only.)
10. Not following instructions will be mark ZERO in this activity.

Prepared by: MARITES D. MANGANTI, LPT, Ph.D.

Faculty
BS in Information Technology - Introduction to Computing

Website Title: _________________________________________Date:___________Section: _____

Criteria for Grading the Webpages:100pts
Points
(no output will be marked zero)
Category 3 5 7 10 Total
The pages appear The pages are The pages are well
The pages are “busy” or “boring”. eye-catching and organized with
unattractive. Text Text may be difficult attractive. The text tables. Text spacing
Layout/Design is difficult to read. to read. The is easy to read. The and alignment make
The backgrounds backgrounds are backgrounds are reading easy. The
are distracting. somewhat subtle and backgrounds
distracting. appropriate. enhance the page.
Photos are blurry or
Photos, icons, and
There are no fuzzy; icons and clip
clip art are Photos, icons, and
photos, icons, or art do not “fit” with
appropriate, of clip art are used
Graphics clip art or they the topic. Too many
high quality, and creatively and may
are inappropriate pictures make the
download fairly follow a theme.
or of low quality. download time
quickly.
slow.
Information could Information is well Information is
Information is
Information/ be better written, written and creatively written
poorly written,
Originality of and too much interesting to read and cleverly
inaccurate, or
Content information is given and is presented in presented with
incomplete.
in each section. short sections. originality.
The user may Links are consistent
The user may
become confused and easy to find so Links are created
become lost or
when navigating that the user can with images and
Navigation/Links links may be
between pages. easily navigate icons to enhance the
missing or not
Some links may not back and forth text links.
working.
work. through pages.
Minimal effort.
Was well done and Was extremely clever
Poor
interesting to the and presented with
layout/design. Was clever at times;
audience; added originality. Excellent
Did not incorporated most
a few original layout/design work
Creativity With incorporate of the attributes;
touches to incorporating all
Originality of required used a limited
enhance the required attributes, a
Design attributes, variety of
project; used a great variety of
graphics, did not appropriate
good variety of appropriate graphics
resize pictures, graphics.
appropriate that enhanced the
inappropriate
graphics. pages.
graphics.
PRESENTATION (50pts)-actual .html/.css file submitted

Total 50pts

DOCUMENTATION GRADING CRITERIA: 50PTS

Evaluated
Provide the Following Documentation: Scores
Score
Title Page (follow the SAMPLE FORMAT BELOW) 2
Table of Contents 3
1. Rationale (Introduction, Prior Arts (Related Studies and Literature note less than 5
references, System/Web Description) 10
2. Project Objectives (DEVELOPMENT OF YOUR WEBSITE) 5
3. User's Manual
3.1 System/Website Description 10
3.2 Step by Step Process/Procedures in using the system/website with screenshot (2
visible screenshot in a page only) and discussion of every page 20

50

Group Members: Score

__________________________________________ _____________________
__________________________________________ _____________________
__________________________________________ _____________________
__________________________________________ _____________________
__________________________________________ _____________________
Sample Cover Page and Table of Contents

Prepared by: MARITES D. MANGANTI, LPT, Ph.D.

Faculty
BS in Information Technology - Introduction to Computing

Include in your Documentation:

Title Page (follow the SAMPLE FORMAT)

Table of Contents
1. Rationale (Introduction, Prior Arts, System/Web Description)
(at least 2 paragraphs (10-15 sentences), include citation if copied from other
studies/internet)
2. Project Objectives (DEVELOPMENT OF YOUR WEBSITE)
Purpose of the Website (1 paragraph (5-8sentences))
3. User's Manual
3.1 System/Website Description
3.2 Step by Step Process/Procedures in using the system/website with screenshot
(2 visible screenshot in a page only) and discuss the function or purpose of each webpage.

Prepared by: MARITES D. MANGANTI, LPT, Ph.D.

Faculty
BS in Information Technology - Introduction to Computing

Sample format of your screenshot

(Header should be repeated in every page but you are free to create your own design of the
menu bar/navigational links etc. – Be Creative)

Home.html

My Logo and header “Image must be here”

Home | Gallery | Profile | Contact us

This consists of your home page which contains or have a brief

description of your website.
Other images
Logo if any
related to your
product Description here…

Cite also your company’s mission and vision, objectives and core values
Include relevant images here and other elements

footer

Gallery.html

My Logo and header “Image must be here”

Home | Gallery | Profile | Contact us

This consists of your gallery page which contains your business product
/services

images images
Description here…

images images

Provide descriptions in each picture, or if it is a product, provide prices

or its benefits.

footer

Prepared by: MARITES D. MANGANTI, LPT, Ph.D.

Faculty
BS in Information Technology - Introduction to Computing

Website Title: _________________________________________Date:___________Section: _____

Criteria for Grading the Webpages:100pts
Points
(no output will be marked zero)
Category 3 5 7 10 Scores
Layout/Design 3 5 7 10
Graphics 3 5 7 10
Information/ Originality of Content 3 5 7 10
Navigation/Links 3 5 7 10
Creativity With Originality of Design 3 5 7 10
PRESENTATION 35 40 45 50
Total (100pts.)
DOCUMENTATION GRADING CRITERIA: 50PTS + 10pts individual
Provide the Following Documentation: Scores Evaluated Score
Title Page (follow the SAMPLE FORMAT BELOW) 2
Table of Contents 3
1. Rationale (Introduction, Prior Arts, System/Web Description) 10
2. Project Objectives (DEVELOPMENT OF YOUR WEBSITE) 5
3. User's Manual
3.1 System/Website Description 10
3.2 Step by Step Process/Procedures in using the system/website with screenshot
(2 visible screenshot in a page only) and discussion of every page 20
3.3 Source Code (Label for each web page) 50

Group Members: Score

__________________________________________ _____________________
__________________________________________ _____________________
__________________________________________ _____________________
__________________________________________ _____________________
__________________________________________ _____________________
_____________________________________________________________________________________________

Prepared by: MARITES D. MANGANTI, LPT, Ph.D.

Faculty