PITSTOP

Code Institute - User-Centric Frontend Development - Milestone Project

PITSTOP is a website inpired by the city i live in Amsterdam. I created this concept of bicycle repair shop start-Up website. Many of the concetps of services offered were created by me, it doesn't exist yet in Amsterdam but i believe in the future it will.

The store offers services like 24/7 repairs and pick up and drop services, and bicycle maintanance services. Dutch people really love their bicycles and maintanance and having a good mean of transport is crusual to dutch society functionality, especially the city of Amsterdam.

UX

This website is for anyone who lives in Amsterdam that has bicycle. This applies to students, young professionals, the elderly, families and for those whom lives are extremely busy.

Every young professional and people who are just busy all day long this concept is a perfect product for them. For example:

• The 24/7 service would be great for students.
• The maintanance reminder would be great for families who carry children on their bicycles which it can be dangerous to have a faulty bike and you can be putting your kids in danger.
• Pick up and drop service is great for those who don't have time to spare or those who simply don't want or have time to take their bicycleto our shop, we can come to you.

Strategy

My goal was to make sure the website was as user-friendly as possible clean and straight forward. I wanted to make sure people could understand what the business offers so that it could best help Amsterdamers with their needs when it comes the bicycles they dearly love and have being imprinted into their way of life sense they were 3 years old.

Technologies Used

1. HTML
2. CSS
3. Bootstrap (4.4.1)

Testing

• The website will work on all devices, But i made sure it works for mobile well. Most people use their smartphones first before a laptop.

Contact

1. Go to the "Contact Us" page
3. Try to submit the form with an invalid email address and verify that a relevant error message appears

• All links will open in a new tab using target="_blank".

This site was tested across multiple browsers (Chrome, Safari, Internet Explorer, FireFox) and on multiple mobile devices (iPhone 4,5,6,7,8,plus and X: Chrome and Safari, iPad, Samsung Galaxy) to ensure compatibility and responsiveness.

During testing a ran into many issues with image Hover Overlay Effects transform translateY and transform: scaleY. It took me 3 days to get it to work. It was a nightmare to get the grid to work how i wanted, and things started shift around. especially on mobile and Ipads.

Deployment

This site is hosted using GitHub pages, deployed directly from the master branch. In order for the site to deploy correctly on GitHub pages, the landing page must be named index.html.

To run locally, clone this repository directly into the editor of your choice by pasting git clone : https://github.com/Antonio-dev7/milestone-project.git into your terminal. To cut ties with this GitHub repository, type git remote rm origin into the terminal.

Credits

Content

All content,

• Home
• Bicycles recently serviced
• Services
• About
• Contact

Was writen by me.

Media

• The photos used in this site were obtained from Unsplash https://unsplash.com/
• I did resize many of the pictures to look like how I wanted it.

Acknowledgements

• I Solved many CSS and GRID problems by looking up solutions in :

• https://www.w3schools.com/html/default.asp
• https://fontawesome.bootstrapcheatsheets.com/#
• https://getbootstrap.com/
• Book : HTML & CSS design and build websites, by JON DUCKETT.