Personal Website Wireframes

JARROD HAYNES DECO2102: WEB DESIGN AND TECHNOLOGIES ASSIGNMENT 1: WIREFRAMES

Jarrod Haynes

|

440173788

DECO2102 Web Design and Technologies

Information Architecture

To ensure that the user’s focus is on the website’s content, the information architecture has been simplified so that everything can be accessed from one menu. All pages (except for the ‘Hero’ page offer links to social media.

Jarrod Haynes

|

440173788

DECO2102 Web Design and Technologies

Wireframes

‘Hero’ Page

Jarrod Haynes

|

440173788

Index

DECO2102 Web Design and Technologies

Wireframes Index Selection

User selects ‘Sydney’

User selects ‘Melbourne’

User selects ‘Canberra’

User selects ‘Hobart’

User selects ‘Colours’

User selects ‘About’

When the user selects an index item, the image on the previous index screen fades to white, their selection turns from grey to black and the index moves to the left corner of the screen.

Jarrod Haynes

|

440173788

After the menu has moved to the left, content appears horizontally.

Throughout the website, social media links are always below the content, even when scrolling.

User selects ‘Context’

DECO2102 Web Design and Technologies

Wireframes Content Page - Sydney

When the user selects a content page (Sydney, Melbourne, etc.), they are directed to a page of information with the index on the side. When the user is finished reading the biography, they scroll horizontally.

Content Page - Sydney

Each individual image throughout the content pages is designed to fill a whole screen and will thus ‘snap’ to the browser, regardless of the shape of the image, or the user’s screen resolution.

Jarrod Haynes

|

440173788

DECO2102 Web Design and Technologies

Wireframes Content Page - Canberra

Content Page - Colours

Jarrod Haynes

|

440173788

DECO2102 Web Design and Technologies

Wireframes

Content Page - Hobart

Jarrod Haynes

|

440173788

DECO2102 Web Design and Technologies

Wireframes

About Page

Contact Page

The ‘About’ section will contain a brief biography, a C.V. and links to any other relevant websites (LinkedIn, ISSUU, etc.)

The ‘Contact’ form will be simple, only giving the user the option of leaving an email address and text.

Jarrod Haynes

|

440173788

DECO2102 Web Design and Technologies