#Walk with me | Meet Dublin It's my first project based on a webiste aimed to show the city of Dublin going on walking tours.
##Description The website has the homepage as introduction of the concept. 2 other pages; 1 with day walks and 1 with night tours, where the user can pick areas to visit, time and language of the tour. About us and contact page where the user can leave comments, feeback, etc.
###Images All images come from getty images (work account) and unsplash private account.
###UX The user needs to find a tour that he or she likes and book it. When enabled, a calendar should pop-up when clicking "book your walk" button. I tried to create a uniform style (colours and layout) thoughout all pages.
The form in the contact page means to be simple and to the point. When enabled, a "sent confirmation message" should appear when submitting the form.
###Features ####1. For the tour booking pages I used cards to present the different walk choices. The cards have a simple design with a clearly visible button with the CTA. They have also an intro text above to explain the user what to expect. ####2. The about us and contact page are built with 2 block. Un with text explaining about the page and one with a form for the user to fill out to contact with a choice of specific reasons.
###Technologies I used code from Bootstrap 4, HTML5 and CSS editing. I used Font awesome. I took some inspiration from previous projects from the course.
###Process After some fustrated few days trying to understand AdobeXD to create the wireframes, I wrote them on paper as suggested by my menthor. That was my only interaction with my menthor as he never got back to me after I sent them the wireframes.
I created the index page first and when I had it ready as a template for heading and footer I created the contact page. The contact page i taking a while to have the content fitting the background image or should I make the image to fit the content? This part is taking me a while to figure out.
Day and night tour pages are built last. One I have the day walk tours created, the night walk tours will be very similar in terms of layout.
I ended up changing back to my original idea of 2 section per page (except homepage). This way images and cards are all responsive.
###Testing After much researching and tweaking, I was not able to solve the problem of adjusting an image background to smaller screen size.
###Deployment I uploaded all the work to my github account.
###Comments ####17/09/19 It has taking me a while to come up with the concept and start with it. It's common for me to hesitate at first but once I have the basic structure created, I'm confident I won't stop. ####30/09/19 Getting used to editing the bootstrap code and getting used to the grid it ws a bit harder than expected. Tons of twicks and backs and forths. ####08/10/19 Working full time and being a full time time while tryig to do this project is very challenging. I'm struggling with time, energy and concentration. I must find my pace. ####13/10/10 I mananged to finish the project but I'm not fully satisafied. As mentioned above there are some responsive issues I think I'll be able to solve them further along the line as I progress with the course.
###Acknowledgments W3schools and FreeCodeCamp as well as documents from Bootstrap page have been very important at the time of finding my way around the code.