( Connect )
Menu
Accessibility Score
Best Practices
SEO Score
Studio Sown is a boutique landscape architecture practice in Melbourne, specialising in residential garden design, urban botany and refined groundwork. The brief was a marketing website that reflects their craft, performs well in search, and converts inquiry , without leaning on heavy CMS or third-party page builders.
Echo Studios delivered the strategy, design and technical build; echosite.au handled architecture, development and technical SEO.
(Technical Stack)
Framework
UI
SEO
Backend
Forms
Analytics
Technical SEO was treated as a first-order concern: metadata, crawling, structured data and performance are built into the stack rather than retrofitted. Per-page metadata driven by generateMetadata() with unique title, description, keywords, canonical and noindex per route. Open Graph and Twitter cards generated from centralised config.
Geo-targeting with geo.region, geo.placename, geo.position reinforcing Melbourne/VIC for local queries. Dual sitemaps: standard sitemap.xml with lastModified, changeFrequency, priority and images per URL, plus a dedicated sitemap-images.xml with image:loc, image:caption and image:title.
Security headers set via next.config.mjs including X-DNS-Prefetch-Control, X-Frame-Options, X-Content-Type-Options, and Referrer-Policy.
(Implementation)
App Router & Routing
Root layout holds metadata, GTM, schema (Organisation, WebSite) and Providers. Static and dynamic routes: home, ethos, work, work/[project], process, contact, contact/thank-you. Route handlers for contact form POST. Custom not-found and template for 404 and re-renders.
React & Components
React 19 with Server Components by default, client components only where needed (GTM, hero images, forms, toasts). shadcn/ui with Radix primitives, Tailwind, tailwindcss-animate, framer-motion, embla-carousel. Forms via react-hook-form with Zod validation submitting to /api/contact.
Contact API & Backend
POST handler validates name and email (returns 400 if missing). Sends normalised payload to external webhook with x-api-key auth. Returns 200 on success, 500 on config or webhook failure. No database or file storage, integration via env and webhook. Environment requires WEBHOOK_URL and WEBHOOK_API_KEY.
Image & Performance Optimisation
Next.js images config with AVIF and WebP formats, device sizes and image sizes tuned for responsive and Core Web Vitals. minimumCacheTTL: 60 for caching. Lazy loading for below-fold content. Priority loading for hero and LCP images. reactStrictMode enabled.
Beyond the technical build, Echo Studios implemented CRM and automation. Instant lead capture from the website with automated response from the contact form. Email welcome sequence for new leads with quick overview of services.
Follow-up email and SMS sequences driving people to a new /schedule page with embedded calendar. In-person usage support: when Jeejoon speaks with prospects face-to-face, adding a quick tag triggers a follow-up email and SMS sequence for professionality and keeping leads warm.
(Testimonial)
Rachel G., Owner, Studio Sown
100
SEO Score
100
Accessibility
(Schema & Structured Data)
Organisation
WebSite
BreadcrumbList
CreativeWork
Service
HowTo
CollectionPage
A marketing website that reflects Studio Sown's craft, technically excellent, SEO-first, and built to convert inquiry. Perfect Lighthouse scores across accessibility, best practices, and SEO. Comprehensive structured data making every page rich in search results. And beyond the website, CRM automation capturing and nurturing every lead.
This is what happens when strategy, design, and technical build work together.
Start your project