Human Interaction Project: Homeschool Hangout Zone Website Redesign

This project focuses on the redesign of the Homeschool Hangout Zone website, addressing issues in the original design to improve user experience and engagement. The assignment includes the creation of sitemaps and storyboards for the website's structure and content, specifically for the homepage, about page, subjects page, meet friends page, and miscellaneous page. The project highlights the importance of user interaction, visual appeal, and effective navigation, with a focus on incorporating images, videos, and a well-organized navigation menu. The redesigned website aims to provide informative content and improve usability by placing the navigation menu at the header and creating separate pages for each section. The report also includes an analysis of the original website's shortcomings and details the improvements made to enhance user experience and overall design.

1
Running Head: HUMAN INTERACTION
Human Interaction
Student’s Name
Institution

2
HUMAN INTERACTION
Human Interaction
Q1. A) Sitemap
B) Storyboard
Storyboard Template
Website Name: Homeschool Hangout Zone
Descriptive name of page: Homepage

3
HUMAN INTERACTION
Description of copy
text:
Text will offer users an introduction to the site, its purpose, and
content available. It is organized in a manner that is informative and
appealing to the audience.
Links on the page: The navigation menu is at the top and contains five links. The links
are displayed consistently in all pages. The links are interactive which
enables users to know the status of the system. Active or hovered
linksare underlined.
User Interaction: Users can only interact click the navigation menu by clicking the links
provided to visit another page.
Graphical
elements/Images:
Two images are prominently displayed on the homepage.
They enhance the outlook of the
homepage and grabs user attention.
Color Specs: The page has white, black, and light pink background color. This is
key in avoiding the monotony of one color background which is
unappealing. Text color used include white and black. Dark text
colors are used against light backgrounds while bright text color is
used for the black background.
Font Specs: Different font size is used for different content. For example, headings
have a large font size while body content has small font size. This is

4
HUMAN INTERACTION
key in attracting users and helping to differentiate the content
presented.
Additional
Comments:
The original website is unattractive and does not engage the target
audience as expected.
The website should incorporate various media such as images and
video to enhance visual appeal.
The navigation bar is found in the content section and this is not
appropriate. It should be placed on the header to enhance usability.
Homeschool
Hangout
Zone
Home Subjects About
Us
Meet
Friends
Miscellaneous
Welcome to Homeschool Hangout Zone

5
HUMAN INTERACTION
Copyright 2017.
Current Website

6
HUMAN INTERACTION
New Homepage design

7
HUMAN INTERACTION
Storyboard Template

8
HUMAN INTERACTION
Website Name: Homeschool Hangout Zone
Descriptive name of page: About
Description of copy
text:
The text provides information about the website including its goals
and how it intends to help people. The length of the text is short and
effectively engages users.
Links on the page: The navigation menu is at the top and contains five links. The links
are displayed consistently in all pages. The links are interactive which
enables users to know the status of the system. Active or hovered
linksare underlined.
User Interaction: Users will interact with the page by playing the video embedded and
clicking the navigation links.
Graphical
elements/Images:
A video is embedded on the page to enhance user interactivity.
Color Specs: The page has white, black, and light pink background color. This is
key in avoiding the monotony of one color background which is
unappealing. Text color used include white and black. Dark text
colors are used against light backgrounds while bright text color is
used for the black background.

9
HUMAN INTERACTION
Font Specs: Different font size is used for different content. For example, headings
have a large font size while body content has small font size. This is
key in attracting users and helping to differentiate the content
presented.
Additional
Comments:
The original website is unattractive and does not engage the target
audience as expected.
The website should incorporate various media such as images and
video to enhance visual appeal.
The navigation bar is found in the content section and this is not
appropriate. It should be placed on the header to enhance usability.
Homeschoo
l Hangout
Zone
Home Subjects About
Us
Meet
Friend
s
Miscellaneous
About Us.
Lorem ipsum. Lorem ipsum. Lorem ipsum. Lorem ipsum

10
HUMAN INTERACTION
Copyright 2017.
Current Website

11
HUMAN INTERACTION
New About Page

12
HUMAN INTERACTION
Storyboard Template
Website Name: Homeschool Hangout Zone