WordPress Projects

Roasted and Toasted Lakeside Coffee Bar

Design application: WordPress

Project Outline

Roasted and Toasted Lakeside Coffee Bar is a locally owned coffee shop in Burlington, Vermont, offering a range of coffee-based beverages and a small menu of pastries and breakfast sandwiches. The brand's website had not been updated since 1999, when it opened for business, and the owner wanted their out-of-date website replaced with a new one. Many customers had inquired about online orders but found the website difficult to navigate on mobile devices. The goal of the project was to create a new responsive and mobile-friendly website that met Web Content Accessibility Guidelines (WCAG) while maintaining brand consistency.

Homepage web design for Roasted and Toasted Lakeside Coffee Bar featuring drinks, specials, testimonials, and location map.
Homepage web design for Roasted and Toasted Lakeside Coffee Bar featuring drinks, specials, testimonials, and location map.

Color Palette

Typography

The overall concept of the design revolves around modernity, accessibility, and brand consistency, aligning with the café’s friendly, lakeside aesthetic. By incorporating a clean and intuitive layout, the website achieves usability and easy online ordering for both regular customers and new visitors.

Order Ahead webpage displaying brewed coffee, cold drinks, hot drinks, and seasonal specials with descriptions and images.
Order Ahead webpage displaying brewed coffee, cold drinks, hot drinks, and seasonal specials with descriptions and images.
Menu webpage featuring various coffee drinks and breakfast items with descriptions and images.
Menu webpage featuring various coffee drinks and breakfast items with descriptions and images.
About webpage with images of cafe interior, food, employees, and text about Roasted and Toasted.
About webpage with images of cafe interior, food, employees, and text about Roasted and Toasted.
Contact webpage with a form, address details, map, and social media links for Roasted & Toasted.
Contact webpage with a form, address details, map, and social media links for Roasted & Toasted.
Color swatches with their respective color codes.
Color swatches with their respective color codes.
Open Sans font including letters, numbers, and special characters in uppercase and lowercase.
Open Sans font including letters, numbers, and special characters in uppercase and lowercase.

Thera Spa and Wellness

Design application: WordPress

Project Outline

Thera Spa and Wellness is a serene oasis dedicated to holistic health and relaxation. They offer a range of services, including different face and body massages, facial and skin treatment packages, and naturopathy consultations, all aimed at promoting overall well-being, natural healing, and inner balance. The client wanted their customers to be able to book an assortment of services on the site. The project's goal was to present the client with a prototype of the homepage that's mobile-friendly.

Homepage web design with candles, welcome message, mission statement, service benefits, popular services, and contact info.
Homepage web design with candles, welcome message, mission statement, service benefits, popular services, and contact info.
Homepage web design with candles, welcome message, mission statement, service benefits, popular services, and contact info.
Homepage web design with candles, welcome message, mission statement, service benefits, popular services, and contact info.

Color Palette

Brand color palette with their respective color codes.
Brand color palette with their respective color codes.
Open Sans font including letters, numbers, and special characters in uppercase and lowercase.
Open Sans font including letters, numbers, and special characters in uppercase and lowercase.

Typography

Built using WordPress, the homepage prototype effectively presents the brand's offerings while facilitating a seamless user experience for customers. The design conveys a sense of calm, trust, and balance while ensuring usability and encouraging users to book appointments through prominent call-to-action buttons.

Desktop view:

Mobile view:

Web Development Brand Homepage

Design application: WordPress

Project Outline

WebWorks is a fictitious web development company used for the creation of a prototype homepage with WordPress.

Homepage prototype with a welcome message, navigation bar, and contact info. Features a dark background and placeholder text.
Homepage prototype with a welcome message, navigation bar, and contact info. Features a dark background and placeholder text.