A restaurant brochure
Contact form and Google Maps customized to match the theme are built in to serve additional functionalities for the site.
For this project, I started by creating wire frames then made a Photoshop mockup for each page. By using real images, colours, and fonts, the mockup gave me a more realistic idea of what each page was going to look like after the development process. Using these mockup pages, I built a prototype with InVision as well as Adobe XD. The interactive prototype that has hotspots that are clickable and linked to a specific page, an area within a page, or an external page was helpful for understanding the overall experience of the website even before it was built.
I had a lot of fun during both the designing and developing process in this project. Particularly, I got a chance to play around with Google Maps. I used Google Maps API to output the map on the page and customized the colour theme of the map using Snazzy Map's styles. Utilizing background images and colour contrast between light and dark allowed me to create a simple but visually captivating website that is easy to use.