Cakes by Katie | Matthew O'Callaghan

Website for a local cake decorator to display her work and acquire new clients.

View website GitHub

Tell me more ...

I design, develop and maintain the website of local cake maker Cakes by Katie, which serves as their primary customer acquisition channel and has contributed significantly to the early success of the business.

Visitors arriving on the homepage are welcomed by a full-screen video that immediately showcases Katie's creativity and skill. The site includes a portfolio, individual pages for each product and occasion, and supporting informational pages - designed to be both user-friendly and optimised for search engines.

Driving customer acquisition is the site's main goal. We regularly review insights from Google Analytics, Google Search Console, and Hotjar to identify areas for improvement. The site makes use of modern web image formats, performs well in Lighthouse audits, and ranks highly in search results compared to local competitors.

The site is built using a lightweight static stack including Gulp for task automation, Nunjucks for templating, and Sass for styling.

Screenshots

Screenshot of cakesbykatie.co.uk home page — The home page starts with a striking video of Katie decorating a cake above the fold, followed by information about her, a preview of her portfolio, a magazine feature, contact information, and testimonials.

Screenshot of wedding cakes page on cakesbykatie.co.uk — There is a page for each product (celebration cakes, wedding cakes, cupcakes, etc.). Above the fold we have a summary of the service and a rotating carousel of images, followed by design ideas, pricing information, suggestions of other products, and any other relevant content.

Screenshot of portfolio page on cakesbykatie.co.uk — The grid of images on the portfolio page fills the screen width and uses a masonry layout.

Screenshot of the modal which opens when a cake is selected from the portfolio. — When a cake is selected from the portfolio, a full screen modal opens which can contain a description, testimonial, videos and further images. This particular example provides more images covering all angles of the cake.

Another screenshot of the modal which opens when a cake is selected from the portfolio, this one including a video. — Here is another example of a cake from the portfolio being selected. This one includes a video which autoplays when the modal is opened.