The Monkees Website Project

by Norbertas Lapenas

Preview Website.

A static website for the 1960's rock band "The Monkees".Their primary target audience is their fans and potential fans who wish to use the site to see and hear clips from their back catalog.The band would also like to showcase their music and publicise their availability to perform at events.

Library Dependencies

• Bootstrap 4 Link
• Font Awesome Link
• Google Fonts Link

UX

I chose to go for a very retro style design.Using round shapes and very bright colour. Most colour used on the website have been used by the band in their album covers. I am not very happy with the video/music players.I think they should be changed into something that more closely match the websites feel.

Features

Existing

• Responsive design
  • Website column and content resizes depending on screen sizes
• 1960's website feel
  • Using bright colours and fun fonts the imitate a 1960's feel
  • Using colours use by the bands album covers
• Ability to play their song
  • Need to click on the song icons
• Ability to watch video
  • Need to click on the icons
• Contact form
  • Easy to use contact form for booking "Gigs"
• Social media links
  • facebook
  • twitter
  • youtube

Ideas

• Custom media players

  • A better looking media played for video and music

• Contact form

  • Connect the contact form to a email service

Testing

• Header/Nav-bar

  • Tested on all screen sizes
  • Tested nav buttons align on different screen sizes
  • Tested logo and header text align in all sizes
  • Tested all the nav links/logo links

• Footer Testing

  • Tested alignment of elements in all sizes
  • Tested "Book Us Now!" links
  • Tested the social links.They point to the default social links only

• Home page

  • Tested on all screen sizes
  • Tested image and content repositioning
  • Tested auto image resizing

• Members page

  • Tested on all screen sizes
  • Tested of image is hidden on smaller screens
  • Tested if content centers
  • Tester if images of members resize

• Listen page

  • Tested on all screen sizes
  • Tested element realignment based on screen size
  • Tested if the video/music resource play

• Contact page

  • Tested form resizing based on screen size.
  • Form is not connected to a email service so no testing for it is needed.

• Validation

  • Validated all html pages with https://validator.nu/
  • Validated CSS with https://jigsaw.w3.org/css-validator/

• Website was tested on these browsers:

  • Chrome - Everything Works
  • Mozila/FireFox - Everything Works(Some fixed were needed)

Deployment

• Using GitHub Pages for hosting
  • Info about it Link Here
• Visit the project pages
  • Preview Website

Credits

Content

• The Monkees group information
  • Sourced from wikipedia The Monkees Wiki Page
• Group member information sourced from:
  • Wikipedia
  • The Monkees Website

Media

• Images/Audio/Video provided by Code Institute GitHub Link
• Logo Image is from www.monkees.com

Acknowledgements

• Thank you Stack Overflow Link
  • Website and it members helped me a lot in figuring out problems.
• Thank you W3Schools Link
  • Website with very clean and helpful tutorials