YuNet
The official website for YuNet — a Auckland-based digital studio specialising in web design, product development, AI-powered solutions, and e-commerce platforms. Bilingual, SEO-optimised, and built to convert.
YuNet is a digital product design and development studio based in Auckland, operating since 2016. The website serves as both a portfolio and lead-generation platform, showcasing 50+ delivered projects across web design, web applications, AI integration, and e-commerce. Built with Next.js and bilingual support (English and Chinese), the site features an interactive quotation calculator, rich case studies, and a content-driven blog — all designed to communicate capability and convert visitors into clients.
Building a studio website that practises what it preaches
An agency site must demonstrate the same level of craft, performance, and strategic thinking that it promises to clients. The challenge was to create a bilingual platform that generates qualified leads while showcasing a decade of work across diverse industries.
- • Needed to serve English-speaking and Chinese-speaking audiences with hostname-based locale routing
- • Portfolio must present 50+ projects with rich, structured case studies that tell a compelling story
- • An interactive quotation tool was required to qualify leads and set pricing expectations early
- • Performance and SEO had to be exemplary — the site itself is a proof of capability
A design-led, performance-first studio platform
Built a Next.js application with server-side rendering, bilingual content via next-intl, and a file-based CMS (Velite) for easy content management. The site combines editorial design sensibility with strong technical foundations — from an interactive pricing calculator powered by Strapi to Framer Motion animations that enhance without overwhelming.
- • Bilingual Architecture — Hostname-based locale detection (yunet.nz / cn.yunet.nz) with full content localisation via next-intl
- • Interactive Quotation Tool — Real-time project pricing calculator with backend estimation via Strapi, covering web, e-commerce, AI, and app projects
- • Content-Driven Portfolio — MDX-powered case studies with structured narratives (challenge, solution, results), performance metrics, and client testimonials
- • Performance & SEO — Server-rendered pages, optimised Core Web Vitals, structured data, and editorial blog content for organic discovery
Key Deliverables
Strategy & Design
- Defined the site's information architecture to serve both portfolio and lead-generation goals
- Designed a dark-first, editorial aesthetic with golden accent colour and magazine-style layouts
- Created a three-phase process narrative (Discovery → Design & Build → Launch & Evolve) to set client expectations
Development
- Next.js 16 application with App Router, React 19, and TypeScript
- Bilingual content system with hostname-based routing and full i18n support
- Interactive quotation calculator with real-time pricing via Strapi backend API
- File-based CMS using Velite for MDX case studies, blog posts, and structured FAQ content
- Framer Motion animations — staggered reveals, parallax scroll, and Ken Burns effects
Content & SEO
- 50+ project case studies with structured metadata and bilingual support
- Blog/insights section with category filtering and pinned article support
- Comprehensive FAQ system organised by service category
- Technical SEO with structured data, meta optimisation, and server-rendered pages
© 2026 Siyu Qian. All rights reserved.