// PROJECT BACKGROUND // Final Project for an Introductory Web Development course in which I was enrolled during the Summer of 2020.
The project tasked me with creating a front-end website design for a small, local business. The company I chose happened to be the restaurant where I was working as a server and bartender at the time, CHEF'S PLAYGROUND EATERY. The project's deliverables included the main web pages and assets, dependency tree diagram, bibliography, and feedback from the business owner (that I received after presenting the completed project to him).
** PLEASE NOTE: This is a student project and is not the restaurant's official website, nor does it reflect the business's menu or its current state (it so happens that it is doing quite well). An additional sidenote: the food is amazing and it was one of the best jobs I have ever had.
The project had certain requirements such as proper use of elements in the head and body; CSS colour, position, and function tools (eg. borders and scaling); Javascript elements, mainly for date/time updates and form validation; and effective use of C.R.A.P. principes (Contrast Repetition Alignment Proximity).
There were some required features that I did not believe went well with my overall vision for the project, though I was more than able to make them align with my design. For example, I needed to include a video object or rather a link to a video. I felt this was unnecessary since the images and design I had chosen already spoke volumes for the business without utilizing auditory or motion-picture content. But as the university (or rather my course representative) was my 'client', I resolved to work through the constraint and create something that met the requirement with a quality fashion.
I made use of Bootstrap 3.3.7, particularly to create the header and footer elements. Bootstrap's built-in column structure helped me organize my tags and content with a consistent layout. I also made use of a Javascript that I found on Dynamic Drive that allowed me to create scrolling bookmarks. Pexels, YouTube, and Google Fonts provided me with assets for images, video, and the website's font. Additionally, I made use of the special Chef's Series dinner menus that are available on the company's official website and Instagram page.
// WEBSITE GUIDELINES //
open up the website by accessing the "Main Files" folder and opening the "index.html" file. additional files are located in the following folders within the "Main Files" folder: Assets Javascript Pages Styles after opening the "index.html" file, the other web pages are reachable by clicking on the appropriate links located in the header and footer navigation bars. // DOCUMENTATION //
Documentation is located under the "Documentation" folder which contains the following: Project Wireframe.pdf Site Map & Dependency Tree.pdf Website Evaluation Form.pdf // REFERENCES //
Bootstrap (v3.3.7). Retrieved from https://getbootstrap.com/docs/3.3/ BootstrapCDN Quick Start (v3.3.7). Retrieved from https://www.bootstrapcdn.com/ Bring the power of google maps to your website with simple HTML. Retrieved from https://developers.google.com/maps/documentation/embed/ CA restaurant. . ().[Video/DVD] CA Restaurant. Retrieved from https://www.youtube.com/ Google Fonts. Retrieved from https://fonts.google.com/?selection.family=Lato:400,700 Pasta tomatoes and flour with egg shells on table Retrieved from https://www.pexels.com/photo/pasta-tomatoes-and-flour-with-egg-shells-on-table-3 5661/ Scrolling HTML bookmarks. Retrieved from http://www.dynamicdrive.com/dynamicindex5/bookmarkscroll.htm Wu, G. (a). Chef's playground eatery. Retrieved from http://chefsplayground.ca/ Wu, G. (b). chefsplaygroundsteveston. Retrieved from https://www.instagram.com/chefsplaygroundsteveston/