James Andrew Smith James Andrew Smith

Design & Development

Filter Beds

Skills

  • Team Solo Project
  • HTML
  • CSS
  • JavaScript
  • jQuery
  • Page Design
  • Logo Design
  • UX Consultation
  • Information Architecture Design
filterbeds.com

The Brief

An online platform for the band Filter Beds. The band wanted an engaging and memorable website that avoided the prevalent blog-style of many band websites.

Design & UX

The logo plays both a display and navigational role across a horizontal parallax page. As the user scrolls, text at differing depths fragments and unites with the aid of sticky scrolling.

Development

For DRY CSS and responsive design with maximum accuracy, I used Javascript to resize all elements based on viewport aspect ratio breakpoints rather than CSS media queries.

The parallax effect itself was implemented using just CSS as I found the effect smoother than with Javascript - as well as less verbose and easier to manipulate if required.