Design Prototypes

In this webpage you will see the design page prototypes for Main Page(Index.html), CS100.html and the 5 Computer History Innovations (pageX.html). The materials used for design prototypes is the Paint Desktop app. This material assist me to make a guide in creating and coding my Assignment website in Computer Science 100. Also, this material heps me to make my webpage look presentable and enhance my skill in editing.

My Design Prototypes
Index.Html Prototype
	Envisioned design description: Main page of my website For my Main page of my website I used paint desktop app. I used teh same color in my real werbpage for the outline. Also, I used basic color for my outline.
Transformation experiences: I experienced to changed my background colour and put a borderline to match my design outline to looks the same on my website.
CS100.html Prototype
	Envisioned design description: In Cs 100 web page, I use red color for the link outline. I put a font shadow on the heading.
Transformation experiences: Transforming Cs100.html, I experienced to changed my background colour and put a borderline to match my design outline to looks the same on my website.
PageX.html Prototype
Computer Innovation 1 Computer Innovation 2 Computer Innovation 3 Computer Innovation 4 Computer Innovation 5	Envisioned design description: Each PageX html has a consistent design which is shown below. All of the Innovation X title has a same color and a font shadow. Also, PageX has a different shade of website background.
Transformation experiences: At first, I found out that the challenging part is to match page1.html to the rest of the pageX.html. I searched how to code a table and put some style on google. I changed my webpage and made sure it looks like in my outline. I set a table and organize my stuff.

My Design Prototypes

Index.Html Prototype

Envisioned design description:

Main page of my website For my Main page of my website I used paint desktop app. I used teh same color in my real werbpage for the outline. Also, I used basic color for my outline.

Transformation experiences:

I experienced to changed my background colour and put a borderline to match my design outline to looks the same on my website.

CS100.html Prototype

Envisioned design description:

In Cs 100 web page, I use red color for the link outline. I put a font shadow on the heading.

Transformation experiences:

Transforming Cs100.html, I experienced to changed my background colour and put a borderline to match my design outline to looks the same on my website.

PageX.html Prototype

Computer Innovation 1

Computer Innovation 2

Computer Innovation 3

Computer Innovation 4

Computer Innovation 5

Envisioned design description:

Each PageX html has a consistent design which is shown below. All of the Innovation X title has a same color and a font shadow. Also, PageX has a different shade of website background.

Transformation experiences:

At first, I found out that the challenging part is to match page1.html to the rest of the pageX.html. I searched how to code a table and put some style on google. I changed my webpage and made sure it looks like in my outline. I set a table and organize my stuff.