Creating a High Fidelity Website

Table of Contents
Introduction................................................................................................................................2
Purpose of the project.............................................................................................................2
Objective................................................................................................................................2
Body content..............................................................................................................................2
Planning the website..............................................................................................................2
Header section....................................................................................................................2
Footer section.....................................................................................................................2
Body section.......................................................................................................................2
Website design.......................................................................................................................2
Page design.............................................................................................................................3
Page organization...............................................................................................................3
Design principles................................................................................................................3
User acceptance test...................................................................................................................4
Analysis..................................................................................................................................5
Outcomes................................................................................................................................5
Quantitative........................................................................................................................5
Recommendations......................................................................................................................5
Summary....................................................................................................................................5

Introduction
High fidelity website is a website that is ready to be used in the market. Design concept must
be put into consideration while building a high fidelity prototype. This project is focused on
creating a website that is ready for the market.
Purpose of the project
Is to create a high fidelity website prototype that can be used by major companies to run their
business.
Objective
1. To use design principles and element of designs to come up with the website.
2. To use the new HTML 5 and CSS 3 technology to build the website.
3. To carry out user testing to determine the strength and weakness of the website.
Body content
Planning the website
Before developing the website is a good idea to plan how elements will be organized, the
major element included in the site are header, body section and footer.
Header section
The section contain the navigations links and the company logo. The company logo is placed
on the top left of the page while navigation is placed on the right side of the logo. The header
section will appear the same on both pages, to create a consistent design on both pages.
The navigation is made up of hyperlinks. The links are used to navigate to different pages.
The hyperlinks are same on both pages to allow user to shift to different pages
Footer section
The footer section will be positioned at the bottom of the website. The footer will contain the
copyright of the company. To maintain consistency of the website ad to give all pages the
same look, the footer will be the same on all pages.
Body section
Body section contain the content of the website, this section will differ from page to page.
We will have five pages in total. Each page will have its different content depending on its
requirement.
Website design
Design is a crucial part of building any protocol; poor design will result in a poor website.
The first process in designing was to come up with a brand. The brand include the logo and
the theme to present the company. To design the logo we had to first choose the colors for
our site. The color were used in building the logo.

Page design
All pages applied the same design, to make the site look unique. Each contained a header, a
body and footer. The header of each page head a brownish background and the text had white
color.
Page organization
Figure 1
The first page that displays when the user visit the site is the home page. From the home
page, you can use the navigation on top of the page to navigate to other pages.
Design principles
To come up with a good design we have to apply the design concept. A design concept is the
idea behind a design. It is how you plans to solve the design problem in front of you. It is the
underlying logic, thinking, and reasoning for how you will design a website. The concept
lead in the choice of colors and the images. To create a stunning website we had to apply
principles of design. The major principles applied were, balancing, white space, alignment
and repetition.
Balancing
Is balancing of website elements colors, font type, images and text (Meg, 2019). Balancing
is done to avoid crowding elements in one area. The principles was applied to the website to
position elements.
Whitespace
Whitespace is used to give the website a breathing space. It shows the objects that are
grouped together.
Alignment
We used alignment to organize and arrange our elements. The website elements need to be
aligned properly to give the website a consistent look. All the text used in the website are
aligned on the left side.
home
marker pen fountain penwater color working hour