James Andrew Smith James Andrew Smith

Front-End Design

City Cycles


  • Team Solo Project
  • HTML
  • CSS
  • Page Design
  • Logo Design
  • UX Consultation
  • Information Architecture Design
View Project

The Brief

Design of a homepage for City Cycles, a hypothetical start-up brand targeting an 18 to 35, "non-lycra-wearing" profile of urban cyclists.

(s) mobile (m) tablet (l) desktop


As well as succeeding on an aesthetic level, it was essential that the page design fulfil the practicalities of an e-commerce website, whilst establishing and retaining user orientation and engagement down the long scroll.

(s) mobile (m) tablet (l) desktop


I split the content in two broad categories, each with a distinctive tone: firstly, product sections linking to a ‘shop’ area of the website and, secondly, more editorially-toned sections linking to featured products and a blog area.

I opted for Avant Garde as the main typeface as its geometry and functional aesthetic echo that of the brand’s title product: bicycles. This idea is also reflected in its inclusion in my logo design for the brand.

(s) mobile (m) tablet (l) desktop