Smart Devices
Reviews for the Modern Home
Overview
Smart Devices is an affiliate content platform dedicated to expert reviews and buying guides for smart home gadgets — covering smart hubs, home security, wellbeing devices, kitchenware, garden tech and more.
I designed and developed the platform end-to-end: brand identity, editorial UI, content management system, SEO architecture and full-stack Next.js application — all optimised for organic search and affiliate conversion.
The platform is built for scale, featuring a Cloudinary-powered image pipeline, category and tag filtering, a Supabase CMS for editorial workflows, and a fully responsive reading experience across all devices.
Architecture & Technologies
Built with Next.js 15 (App Router) and TypeScript, deployed on Vercel with incremental static regeneration for near-instant page loads. Tailwind CSS 4 powers the design system, with Geist Sans for UI text and Lora for editorial body copy.
Content is managed through a custom Supabase CMS — authors log in, draft posts with rich-text editing, assign categories and hero flags, and publish directly to the live site. Images are stored and transformed via Cloudinary, serving optimised WebP at every breakpoint.
SEO is built-in from day one: auto-generated sitemaps, dynamic Open Graph images, JSON-LD structured data for articles, canonical URLs, and robots directives — all driven by the post metadata schema.
Brand Identity & Visual Language
The brand palette pairs a bold coral-red (#FF2E4B) with clean white and neutral grays — evoking energy, trust and editorial authority. A three-bar gradient logo mark in descending coral tones reinforces the brand across every touchpoint.
The visual language is editorial-first: generous whitespace, a clear typographic hierarchy and full-bleed hero images let the content breathe. Category badges, hover transitions and a sticky header keep navigation sharp and intuitive.
Typography
The typographic system pairs Jost — a geometric, high-contrast sans-serif — for headlines and brand marks with Lora, an elegant serif, for long-form article body text. Geist Sans handles all UI chrome, ensuring crisp legibility at every size.
This three-font system creates a clear hierarchy: Jost commands attention in headlines, Lora sustains readability across article pages, and Geist keeps interface elements clean and neutral.
Colour Palette
Coral-red is the brand's primary action colour — used for CTAs, category badges and interactive highlights. It pairs with warm off-whites and neutral grays to ensure high contrast without visual fatigue across long reading sessions.
The three-step gradient (deep coral → mid coral → blush) echoes the logo mark and appears as a subtle motif throughout cards, borders and decorative elements.
Platform Screens
A selection of key screens from the Smart Devices platform — showcasing the homepage hero layout, category filtering, article pages and the editorial content management interface.
Editorial CMS & Content Pipeline
Authors access a secure admin panel backed by Supabase Row Level Security. The editorial workflow covers post creation, category assignment, hero slot selection, rich-text body editing, and one-click publish — no developer involvement needed for day-to-day content operations.
Every post is tied to structured metadata: title, slug, excerpt, header image, category, author and hero flag. This schema powers automated sitemaps, Open Graph tags, JSON-LD article markup and category-filtered listing pages — all generated at build or revalidation time.
SEO & Affiliate Architecture
Organic search is the platform's primary traffic channel. Every article page includes auto-generated meta titles and descriptions, canonical URLs, Open Graph and Twitter Card images (rendered server-side via Next.js opengraph-image routes), and JSON-LD Article structured data.
Affiliate disclosure pages, robots.txt directives and a dynamically generated sitemap ensure full compliance with search engine guidelines and affiliate programme requirements — protecting domain authority from day one.