04 / Design & full-stack development
Grounds Control
A new foundation for a growing business.
A ground-up website design for a commercial landscape contractor, supporting its “Incredible Passion” campaign.
The context
Grounds Control needed to replace its Squarespace website with a modern presence that showcases its commercial landscape work and helps customers connect with the business.
The challenge
The previous Squarespace website was simple and lacked a cohesive design. Its presentation did not reflect the quality of Grounds Control’s services. The business needed a website that could express that quality and support its “Incredible Passion” advertising campaign.
The approach
I gathered details about the business owner’s personal tastes, then personally designed the website from the ground up. Those preferences informed a cohesive visual direction for the business.
The landing page centered on a carousel showcasing Grounds Control’s project photography. It made the quality of the work the visual focus of the “Incredible Passion” campaign, with readable content available while the larger image assets loaded.
I built the site with Next.js, TypeScript, and Tailwind CSS, using Cloudinary for portfolio photography and Vercel for hosting. Structured data and page metadata supported the search foundation.
I built custom UI components with native HTML elements and careful state lifecycle management to limit component-library overhead. CSS transitions handled motion, and server-side rendering delivered HTML wherever possible to reduce processing on client devices. Minification and tree shaking limited the JavaScript shipped to the browser.
Image delivery was a central part of the performance work. I optimized image resolution and converted assets to WebP to reduce transfer sizes and client bandwidth demands. These choices supported the goal of minimizing Largest Contentful Paint while retaining the photography-led design.
The outcome
The rebuild replaced the simple Squarespace presentation with a custom website designed around the owner’s tastes and the “Incredible Passion” campaign. A photography-led landing carousel showcased the quality of the business’s work, supported by custom components, server rendering, and optimized image delivery.
My contributions
- Personally designed the website from the ground up after gathering the business owner’s preferences.
- Designed a photography-led landing carousel and cohesive presentation for the “Incredible Passion” advertising campaign.
- Built the website with Next.js, TypeScript, and Tailwind CSS.
- Optimized portfolio photography with appropriately sized WebP images and Cloudinary delivery to reduce network transfers.
- Built custom UI components with native HTML, CSS transitions, efficient state lifecycles, and server rendering, using minification and tree shaking to limit client JavaScript.
- Implemented structured data, page metadata, and performance improvements to support search visibility.
- Delivered the site using Vercel hosting through Phi Technology Solutions.