案例研究 · 2026
Euan Livingstone Portfolio
A living product demo — minimalist craft, system theming and case studies on the site that sells the work.
My own portfolio rebuilt in Next.js — a minimalist personal site with motion, theming and case studies that doubles as a live product demo.
项目叙述以英文撰写。
概览
euanliv.click is the public face of my freelance work: selected projects, about, charity and local Dunfermline pages, contact, and Google Calendar booking. The brief was self-imposed — replace an older portfolio with something quieter and more intentional, close to references like restrained European studio sites, while still feeling personal to a Fife-based designer–developer with an MBCS membership.
挑战
A portfolio has to prove craft without shouting. It needs fast performance, clear case studies, booking without friction, and enough personality that it doesn’t look like a generic template — plus light/dark modes and a system that can grow as projects ship.
方案
Designed and built in Next.js, React and TypeScript with Tailwind CSS. The experience includes a code-style boot intro, a typewriter hero, session-based accent colours (with a footer hue swapper), frosted sticky navigation, Discord presence, live UK clock, SEO-ready case study routes and structured data, plus integrated Google Calendar consultations.
成果
A production portfolio that works as both marketing site and case study in its own right — showing how I design systems, ship front-end detail and keep charity/local work visible alongside commercial projects.
设计工具
在 Figma 中设计，品牌与视觉素材在 Adobe Illustrator 与 Adobe Photoshop 中制作。
- Figma
- Adobe Illustrator
- Adobe Photoshop
技术栈
用于交付线上体验的语言与技术。
- HTML
- CSS
- JavaScript
- TypeScript
- React
- Next.js
- Tailwind CSS
色彩方案
下方为品牌色板。本页 UI 强调色会在必要时微调，以确保在网站背景上可读。
Accent Teal
#0F5C4C
Signal Mint
#5FBFA8
Ink
#0A0E0C
Mist
#F4F6F5
Glow
#B8D4C8
下一步
需要类似方向的项目吗？
无论你是 Dunfermline 或 Fife 的机构，还是英国远程客户，我都能从最初草图推进到上线网站。可查看 更多作品、发一条消息，或 预约交流。