Tablet

Mobile

Notebook/ Desktop

DESIGN ANALYSISwww.richdean.co.uk

Icons used: • Links• Home• Contact• Social Media

• Single image• Images slide up and halftone overlay removed on hover over.

• Multiple images displayed across depending on monitor width.• Project details displayed on hover over• Slider scroll bar exisitant

• Two up images• Slider scroll bar removed

Transition

Landing Page Portfolio Work

Project Overview Main Navigation

TRANSISTION www.wantstobegreat.com

• Scroll down to view portfolio• Navigation bar darkens on hover over

• Turquoise on hover over• On click, page scrolls up

• Website scrolls up, pass the landing page

• Scrolling up from the portfolio page, shows project overview and images

• Scrolling up above that is the main navigation bar

Icons Background

TRANSITIONSwww.adamwoodhouse.co.uk

NAVIGATIONwww.academyart.edu

DESIGN ELEMENTS

CONTACT

DROP DOWNwww.cca.edu

DROP DOWN

• On contact click, page scrolls right

• Option to instantly goto particular page within site

• Info request, apply, events calendar, etc. easily acceissiable on home page

• Contact form and info • Click back to scroll left to main site

• Use of colors as representation of program• Hover over slides up to reveal program name

• Textured background rather than gray