Speedy Gym

First Milestone. User Centric Frontend Development. Code Institute.

This is a website that promote an imaginary gym. The website includes a description of the gym, membership classes and personal trainer prices, timetable for all the classes, a contact page and a gallery page.

Demo

A live demo con be found here at github: https://marcomoreschi.github.io/Milestrone-project/

UX

My intent with this website is to make it simple to use and understand for any customers. I want to give the clear vision of the activity and services which they can find in the gym. For the gym owner the website will increase his business, create word of mouth and attract more customer.

Wire frame's

Figma was used to design the initial layout (these can be used via the wireframes folder). The idea was to keep the layout simple and consistent. As I started to work on the website the actual design changed as I felt I needed to add more details, defining the layout of the class time-time, including the gallery page with different pictures about the gym.

Technologies Used

• Html
• Css
• Google chrome
• Bootstraps
• Git
• GitHub
• Aws
• Am I Responsive
• Font awesome

Testing

I checked both mobile and desktop versions worked correctly displaying all the pages. Media alert works correctly providing a link direct to the media page. The websites have been tested on various phone types and internet explorer pages. (Chrome, Safari, Internet Explorer, Firefox) and on multiple mobile devices (iPhone 4, 5, 7: Chrome and Safari, iPad, Samsung Galaxy) to ensure compatibility and responsiveness. During the setup I realized the picture in the mobile version were to big so I have changed the size with some media queries on CSS. a column on the right-hand side this was resolved due to unclosed rows, duplicate code and also amended any columns necessary.

Deployment

The sites is deployed using GitHub, it is deployed directly using the master branch. That allowed me to make change to the webpages and it will update automatically.

Credits

Contents

All the content is written by me.

Media

Most of the photos are taken from Pexels and Google, The Icon in the footer are created with Font Awesome

Acknowledgements

I have taken inspiration from two Code Institute mini project, the Bootstrap project and Resume project. I made adjustment to the contact form and the navbar form, the contact form is part from bootstrap and helps form a slack mentor. My mentor and Slack were both great help throughout my project.